From 705bc2ad9851805628bab4b5cebb86d293fc3f62 Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <nielsen.dustin@gmail.com>
Date: Wed, 1 Oct 2025 12:07:42 -0600
Subject: [PATCH 01/10] feat(#2779): Added Menu Button documentation

---
 .../version-language-switcher/HelpButton.tsx  |   1 -
 .../VersionLanguageSwitcher.tsx               |  31 +--
 .../version-language-switcher.css             |  14 +-
 src/routes/components/Components.tsx          |   1 +
 src/routes/components/MenuButton.tsx          | 200 ++++++++++++++++++
 src/versioned-router.tsx                      |   2 +
 6 files changed, 226 insertions(+), 23 deletions(-)
 create mode 100644 src/routes/components/MenuButton.tsx

diff --git a/src/components/version-language-switcher/HelpButton.tsx b/src/components/version-language-switcher/HelpButton.tsx
index 7fb14e824..cb3a58c79 100644
--- a/src/components/version-language-switcher/HelpButton.tsx
+++ b/src/components/version-language-switcher/HelpButton.tsx
@@ -26,7 +26,6 @@ export function HelpButton() {
   return (
     <GoabTooltip content="Version and framework info">
       <GoabIconButton ml={"xs"}
-                      mb={"2xs"}
                       variant="color"
                       size="small"
                       icon="help-circle"
diff --git a/src/components/version-language-switcher/VersionLanguageSwitcher.tsx b/src/components/version-language-switcher/VersionLanguageSwitcher.tsx
index e98056ed2..1e7a63818 100644
--- a/src/components/version-language-switcher/VersionLanguageSwitcher.tsx
+++ b/src/components/version-language-switcher/VersionLanguageSwitcher.tsx
@@ -85,30 +85,22 @@ export const VersionLanguageSwitcher = () => {
     return str.charAt(0).toUpperCase() + str.slice(1);
   }
 
-  const openLanguagePopOver = (e: React.MouseEvent<HTMLAnchorElement>) => {
-    e.preventDefault();
-  };
-
-  const openVersionPopOver = (e: React.MouseEvent<HTMLAnchorElement>) => {
-    e.preventDefault();
-  };
-
   const getCurrentVersionLabel = (language: string, version: string) => {
     if (language === "react") {
       return version === "new" ? REACT_VERSIONS.NEW.label : REACT_VERSIONS.OLD.label;
-    }    if (language === "angular") {
+    } if (language === "angular") {
       return version === "new" ? ANGULAR_VERSIONS.NEW.label : ANGULAR_VERSIONS.OLD.label;
     }
   }
 
   return (
-    <>
-      <div className="version-language-switcher">
+    <div className="version-language-switcher">
       <GoabPopover
         target={
-          <a className="version-language-switcher__heading" href="#" id="language-switcher" onClick={e => openLanguagePopOver(e)}>
-            <GoabIcon type="chevron-down" size="small"></GoabIcon> {capitalizeFirstLetter(language)}
-          </a>
+          <div className="menu-link">
+            <GoabIcon type="chevron-down" size="small" />
+            { capitalizeFirstLetter(language) }
+          </div>
         }
         padded={false}>
         <>
@@ -121,10 +113,10 @@ export const VersionLanguageSwitcher = () => {
       </GoabPopover>
 
       <GoabPopover target={
-        <a className="version-language-switcher__heading" href="#"
-           onClick={e => openVersionPopOver(e)}>
-          <GoabIcon type="chevron-down" size="small"></GoabIcon> {getCurrentVersionLabel(language, version)}
-        </a>
+        <div className="menu-link">
+          <GoabIcon type="chevron-down" size="small" />
+          { getCurrentVersionLabel(language, version) }
+        </div>
       } padded={false}>
         <>
           {["new", "old"].map(ver => (
@@ -134,7 +126,6 @@ export const VersionLanguageSwitcher = () => {
           ))}
         </>
       </GoabPopover>
-      </div>
-    </>
+    </div>
   );
 }
diff --git a/src/components/version-language-switcher/version-language-switcher.css b/src/components/version-language-switcher/version-language-switcher.css
index f2594c468..5a4c79b6d 100644
--- a/src/components/version-language-switcher/version-language-switcher.css
+++ b/src/components/version-language-switcher/version-language-switcher.css
@@ -30,12 +30,22 @@
 }
 
 .version-language-switcher {
-    height: 20px;
     display: flex;
     flex-direction: row;
     align-items: center; /* vertically align content */
     gap: var(--goa-space-s);
-    margin-bottom: var(--goa-space-xs);
+}
+
+.menu-link {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--goa-color-interactive-default);
+}
+
+.menu-link:hover {
+    color: var(--goa-color-interactive-hover);
+    text-decoration: underline;
 }
 
 @media (max-width: 623px) {
diff --git a/src/routes/components/Components.tsx b/src/routes/components/Components.tsx
index 4b3062fb4..dc30e4415 100644
--- a/src/routes/components/Components.tsx
+++ b/src/routes/components/Components.tsx
@@ -92,6 +92,7 @@ export function Components() {
               <Link to={getUrl("file-uploader")}>File uploader</Link>
               <Link to={getUrl("icon-button")}>Icon button</Link>
               <Link to={getUrl("input")}>Input</Link>
+              <Link to={getUrl("menu-button")}>{newComponentLabel("Menu Button")}</Link>
               <Link to={getUrl("radio")}>Radio</Link>
               <Link to={getUrl("text-area")}>Text area</Link>
             </GoabSideMenuGroup>
diff --git a/src/routes/components/MenuButton.tsx b/src/routes/components/MenuButton.tsx
new file mode 100644
index 000000000..0ccd3c8b9
--- /dev/null
+++ b/src/routes/components/MenuButton.tsx
@@ -0,0 +1,200 @@
+import { useContext, useState } from "react";
+import {
+  GoabBadge,
+  GoabMenuAction,
+  GoabMenuButton,
+  GoabMenuButtonProps,
+  GoabTab,
+  GoabTabs,
+  GoabText,
+} from "@abgov/react-components";
+import { Category, ComponentHeader } from "@components/component-header/ComponentHeader.tsx";
+import { ComponentContent } from "@components/component-content/ComponentContent";
+import {
+  ComponentProperties,
+  ComponentProperty,
+} from "@components/component-properties/ComponentProperties.tsx";
+import { LanguageVersionContext } from "@contexts/LanguageVersionContext.tsx";
+import { OldComponentBanner } from "@components/old-component-banner/OldComponentBanner.tsx";
+import { TestIdProperty } from "@components/component-properties/common-properties.ts";
+import { ExamplesEmpty } from "@components/empty-states/examples-empty/ExamplesEmpty.tsx";
+import { AccessibilityEmpty } from "@components/empty-states/accessibility-empty/AccessibilityEmpty.tsx";
+import { DesignEmpty } from "@components/empty-states/design-empty/DesignEmpty.tsx";
+import { ComponentBinding, Sandbox } from "@components/sandbox";
+import { GoabButtonType } from "@abgov/ui-components-common";
+import { CodeSnippet } from "@components/code-snippet/CodeSnippet";
+
+const FIGMA_LINK =
+  "https://www.figma.com/design/3pb2IK8s2QUqWieH79KdN7/%E2%9D%96-Component-library-%7C-DDD?node-id=41625-336313&t=SorPzaYbnqfQ8qiQ-4";
+
+const componentName = "Menu button";
+const description = "Expose a short list of contextual actions without cluttering the interface.";
+const componentCategory = Category.INPUTS_AND_ACTIONS;
+const relatedComponents = [
+  { link: "/components/button", name: "Button" },
+  { link: "/components/dropdown", name: "Dropdown" },
+  { link: "/components/icon-button", name: "Icon button" },
+];
+
+type ComponentPropsType = GoabMenuButtonProps;
+type CastingType = {
+  text: string,
+  type: GoabButtonType,
+  [key: string]: unknown;
+};
+
+export default function MenuButtonPage() {
+  const { version, language } = useContext(LanguageVersionContext);
+  
+  const [menuButtonProps, setMenuButtonProps] = useState<ComponentPropsType>({
+    text: "Menu actions",
+    type: "primary",
+  });
+
+  const [menuButtonBindings, setMenuButtonBindings] = useState<ComponentBinding[]>([
+    {
+      label: "Button text",
+      type: "string",
+      name: "text",
+      value: "Menu actions",
+    },
+    {
+      label: "Button type",
+      type: "radio",
+      name: "type",
+      options: ["primary", "secondary", "tertiary"],
+      value: "primary",
+    },
+  ]);
+
+  const menuButtonProperties: ComponentProperty[] = [
+    {
+      name: "text",
+      type: "string",
+      required: true,
+      description: "Sets the label displayed on the menu trigger button.",
+    },
+    {
+      name: "type",
+      type: "GoabButtonType (primary | secondary | tertiary)",
+      description: "Controls the visual style of the trigger button.",
+      defaultValue: "primary",
+    },
+    TestIdProperty,
+    {
+      name: "onAction",
+      type: "(action: string) => void",
+      description:
+        "Callback fired when a menu action is selected. Receives the action identifier from the clicked item.",
+    },
+  ];
+
+  const menuActionProperties: ComponentProperty[] = [
+    {
+      name: "text",
+      type: "string",
+      required: true,
+      description: "Sets the visible label for the action inside the menu.",
+    },
+    {
+      name: "action",
+      type: "string",
+      required: true,
+      description: "Identifier emitted through onAction when the item is selected.",
+    },
+    {
+      name: "icon",
+      type: "GoabIconType",
+      description: "Optional leading icon shown before the label.",
+    },
+    {
+      name: "testId",
+      type: "string",
+      description: "Sets the data-testid attribute. Used with ByTestId queries in tests.",
+    },
+  ];
+
+  function onSandboxChange(bindings: ComponentBinding[], props: Record<string, unknown>) {
+    setMenuButtonBindings(bindings);
+    setMenuButtonProps(props as CastingType);
+  }
+
+  function handleAction(action: string) {
+    console.log("Last action: ", action);
+  }
+
+  return (
+    <>
+      <ComponentHeader
+        name={componentName}
+        category={componentCategory}
+        description={description}
+        relatedComponents={relatedComponents}
+        figmaLink={FIGMA_LINK}
+        githubLink="Menu button"
+      />
+
+      {version === "old" && <OldComponentBanner componentName={componentName} language={language} />}
+
+      {version === "new" && (
+        <ComponentContent tocCssQuery="goa-tab[open=true] :is(h2[id], h3[id])">
+          <GoabTabs initialTab={1}>
+            <GoabTab heading="Code playground">
+              <h2 id="component" style={{ display: "none" }}>
+                Playground
+              </h2>
+              <Sandbox properties={menuButtonBindings} onChange={onSandboxChange}>
+                <CodeSnippet
+                  lang="typescript"
+                  tags="angular"
+                  allowCopy={true}
+                  code={`
+                    menuOnAction(action: string) {
+                      console.log("Last action: ", action);
+                    }
+                  `}
+                />
+                <CodeSnippet
+                  lang="typescript"
+                  tags="react"
+                  allowCopy={true}
+                  code={`
+                    const menuButtonOnAction = (action: string) => {
+                      console.log("Last action: ", action);
+                    };
+                  `}
+                />
+                <GoabMenuButton {...menuButtonProps} onAction={handleAction}>
+                  <GoabMenuAction text="View profile" action="profile" icon="person-circle" />
+                  <GoabMenuAction text="Notifications" action="notifications" icon="notifications" />
+                  <GoabMenuAction text="Log out" action="logout" icon="log-out" />
+                </GoabMenuButton>
+              </Sandbox>
+
+              <ComponentProperties heading="Menu button properties" properties={menuButtonProperties} />
+              <ComponentProperties heading="Menu action properties" properties={menuActionProperties} />
+            </GoabTab>
+
+            <GoabTab
+              heading={
+                <>
+                  Examples
+                  <GoabBadge type="information" content="0" />
+                </>
+              }>
+              <ExamplesEmpty />
+            </GoabTab>
+
+            <GoabTab heading="Design">
+              <DesignEmpty figmaLink={FIGMA_LINK} />
+            </GoabTab>
+
+            <GoabTab heading="Accessibility">
+              <AccessibilityEmpty figmaLink={FIGMA_LINK} />
+            </GoabTab>
+          </GoabTabs>
+        </ComponentContent>
+      )}
+    </>
+  );
+}
diff --git a/src/versioned-router.tsx b/src/versioned-router.tsx
index 9cac192f0..74763b1fc 100644
--- a/src/versioned-router.tsx
+++ b/src/versioned-router.tsx
@@ -24,6 +24,7 @@ import IconsPage from "@routes/components/Icons.tsx";
 import IconButtonPage from "@routes/components/IconButton.tsx";
 import TextFieldPage from "@routes/components/TextField.tsx";
 import ListPage from "@routes/components/List.tsx";
+import MenuButtonPage from "@routes/components/MenuButton.tsx";
 import MicrositeHeaderPage from "@routes/components/MicrositeHeader.tsx";
 import ModalPage from "@routes/components/Modal.tsx";
 import NotificationBannerPage from "@routes/components/Notificationbanner.tsx";
@@ -109,6 +110,7 @@ export const ComponentsRouter = () => {
     "icon-button": <IconButtonPage />,
     "input": <TextFieldPage />,
     "list": <ListPage />,
+    "menu-button": <MenuButtonPage />,
     "microsite-header": <MicrositeHeaderPage />,
     "modal": <ModalPage />,
     "notification-banner": <NotificationBannerPage />,

From 920fbc7174ae54bf2ade13dccc1131ecd7bb0c6a Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <dustin.nielsen@gov.ab.ca>
Date: Wed, 1 Oct 2025 12:10:15 -0600
Subject: [PATCH 02/10] feat(#2779): Updating component versions

---
 package-lock.json | 16 ++++++++--------
 package.json      |  4 ++--
 2 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f4f5aa7d9..afd738877 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,9 +8,9 @@
       "name": "code-sandbox",
       "version": "0.0.0",
       "dependencies": {
-        "@abgov/react-components": "6.7.1-alpha.1",
+        "@abgov/react-components": "6.8.0-alpha.2",
         "@abgov/ui-components-common": "1.7.0",
-        "@abgov/web-components": "1.37.1-alpha.2",
+        "@abgov/web-components": "1.38.0-alpha.3",
         "@faker-js/faker": "^8.3.1",
         "highlight.js": "^11.8.0",
         "js-cookie": "^3.0.5",
@@ -68,9 +68,9 @@
       }
     },
     "node_modules/@abgov/react-components": {
-      "version": "6.7.1-alpha.1",
-      "resolved": "https://registry.npmjs.org/@abgov/react-components/-/react-components-6.7.1-alpha.1.tgz",
-      "integrity": "sha512-s5+tGLY2DOeMV3BjiIz0c71hESIF/kcWA3PrFxvPCoCuPWiilLL0ktmd9sCRPp5qhcbWtW6M8vuLatwIiD28qQ==",
+      "version": "6.8.0-alpha.2",
+      "resolved": "https://registry.npmjs.org/@abgov/react-components/-/react-components-6.8.0-alpha.2.tgz",
+      "integrity": "sha512-C4ZmYzOWrFUKtcmcP+3Zz3zcUBQgziZqx3lVB5jkQT052vqt/5JQQWkB8Danw0fjfgnuO/MheOWH8qZEuZjFlg==",
       "peerDependencies": {
         "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
         "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
@@ -83,9 +83,9 @@
       "integrity": "sha512-dnqLxTJdBxNZFKPDyckaHHrkipjFIwXyU63rlEkcHgKhn4d+KrwlbMuxtsS73FvH4bozyQm2OM+sPu32wyWgNA=="
     },
     "node_modules/@abgov/web-components": {
-      "version": "1.37.1-alpha.2",
-      "resolved": "https://registry.npmjs.org/@abgov/web-components/-/web-components-1.37.1-alpha.2.tgz",
-      "integrity": "sha512-WoQZAwccxRPQHWHBS/7gDISCFbEnWrsRZvS8U9iK0N3jr00YTtlvxdwEDywZAcgrXitxa8qlIVbpylZVLzDdmQ==",
+      "version": "1.38.0-alpha.3",
+      "resolved": "https://registry.npmjs.org/@abgov/web-components/-/web-components-1.38.0-alpha.3.tgz",
+      "integrity": "sha512-mE8qwOCO+V7gHvZqrONgo81c0HBekci7jSwO+GoOQRrRMYoh17vTRM3tPPrtRznqJ+QyQBQS5G2tWkpoqbHMsg==",
       "peerDependencies": {
         "@sveltejs/vite-plugin-svelte": "3.x",
         "glob": "10.x",
diff --git a/package.json b/package.json
index 1660d33b7..e062f4968 100644
--- a/package.json
+++ b/package.json
@@ -12,9 +12,9 @@
     "prettier": "npx prettier . --write"
   },
   "dependencies": {
-    "@abgov/react-components": "6.7.1-alpha.1",
+    "@abgov/react-components": "6.8.0-alpha.2",
     "@abgov/ui-components-common": "1.7.0",
-    "@abgov/web-components": "1.37.1-alpha.2",
+    "@abgov/web-components": "1.38.0-alpha.3",
     "@faker-js/faker": "^8.3.1",
     "highlight.js": "^11.8.0",
     "js-cookie": "^3.0.5",

From 525564ee2b7228065e680740cc66879a487ef7c6 Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <nielsen.dustin@gmail.com>
Date: Wed, 1 Oct 2025 12:14:00 -0600
Subject: [PATCH 03/10] feat(#2779): Removed GoabText declaration

---
 src/routes/components/MenuButton.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/routes/components/MenuButton.tsx b/src/routes/components/MenuButton.tsx
index 0ccd3c8b9..9d3c08632 100644
--- a/src/routes/components/MenuButton.tsx
+++ b/src/routes/components/MenuButton.tsx
@@ -6,7 +6,6 @@ import {
   GoabMenuButtonProps,
   GoabTab,
   GoabTabs,
-  GoabText,
 } from "@abgov/react-components";
 import { Category, ComponentHeader } from "@components/component-header/ComponentHeader.tsx";
 import { ComponentContent } from "@components/component-content/ComponentContent";

From 38b8f811f7c7edcba53e9f8e8443e9559a27e1c5 Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <nielsen.dustin@gmail.com>
Date: Wed, 1 Oct 2025 14:55:31 -0600
Subject: [PATCH 04/10] feat(#2779): Fixed Dropdown components

---
 src/components/sandbox/SandboxProperties.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/sandbox/SandboxProperties.tsx b/src/components/sandbox/SandboxProperties.tsx
index 549f830ac..4b626a7fe 100644
--- a/src/components/sandbox/SandboxProperties.tsx
+++ b/src/components/sandbox/SandboxProperties.tsx
@@ -80,7 +80,7 @@ export function SandboxProperties({ properties = [], onChange }: Props) {
       case "list":
       case "dropdown":
         return (
-          <GoabDropdown key={p.name} name={p.name} value={p.value} onChange={onListChange}>
+          <GoabDropdown key={p.name} name={p.name} width="100%" value={p.value} onChange={onListChange}>
             {p.options.map(option => (
               <GoabDropdownItem
                 value={option || ""}
@@ -95,6 +95,7 @@ export function SandboxProperties({ properties = [], onChange }: Props) {
           <GoabDropdown
             key={p.name}
             name={p.name}
+            width="100%"
             filterable
             leadingIcon="search"
             value={p.value}

From 94c49a205068483758534e28b187e80c6df7b72d Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <nielsen.dustin@gmail.com>
Date: Thu, 2 Oct 2025 15:12:45 -0600
Subject: [PATCH 05/10] feat(#2779): Added new button type and updated Angular
 code

---
 src/routes/components/MenuButton.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/routes/components/MenuButton.tsx b/src/routes/components/MenuButton.tsx
index 9d3c08632..e4800944f 100644
--- a/src/routes/components/MenuButton.tsx
+++ b/src/routes/components/MenuButton.tsx
@@ -75,7 +75,7 @@ export default function MenuButtonPage() {
     },
     {
       name: "type",
-      type: "GoabButtonType (primary | secondary | tertiary)",
+      type: "GoabButtonType (primary | secondary | tertiary | start)",
       description: "Controls the visual style of the trigger button.",
       defaultValue: "primary",
     },
@@ -148,8 +148,8 @@ export default function MenuButtonPage() {
                   tags="angular"
                   allowCopy={true}
                   code={`
-                    menuOnAction(action: string) {
-                      console.log("Last action: ", action);
+                    menuOnAction(detail: GoabMenuButtonOnActionDetail) {
+                      console.log("Last action: ", detail.action);
                     }
                   `}
                 />
@@ -158,8 +158,8 @@ export default function MenuButtonPage() {
                   tags="react"
                   allowCopy={true}
                   code={`
-                    const menuButtonOnAction = (action: string) => {
-                      console.log("Last action: ", action);
+                    const menuButtonOnAction = (detail: GoabMenuButtonOnActionDetail) => {
+                      console.log("Last action: ", detail.action);
                     };
                   `}
                 />

From f366676c5ecb8f63cfa75091586c8ba48303c7f2 Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <nielsen.dustin@gmail.com>
Date: Thu, 2 Oct 2025 15:13:51 -0600
Subject: [PATCH 06/10] feat(#2779): Didn't mean to push React code change,
 undid

---
 src/routes/components/MenuButton.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/routes/components/MenuButton.tsx b/src/routes/components/MenuButton.tsx
index e4800944f..f57545ad2 100644
--- a/src/routes/components/MenuButton.tsx
+++ b/src/routes/components/MenuButton.tsx
@@ -158,8 +158,8 @@ export default function MenuButtonPage() {
                   tags="react"
                   allowCopy={true}
                   code={`
-                    const menuButtonOnAction = (detail: GoabMenuButtonOnActionDetail) => {
-                      console.log("Last action: ", detail.action);
+                    const menuButtonOnAction = (action: string) => {
+                      console.log("Last action: ", action);
                     };
                   `}
                 />

From a85634ceabab53911052c1a8c1244a0f343e19eb Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <nielsen.dustin@gmail.com>
Date: Thu, 2 Oct 2025 16:21:48 -0600
Subject: [PATCH 07/10] feat(#2779): Re-implementing React code change

---
 src/routes/components/MenuButton.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/routes/components/MenuButton.tsx b/src/routes/components/MenuButton.tsx
index f57545ad2..e4800944f 100644
--- a/src/routes/components/MenuButton.tsx
+++ b/src/routes/components/MenuButton.tsx
@@ -158,8 +158,8 @@ export default function MenuButtonPage() {
                   tags="react"
                   allowCopy={true}
                   code={`
-                    const menuButtonOnAction = (action: string) => {
-                      console.log("Last action: ", action);
+                    const menuButtonOnAction = (detail: GoabMenuButtonOnActionDetail) => {
+                      console.log("Last action: ", detail.action);
                     };
                   `}
                 />

From 0f05b35e57a91d52d5c35b5565afbd4ffb5de04e Mon Sep 17 00:00:00 2001
From: syedszeeshan <47701214+syedszeeshan@users.noreply.github.com>
Date: Mon, 29 Sep 2025 14:19:02 -0400
Subject: [PATCH 08/10] fix(#3077): misc docs updates

---
 package.json                           |   4 +-
 src/global-constants.ts                |   2 +-
 src/routes/components/Badge.tsx        |  34 +++-
 src/routes/components/Checkbox.tsx     |  43 ++--
 src/routes/components/CheckboxList.tsx | 260 +++++++++++++++++++++++++
 src/routes/components/Components.tsx   |   1 +
 src/routes/components/Radio.tsx        |  42 ++--
 src/routes/components/Tooltip.tsx      |  18 +-
 src/versioned-router.tsx               |   2 +
 9 files changed, 357 insertions(+), 49 deletions(-)
 create mode 100644 src/routes/components/CheckboxList.tsx

diff --git a/package.json b/package.json
index 1660d33b7..e062f4968 100644
--- a/package.json
+++ b/package.json
@@ -12,9 +12,9 @@
     "prettier": "npx prettier . --write"
   },
   "dependencies": {
-    "@abgov/react-components": "6.7.1-alpha.1",
+    "@abgov/react-components": "6.8.0-alpha.2",
     "@abgov/ui-components-common": "1.7.0",
-    "@abgov/web-components": "1.37.1-alpha.2",
+    "@abgov/web-components": "1.38.0-alpha.3",
     "@faker-js/faker": "^8.3.1",
     "highlight.js": "^11.8.0",
     "js-cookie": "^3.0.5",
diff --git a/src/global-constants.ts b/src/global-constants.ts
index 43744e07d..a5c6ac850 100644
--- a/src/global-constants.ts
+++ b/src/global-constants.ts
@@ -3,4 +3,4 @@ export const DEFAULT_VERSION = "old";
 export const DEFAULT_LANGUAGE = "react";
 
 // Array of 'New' components
-export const NEW_COMPONENTS = ["Drawer", "Temporary notification"];
+export const NEW_COMPONENTS = ["Drawer", "Temporary notification", "Checkbox list"];
diff --git a/src/routes/components/Badge.tsx b/src/routes/components/Badge.tsx
index 41b3c9c87..26f3ebf7b 100644
--- a/src/routes/components/Badge.tsx
+++ b/src/routes/components/Badge.tsx
@@ -53,7 +53,35 @@ export default function BadgePage() {
       label: "Type",
       type: "list",
       name: "type",
-      options: ["success", "important", "information", "emergency", "dark", "midtone", "light"],
+      options: [
+        "information",
+        "success",
+        "important",
+        "emergency",
+        "dark",
+        "midtone",
+        "light",
+        "archived",
+        "aqua",
+        "black",
+        "blue",
+        "green",
+        "orange",
+        "pink",
+        "red",
+        "violet",
+        "white",
+        "yellow",
+        "aqua-light",
+        "black-light",
+        "blue-light",
+        "green-light",
+        "orange-light",
+        "pink-light",
+        "red-light",
+        "violet-light",
+        "yellow-light",
+      ],
       value: "information",
     },
     {
@@ -79,7 +107,7 @@ export default function BadgePage() {
   const oldComponentProperties: ComponentProperty[] = [
     {
       name: "type",
-      type: "success | important | information | emergency | dark | midtone | light",
+      type: "information | success | important | emergency | dark | midtone | light | archived | aqua | black | blue | green | orange | pink | red | violet | white | yellow | aqua-light | black-light | blue-light | green-light | orange-light | pink-light | red-light | violet-light | yellow-light",
       description: "Define the context and colour of the badge",
       required: true,
     },
@@ -128,7 +156,7 @@ export default function BadgePage() {
   const componentProperties: ComponentProperty[] = [
     {
       name: "type",
-      type: "GoabBadgeType(success | important | information | emergency | dark | midtone | light)",
+      type: "GoabBadgeType(information | success | important | emergency | dark | midtone | light | archived | aqua | black | blue | green | orange | pink | red | violet | white | yellow | aqua-light | black-light | blue-light | green-light | orange-light | pink-light | red-light | violet-light | yellow-light)",
       description: "Define the context and colour of the badge",
       required: true,
     },
diff --git a/src/routes/components/Checkbox.tsx b/src/routes/components/Checkbox.tsx
index 6aed93c8a..113fe77b2 100644
--- a/src/routes/components/Checkbox.tsx
+++ b/src/routes/components/Checkbox.tsx
@@ -55,7 +55,7 @@ export default function CheckboxPage() {
       name: "maxWidth",
       requirement: "optional",
       value: "",
-    },
+    }
   ]);
   const { formItemBindings, formItemProps, onFormItemChange } = useSandboxFormItem({
     label: "Basic",
@@ -230,11 +230,16 @@ export default function CheckboxPage() {
       type: "(event: GoabCheckboxOnChangeDetail) => void",
       description: "Callback function when checkbox value is changed.",
     },
+    {
+      name: "indeterminate",
+      type: "boolean",
+      description: "Displays the checkbox styled with a dash when set to true",
+    },
     TestIdProperty,
     MarginProperty,
   ];
 
-  const noop = () => { };
+  const noop = () => {};
 
   function onChange(bindings: ComponentBinding[], props: Record<string, unknown>) {
     const missingProps = {
@@ -284,10 +289,10 @@ export default function CheckboxPage() {
               />
 
               {version === "old" && <CodeSnippet
-                lang="typescript"
-                tags={["angular", "reactive"]}
-                allowCopy={true}
-                code={`
+                  lang="typescript"
+                  tags={["angular", "reactive"]}
+                  allowCopy={true}
+                  code={`
                   import { FormControl } from "@angular/forms";
                   export class SomeOtherComponent {
                     itemFormCtrl = new FormControl();
@@ -296,10 +301,10 @@ export default function CheckboxPage() {
               />}
 
               {version === "new" && <CodeSnippet
-                lang="typescript"
-                tags={["angular", "reactive"]}
-                allowCopy={true}
-                code={`
+                  lang="typescript"
+                  tags={["angular", "reactive"]}
+                  allowCopy={true}
+                  code={`
                   export class SomeOtherComponent {
                    form!: FormGroup;
                    constructor(private fb: FormBuilder) {
@@ -312,10 +317,10 @@ export default function CheckboxPage() {
               />}
 
               {version === "new" && <CodeSnippet
-                lang="typescript"
-                tags={["angular", "template-driven"]}
-                allowCopy={true}
-                code={`
+                  lang="typescript"
+                  tags={["angular", "template-driven"]}
+                  allowCopy={true}
+                  code={`
                   export class SomeOtherComponent {
                    item=false;
                    checkboxOnChange(event: GoabCheckboxOnChangeDetail) {
@@ -327,15 +332,15 @@ export default function CheckboxPage() {
               />}
 
               {version === "new" && <CodeSnippet
-                lang="typescript"
-                tags="react"
-                allowCopy={true}
-                code={`
+                  lang="typescript"
+                  tags="react"
+                  allowCopy={true}
+                  code={`
                   function checkboxOnChange(event: GoabCheckboxOnChangeDetail) {
                     console.log(event.value);
                   }
                 `}
-              />
+                />
               }
 
               <form>
diff --git a/src/routes/components/CheckboxList.tsx b/src/routes/components/CheckboxList.tsx
new file mode 100644
index 000000000..51f66c766
--- /dev/null
+++ b/src/routes/components/CheckboxList.tsx
@@ -0,0 +1,260 @@
+import { Category, ComponentHeader } from "@components/component-header/ComponentHeader.tsx";
+import {
+  GoabBadge,
+  GoabCheckboxList,
+  GoabCheckbox,
+  GoabTab,
+  GoabTabs,
+} from "@abgov/react-components";
+import { ComponentContent } from "@components/component-content/ComponentContent";
+import {
+  ComponentProperties,
+  ComponentProperty,
+} from "@components/component-properties/ComponentProperties.tsx";
+import { Sandbox, ComponentBinding } from "@components/sandbox";
+import { useState, useContext } from "react";
+import { DesignEmpty } from "@components/empty-states/design-empty/DesignEmpty.tsx";
+import { AccessibilityEmpty } from "@components/empty-states/accessibility-empty/AccessibilityEmpty.tsx";
+import { ExamplesEmpty } from "@components/empty-states/examples-empty/ExamplesEmpty.tsx";
+import {
+  MarginProperty,
+  TestIdProperty,
+} from "@components/component-properties/common-properties.ts";
+import { LanguageVersionContext } from "@contexts/LanguageVersionContext.tsx";
+import { OldComponentBanner } from "@components/old-component-banner/OldComponentBanner.tsx";
+import { CodeSnippet } from "@components/code-snippet/CodeSnippet";
+
+// Page metadata
+const componentName = "Checkbox list";
+const description = "A multiple selection input.";
+const category = Category.INPUTS_AND_ACTIONS;
+const relatedComponents = [
+  { link: "/components/checkbox", name: "Checkbox" },
+  { link: "/components/radio", name: "Radio" },
+  { link: "/components/dropdown", name: "Dropdown" },
+  { link: "/components/form-item", name: "Form item" },
+];
+const FIGMA_LINK = ""; // Provide Figma link when available
+
+export default function CheckboxListPage() {
+  const { version, language } = useContext(LanguageVersionContext);
+
+  // Internal selection state managed by individual checkboxes only for demo; list is uncontrolled here
+  const [bindings, setBindings] = useState<ComponentBinding[]>([
+    { label: "Name", type: "string", name: "name", value: "transport" },
+    { label: "Disabled", type: "boolean", name: "disabled", value: false },
+    { label: "Error", type: "boolean", name: "error", value: false },
+    { label: "Max Width", type: "string", name: "maxWidth", value: "" },
+  ]);
+
+  function onSandboxChange(updatedBindings: ComponentBinding[]) {
+    setBindings(updatedBindings);
+    // value is controlled externally; props.value is not used directly here
+  }
+
+  const componentProperties: ComponentProperty[] = [
+    {
+      name: "name",
+      type: "string",
+      required: true,
+      description: "Unique name to identify the list group.",
+    },
+    { name: "value", type: "string[]", description: "Array of selected checkbox item values." },
+    { name: "disabled", type: "boolean", description: "Disables the entire checkbox list." },
+    { name: "error", type: "boolean", description: "Shows an error state for the list." },
+    {
+      name: "maxWidth",
+      type: "string",
+      description: "Sets the maximum width of the list container.",
+    },
+    {
+      name: "onChange",
+      type: "(detail: GoabCheckboxListOnChangeDetail) => void",
+      description: "Callback when any checkbox selection changes.",
+    },
+    TestIdProperty,
+    MarginProperty,
+  ];
+
+  return (
+    <>
+      <ComponentHeader
+        name={componentName}
+        category={category}
+        description={description}
+        relatedComponents={relatedComponents}
+        figmaLink={FIGMA_LINK}
+        githubLink="Checkbox list"
+      />
+
+      {version === "old" && (
+        <OldComponentBanner componentName={componentName} language={language} />
+      )}
+
+      {version === "new" && (
+        <ComponentContent tocCssQuery="goa-tab[open=true] :is(h2[id], h3[id])">
+          <GoabTabs initialTab={1}>
+            <GoabTab heading="Code playground">
+              <h2 id="component" style={{ display: "none" }}>
+                Playground
+              </h2>
+              <Sandbox
+                skipRender
+                properties={bindings}
+                onChange={onSandboxChange}
+                flags={["reactive", "template-driven"]}>
+                {/* ================================================================== */}
+                {/* REACT SECTION */}
+                {/* ================================================================== */}
+                {version === "new" && (
+                  <CodeSnippet
+                    lang="typescript"
+                    tags="react"
+                    allowCopy={true}
+                    code={`
+                          const [basicSelection, setBasicSelection] = useState<string[]>([]);
+
+                          function checkboxListOnChange(details: GoabCheckboxListOnChangeDetail) {
+                            console.log(details);
+                            setBasicSelection(details.value); 
+                          }
+                          `}
+                  />
+                )}
+
+                {version === "new" && (
+                  <CodeSnippet
+                    lang="html"
+                    tags="react"
+                    allowCopy={true}
+                    code={`
+                    <GoabCheckboxList 
+                      name="basic"
+                      value={basicSelection}
+                      onChange={(e) => checkboxListOnChange(e)}
+                    >
+                      <GoabCheckbox name="car" text="Car" value="Car" />
+                      <GoabCheckbox name="bike" text="Bike" value="Bike" />
+                      <GoabCheckbox name="bus" text="Bus" value="Bus" />
+                    </GoabCheckboxList>
+                  `}
+                  />
+                )}
+                {/* ================================================================== */}
+
+                {/* ================================================================== */}
+                {/* ANGULAR SECTION (Template) */}
+                {/* ================================================================== */}
+                {version === "new" && (
+                  <CodeSnippet
+                    lang="typescript"
+                    tags={["angular", "template-driven"]}
+                    allowCopy={true}
+                    code={`
+                      export class SomeComponent {
+                        basicSelection: string[] = [];
+
+                        checkboxListOnChange(event: GoabCheckboxListOnChangeDetail) {
+                          console.log(event);
+                          this.basicSelection = event.value;
+                        }
+                      }
+                    `}
+                  />
+                )}
+
+                {version === "new" && (
+                  <CodeSnippet
+                    lang="html"
+                    tags={["angular", "template-driven"]}
+                    allowCopy={true}
+                    code={`
+                    <goab-checkbox-list 
+                      name="basic"
+                      [value]="basicSelection"
+                      (onChange)="checkboxListOnChange($event)"
+                    >
+                      <goab-checkbox name="car" text="Car" value="Car" ></goab-checkbox>
+                      <goab-checkbox name="bike" text="Bike" value="Bike" ></goab-checkbox>
+                      <goab-checkbox name="bus" text="Bus" value="Bus" ></goab-checkbox>
+                    </goab-checkbox-list>
+                  `}
+                  />
+                )}
+                {/* ================================================================== */}
+
+                {/* ================================================================== */}
+                {/* ANGULAR SECTION (Reactive) */}
+                {/* ================================================================== */}
+                {version === "new" && (
+                  <CodeSnippet
+                    lang="typescript"
+                    tags={["angular", "reactive"]}
+                    allowCopy={true}
+                    code={`
+                      export class SomeComponent {
+                        form!: FormGroup;
+                        
+                        constructor(private fb: FormBuilder) {
+                          this.form = this.fb.group({
+                            transportation: this.fb.control<string[] | null>([]),
+                          });
+                        }
+                      }
+                    `}
+                  />
+                )}
+
+                {version === "new" && (
+                  <CodeSnippet
+                    lang="html"
+                    tags={["angular", "reactive"]}
+                    allowCopy={true}
+                    code={`
+                      <form [formGroup]="form">
+                        <goab-checkbox-list name="basic" formControlName="transportation">
+                          <goab-checkbox name="car" text="Car" value="Car" ></goab-checkbox>
+                          <goab-checkbox name="bike" text="Bike" value="Bike" ></goab-checkbox>
+                          <goab-checkbox name="bus" text="Bus" value="Bus" ></goab-checkbox>
+                        </goab-checkbox-list>
+                      </form>
+                  `}
+                  />
+                )}
+                {/* ================================================================== */}
+
+                <GoabCheckboxList
+                  name={bindings.find(b => b.name === "name")?.value as string}
+                  disabled={bindings.find(b => b.name === "disabled")?.value as boolean}
+                  error={bindings.find(b => b.name === "error")?.value as boolean}
+                  maxWidth={
+                    (bindings.find(b => b.name === "maxWidth")?.value as string) || undefined
+                  }>
+                  <GoabCheckbox name="car" text="Car" value="car" />
+                  <GoabCheckbox name="bike" text="Bike" value="bike" />
+                  <GoabCheckbox name="bus" text="Bus" value="bus" />
+                </GoabCheckboxList>
+              </Sandbox>
+              <ComponentProperties properties={componentProperties} />
+            </GoabTab>
+            <GoabTab
+              heading={
+                <>
+                  <>Examples</>
+                  <GoabBadge type="information" content="0" />
+                </>
+              }>
+              <ExamplesEmpty />
+            </GoabTab>
+            <GoabTab heading="Design">
+              <DesignEmpty figmaLink={FIGMA_LINK} />
+            </GoabTab>
+            <GoabTab heading="Accessibility">
+              <AccessibilityEmpty figmaLink={FIGMA_LINK} />
+            </GoabTab>
+          </GoabTabs>
+        </ComponentContent>
+      )}
+    </>
+  );
+}
diff --git a/src/routes/components/Components.tsx b/src/routes/components/Components.tsx
index 4b3062fb4..959692a99 100644
--- a/src/routes/components/Components.tsx
+++ b/src/routes/components/Components.tsx
@@ -87,6 +87,7 @@ export function Components() {
               <Link to={getUrl("button")}>Button</Link>
               <Link to={getUrl("button-group")}>Button group</Link>
               <Link to={getUrl("checkbox")}>Checkbox</Link>
+              <Link to={getUrl("checkbox-list")}>{newComponentLabel("Checkbox list")}</Link>
               <Link to={getUrl("date-picker")}>Date picker</Link>
               <Link to={getUrl("dropdown")}>Dropdown</Link>
               <Link to={getUrl("file-uploader")}>File uploader</Link>
diff --git a/src/routes/components/Radio.tsx b/src/routes/components/Radio.tsx
index b3879b9ac..9b1efda05 100644
--- a/src/routes/components/Radio.tsx
+++ b/src/routes/components/Radio.tsx
@@ -8,10 +8,11 @@ import { Category, ComponentHeader } from "@components/component-header/Componen
 import {
   GoabBadge,
   GoabFormItem,
-  GoabRadioGroup, GoabRadioGroupProps,
+  GoabRadioGroup,
+  GoabRadioGroupProps,
   GoabRadioItem,
   GoabTab,
-  GoabTabs
+  GoabTabs,
 } from "@abgov/react-components";
 import { CodeSnippet } from "@components/code-snippet/CodeSnippet.tsx";
 import { useSandboxFormItem } from "@hooks/useSandboxFormItem.tsx";
@@ -21,7 +22,7 @@ import { LanguageVersionContext } from "@contexts/LanguageVersionContext.tsx";
 import {
   LegacyMarginProperty,
   MarginProperty,
-  TestIdProperty
+  TestIdProperty,
 } from "@components/component-properties/common-properties.ts";
 import { GoabRadioGroupOnChangeDetail } from "@abgov/ui-components-common";
 import { DesignEmpty } from "@components/empty-states/design-empty/DesignEmpty.tsx";
@@ -34,19 +35,20 @@ const category = Category.INPUTS_AND_ACTIONS;
 const relatedComponents = [
   { link: "/components/checkbox", name: "Checkbox" },
   { link: "/components/dropdown", name: "Dropdown" },
-  { link: "/components/form-item", name: "Form item" }
+  { link: "/components/form-item", name: "Form item" },
 ];
-const FIGMA_LINK = "https://www.figma.com/design/3pb2IK8s2QUqWieH79KdN7/%E2%9D%96-Component-library-%7C-DDD?node-id=102-26";
+const FIGMA_LINK =
+  "https://www.figma.com/design/3pb2IK8s2QUqWieH79KdN7/%E2%9D%96-Component-library-%7C-DDD?node-id=102-26";
 type ComponentPropsType = GoabRadioGroupProps;
 type CastingType = {
   name: string;
   value: string;
   [key: string]: unknown;
   onChange: (detail: GoabRadioGroupOnChangeDetail) => void;
-}
+};
 
 export default function RadioPage() {
-  const {version} = useContext(LanguageVersionContext);
+  const { version } = useContext(LanguageVersionContext);
   const [radioProps, setRadioProps] = useState<ComponentPropsType>({
     name: "item",
     value: "",
@@ -79,7 +81,9 @@ export default function RadioPage() {
       value: "",
     },
   ]);
-  const { formItemBindings, formItemProps, onFormItemChange } = useSandboxFormItem({ label: "Basic" });
+  const { formItemBindings, formItemProps, onFormItemChange } = useSandboxFormItem({
+    label: "Basic",
+  });
 
   const oldRadioGroupProperties: ComponentProperty[] = [
     {
@@ -114,29 +118,25 @@ export default function RadioPage() {
     {
       name: "ariaLabel",
       lang: "react",
-      description:
-        "Defines how the text will be translated for the screen reader.",
+      description: "Defines how the text will be translated for the screen reader.",
       type: "string",
     },
     {
       name: "arialabel",
       lang: "angular",
-      description:
-        "Defines how the text will be translated for the screen reader.",
+      description: "Defines how the text will be translated for the screen reader.",
       type: "string",
     },
     {
       name: "arialabelledby",
       lang: "angular",
-      description:
-        "Refers to the element that contains the label of the radio group.",
+      description: "Refers to the element that contains the label of the radio group.",
       type: "string",
     },
     {
       name: "ariaLabelledBy",
       lang: "react",
-      description:
-        "Refers to the element that contains the label of the radio group.",
+      description: "Refers to the element that contains the label of the radio group.",
       type: "string",
     },
     {
@@ -180,8 +180,7 @@ export default function RadioPage() {
     },
     {
       name: "ariaLabel",
-      description:
-        "Defines how the text will be translated for the screen reader.",
+      description: "Defines how the text will be translated for the screen reader.",
       type: "string",
     },
     {
@@ -288,7 +287,7 @@ export default function RadioPage() {
     {
       name: "maxWidth",
       type: "string",
-      description: "Sets the maximum width of the radio."
+      description: "Sets the maximum width of the radio.",
     },
     {
       name: "ariaLabel",
@@ -303,7 +302,7 @@ export default function RadioPage() {
     setRadioBindings(bindings);
   }
 
-  const noop = () => { };
+  const noop = () => {};
 
   return (
     <>
@@ -483,8 +482,7 @@ export default function RadioPage() {
                 {version === "new" && <GoabBadge type="information" content="3" />}
                 {version === "old" && <GoabBadge type="information" content="2" />}
               </>
-            }
-          >
+            }>
             <RadioExamples />
           </GoabTab>
 
diff --git a/src/routes/components/Tooltip.tsx b/src/routes/components/Tooltip.tsx
index 467fbc9d1..8a1997568 100644
--- a/src/routes/components/Tooltip.tsx
+++ b/src/routes/components/Tooltip.tsx
@@ -73,8 +73,15 @@ export default function TooltipPage() {
   const oldComponentProperties: ComponentProperty[] = [
     {
       name: "content",
-      type: "string",
+      type: "string | slot",
+      description: "The content of the tooltip",
+      lang: "angular",
+    },
+    {
+      name: "content",
+      type: "string | ReactNode",
       description: "The content of the tooltip",
+      lang: "react",
     },
     {
       name: "position",
@@ -93,8 +100,15 @@ export default function TooltipPage() {
   const componentProperties: ComponentProperty[] = [
     {
       name: "content",
-      type: "string",
+      type: "string | TemplateRef<any>",
+      description: "The content of the tooltip",
+      lang: "angular",
+    },
+    {
+      name: "content",
+      type: "string | ReactNode",
       description: "The content of the tooltip",
+      lang: "react",
     },
     {
       name: "position",
diff --git a/src/versioned-router.tsx b/src/versioned-router.tsx
index 9cac192f0..d3dadbf99 100644
--- a/src/versioned-router.tsx
+++ b/src/versioned-router.tsx
@@ -10,6 +10,7 @@ import ButtonPage from "@routes/components/Button.tsx";
 import ButtonGroupPage from "@routes/components/ButtonGroup.tsx";
 import CalloutPage from "@routes/components/Callout.tsx";
 import CheckboxPage from "@routes/components/Checkbox.tsx";
+import CheckboxListPage from "@routes/components/CheckboxList";
 import ContainerPage from "@routes/components/Container.tsx";
 import DatePickerPage from "@routes/components/DatePicker.tsx";
 import DetailsPage from "@routes/components/Details.tsx";
@@ -93,6 +94,7 @@ export const ComponentsRouter = () => {
     "button-group": <ButtonGroupPage />,
     "callout": <CalloutPage />,
     "checkbox": <CheckboxPage />,
+    "checkbox-list": <CheckboxListPage />,
     "container": <ContainerPage />,
     "date-picker": <DatePickerPage />,
     "details": <DetailsPage />,

From 7750297c010b23989b4ed204bd828773fbfc6d38 Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <nielsen.dustin@gmail.com>
Date: Fri, 3 Oct 2025 16:12:28 -0600
Subject: [PATCH 09/10] fix: Updated Figma Link for Menu Button

---
 src/routes/components/MenuButton.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/components/MenuButton.tsx b/src/routes/components/MenuButton.tsx
index e4800944f..199c44601 100644
--- a/src/routes/components/MenuButton.tsx
+++ b/src/routes/components/MenuButton.tsx
@@ -24,7 +24,7 @@ import { GoabButtonType } from "@abgov/ui-components-common";
 import { CodeSnippet } from "@components/code-snippet/CodeSnippet";
 
 const FIGMA_LINK =
-  "https://www.figma.com/design/3pb2IK8s2QUqWieH79KdN7/%E2%9D%96-Component-library-%7C-DDD?node-id=41625-336313&t=SorPzaYbnqfQ8qiQ-4";
+  "https://www.figma.com/design/3pb2IK8s2QUqWieH79KdN7/%E2%9D%96-Component-library-%7C-DDD?node-id=69366-164803";
 
 const componentName = "Menu button";
 const description = "Expose a short list of contextual actions without cluttering the interface.";

From 17b95f6a900f782562ae4f960f51476fe9b2bdc4 Mon Sep 17 00:00:00 2001
From: Dustin Nielsen <dustin.nielsen@gov.ab.ca>
Date: Fri, 3 Oct 2025 16:16:13 -0600
Subject: [PATCH 10/10] fix: Updated versions to fix Menu Button tertiary issue

---
 package-lock.json | 721 ++++++----------------------------------------
 package.json      |   6 +-
 2 files changed, 86 insertions(+), 641 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index afd738877..29c14b951 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,9 +8,9 @@
       "name": "code-sandbox",
       "version": "0.0.0",
       "dependencies": {
-        "@abgov/react-components": "6.8.0-alpha.2",
-        "@abgov/ui-components-common": "1.7.0",
-        "@abgov/web-components": "1.38.0-alpha.3",
+        "@abgov/react-components": "6.8.0-alpha.3",
+        "@abgov/ui-components-common": "1.8.0-alpha.3",
+        "@abgov/web-components": "1.38.0-alpha.5",
         "@faker-js/faker": "^8.3.1",
         "highlight.js": "^11.8.0",
         "js-cookie": "^3.0.5",
@@ -68,9 +68,9 @@
       }
     },
     "node_modules/@abgov/react-components": {
-      "version": "6.8.0-alpha.2",
-      "resolved": "https://registry.npmjs.org/@abgov/react-components/-/react-components-6.8.0-alpha.2.tgz",
-      "integrity": "sha512-C4ZmYzOWrFUKtcmcP+3Zz3zcUBQgziZqx3lVB5jkQT052vqt/5JQQWkB8Danw0fjfgnuO/MheOWH8qZEuZjFlg==",
+      "version": "6.8.0-alpha.3",
+      "resolved": "https://registry.npmjs.org/@abgov/react-components/-/react-components-6.8.0-alpha.3.tgz",
+      "integrity": "sha512-BMEMhhJiNF/QaVHXG4yCO/fQaLUy6d7nYZS0h6cKFHCeCmd5ZZVpuZI3E/wdWDO1HgZH+HLpNtUyi7G7BpYfkA==",
       "peerDependencies": {
         "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
         "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
@@ -78,32 +78,14 @@
       }
     },
     "node_modules/@abgov/ui-components-common": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/@abgov/ui-components-common/-/ui-components-common-1.7.0.tgz",
-      "integrity": "sha512-dnqLxTJdBxNZFKPDyckaHHrkipjFIwXyU63rlEkcHgKhn4d+KrwlbMuxtsS73FvH4bozyQm2OM+sPu32wyWgNA=="
+      "version": "1.8.0-alpha.3",
+      "resolved": "https://registry.npmjs.org/@abgov/ui-components-common/-/ui-components-common-1.8.0-alpha.3.tgz",
+      "integrity": "sha512-RW53rqOfP0gd8W2OoWOZnj8U8Q5L4KL9V2staZswqm+O7D3AXQUAslmXImGUPd922Xn8hkPNzDEq1CPuoAcaXw=="
     },
     "node_modules/@abgov/web-components": {
-      "version": "1.38.0-alpha.3",
-      "resolved": "https://registry.npmjs.org/@abgov/web-components/-/web-components-1.38.0-alpha.3.tgz",
-      "integrity": "sha512-mE8qwOCO+V7gHvZqrONgo81c0HBekci7jSwO+GoOQRrRMYoh17vTRM3tPPrtRznqJ+QyQBQS5G2tWkpoqbHMsg==",
-      "peerDependencies": {
-        "@sveltejs/vite-plugin-svelte": "3.x",
-        "glob": "10.x",
-        "svelte": "4.x"
-      }
-    },
-    "node_modules/@ampproject/remapping": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
-      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
-      "peer": true,
-      "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.5",
-        "@jridgewell/trace-mapping": "^0.3.24"
-      },
-      "engines": {
-        "node": ">=6.0.0"
-      }
+      "version": "1.38.0-alpha.5",
+      "resolved": "https://registry.npmjs.org/@abgov/web-components/-/web-components-1.38.0-alpha.5.tgz",
+      "integrity": "sha512-YqVXvd8KkCc/oy2rcfiuL89RB0kJ+x/y94vm0azPLL1iKyhw1xCQBIXhJIkeGeEcLGZHUNYGV2DIPupHHOnb5Q=="
     },
     "node_modules/@esbuild/aix-ppc64": {
       "version": "0.21.5",
@@ -112,6 +94,7 @@
       "cpu": [
         "ppc64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "aix"
@@ -127,6 +110,7 @@
       "cpu": [
         "arm"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "android"
@@ -142,6 +126,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "android"
@@ -157,6 +142,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "android"
@@ -172,6 +158,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "darwin"
@@ -187,6 +174,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "darwin"
@@ -202,6 +190,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "freebsd"
@@ -217,6 +206,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "freebsd"
@@ -232,6 +222,7 @@
       "cpu": [
         "arm"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -247,6 +238,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -262,6 +254,7 @@
       "cpu": [
         "ia32"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -277,6 +270,7 @@
       "cpu": [
         "loong64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -292,6 +286,7 @@
       "cpu": [
         "mips64el"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -307,6 +302,7 @@
       "cpu": [
         "ppc64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -322,6 +318,7 @@
       "cpu": [
         "riscv64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -337,6 +334,7 @@
       "cpu": [
         "s390x"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -352,6 +350,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -367,6 +366,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "netbsd"
@@ -382,6 +382,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "openbsd"
@@ -397,6 +398,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "sunos"
@@ -412,6 +414,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "win32"
@@ -427,6 +430,7 @@
       "cpu": [
         "ia32"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "win32"
@@ -442,6 +446,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "win32"
@@ -554,85 +559,6 @@
       "integrity": "sha512-6EwiSjwWYP7pTckG6I5eyFANjPhmPjUX9JRLUSfNPC7FX7zK9gyZAfUEaECL6ALTpGX5AjnBq3C9XmVWPitNpw==",
       "dev": true
     },
-    "node_modules/@isaacs/cliui": {
-      "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
-      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
-      "peer": true,
-      "dependencies": {
-        "string-width": "^5.1.2",
-        "string-width-cjs": "npm:string-width@^4.2.0",
-        "strip-ansi": "^7.0.1",
-        "strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
-        "wrap-ansi": "^8.1.0",
-        "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@isaacs/cliui/node_modules/ansi-regex": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
-      "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==",
-      "peer": true,
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
-      }
-    },
-    "node_modules/@isaacs/cliui/node_modules/strip-ansi": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
-      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
-      "peer": true,
-      "dependencies": {
-        "ansi-regex": "^6.0.1"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
-      }
-    },
-    "node_modules/@jridgewell/gen-mapping": {
-      "version": "0.3.12",
-      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.12.tgz",
-      "integrity": "sha512-OuLGC46TjB5BbN1dH8JULVVZY4WTdkF7tV9Ys6wLL1rubZnCMstOhNHueU5bLCrnRuDhKPDM4g6sw4Bel5Gzqg==",
-      "peer": true,
-      "dependencies": {
-        "@jridgewell/sourcemap-codec": "^1.5.0",
-        "@jridgewell/trace-mapping": "^0.3.24"
-      }
-    },
-    "node_modules/@jridgewell/resolve-uri": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
-      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
-      "peer": true,
-      "engines": {
-        "node": ">=6.0.0"
-      }
-    },
-    "node_modules/@jridgewell/sourcemap-codec": {
-      "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.4.tgz",
-      "integrity": "sha512-VT2+G1VQs/9oz078bLrYbecdZKs912zQlkelYpuf+SXF+QvZDYJlbx/LSx+meSAwdDFnF8FVXW92AVjjkVmgFw==",
-      "peer": true
-    },
-    "node_modules/@jridgewell/trace-mapping": {
-      "version": "0.3.29",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.29.tgz",
-      "integrity": "sha512-uw6guiW/gcAGPDhLmd77/6lW8QLeiV5RUTsAX46Db6oLhGaVj4lhnPwb184s1bkc8kdVg/+h988dro8GRDpmYQ==",
-      "peer": true,
-      "dependencies": {
-        "@jridgewell/resolve-uri": "^3.1.0",
-        "@jridgewell/sourcemap-codec": "^1.4.14"
-      }
-    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -990,16 +916,6 @@
         "node": ">= 18"
       }
     },
-    "node_modules/@pkgjs/parseargs": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
-      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
-      "optional": true,
-      "peer": true,
-      "engines": {
-        "node": ">=14"
-      }
-    },
     "node_modules/@remix-run/router": {
       "version": "1.15.3",
       "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.15.3.tgz",
@@ -1015,6 +931,7 @@
       "cpu": [
         "arm"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "android"
@@ -1027,6 +944,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "android"
@@ -1039,6 +957,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "darwin"
@@ -1051,6 +970,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "darwin"
@@ -1063,6 +983,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "freebsd"
@@ -1075,6 +996,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "freebsd"
@@ -1087,6 +1009,7 @@
       "cpu": [
         "arm"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1099,6 +1022,7 @@
       "cpu": [
         "arm"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1111,6 +1035,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1123,6 +1048,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1135,6 +1061,7 @@
       "cpu": [
         "ppc64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1147,6 +1074,7 @@
       "cpu": [
         "riscv64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1159,6 +1087,7 @@
       "cpu": [
         "s390x"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1171,6 +1100,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1183,6 +1113,7 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "linux"
@@ -1195,6 +1126,7 @@
       "cpu": [
         "arm64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "win32"
@@ -1207,6 +1139,7 @@
       "cpu": [
         "ia32"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "win32"
@@ -1219,50 +1152,12 @@
       "cpu": [
         "x64"
       ],
+      "dev": true,
       "optional": true,
       "os": [
         "win32"
       ]
     },
-    "node_modules/@sveltejs/vite-plugin-svelte": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-3.1.2.tgz",
-      "integrity": "sha512-Txsm1tJvtiYeLUVRNqxZGKR/mI+CzuIQuc2gn+YCs9rMTowpNZ2Nqt53JdL8KF9bLhAf2ruR/dr9eZCwdTriRA==",
-      "peer": true,
-      "dependencies": {
-        "@sveltejs/vite-plugin-svelte-inspector": "^2.1.0",
-        "debug": "^4.3.4",
-        "deepmerge": "^4.3.1",
-        "kleur": "^4.1.5",
-        "magic-string": "^0.30.10",
-        "svelte-hmr": "^0.16.0",
-        "vitefu": "^0.2.5"
-      },
-      "engines": {
-        "node": "^18.0.0 || >=20"
-      },
-      "peerDependencies": {
-        "svelte": "^4.0.0 || ^5.0.0-next.0",
-        "vite": "^5.0.0"
-      }
-    },
-    "node_modules/@sveltejs/vite-plugin-svelte-inspector": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte-inspector/-/vite-plugin-svelte-inspector-2.1.0.tgz",
-      "integrity": "sha512-9QX28IymvBlSCqsCll5t0kQVxipsfhFFL+L2t3nTWfXnddYwxBuAEtTtlaVQpRz9c37BhJjltSeY4AJSC03SSg==",
-      "peer": true,
-      "dependencies": {
-        "debug": "^4.3.4"
-      },
-      "engines": {
-        "node": "^18.0.0 || >=20"
-      },
-      "peerDependencies": {
-        "@sveltejs/vite-plugin-svelte": "^3.0.0",
-        "svelte": "^4.0.0 || ^5.0.0-next.0",
-        "vite": "^5.0.0"
-      }
-    },
     "node_modules/@swc/core": {
       "version": "1.4.8",
       "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.4.8.tgz",
@@ -1484,7 +1379,8 @@
     "node_modules/@types/estree": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
-      "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw=="
+      "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==",
+      "dev": true
     },
     "node_modules/@types/history": {
       "version": "4.7.11",
@@ -1776,6 +1672,7 @@
       "version": "8.11.3",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
       "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==",
+      "dev": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -1812,6 +1709,7 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
       "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -1820,6 +1718,7 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
       "dependencies": {
         "color-convert": "^2.0.1"
       },
@@ -1836,15 +1735,6 @@
       "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
       "dev": true
     },
-    "node_modules/aria-query": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz",
-      "integrity": "sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==",
-      "peer": true,
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/array-union": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
@@ -1854,19 +1744,11 @@
         "node": ">=8"
       }
     },
-    "node_modules/axobject-query": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
-      "integrity": "sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==",
-      "peer": true,
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
+      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
+      "dev": true
     },
     "node_modules/before-after-hook": {
       "version": "3.0.2",
@@ -1925,23 +1807,11 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
-    "node_modules/code-red": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/code-red/-/code-red-1.0.4.tgz",
-      "integrity": "sha512-7qJWqItLA8/VPVlKJlFXU+NBlo/qyfs39aJcuMT/2ere32ZqvF5OSxgdM5xOfJJ7O429gg2HM47y8v9P+9wrNw==",
-      "peer": true,
-      "dependencies": {
-        "@jridgewell/sourcemap-codec": "^1.4.15",
-        "@types/estree": "^1.0.1",
-        "acorn": "^8.10.0",
-        "estree-walker": "^3.0.3",
-        "periscopic": "^3.1.0"
-      }
-    },
     "node_modules/color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
       "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dev": true,
       "dependencies": {
         "color-name": "~1.1.4"
       },
@@ -1952,7 +1822,8 @@
     "node_modules/color-name": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "dev": true
     },
     "node_modules/concat-map": {
       "version": "0.0.1",
@@ -1964,6 +1835,7 @@
       "version": "7.0.6",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
       "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
+      "dev": true,
       "dependencies": {
         "path-key": "^3.1.0",
         "shebang-command": "^2.0.0",
@@ -1973,19 +1845,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/css-tree": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz",
-      "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==",
-      "peer": true,
-      "dependencies": {
-        "mdn-data": "2.0.30",
-        "source-map-js": "^1.0.1"
-      },
-      "engines": {
-        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
-      }
-    },
     "node_modules/csstype": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
@@ -1995,6 +1854,7 @@
       "version": "4.3.4",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
       "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "dev": true,
       "dependencies": {
         "ms": "2.1.2"
       },
@@ -2013,15 +1873,6 @@
       "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
       "dev": true
     },
-    "node_modules/deepmerge": {
-      "version": "4.3.1",
-      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
-      "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
-      "peer": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/dir-glob": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz",
@@ -2046,22 +1897,11 @@
         "node": ">=6.0.0"
       }
     },
-    "node_modules/eastasianwidth": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
-      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
-      "peer": true
-    },
-    "node_modules/emoji-regex": {
-      "version": "9.2.2",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
-      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
-      "peer": true
-    },
     "node_modules/esbuild": {
       "version": "0.21.5",
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
       "integrity": "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==",
+      "dev": true,
       "hasInstallScript": true,
       "bin": {
         "esbuild": "bin/esbuild"
@@ -2301,15 +2141,6 @@
         "node": ">=4.0"
       }
     },
-    "node_modules/estree-walker": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
-      "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
-      "peer": true,
-      "dependencies": {
-        "@types/estree": "^1.0.0"
-      }
-    },
     "node_modules/esutils": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
@@ -2450,22 +2281,6 @@
       "integrity": "sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==",
       "dev": true
     },
-    "node_modules/foreground-child": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
-      "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",
-      "peer": true,
-      "dependencies": {
-        "cross-spawn": "^7.0.6",
-        "signal-exit": "^4.0.1"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/fs.realpath": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
@@ -2476,6 +2291,7 @@
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
       "hasInstallScript": true,
       "optional": true,
       "os": [
@@ -2485,26 +2301,6 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
-    "node_modules/glob": {
-      "version": "10.4.5",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
-      "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
-      "peer": true,
-      "dependencies": {
-        "foreground-child": "^3.1.0",
-        "jackspeak": "^3.1.2",
-        "minimatch": "^9.0.4",
-        "minipass": "^7.1.2",
-        "package-json-from-dist": "^1.0.0",
-        "path-scurry": "^1.11.1"
-      },
-      "bin": {
-        "glob": "dist/esm/bin.mjs"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/glob-parent": {
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
@@ -2517,30 +2313,6 @@
         "node": ">=10.13.0"
       }
     },
-    "node_modules/glob/node_modules/brace-expansion": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
-      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
-      "peer": true,
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/glob/node_modules/minimatch": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
-      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
-      "peer": true,
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/globals": {
       "version": "13.24.0",
       "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
@@ -2658,15 +2430,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/is-fullwidth-code-point": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
-      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
-      "peer": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/is-glob": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
@@ -2697,34 +2460,11 @@
         "node": ">=8"
       }
     },
-    "node_modules/is-reference": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/is-reference/-/is-reference-3.0.3.tgz",
-      "integrity": "sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==",
-      "peer": true,
-      "dependencies": {
-        "@types/estree": "^1.0.6"
-      }
-    },
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
-    },
-    "node_modules/jackspeak": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
-      "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
-      "peer": true,
-      "dependencies": {
-        "@isaacs/cliui": "^8.0.2"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      },
-      "optionalDependencies": {
-        "@pkgjs/parseargs": "^0.11.0"
-      }
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
+      "dev": true
     },
     "node_modules/js-cookie": {
       "version": "3.0.5",
@@ -2779,15 +2519,6 @@
         "json-buffer": "3.0.1"
       }
     },
-    "node_modules/kleur": {
-      "version": "4.1.5",
-      "resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.5.tgz",
-      "integrity": "sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==",
-      "peer": true,
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/levn": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
@@ -2801,12 +2532,6 @@
         "node": ">= 0.8.0"
       }
     },
-    "node_modules/locate-character": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz",
-      "integrity": "sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==",
-      "peer": true
-    },
     "node_modules/locate-path": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
@@ -2850,21 +2575,6 @@
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
       "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ=="
     },
-    "node_modules/magic-string": {
-      "version": "0.30.17",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.17.tgz",
-      "integrity": "sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==",
-      "peer": true,
-      "dependencies": {
-        "@jridgewell/sourcemap-codec": "^1.5.0"
-      }
-    },
-    "node_modules/mdn-data": {
-      "version": "2.0.30",
-      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz",
-      "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==",
-      "peer": true
-    },
     "node_modules/merge2": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -2899,24 +2609,17 @@
         "node": "*"
       }
     },
-    "node_modules/minipass": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
-      "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
-      "peer": true,
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      }
-    },
     "node_modules/ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
+      "dev": true
     },
     "node_modules/nanoid": {
       "version": "3.3.7",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
       "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
+      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -3018,12 +2721,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/package-json-from-dist": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
-      "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
-      "peer": true
-    },
     "node_modules/parent-module": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -3058,26 +2755,11 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
       "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
+      "dev": true,
       "engines": {
         "node": ">=8"
       }
     },
-    "node_modules/path-scurry": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
-      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
-      "peer": true,
-      "dependencies": {
-        "lru-cache": "^10.2.0",
-        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/path-type": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
@@ -3087,21 +2769,11 @@
         "node": ">=8"
       }
     },
-    "node_modules/periscopic": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/periscopic/-/periscopic-3.1.0.tgz",
-      "integrity": "sha512-vKiQ8RRtkl9P+r/+oefh25C3fhybptkHKCZSPlcXiJux2tJF55GnEj3BVn4A5gKfq9NWWXXrxkHBwVPUfH0opw==",
-      "peer": true,
-      "dependencies": {
-        "@types/estree": "^1.0.0",
-        "estree-walker": "^3.0.0",
-        "is-reference": "^3.0.0"
-      }
-    },
     "node_modules/picocolors": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
-      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
+      "dev": true
     },
     "node_modules/picomatch": {
       "version": "2.3.1",
@@ -3119,6 +2791,7 @@
       "version": "8.4.47",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.47.tgz",
       "integrity": "sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ==",
+      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -3303,6 +2976,7 @@
       "version": "4.24.4",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.24.4.tgz",
       "integrity": "sha512-vGorVWIsWfX3xbcyAS+I047kFKapHYivmkaT63Smj77XwvLSJos6M1xGqZnBPFQFBRZDOcG1QnYEIxAvTr/HjA==",
+      "dev": true,
       "dependencies": {
         "@types/estree": "1.0.6"
       },
@@ -3397,6 +3071,7 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
       "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+      "dev": true,
       "dependencies": {
         "shebang-regex": "^3.0.0"
       },
@@ -3408,22 +3083,11 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
       "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+      "dev": true,
       "engines": {
         "node": ">=8"
       }
     },
-    "node_modules/signal-exit": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
-      "peer": true,
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/slash": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
@@ -3437,92 +3101,16 @@
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
       "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
     },
-    "node_modules/string-width": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
-      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
-      "peer": true,
-      "dependencies": {
-        "eastasianwidth": "^0.2.0",
-        "emoji-regex": "^9.2.2",
-        "strip-ansi": "^7.0.1"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/string-width-cjs": {
-      "name": "string-width",
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "peer": true,
-      "dependencies": {
-        "emoji-regex": "^8.0.0",
-        "is-fullwidth-code-point": "^3.0.0",
-        "strip-ansi": "^6.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/string-width-cjs/node_modules/emoji-regex": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
-      "peer": true
-    },
-    "node_modules/string-width/node_modules/ansi-regex": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
-      "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==",
-      "peer": true,
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
-      }
-    },
-    "node_modules/string-width/node_modules/strip-ansi": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
-      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
-      "peer": true,
-      "dependencies": {
-        "ansi-regex": "^6.0.1"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
-      }
-    },
     "node_modules/strip-ansi": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
       "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dependencies": {
-        "ansi-regex": "^5.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/strip-ansi-cjs": {
-      "name": "strip-ansi",
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "peer": true,
+      "dev": true,
       "dependencies": {
         "ansi-regex": "^5.0.1"
       },
@@ -3554,43 +3142,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/svelte": {
-      "version": "4.2.20",
-      "resolved": "https://registry.npmjs.org/svelte/-/svelte-4.2.20.tgz",
-      "integrity": "sha512-eeEgGc2DtiUil5ANdtd8vPwt9AgaMdnuUFnPft9F5oMvU/FHu5IHFic+p1dR/UOB7XU2mX2yHW+NcTch4DCh5Q==",
-      "peer": true,
-      "dependencies": {
-        "@ampproject/remapping": "^2.2.1",
-        "@jridgewell/sourcemap-codec": "^1.4.15",
-        "@jridgewell/trace-mapping": "^0.3.18",
-        "@types/estree": "^1.0.1",
-        "acorn": "^8.9.0",
-        "aria-query": "^5.3.0",
-        "axobject-query": "^4.0.0",
-        "code-red": "^1.0.3",
-        "css-tree": "^2.3.1",
-        "estree-walker": "^3.0.3",
-        "is-reference": "^3.0.1",
-        "locate-character": "^3.0.0",
-        "magic-string": "^0.30.4",
-        "periscopic": "^3.1.0"
-      },
-      "engines": {
-        "node": ">=16"
-      }
-    },
-    "node_modules/svelte-hmr": {
-      "version": "0.16.0",
-      "resolved": "https://registry.npmjs.org/svelte-hmr/-/svelte-hmr-0.16.0.tgz",
-      "integrity": "sha512-Gyc7cOS3VJzLlfj7wKS0ZnzDVdv3Pn2IuVeJPk9m2skfhcu5bq3wtIZyQGggr7/Iim5rH5cncyQft/kRLupcnA==",
-      "peer": true,
-      "engines": {
-        "node": "^12.20 || ^14.13.1 || >= 16"
-      },
-      "peerDependencies": {
-        "svelte": "^3.19.0 || ^4.0.0"
-      }
-    },
     "node_modules/text-table": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
@@ -3701,6 +3252,7 @@
       "version": "5.4.19",
       "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.19.tgz",
       "integrity": "sha512-qO3aKv3HoQC8QKiNSTuUM1l9o/XX3+c+VTgLHbJWHZGeTPVAg2XwazI9UWzoxjIJCGCV2zU60uqMzjeLZuULqA==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "esbuild": "^0.21.3",
@@ -3756,24 +3308,11 @@
         }
       }
     },
-    "node_modules/vitefu": {
-      "version": "0.2.5",
-      "resolved": "https://registry.npmjs.org/vitefu/-/vitefu-0.2.5.tgz",
-      "integrity": "sha512-SgHtMLoqaeeGnd2evZ849ZbACbnwQCIwRH57t18FxcXoZop0uQu0uzlIhJBlF/eWVzuce0sHeqPcDo+evVcg8Q==",
-      "peer": true,
-      "peerDependencies": {
-        "vite": "^3.0.0 || ^4.0.0 || ^5.0.0"
-      },
-      "peerDependenciesMeta": {
-        "vite": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/which": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
       "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
+      "dev": true,
       "dependencies": {
         "isexe": "^2.0.0"
       },
@@ -3784,100 +3323,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/wrap-ansi": {
-      "version": "8.1.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
-      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
-      "peer": true,
-      "dependencies": {
-        "ansi-styles": "^6.1.0",
-        "string-width": "^5.0.1",
-        "strip-ansi": "^7.0.1"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
-      }
-    },
-    "node_modules/wrap-ansi-cjs": {
-      "name": "wrap-ansi",
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-      "peer": true,
-      "dependencies": {
-        "ansi-styles": "^4.0.0",
-        "string-width": "^4.1.0",
-        "strip-ansi": "^6.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
-      }
-    },
-    "node_modules/wrap-ansi-cjs/node_modules/emoji-regex": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
-      "peer": true
-    },
-    "node_modules/wrap-ansi-cjs/node_modules/string-width": {
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "peer": true,
-      "dependencies": {
-        "emoji-regex": "^8.0.0",
-        "is-fullwidth-code-point": "^3.0.0",
-        "strip-ansi": "^6.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/wrap-ansi/node_modules/ansi-regex": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
-      "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==",
-      "peer": true,
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
-      }
-    },
-    "node_modules/wrap-ansi/node_modules/ansi-styles": {
-      "version": "6.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
-      "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
-      "peer": true,
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "node_modules/wrap-ansi/node_modules/strip-ansi": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
-      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
-      "peer": true,
-      "dependencies": {
-        "ansi-regex": "^6.0.1"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
-      }
-    },
     "node_modules/wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
diff --git a/package.json b/package.json
index e062f4968..6feeb98df 100644
--- a/package.json
+++ b/package.json
@@ -12,9 +12,9 @@
     "prettier": "npx prettier . --write"
   },
   "dependencies": {
-    "@abgov/react-components": "6.8.0-alpha.2",
-    "@abgov/ui-components-common": "1.7.0",
-    "@abgov/web-components": "1.38.0-alpha.3",
+    "@abgov/react-components": "6.8.0-alpha.3",
+    "@abgov/ui-components-common": "1.8.0-alpha.3",
+    "@abgov/web-components": "1.38.0-alpha.5",
     "@faker-js/faker": "^8.3.1",
     "highlight.js": "^11.8.0",
     "js-cookie": "^3.0.5",