@nswds/app 1.43.0 → 1.44.0

package/dist/index.cjs

@@ -17,6 +17,7 @@ var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
 var CheckboxPrimitive = require('@radix-ui/react-checkbox');
 var nextThemes = require('next-themes');
 var TooltipPrimitive = require('@radix-ui/react-tooltip');
+var ScrollAreaPrimitive = require('@radix-ui/react-scroll-area');
 var Prism = require('prismjs');
 require('prismjs/components/prism-bash');
 require('prismjs/components/prism-css');
@@ -27,13 +28,13 @@ require('prismjs/components/prism-tsx');
 require('prismjs/components/prism-typescript');
 var SelectPrimitive = require('@radix-ui/react-select');
 var PopoverPrimitive = require('@radix-ui/react-popover');
+var usehooks = require('@uidotdev/usehooks');
+var sonner = require('sonner');
 var LabelPrimitive = require('@radix-ui/react-label');
 var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
 var lucideReact = require('lucide-react');
 var TabsPrimitive2 = require('@radix-ui/react-tabs');
 var CollapsiblePrimitive = require('@radix-ui/react-collapsible');
-var usehooks = require('@uidotdev/usehooks');
-var sonner = require('sonner');
 var cmdk = require('cmdk');
 var DialogPrimitive = require('@radix-ui/react-dialog');
 var ContextMenuPrimitive = require('@radix-ui/react-context-menu');
@@ -46,7 +47,6 @@ var MenubarPrimitive = require('@radix-ui/react-menubar');
 var NavigationMenuPrimitive = require('@radix-ui/react-navigation-menu');
 var ProgressPrimitive = require('@radix-ui/react-progress');
 var ResizablePrimitive = require('react-resizable-panels');
-var ScrollAreaPrimitive = require('@radix-ui/react-scroll-area');
 var SliderPrimitive = require('@radix-ui/react-slider');
 var RechartsPrimitive = require('recharts');
 var react = require('@remixicon/react');
@@ -91,6 +91,7 @@ var culori__namespace = /*#__PURE__*/_interopNamespace(culori);
 var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(DropdownMenuPrimitive);
 var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
 var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
+var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPrimitive);
 var Prism__default = /*#__PURE__*/_interopDefault(Prism);
 var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
 var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
@@ -107,7 +108,6 @@ var MenubarPrimitive__namespace = /*#__PURE__*/_interopNamespace(MenubarPrimitiv
 var NavigationMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(NavigationMenuPrimitive);
 var ProgressPrimitive__namespace = /*#__PURE__*/_interopNamespace(ProgressPrimitive);
 var ResizablePrimitive__namespace = /*#__PURE__*/_interopNamespace(ResizablePrimitive);
-var ScrollAreaPrimitive__namespace = /*#__PURE__*/_interopNamespace(ScrollAreaPrimitive);
 var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
 var RechartsPrimitive__namespace = /*#__PURE__*/_interopNamespace(RechartsPrimitive);
 var HoverCardPrimitives__namespace = /*#__PURE__*/_interopNamespace(HoverCardPrimitives);
@@ -247,23 +247,23 @@ var focusInput = [
   // base
   "focus:ring-2",
   // ring color
-  "focus:ring-blue-200 dark:focus:ring-blue-700/30",
+  "focus:ring-primary-200 dark:focus:ring-primary-700/30",
   // border color
-  "focus:border-blue-500 dark:focus:border-blue-700"
+  "focus:border-primary-500 dark:focus:border-primary-700"
 ];
 var hasErrorInput = [
   // base
   "ring-2",
   // border color
-  "border-red-500 dark:border-red-700",
+  "border-danger-500 dark:border-danger-700",
   // ring color
-  "ring-red-200 dark:ring-red-700/30"
+  "ring-danger-200 dark:ring-danger-700/30"
 ];
 var focusRing = [
   // base
   "outline outline-offset-2 outline-0 focus-visible:outline-2",
   // outline color
-  "outline-blue-500 dark:outline-blue-500"
+  "outline-primary-500 dark:outline-primary-500"
 ];
 function Accordion({ ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(AccordionPrimitive__namespace.Root, { "data-slot": "accordion", ...props });
@@ -276,10 +276,7 @@ function AccordionItem({
     AccordionPrimitive__namespace.Item,
     {
       "data-slot": "accordion-item",
-      className: cn(
-        "border-nsw-grey-200 dark:border-nsw-grey-200/20 border-b last:border-b-0",
-        className
-      ),
+      className: cn("border-grey-200 dark:border-grey-200/20 border-b last:border-b-0", className),
       ...props
     }
   );
@@ -296,17 +293,17 @@ function AccordionTrigger({
       className: cn(
         [
           // Base
-          "bg-nsw-grey-50 flex flex-1 cursor-pointer items-start justify-between gap-4 p-4 text-left text-base font-medium transition-all",
+          "bg-grey-50 flex flex-1 cursor-pointer items-start justify-between gap-4 p-4 text-left text-base font-medium transition-all",
           // Focus
           "focus-visible:border-ring focus-visible:ring-ring/50 outline-none focus-visible:ring-[2px]",
           // State
-          "hover:bg-nsw-grey-100 hover:text-nsw-grey-850 [&[data-state=open]>svg]:rotate-180",
+          "hover:bg-grey-100 hover:text-grey-850 [&[data-state=open]>svg]:rotate-180",
           // Disabled
           "data-disabled:pointer-events-none data-disabled:opacity-50",
           // Dark mode
-          "dark:bg-nsw-grey-800 dark:hover:bg-nsw-grey-700 dark:text-white",
+          "dark:bg-grey-800 dark:hover:bg-grey-700 dark:text-white",
           // Dark mode hover
-          "dark:hover:bg-nsw-grey-700 dark:hover:text-white [&[data-state=open]>svg]:rotate-180"
+          "dark:hover:bg-grey-700 dark:hover:text-white [&[data-state=open]>svg]:rotate-180"
         ],
         className
       ),
@@ -333,6 +330,9 @@ function AccordionContent({
     }
   );
 }
+function AuthLayout({ children }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("main", { className: "flex min-h-dvh flex-col p-2", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:ring-grey-950/5 dark:lg:bg-grey-900 flex grow items-center justify-center p-6 lg:rounded-sm lg:bg-white lg:p-10 lg:shadow-xs lg:ring-1 dark:lg:ring-white/10", children }) });
+}
 var alertVariants = classVarianceAuthority.cva(
   "relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
   {
@@ -1951,7 +1951,7 @@ function Card({ className, ...props }) {
     {
       "data-slot": "card",
       className: cn(
-        "border-nsw-grey-200 dark:border-nsw-grey-50 bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6",
+        "border-grey-200 dark:border-grey-50 bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6",
         className
       ),
       ...props
@@ -2046,640 +2046,73 @@ function Checkbox({ className, ...props }) {
     }
   );
 }
-var Social = {
-  Facebook: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-    "path",
-    {
-      fillRule: "evenodd",
-      d: "M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z",
-      clipRule: "evenodd"
-    }
-  ) }),
-  Github: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-    "path",
-    {
-      fillRule: "evenodd",
-      d: "M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z",
-      clipRule: "evenodd"
-    }
-  ) }),
-  Instagram: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-    "path",
-    {
-      fillRule: "evenodd",
-      d: "M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z",
-      clipRule: "evenodd"
-    }
-  ) }),
-  LinkedIn: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 3A2 2 0 0 1 21 5V19A2 2 0 0 1 19 21H5A2 2 0 0 1 3 19V5A2 2 0 0 1 5 3H19M18.5 18.5V13.2A3.26 3.26 0 0 0 15.24 9.94C14.39 9.94 13.4 10.46 12.92 11.24V10.13H10.13V18.5H12.92V13.57C12.92 12.8 13.54 12.17 14.31 12.17A1.4 1.4 0 0 1 15.71 13.57V18.5H18.5M6.88 8.56A1.68 1.68 0 0 0 8.56 6.88C8.56 5.95 7.81 5.19 6.88 5.19A1.69 1.69 0 0 0 5.19 6.88C5.19 7.81 5.95 8.56 6.88 8.56M8.27 18.5V10.13H5.5V18.5H8.27Z" }) }),
-  X: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M13.6823 10.6218L20.2391 3H18.6854L12.9921 9.61788L8.44486 3H3.2002L10.0765 13.0074L3.2002 21H4.75404L10.7663 14.0113L15.5685 21H20.8131L13.6819 10.6218H13.6823ZM11.5541 13.0956L10.8574 12.0991L5.31391 4.16971H7.70053L12.1742 10.5689L12.8709 11.5655L18.6861 19.8835H16.2995L11.5541 13.096V13.0956Z" }) }),
-  YouTube: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-    "path",
-    {
-      fillRule: "evenodd",
-      d: "M19.812 5.418c.861.23 1.538.907 1.768 1.768C21.998 8.746 22 12 22 12s0 3.255-.418 4.814a2.504 2.504 0 0 1-1.768 1.768c-1.56.419-7.814.419-7.814.419s-6.255 0-7.814-.419a2.505 2.505 0 0 1-1.768-1.768C2 15.255 2 12 2 12s0-3.255.417-4.814a2.507 2.507 0 0 1 1.768-1.768C5.744 5 11.998 5 11.998 5s6.255 0 7.814.418ZM15.194 12 10 15V9l5.194 3Z",
-      clipRule: "evenodd"
-    }
-  ) })
-};
-function TooltipProvider({
-  delayDuration,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TooltipPrimitive__namespace.Provider,
-    {
-      "data-slot": "tooltip-provider",
-      delayDuration,
-      ...props
-    }
-  );
-}
-function Tooltip({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { "data-slot": "tooltip", ...props });
-}
-function TooltipTrigger({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { "data-slot": "tooltip-trigger", ...props });
-}
-function TooltipContent({
-  className,
-  sideOffset = 0,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-    TooltipPrimitive__namespace.Content,
-    {
-      "data-slot": "tooltip-content",
-      sideOffset,
-      className: cn(
-        "bg-nsw-grey-800 animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance text-white",
-        className
-      ),
-      ...props,
-      children: [
-        children,
-        /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Arrow, { className: "bg-nsw-grey-800 fill-nsw-grey-800 z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
-      ]
-    }
-  ) });
-}
-function PreWithCopy(props) {
-  const textInput = React16.useRef(null);
-  const [isJustCopied, setJustCopied] = React16.useState(false);
-  function handleCopy() {
-    if (textInput.current) {
-      navigator.clipboard.writeText(textInput.current.textContent || "");
-      setJustCopied(true);
-      setTimeout(() => setJustCopied(false), 2e3);
-    }
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group relative", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "pre",
-      {
-        ref: textInput,
-        ...props,
-        className: tailwindMerge.twMerge("max-h-[40rem] overflow-auto", props.className)
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        className: "absolute top-2 right-2 m-0.5 inline-flex h-8 items-center justify-center rounded-lg border border-gray-200 bg-white px-2.5 py-2 text-gray-900 opacity-0 transition-opacity group-hover:opacity-100 hover:bg-gray-100 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700",
-        "aria-label": "Copy code to clipboard",
-        onClick: handleCopy,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge(isJustCopied && "hidden"), children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Icons.copy, { className: "me-1.5 size-3" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold", children: "Copy code" })
-          ] }) }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge(isJustCopied ? "block" : "hidden"), children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Icons.check, { className: "text-primary-700 dark:text-primary-500 me-1.5 size-3" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary-700 dark:text-primary-500 text-xs font-semibold", children: "Copied" })
-          ] }) })
-        ]
-      }
-    )
-  ] });
-}
-Prism__default.default.manual = true;
-function CodeHighlight({
-  code,
-  language,
-  className,
-  withCopy = false,
-  ...props
-}) {
-  const highlightedCode = Prism__default.default.highlight(code.trim(), Prism__default.default.languages[language], language);
-  const Component2 = withCopy ? PreWithCopy : "pre";
-  return /* @__PURE__ */ jsxRuntime.jsx(Component2, { className: tailwindMerge.twMerge(`language-${language}`, className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-    "code",
-    {
-      className: `language-${language}`,
-      dangerouslySetInnerHTML: { __html: highlightedCode }
-    }
-  ) });
-}
-function Select({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Root, { "data-slot": "select", ...props });
-}
-function SelectGroup({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Group, { "data-slot": "select-group", ...props });
-}
-function SelectValue({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Value, { "data-slot": "select-value", ...props });
-}
-function SelectTrigger({
-  className,
-  size = "default",
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    SelectPrimitive__namespace.Trigger,
-    {
-      "data-slot": "select-trigger",
-      "data-size": size,
-      className: cn(
-        // Base styles
-        "border-grey-600 [&_svg:not([class*='text-'])]:text-grey-600 flex w-full items-center justify-between gap-2 rounded-sm border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        // Disabled styles
-        "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
-        // aria-invalid styles
-        "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
-        // Focus styles
-        "focus:outline-primary-650/70 focus:outline focus:outline-2 focus:outline-offset-2",
-        // Placeholder styles
-        "data-[placeholder]:text-grey-600",
-        // Dark mode styles
-        "dark:bg-input/30 dark:hover:bg-input/50",
-        // Size styles
-        "data-[size=default]:h-12 data-[size=sm]:h-9",
-        className
-      ),
-      ...props,
-      children: [
-        children,
-        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Icons.chevron_down, { className: "size-6 opacity-80" }) })
-      ]
-    }
-  );
-}
-function SelectContent({
-  className,
-  children,
-  position = "popper",
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-    SelectPrimitive__namespace.Content,
-    {
-      "data-slot": "select-content",
-      className: cn(
-        // Base styles
-        "text-grey-800 border-grey-200 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-sm border bg-white shadow-md",
-        // State styles
-        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-        className
-      ),
-      position,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(SelectScrollUpButton, {}),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          SelectPrimitive__namespace.Viewport,
-          {
-            className: cn(
-              "p-1",
-              position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
-            ),
-            children
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(SelectScrollDownButton, {})
-      ]
-    }
-  ) });
-}
-function SelectLabel({ className, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    SelectPrimitive__namespace.Label,
-    {
-      "data-slot": "select-label",
-      className: cn("text-grey-600 px-2 py-1.5 text-xs", className),
-      ...props
-    }
-  );
-}
-function SelectItem({
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    SelectPrimitive__namespace.Item,
-    {
-      "data-slot": "select-item",
-      className: cn(
-        "focus:bg-primary-800/10 focus:text-primary-800 [&_svg:not([class*='text-'])]:text-grey-600 relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none focus:font-bold data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-6 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
-        className
-      ),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(Icons.check, { className: "size-6" }) }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children })
-      ]
-    }
-  );
-}
-function SelectSeparator({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    SelectPrimitive__namespace.Separator,
-    {
-      "data-slot": "select-separator",
-      className: cn("bg-primary-800/20 pointer-events-none -mx-1 my-1 h-px", className),
-      ...props
-    }
-  );
-}
-function SelectScrollUpButton({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    SelectPrimitive__namespace.ScrollUpButton,
-    {
-      "data-slot": "select-scroll-up-button",
-      className: cn("flex cursor-default items-center justify-center py-1", className),
-      ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx(Icons.chevron_up, { className: "size-6" })
-    }
-  );
-}
-function SelectScrollDownButton({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    SelectPrimitive__namespace.ScrollDownButton,
-    {
-      "data-slot": "select-scroll-down-button",
-      className: cn("flex cursor-default items-center justify-center py-1", className),
-      ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx(Icons.chevron_down, { className: "size-6" })
-    }
-  );
-}
-function Popover({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Root, { "data-slot": "popover", ...props });
-}
-function PopoverTrigger({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Trigger, { "data-slot": "popover-trigger", ...props });
-}
-function PopoverContent({
-  className,
-  align = "center",
-  sideOffset = 4,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
-    PopoverPrimitive__namespace.Content,
-    {
-      "data-slot": "popover-content",
-      align,
-      sideOffset,
-      className: cn(
-        [
-          // Base
-          "bg-background text-foreground z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
-          // Open
-          "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
-          // Closed
-          "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
-          // Side
-          "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
-        ],
-        className
-      ),
-      ...props
-    }
-  ) });
-}
-function PopoverAnchor({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Anchor, { "data-slot": "popover-anchor", ...props });
-}
-function Label3({ className, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    LabelPrimitive__namespace.Root,
-    {
-      "data-slot": "label",
-      className: cn(
-        // Base
-        "flex items-center gap-2",
-        "text-grey-900 text-base/6 font-semibold select-none",
-        // Dark mode
-        "dark:group-data-[disabled=true]:text-grey-400 dark:text-white",
-        // Disabled state
-        "group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function RadioGroup2({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    RadioGroupPrimitive__namespace.Root,
-    {
-      "data-slot": "radio-group",
-      className: cn("grid gap-3", className),
-      ...props
-    }
-  );
-}
-function RadioGroupItem({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    RadioGroupPrimitive__namespace.Item,
-    {
-      "data-slot": "radio-group-item",
-      className: cn(
-        // Base styles
-        "border-primary-800 text-primary-800 aspect-square size-8 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none",
-        // Dark mode styles
-        "dark:bg-input/30",
-        // Focus styles
-        "focus:border-grey-600 focus:ring-primary-650/70 ring-offset-white focus:ring-2 focus:ring-offset-2 focus:outline-none",
-        // aria-invalid styles
-        "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
-        // Disabled styles
-        "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
-        className
-      ),
-      ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        RadioGroupPrimitive__namespace.Indicator,
-        {
-          "data-slot": "radio-group-indicator",
-          className: cn(
-            // Base styles
-            "relative flex items-center justify-center"
-          ),
-          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleIcon, { className: "fill-primary-800 absolute top-1/2 left-1/2 size-6 -translate-x-1/2 -translate-y-1/2" })
-        }
-      )
-    }
-  );
-}
-function SegmentedControl({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TabsPrimitive2__namespace.Root,
-    {
-      "data-slot": "tabs",
-      className: cn("flex flex-col gap-2", className),
-      ...props
-    }
-  );
-}
-function SegmentedControlList({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TabsPrimitive2__namespace.List,
-    {
-      "data-slot": "segmented-control-list",
-      className: cn(
-        "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function SegmentedControlTrigger({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    TabsPrimitive2__namespace.Trigger,
-    {
-      "data-slot": "segmented-control-trigger",
-      className: cn(
-        "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className
-      ),
-      ...props
-    }
-  );
-}
-var findGreyKey = (themes) => Object.keys(themes).find((k) => k.toLowerCase().includes("grey")) ?? "";
-function ThemeSelector({
-  themeCategory,
-  setThemeCategory,
-  primaryColor,
-  setPrimaryColor,
-  accentColor,
-  setAccentColor,
-  greyColor,
-  setGreyColor,
-  availableAccentColors,
-  colorThemes: colorThemes2
-}) {
-  const handleCategoryChange = (newCategory) => {
-    setThemeCategory(newCategory);
-    const availableColors = Object.keys(colorThemes2[newCategory]);
-    const neutral = findGreyKey(colorThemes2[newCategory]);
-    if (neutral && neutral !== greyColor) {
-      setGreyColor(neutral);
-    }
-    if (availableColors.length > 0) {
-      if (availableColors.includes(primaryColor)) {
-        const newAccentColor = availableColors.find((color2) => color2 !== primaryColor);
-        if (newAccentColor && newAccentColor !== accentColor) {
-          setAccentColor(newAccentColor);
-        }
-      } else {
-        setPrimaryColor(availableColors[0]);
-        if (availableColors.length > 1) {
-          setAccentColor(availableColors[1]);
-        }
-      }
-    }
-  };
-  const labelStyles = {
-    base: [
-      // Base
-      "group relative flex w-full items-center gap-2 rounded-sm border px-3 py-2",
-      // Light mode
-      "border-nsw-grey-200 bg-background",
-      // Hover
-      "hover:bg-primary-800/10 hover:text-foreground",
-      // Active
-      "[&:has([data-state=checked])]:border-nsw-grey-800",
-      // Dark mode
-      "",
-      // Dark hover
-      "dark:hover:bg-white/10",
-      // Dark active
-      "dark:group-data-[state=checked]:border-nsw-grey-400"
-    ],
-    label: [
-      // Base
-      "cursor-pointer flex items-center justify-between",
-      // Active
-      ""
-    ]
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-medium", children: "Theme Category" }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        SegmentedControl,
-        {
-          value: themeCategory,
-          onValueChange: (value) => handleCategoryChange(value),
-          children: /* @__PURE__ */ jsxRuntime.jsxs(SegmentedControlList, { className: "w-full", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(SegmentedControlTrigger, { value: "brand", children: "Brand Colors" }),
-            /* @__PURE__ */ jsxRuntime.jsx(SegmentedControlTrigger, { value: "aboriginal", children: "Aboriginal Colors" })
-          ] })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-6", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-medium", children: "Primary Color" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          RadioGroup2,
-          {
-            value: primaryColor,
-            onValueChange: (value) => setPrimaryColor(value),
-            className: "grid grid-cols-2 gap-2",
-            children: Object.entries(colorThemes2[themeCategory]).map(([key, theme2]) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(labelStyles.base, ""), children: [
-              /* @__PURE__ */ jsxRuntime.jsx(RadioGroupItem, { value: key, id: `primary-${key}`, className: "peer sr-only" }),
-              /* @__PURE__ */ jsxRuntime.jsxs(Label3, { htmlFor: `primary-${key}`, className: cn(labelStyles.label, ""), children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "div",
-                  {
-                    className: "h-5 w-5 flex-none rounded-full",
-                    style: { backgroundColor: theme2.colors[3].hex }
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink", children: theme2.colors[3].name?.replace(/\b(NSW|0[1-4])\b/g, "").replace(/\s+/g, " ").trim() }),
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-0", "aria-hidden": true })
-              ] })
-            ] }, key))
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-medium", children: "Accent Color" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          RadioGroup2,
-          {
-            value: accentColor,
-            onValueChange: (value) => setAccentColor(value),
-            className: "grid grid-cols-2 gap-2",
-            children: availableAccentColors.map((key) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(labelStyles.base, ""), children: [
-              /* @__PURE__ */ jsxRuntime.jsx(RadioGroupItem, { value: key, id: `accent-${key}`, className: "peer sr-only" }),
-              /* @__PURE__ */ jsxRuntime.jsxs(Label3, { htmlFor: `accent-${key}`, className: cn(labelStyles.label, ""), children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "div",
-                  {
-                    className: "size-5 flex-none rounded-full",
-                    style: { backgroundColor: colorThemes2[themeCategory][key].colors[2].hex }
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink", children: colorThemes2[themeCategory][key].colors[2].name?.replace(/\b(NSW|0[1-4])\b/g, "").replace(/\s+/g, " ").trim() }),
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-0", "aria-hidden": true })
-              ] })
-            ] }, key))
-          }
-        )
-      ] })
-    ] })
-  ] });
-}
-
-// src/lib/color-palette.ts
-var brand = {
-  grey: [
-    oklchConverter("#22272b"),
-    oklchConverter("#495054"),
-    oklchConverter("#cdd3d6"),
-    oklchConverter("#ebebeb")
-  ],
-  green: [
-    oklchConverter("#004000"),
-    oklchConverter("#00aa45"),
-    oklchConverter("#a8edb3"),
-    oklchConverter("#dbfadf")
-  ],
-  teal: [
-    oklchConverter("#0b3f47"),
-    oklchConverter("#2e808e"),
-    oklchConverter("#8cdbe5"),
-    oklchConverter("#d1eeea")
-  ],
-  blue: [
-    oklchConverter("#002664"),
-    oklchConverter("#146cfd"),
-    oklchConverter("#8ce0ff"),
-    oklchConverter("#cbedfd")
-  ],
-  purple: [
-    oklchConverter("#441170"),
-    oklchConverter("#8055f1"),
-    oklchConverter("#cebfff"),
-    oklchConverter("#e6e1fd")
-  ],
-  fuchsia: [
-    oklchConverter("#65004d"),
-    oklchConverter("#d912ae"),
-    oklchConverter("#f4b5e6"),
-    oklchConverter("#fddef2")
-  ],
-  red: [
-    oklchConverter("#630019"),
-    oklchConverter("#d7153a"),
-    oklchConverter("#ffb8c1"),
-    oklchConverter("#ffe6ea")
-  ],
-  orange: [
-    oklchConverter("#941b00"),
-    oklchConverter("#f3631b"),
-    oklchConverter("#ffce99"),
-    oklchConverter("#fdeddf")
-  ],
-  yellow: [
-    oklchConverter("#694800"),
-    oklchConverter("#faaf05"),
-    oklchConverter("#fde79a"),
-    oklchConverter("#fff4cf")
-  ],
-  brown: [
-    oklchConverter("#523719"),
-    oklchConverter("#b68d5d"),
-    oklchConverter("#e8d0b5"),
-    oklchConverter("#ede3d7")
-  ]
+
+// src/lib/color-palette.ts
+var brand = {
+  grey: [
+    oklchConverter("#22272b"),
+    oklchConverter("#495054"),
+    oklchConverter("#cdd3d6"),
+    oklchConverter("#ebebeb")
+  ],
+  green: [
+    oklchConverter("#004000"),
+    oklchConverter("#00aa45"),
+    oklchConverter("#a8edb3"),
+    oklchConverter("#dbfadf")
+  ],
+  teal: [
+    oklchConverter("#0b3f47"),
+    oklchConverter("#2e808e"),
+    oklchConverter("#8cdbe5"),
+    oklchConverter("#d1eeea")
+  ],
+  blue: [
+    oklchConverter("#002664"),
+    oklchConverter("#146cfd"),
+    oklchConverter("#8ce0ff"),
+    oklchConverter("#cbedfd")
+  ],
+  purple: [
+    oklchConverter("#441170"),
+    oklchConverter("#8055f1"),
+    oklchConverter("#cebfff"),
+    oklchConverter("#e6e1fd")
+  ],
+  fuchsia: [
+    oklchConverter("#65004d"),
+    oklchConverter("#d912ae"),
+    oklchConverter("#f4b5e6"),
+    oklchConverter("#fddef2")
+  ],
+  red: [
+    oklchConverter("#630019"),
+    oklchConverter("#d7153a"),
+    oklchConverter("#ffb8c1"),
+    oklchConverter("#ffe6ea")
+  ],
+  orange: [
+    oklchConverter("#941b00"),
+    oklchConverter("#f3631b"),
+    oklchConverter("#ffce99"),
+    oklchConverter("#fdeddf")
+  ],
+  yellow: [
+    oklchConverter("#694800"),
+    oklchConverter("#faaf05"),
+    oklchConverter("#fde79a"),
+    oklchConverter("#fff4cf")
+  ],
+  brown: [
+    oklchConverter("#523719"),
+    oklchConverter("#b68d5d"),
+    oklchConverter("#e8d0b5"),
+    oklchConverter("#ede3d7")
+  ]
 };
 var aboriginal = {
   grey: [
-    oklchConverter("#2D2D2D"),
+    oklchConverter("#272727"),
     oklchConverter("#555555"),
     oklchConverter("#CCC6C2"),
     oklchConverter("#E5E3E0")
@@ -4480,7 +3913,7 @@ var colors = {
           hex: "#f4aa7d",
           rgb: "rgb(244, 170, 125)",
           hsl: "hsl(22.69, 84.4%, 72.35%)",
-          name: "Orange Clay"
+          name: "Clay Orange"
         },
         {
           token: "nsw-aboriginal-orange-450",
@@ -4509,7 +3942,7 @@ var colors = {
           hex: "#ee6314",
           rgb: "rgb(238, 99, 20)",
           hsl: "hsl(21.74, 86.51%, 50.59%)",
-          name: "Ochre Orange"
+          name: "Orange Ochre"
         },
         {
           token: "nsw-aboriginal-orange-650",
@@ -5190,7 +4623,7 @@ var colors = {
           hex: "#c99ac2",
           rgb: "rgb(201, 154, 194)",
           hsl: "hsl(308.94, 30.32%, 69.61%)",
-          name: "Lilli Pilli Purple"
+          name: "Lilli pilli Purple"
         },
         {
           token: "nsw-aboriginal-purple-450",
@@ -5365,53 +4798,53 @@ var colors = {
         },
         {
           token: "nsw-aboriginal-grey-650",
-          oklch: "oklch(0.4114406365077532 0 none)",
-          hex: "#4b4b4b",
-          rgb: "rgb(75, 75, 75)",
-          hsl: "hsl(223.81, 0%, 29.26%)"
+          oklch: "oklch(0.40533514521305436 0 none)",
+          hex: "#494949",
+          rgb: "rgb(73, 73, 73)",
+          hsl: "hsl(223.81, 0%, 28.62%)"
         },
         {
           token: "nsw-aboriginal-grey-700",
-          oklch: "oklch(0.3733480790552275 0 none)",
-          hex: "#404040",
-          rgb: "rgb(64, 64, 64)",
-          hsl: "hsl(223.81, 0%, 25.29%)"
+          oklch: "oklch(0.3611370964658298 0 none)",
+          hex: "#3d3d3d",
+          rgb: "rgb(61, 61, 61)",
+          hsl: "hsl(223.81, 0%, 24.04%)"
         },
         {
           token: "nsw-aboriginal-grey-750",
-          oklch: "oklch(0.3352555216027018 0 none)",
-          hex: "#373737",
-          rgb: "rgb(55, 55, 55)",
-          hsl: "hsl(223.81, 0%, 21.41%)"
+          oklch: "oklch(0.3169390477186052 0 none)",
+          hex: "#323232",
+          rgb: "rgb(50, 50, 50)",
+          hsl: "hsl(223.81, 0%, 19.59%)"
         },
         {
           token: "nsw-aboriginal-grey-800",
-          oklch: "oklch(0.29716296415017607 0 none)",
-          hex: "#2d2d2d",
-          rgb: "rgb(45, 45, 45)",
-          hsl: "hsl(223.81, 0%, 17.65%)",
+          oklch: "oklch(0.27274099897138065 0 none)",
+          hex: "#272727",
+          rgb: "rgb(39, 39, 39)",
+          hsl: "hsl(223.81, 0%, 15.29%)",
           name: "Charcoal Grey"
         },
         {
           token: "nsw-aboriginal-grey-850",
-          oklch: "oklch(0.24515944542389526 0 none)",
-          hex: "#202020",
-          rgb: "rgb(32, 32, 32)",
-          hsl: "hsl(223.81, 0%, 12.7%)"
+          oklch: "oklch(0.22501132415138902 0 none)",
+          hex: "#1c1c1c",
+          rgb: "rgb(28, 28, 28)",
+          hsl: "hsl(223.81, 0%, 10.85%)"
         },
         {
           token: "nsw-aboriginal-grey-900",
-          oklch: "oklch(0.19315592669761444 0 none)",
-          hex: "#141414",
-          rgb: "rgb(20, 20, 20)",
-          hsl: "hsl(223.81, 0%, 8.01%)"
+          oklch: "oklch(0.17728164933139742 0 none)",
+          hex: "#111111",
+          rgb: "rgb(17, 17, 17)",
+          hsl: "hsl(223.81, 0%, 6.64%)"
         },
         {
           token: "nsw-aboriginal-grey-950",
-          oklch: "oklch(0.14115240797133363 0 none)",
-          hex: "#090909",
-          rgb: "rgb(9, 9, 9)",
-          hsl: "hsl(223.81, 0%, 3.63%)"
+          oklch: "oklch(0.12955197451140582 0 none)",
+          hex: "#070707",
+          rgb: "rgb(7, 7, 7)",
+          hsl: "hsl(223.81, 0%, 2.81%)"
         }
       ]
     }
@@ -5970,26 +5403,826 @@ var colors = {
           hsl: "hsl(222.21, 84%, 8.9%)"
         },
         {
-          token: "info-900",
-          oklch: "oklch(0.13904995929121322 0.047662878696429115 262.409403192285)",
-          hex: "#02071c",
-          rgb: "rgb(2, 7, 28)",
-          hsl: "hsl(226.63, 89.54%, 5.83%)"
-        },
+          token: "info-900",
+          oklch: "oklch(0.13904995929121322 0.047662878696429115 262.409403192285)",
+          hex: "#02071c",
+          rgb: "rgb(2, 7, 28)",
+          hsl: "hsl(226.63, 89.54%, 5.83%)"
+        },
+        {
+          token: "info-950",
+          oklch: "oklch(0.10161343178973273 0.03744940469005145 262.409403192285)",
+          hex: "#00030f",
+          rgb: "rgb(0, 3, 15)",
+          hsl: "hsl(230.65, 94.13%, 3.12%)"
+        }
+      ]
+    }
+  }
+};
+var colorThemes = generateColorThemes(colors);
+var Social = {
+  Facebook: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      fillRule: "evenodd",
+      d: "M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z",
+      clipRule: "evenodd"
+    }
+  ) }),
+  Figma: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      fillRule: "evenodd",
+      d: "M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z",
+      clipRule: "evenodd"
+    }
+  ) }),
+  Github: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      fillRule: "evenodd",
+      d: "M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z",
+      clipRule: "evenodd"
+    }
+  ) }),
+  Instagram: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      fillRule: "evenodd",
+      d: "M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z",
+      clipRule: "evenodd"
+    }
+  ) }),
+  LinkedIn: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 3A2 2 0 0 1 21 5V19A2 2 0 0 1 19 21H5A2 2 0 0 1 3 19V5A2 2 0 0 1 5 3H19M18.5 18.5V13.2A3.26 3.26 0 0 0 15.24 9.94C14.39 9.94 13.4 10.46 12.92 11.24V10.13H10.13V18.5H12.92V13.57C12.92 12.8 13.54 12.17 14.31 12.17A1.4 1.4 0 0 1 15.71 13.57V18.5H18.5M6.88 8.56A1.68 1.68 0 0 0 8.56 6.88C8.56 5.95 7.81 5.19 6.88 5.19A1.69 1.69 0 0 0 5.19 6.88C5.19 7.81 5.95 8.56 6.88 8.56M8.27 18.5V10.13H5.5V18.5H8.27Z" }) }),
+  X: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M13.6823 10.6218L20.2391 3H18.6854L12.9921 9.61788L8.44486 3H3.2002L10.0765 13.0074L3.2002 21H4.75404L10.7663 14.0113L15.5685 21H20.8131L13.6819 10.6218H13.6823ZM11.5541 13.0956L10.8574 12.0991L5.31391 4.16971H7.70053L12.1742 10.5689L12.8709 11.5655L18.6861 19.8835H16.2995L11.5541 13.096V13.0956Z" }) }),
+  YouTube: (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", "data-slot": "icon", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      fillRule: "evenodd",
+      d: "M19.812 5.418c.861.23 1.538.907 1.768 1.768C21.998 8.746 22 12 22 12s0 3.255-.418 4.814a2.504 2.504 0 0 1-1.768 1.768c-1.56.419-7.814.419-7.814.419s-6.255 0-7.814-.419a2.505 2.505 0 0 1-1.768-1.768C2 15.255 2 12 2 12s0-3.255.417-4.814a2.507 2.507 0 0 1 1.768-1.768C5.744 5 11.998 5 11.998 5s6.255 0 7.814.418ZM15.194 12 10 15V9l5.194 3Z",
+      clipRule: "evenodd"
+    }
+  ) })
+};
+function TooltipProvider({
+  delayDuration,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TooltipPrimitive__namespace.Provider,
+    {
+      "data-slot": "tooltip-provider",
+      delayDuration,
+      ...props
+    }
+  );
+}
+function Tooltip({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Root, { "data-slot": "tooltip", ...props });
+}
+function TooltipTrigger({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { "data-slot": "tooltip-trigger", ...props });
+}
+function TooltipContent({
+  className,
+  sideOffset = 0,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+    TooltipPrimitive__namespace.Content,
+    {
+      "data-slot": "tooltip-content",
+      sideOffset,
+      className: cn(
+        "bg-grey-800 animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance text-white",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Arrow, { className: "bg-grey-800 fill-grey-800 z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
+      ]
+    }
+  ) });
+}
+function ScrollArea({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    ScrollAreaPrimitive__namespace.Root,
+    {
+      "data-slot": "scroll-area",
+      className: cn("relative", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ScrollAreaPrimitive__namespace.Viewport,
+          {
+            "data-slot": "scroll-area-viewport",
+            className: "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1",
+            children
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(ScrollBar, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(ScrollAreaPrimitive__namespace.Corner, {})
+      ]
+    }
+  );
+}
+function ScrollBar({
+  className,
+  orientation = "vertical",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ScrollAreaPrimitive__namespace.ScrollAreaScrollbar,
+    {
+      "data-slot": "scroll-area-scrollbar",
+      orientation,
+      className: cn(
+        "flex touch-none p-px transition-colors select-none",
+        orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent",
+        orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        ScrollAreaPrimitive__namespace.ScrollAreaThumb,
+        {
+          "data-slot": "scroll-area-thumb",
+          className: "bg-border relative flex-1 rounded-full"
+        }
+      )
+    }
+  );
+}
+function PreWithCopy(props) {
+  const textInput = React16.useRef(null);
+  const [isJustCopied, setJustCopied] = React16.useState(false);
+  function handleCopy() {
+    if (textInput.current) {
+      navigator.clipboard.writeText(textInput.current.textContent || "");
+      setJustCopied(true);
+      setTimeout(() => setJustCopied(false), 2e3);
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group relative", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "pre",
+      {
+        ref: textInput,
+        ...props,
+        className: tailwindMerge.twMerge("max-h-[40rem] overflow-auto", props.className)
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        className: "absolute top-2 right-2 m-0.5 inline-flex h-8 items-center justify-center rounded-lg border border-gray-200 bg-white px-2.5 py-2 text-gray-900 opacity-0 transition-opacity group-hover:opacity-100 hover:bg-gray-100 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700",
+        "aria-label": "Copy code to clipboard",
+        onClick: handleCopy,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge(isJustCopied && "hidden"), children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Icons.copy, { className: "me-1.5 size-3" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-semibold", children: "Copy code" })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge(isJustCopied ? "block" : "hidden"), children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Icons.check, { className: "text-primary-700 dark:text-primary-500 me-1.5 size-3" }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary-700 dark:text-primary-500 text-xs font-semibold", children: "Copied" })
+          ] }) })
+        ]
+      }
+    )
+  ] });
+}
+Prism__default.default.manual = true;
+function CodeHighlight({
+  code,
+  language,
+  className,
+  withCopy = false,
+  ...props
+}) {
+  const highlightedCode = Prism__default.default.highlight(code.trim(), Prism__default.default.languages[language], language);
+  const Component2 = withCopy ? PreWithCopy : "pre";
+  return /* @__PURE__ */ jsxRuntime.jsx(Component2, { className: tailwindMerge.twMerge(`language-${language}`, className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "code",
+    {
+      className: `language-${language}`,
+      dangerouslySetInnerHTML: { __html: highlightedCode }
+    }
+  ) });
+}
+function Select({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Root, { "data-slot": "select", ...props });
+}
+function SelectGroup({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Group, { "data-slot": "select-group", ...props });
+}
+function SelectValue({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Value, { "data-slot": "select-value", ...props });
+}
+function SelectTrigger({
+  className,
+  size = "default",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    SelectPrimitive__namespace.Trigger,
+    {
+      "data-slot": "select-trigger",
+      "data-size": size,
+      className: cn(
+        // Base styles
+        "border-grey-600 [&_svg:not([class*='text-'])]:text-grey-600 flex w-full items-center justify-between gap-2 rounded-sm border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        // Disabled styles
+        "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+        // aria-invalid styles
+        "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+        // Focus styles
+        "focus:outline-primary-650/70 focus:outline focus:outline-2 focus:outline-offset-2",
+        // Placeholder styles
+        "data-[placeholder]:text-grey-600",
+        // Dark mode styles
+        "dark:bg-input/30 dark:hover:bg-input/50",
+        // Size styles
+        "data-[size=default]:h-12 data-[size=sm]:h-9",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Icons.chevron_down, { className: "size-6 opacity-80" }) })
+      ]
+    }
+  );
+}
+function SelectContent({
+  className,
+  children,
+  position = "popper",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
+    SelectPrimitive__namespace.Content,
+    {
+      "data-slot": "select-content",
+      className: cn(
+        // Base styles
+        "text-grey-800 border-grey-200 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-sm border bg-white shadow-md",
+        // State styles
+        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+        className
+      ),
+      position,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(SelectScrollUpButton, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          SelectPrimitive__namespace.Viewport,
+          {
+            className: cn(
+              "p-1",
+              position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
+            ),
+            children
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(SelectScrollDownButton, {})
+      ]
+    }
+  ) });
+}
+function SelectLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SelectPrimitive__namespace.Label,
+    {
+      "data-slot": "select-label",
+      className: cn("text-grey-600 px-2 py-1.5 text-xs", className),
+      ...props
+    }
+  );
+}
+function SelectItem({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    SelectPrimitive__namespace.Item,
+    {
+      "data-slot": "select-item",
+      className: cn(
+        "focus:bg-primary-800/10 focus:text-primary-800 [&_svg:not([class*='text-'])]:text-grey-600 relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none focus:font-bold data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-6 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(Icons.check, { className: "size-6" }) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children })
+      ]
+    }
+  );
+}
+function SelectSeparator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SelectPrimitive__namespace.Separator,
+    {
+      "data-slot": "select-separator",
+      className: cn("bg-primary-800/20 pointer-events-none -mx-1 my-1 h-px", className),
+      ...props
+    }
+  );
+}
+function SelectScrollUpButton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SelectPrimitive__namespace.ScrollUpButton,
+    {
+      "data-slot": "select-scroll-up-button",
+      className: cn("flex cursor-default items-center justify-center py-1", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(Icons.chevron_up, { className: "size-6" })
+    }
+  );
+}
+function SelectScrollDownButton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    SelectPrimitive__namespace.ScrollDownButton,
+    {
+      "data-slot": "select-scroll-down-button",
+      className: cn("flex cursor-default items-center justify-center py-1", className),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(Icons.chevron_down, { className: "size-6" })
+    }
+  );
+}
+function Popover({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Root, { "data-slot": "popover", ...props });
+}
+function PopoverTrigger({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Trigger, { "data-slot": "popover-trigger", ...props });
+}
+function PopoverContent({
+  className,
+  align = "center",
+  sideOffset = 4,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    PopoverPrimitive__namespace.Content,
+    {
+      "data-slot": "popover-content",
+      align,
+      sideOffset,
+      className: cn(
+        [
+          // Base
+          "bg-background text-foreground z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
+          // Open
+          "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
+          // Closed
+          "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
+          // Side
+          "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
+        ],
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+function PopoverAnchor({ ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Anchor, { "data-slot": "popover-anchor", ...props });
+}
+function Label3({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    LabelPrimitive__namespace.Root,
+    {
+      "data-slot": "label",
+      className: cn(
+        // Base
+        "flex items-center gap-2",
+        "text-grey-900 text-base/6 font-semibold select-none",
+        // Dark mode
+        "dark:group-data-[disabled=true]:text-grey-400 dark:text-white",
+        // Disabled state
+        "group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function RadioGroup2({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    RadioGroupPrimitive__namespace.Root,
+    {
+      "data-slot": "radio-group",
+      className: cn("grid gap-3", className),
+      ...props
+    }
+  );
+}
+function RadioGroupItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    RadioGroupPrimitive__namespace.Item,
+    {
+      "data-slot": "radio-group-item",
+      className: cn(
+        // Base styles
+        "border-primary-800 text-primary-800 aspect-square size-8 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none",
+        // Dark mode styles
+        "dark:bg-input/30",
+        // Focus styles
+        "focus:border-grey-600 focus:ring-primary-650/70 ring-offset-white focus:ring-2 focus:ring-offset-2 focus:outline-none",
+        // aria-invalid styles
+        "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+        // Disabled styles
+        "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        RadioGroupPrimitive__namespace.Indicator,
         {
-          token: "info-950",
-          oklch: "oklch(0.10161343178973273 0.03744940469005145 262.409403192285)",
-          hex: "#00030f",
-          rgb: "rgb(0, 3, 15)",
-          hsl: "hsl(230.65, 94.13%, 3.12%)"
+          "data-slot": "radio-group-indicator",
+          className: cn(
+            // Base styles
+            "relative flex items-center justify-center"
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleIcon, { className: "fill-primary-800 absolute top-1/2 left-1/2 size-6 -translate-x-1/2 -translate-y-1/2" })
         }
-      ]
+      )
     }
-  }
-};
-var colorThemes = generateColorThemes(colors);
-function CodeDemo({ data, hide = {} }) {
+  );
+}
+function SegmentedControl({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive2__namespace.Root,
+    {
+      "data-slot": "tabs",
+      className: cn("flex flex-col gap-2", className),
+      ...props
+    }
+  );
+}
+function SegmentedControlList({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive2__namespace.List,
+    {
+      "data-slot": "segmented-control-list",
+      className: cn(
+        "bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function SegmentedControlTrigger({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive2__namespace.Trigger,
+    {
+      "data-slot": "segmented-control-trigger",
+      className: cn(
+        "data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var findGreyKey = (themes) => Object.keys(themes).find((k) => k.toLowerCase().includes("grey")) ?? "";
+function ThemeSelectorLoading() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex animate-pulse flex-col gap-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-5 w-32 rounded" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-full rounded" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-5 w-24 rounded" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-2", children: [1, 2, 3, 4].map((i) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-12 rounded" }, i)) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-5 w-24 rounded" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-2", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-12 rounded" }, i)) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-5 w-20 rounded" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-muted bg-muted/30 gap-3 rounded-md border p-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex min-w-0 items-center justify-between", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-4 w-48 rounded" }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-8 w-8 rounded" })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-8 w-full rounded" })
+      ] })
+    ] })
+  ] });
+}
+function ThemeSelectorContent({
+  themeCategory,
+  setThemeCategory,
+  primaryColor,
+  setPrimaryColor,
+  accentColor,
+  setAccentColor,
+  greyColor,
+  setGreyColor,
+  availableAccentColors,
+  colorThemes: colorThemes2
+}) {
+  const searchParams = navigation.useSearchParams();
+  const [, copyToClipboardRaw] = usehooks.useCopyToClipboard();
+  const [copied, setCopied] = React16.useState(false);
+  const updateUrlParams = React16.useCallback(
+    (category, primary, accent) => {
+      const params = new URLSearchParams();
+      params.set("theme", category);
+      params.set("primary", primary);
+      params.set("accent", accent);
+      window.history.replaceState(null, "", `?${params.toString()}`);
+    },
+    []
+  );
+  React16.useEffect(() => {
+    const themeParam = searchParams.get("theme");
+    const primaryParam = searchParams.get("primary");
+    const accentParam = searchParams.get("accent");
+    let shouldUpdateUrl = false;
+    let newCategory = themeCategory;
+    let newPrimary = primaryColor;
+    let newAccent = accentColor;
+    if (themeParam && (themeParam === "brand" || themeParam === "aboriginal")) {
+      if (themeParam !== themeCategory) {
+        newCategory = themeParam;
+        shouldUpdateUrl = true;
+        const neutral = findGreyKey(colorThemes2[themeParam]);
+        if (neutral && neutral !== greyColor) {
+          setGreyColor(neutral);
+        }
+      }
+    }
+    const availableColors = Object.keys(colorThemes2[newCategory]);
+    if (primaryParam && availableColors.includes(primaryParam)) {
+      if (primaryParam !== primaryColor) {
+        newPrimary = primaryParam;
+        shouldUpdateUrl = true;
+      }
+    }
+    if (accentParam && availableColors.includes(accentParam) && accentParam !== newPrimary) {
+      if (accentParam !== accentColor) {
+        newAccent = accentParam;
+        shouldUpdateUrl = true;
+      }
+    } else {
+      const newAccentColor = availableColors.find((color2) => color2 !== newPrimary);
+      if (newAccentColor && newAccentColor !== accentColor) {
+        newAccent = newAccentColor;
+        shouldUpdateUrl = true;
+      }
+    }
+    if (shouldUpdateUrl) {
+      if (newCategory !== themeCategory) setThemeCategory(newCategory);
+      if (newPrimary !== primaryColor) setPrimaryColor(newPrimary);
+      if (newAccent !== accentColor) setAccentColor(newAccent);
+    }
+  }, [
+    searchParams,
+    themeCategory,
+    primaryColor,
+    accentColor,
+    greyColor,
+    colorThemes2,
+    setThemeCategory,
+    setPrimaryColor,
+    setAccentColor,
+    setGreyColor
+  ]);
+  const handleCategoryChange = (newCategory) => {
+    setThemeCategory(newCategory);
+    const availableColors = Object.keys(colorThemes2[newCategory]);
+    const neutral = findGreyKey(colorThemes2[newCategory]);
+    if (neutral && neutral !== greyColor) {
+      setGreyColor(neutral);
+    }
+    let newPrimary = primaryColor;
+    let newAccent = accentColor;
+    if (availableColors.length > 0) {
+      if (availableColors.includes(primaryColor)) {
+        const newAccentColor = availableColors.find((color2) => color2 !== primaryColor);
+        if (newAccentColor && newAccentColor !== accentColor) {
+          newAccent = newAccentColor;
+          setAccentColor(newAccentColor);
+        }
+      } else {
+        newPrimary = availableColors[0];
+        setPrimaryColor(availableColors[0]);
+        if (availableColors.length > 1) {
+          newAccent = availableColors[1];
+          setAccentColor(availableColors[1]);
+        }
+      }
+    }
+    updateUrlParams(newCategory, newPrimary, newAccent);
+  };
+  const handlePrimaryColorChange = (value) => {
+    setPrimaryColor(value);
+    if (value === accentColor) {
+      const availableColors = Object.keys(colorThemes2[themeCategory]);
+      const newAccentColor = availableColors.find((color2) => color2 !== value);
+      if (newAccentColor) {
+        setAccentColor(newAccentColor);
+        updateUrlParams(themeCategory, value, newAccentColor);
+        return;
+      }
+    }
+    updateUrlParams(themeCategory, value, accentColor);
+  };
+  const handleAccentColorChange = (value) => {
+    setAccentColor(value);
+    updateUrlParams(themeCategory, primaryColor, value);
+  };
+  const labelStyles = {
+    base: [
+      // Base
+      "group relative flex w-full items-center gap-2 rounded-sm border px-3 py-2",
+      // Light mode
+      "border-grey-200 bg-background",
+      // Hover
+      "hover:bg-primary-800/10 hover:text-foreground",
+      // Active
+      "[&:has([data-state=checked])]:border-grey-800",
+      // Dark mode
+      "",
+      // Dark hover
+      "dark:hover:bg-white/10",
+      // Dark active
+      "dark:group-data-[state=checked]:border-grey-400"
+    ],
+    label: [
+      // Base
+      "cursor-pointer flex items-center justify-between",
+      // Active
+      ""
+    ]
+  };
+  const themeUrl = window?.location?.href || "";
+  const copyToClipboard = () => {
+    copyToClipboardRaw(themeUrl);
+    setCopied(true);
+    sonner.toast("Color theme url copied to clipboard", {
+      duration: 2e3
+    });
+    setTimeout(() => setCopied(false), 2e3);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-medium", children: "Theme Category" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        SegmentedControl,
+        {
+          value: themeCategory,
+          onValueChange: (value) => handleCategoryChange(value),
+          children: /* @__PURE__ */ jsxRuntime.jsxs(SegmentedControlList, { className: "w-full", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(SegmentedControlTrigger, { value: "brand", children: "Brand Colors" }),
+            /* @__PURE__ */ jsxRuntime.jsx(SegmentedControlTrigger, { value: "aboriginal", children: "Aboriginal Colors" })
+          ] })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-medium", children: "Primary Color" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          RadioGroup2,
+          {
+            value: primaryColor,
+            onValueChange: handlePrimaryColorChange,
+            className: "grid grid-cols-2 gap-2",
+            children: Object.entries(colorThemes2[themeCategory]).map(([key, theme2]) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(labelStyles.base, ""), children: [
+              /* @__PURE__ */ jsxRuntime.jsx(RadioGroupItem, { value: key, id: `primary-${key}`, className: "peer sr-only" }),
+              /* @__PURE__ */ jsxRuntime.jsxs(Label3, { htmlFor: `primary-${key}`, className: cn(labelStyles.label, ""), children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: "h-5 w-5 flex-none rounded-full",
+                    style: { backgroundColor: theme2.colors[3].hex }
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink", children: theme2.colors[3].name?.replace(/\b(NSW|0[1-4])\b/g, "").replace(/\s+/g, " ").trim() }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-0", "aria-hidden": true })
+              ] })
+            ] }, key))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-medium", children: "Accent Color" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          RadioGroup2,
+          {
+            value: accentColor,
+            onValueChange: handleAccentColorChange,
+            className: "grid grid-cols-2 gap-2",
+            children: availableAccentColors.map((key) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(labelStyles.base, ""), children: [
+              /* @__PURE__ */ jsxRuntime.jsx(RadioGroupItem, { value: key, id: `accent-${key}`, className: "peer sr-only" }),
+              /* @__PURE__ */ jsxRuntime.jsxs(Label3, { htmlFor: `accent-${key}`, className: cn(labelStyles.label, ""), children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: "size-5 flex-none rounded-full",
+                    style: { backgroundColor: colorThemes2[themeCategory][key].colors[2].hex }
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink", children: colorThemes2[themeCategory][key].colors[2].name?.replace(/\b(NSW|0[1-4])\b/g, "").replace(/\s+/g, " ").trim() }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-0", "aria-hidden": true })
+              ] })
+            ] }, key))
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-medium", children: "Share Theme" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-muted bg-muted/30 gap-3 rounded-md border p-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex min-w-0 items-center justify-between", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-sm", children: "Copy this URL to share your theme selection:" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            Button2,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "flex-shrink-0 p-0",
+              onClick: copyToClipboard,
+              title: copied ? "Copied!" : "Copy URL",
+              children: [
+                copied ? /* @__PURE__ */ jsxRuntime.jsx(Icons.check, {}) : /* @__PURE__ */ jsxRuntime.jsx(Icons.copy, {}),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: copied ? "URL copied to clipboard" : "Copy URL to clipboard" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("code", { className: "bg-background text-foreground block w-full rounded border px-2 py-1.5 font-mono text-xs break-all", children: themeUrl })
+      ] })
+    ] })
+  ] });
+}
+function ThemeSelector(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(React16.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(ThemeSelectorLoading, {}), children: /* @__PURE__ */ jsxRuntime.jsx(ThemeSelectorContent, { ...props }) });
+}
+function CodeDemoLoading() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-8 animate-pulse", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-grey-200 bg-grey-50 dark:border-grey-600 dark:bg-grey-700 w-full rounded-t-xl border p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 sm:grid-cols-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-32 rounded" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-32 rounded" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-20 rounded" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-16 rounded" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-10 rounded" })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-grey-200 dark:border-grey-600 dark:bg-grey-900 flex border-x bg-white bg-gradient-to-r p-5", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-64 w-full rounded" }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-grey-200 dark:border-grey-600 border", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-grey-200 bg-grey-50 dark:border-grey-600 dark:bg-grey-700 flex w-full rounded-t-md border-b p-2", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-8 w-24 rounded" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-100 h-48" })
+    ] })
+  ] });
+}
+function CodeDemoContent({ data, hide = {} }) {
   const { resolvedTheme } = nextThemes.useTheme();
+  const searchParams = navigation.useSearchParams();
   const { rtl = false, darkMode = false, themeSelector = false } = hide;
   const [tabIndex, setTabIndex] = React16.useState(0);
   const [variant, setVariant] = React16.useState(getInitialVariant(data));
@@ -6002,6 +6235,44 @@ function CodeDemo({ data, hide = {} }) {
   const [primaryColor, setPrimaryColor] = React16.useState("blue");
   const [accentColor, setAccentColor] = React16.useState("red");
   const [greyColor, setGreyColor] = React16.useState("grey");
+  const [isThemeInitialized, setIsThemeInitialized] = React16.useState(false);
+  React16.useEffect(() => {
+    const themeParam = searchParams.get("theme");
+    const primaryParam = searchParams.get("primary");
+    const accentParam = searchParams.get("accent");
+    let newCategory = themeCategory;
+    let newPrimary = primaryColor;
+    let newAccent = accentColor;
+    if (themeParam && (themeParam === "brand" || themeParam === "aboriginal")) {
+      newCategory = themeParam;
+      setThemeCategory(themeParam);
+    }
+    const availableColors = Object.keys(colorThemes[newCategory]);
+    if (primaryParam && availableColors.includes(primaryParam)) {
+      newPrimary = primaryParam;
+      setPrimaryColor(primaryParam);
+    } else if (!availableColors.includes(newPrimary)) {
+      newPrimary = availableColors[0];
+      setPrimaryColor(newPrimary);
+    }
+    if (accentParam && availableColors.includes(accentParam) && accentParam !== newPrimary) {
+      newAccent = accentParam;
+      setAccentColor(accentParam);
+    } else {
+      const newAccentColor = availableColors.find((color2) => color2 !== newPrimary);
+      if (newAccentColor) {
+        newAccent = newAccentColor;
+        setAccentColor(newAccent);
+      }
+    }
+    const neutralKey = Object.keys(colorThemes[newCategory]).find(
+      (k) => k.toLowerCase().includes("grey")
+    );
+    if (neutralKey) {
+      setGreyColor(neutralKey);
+    }
+    setIsThemeInitialized(true);
+  }, [searchParams, themeCategory, primaryColor, accentColor]);
   React16.useEffect(() => {
     setDarkMode(resolvedTheme === "dark");
   }, [resolvedTheme]);
@@ -6093,6 +6364,7 @@ function CodeDemo({ data, hide = {} }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-8", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-grey-200 bg-grey-50 dark:border-grey-600 dark:bg-grey-700 w-full rounded-t-xl border p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 sm:grid-cols-3", children: [
       /* @__PURE__ */ jsxRuntime.jsx(EditOnGithubButton, { githubSlug: data.githubSlug }),
+      data.figmaSlug && /* @__PURE__ */ jsxRuntime.jsx(OpenInFigmaButton, { figmaSlug: data.figmaSlug }),
       /* @__PURE__ */ jsxRuntime.jsx(ToggleViewButtons, { onSelect: setView }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-1 flex justify-end gap-3", children: [
         !themeSelector && /* @__PURE__ */ jsxRuntime.jsx(
@@ -6105,7 +6377,8 @@ function CodeDemo({ data, hide = {} }) {
             accentColor,
             setAccentColor,
             greyColor,
-            setGreyColor
+            setGreyColor,
+            isInitialized: isThemeInitialized
           }
         ),
         !rtl && /* @__PURE__ */ jsxRuntime.jsx(ToggleRTLButton, { isRTL, onClick: () => setIsRTL((state) => !state) }),
@@ -6180,6 +6453,9 @@ function CodeDemo({ data, hide = {} }) {
     ) })
   ] });
 }
+function CodeDemo(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(React16.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(CodeDemoLoading, {}), children: /* @__PURE__ */ jsxRuntime.jsx(CodeDemoContent, { ...props }) });
+}
 var IFrame = React16__namespace.default.forwardRef(
   ({ iframe, isRTL, isDarkMode }, ref) => {
     React16.useEffect(() => {
@@ -6268,7 +6544,7 @@ function CodePreview({
 }
 function EditOnGithubButton({ githubSlug }) {
   const githubSrcHref = "https://github.com";
-  const href = `${githubSrcHref}${githubSlug}`;
+  const href = githubSlug ? `${githubSrcHref}${githubSlug}` : githubSrcHref;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Button2,
     {
@@ -6285,6 +6561,25 @@ function EditOnGithubButton({ githubSlug }) {
     }
   );
 }
+function OpenInFigmaButton({ figmaSlug }) {
+  const figmaSrcHref = "https://www.figma.com";
+  const href = figmaSlug ? `${figmaSrcHref}${figmaSlug}` : figmaSrcHref;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Button2,
+    {
+      variant: "outline",
+      color: "light",
+      href,
+      target: "_blank",
+      rel: "nofollow noopener noreferrer",
+      className: "flex h-10 w-fit items-center text-sm",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Social.Figma, { "data-slot": "icon" }),
+        "Open in Figma"
+      ]
+    }
+  );
+}
 function ToggleViewButtons({ onSelect }) {
   const views = [
     { name: "desktop", title: "Toggle full screen", icon: Icons.desktop },
@@ -6301,7 +6596,8 @@ function ThemeSelectorDropDown({
   accentColor,
   setAccentColor,
   greyColor,
-  setGreyColor
+  setGreyColor,
+  isInitialized
 }) {
   const filteredColorThemes = React16.useMemo(() => {
     const filtered = {};
@@ -6319,6 +6615,7 @@ function ThemeSelectorDropDown({
     return allColors.filter((color2) => color2 !== primaryColor);
   }, [filteredColorThemes, themeCategory, primaryColor]);
   React16.useEffect(() => {
+    if (!isInitialized) return;
     const neutralKey = Object.keys(colorThemes[themeCategory]).find((k) => k.toLowerCase().includes("grey")) ?? "";
     if (neutralKey && neutralKey !== greyColor) {
       setGreyColor(neutralKey);
@@ -6344,20 +6641,29 @@ function ThemeSelectorDropDown({
     greyColor,
     setPrimaryColor,
     setAccentColor,
-    setGreyColor
+    setGreyColor,
+    isInitialized
   ]);
   const primaryColorSwatch = colorThemes[themeCategory][primaryColor]?.colors[3]?.hex || "#000000";
   const accentColorSwatch = colorThemes[themeCategory][accentColor]?.colors[2]?.hex || "#000000";
   return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button2, { color: "light", variant: "outline", className: "flex h-10 items-center text-sm", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Icons.palette, {}),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Theme" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-2 flex gap-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-3 w-3 rounded-full", style: { backgroundColor: primaryColorSwatch } }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-3 w-3 rounded-full", style: { backgroundColor: accentColorSwatch } })
-      ] })
-    ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-80", children: /* @__PURE__ */ jsxRuntime.jsx(
+    /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      Button2,
+      {
+        color: "light",
+        variant: "outline",
+        className: "flex h-10 items-center bg-transparent text-sm",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Icons.palette, {}),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Theme" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-2 flex gap-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-3 w-3 rounded-full", style: { backgroundColor: primaryColorSwatch } }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-3 w-3 rounded-full", style: { backgroundColor: accentColorSwatch } })
+          ] })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-100", children: /* @__PURE__ */ jsxRuntime.jsx(ScrollArea, { className: "h-120 w-full", children: /* @__PURE__ */ jsxRuntime.jsx(
       ThemeSelector,
       {
         themeCategory,
@@ -6371,7 +6677,7 @@ function ThemeSelectorDropDown({
         availableAccentColors,
         colorThemes: filteredColorThemes
       }
-    ) })
+    ) }) })
   ] });
 }
 function ToggleRTLButton({ isRTL, onClick }) {
@@ -6384,7 +6690,7 @@ function ToggleRTLButton({ isRTL, onClick }) {
         onClick,
         color: "light",
         variant: "outline",
-        className: "flex h-10 items-center text-sm",
+        className: "flex h-10 items-center bg-transparent text-sm",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: title }),
           dir
@@ -7159,20 +7465,20 @@ function FooterSocialLink({
       Icon2,
       {
         "data-slot": "icon",
-        className: "group-hover:fill-nsw-grey-900 dark:group-hover:fill-nsw-grey-500 fill-nsw-grey-700 transition"
+        className: "group-hover:fill-grey-900 dark:group-hover:fill-grey-500 fill-grey-700 transition"
       }
     )
   ] });
 }
 function FooterAcknowledgement() {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-nsw-grey-200 flex flex-row items-center gap-5 border-t pt-8 pb-4 dark:border-white/5", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-nsw-grey-600 dark:text-nsw-grey-400 text-center text-base text-pretty lg:text-left", children: "We acknowledge the Traditional Custodians of the land on which we work and live, and pay our respects to Elders past, present and emerging." }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-grey-200 flex flex-row items-center gap-5 border-t pt-8 pb-4 dark:border-white/5", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-grey-600 dark:text-grey-400 text-center text-base text-pretty lg:text-left", children: "We acknowledge the Traditional Custodians of the land on which we work and live, and pay our respects to Elders past, present and emerging." }) });
 }
 function FooterSmallPrint({
   socialLinks,
   department
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-between gap-5 pt-4 sm:flex-row dark:border-white/5", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-nsw-grey-600 dark:text-nsw-grey-400 text-center text-sm lg:text-left", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-grey-600 dark:text-grey-400 text-center text-sm lg:text-left", children: [
       "\xA9 Copyright ",
       (/* @__PURE__ */ new Date()).getFullYear(),
       department && " ",
@@ -7195,7 +7501,7 @@ function FooterLegalLinks({ legalLinks }) {
         Link10__default.default,
         {
           href: item.href,
-          className: "text-nsw-grey-600 hover:text-nsw-grey-600 hover:bg-primary-800/10 -m-1 rounded p-1 underline underline-offset-4 hover:decoration-2",
+          className: "text-grey-600 hover:text-grey-600 hover:bg-primary-800/10 -m-1 rounded p-1 underline underline-offset-4 hover:decoration-2",
           children: item.name
         },
         item.name
@@ -7210,7 +7516,7 @@ function Footer({
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("footer", { className: "mx-auto w-full px-4 py-16 pb-16 lg:pr-0 lg:pl-8", children: [
     /* @__PURE__ */ jsxRuntime.jsx(FooterAcknowledgement, {}),
-    /* @__PURE__ */ jsxRuntime.jsx(Separator4, { className: "bg-nsw-grey-200 my-4" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Separator4, { className: "bg-grey-200 my-4" }),
     /* @__PURE__ */ jsxRuntime.jsx(FooterLegalLinks, { legalLinks }),
     /* @__PURE__ */ jsxRuntime.jsx(FooterSmallPrint, { department, socialLinks })
   ] });
@@ -7304,11 +7610,11 @@ function FormMessage({ className, ...props }) {
 var styles3 = {
   base: [
     // Base
-    "inline-flex items-center justify-center gap-2 rounded-sm text-sm font-medium bg-transparent transition-all whitespace-nowrap cursor-pointer border-(--toggle-border) [--toggle-border:var(--color-nsw-grey-200)] text-nsw-grey-800",
+    "inline-flex items-center justify-center gap-2 rounded-sm text-sm font-medium bg-transparent transition-all whitespace-nowrap cursor-pointer border-(--toggle-border) [--toggle-border:var(--color-grey-200)] text-grey-800",
     // States
-    "data-[state=on]:bg-nsw-grey-100 data-[state=on]:text-nsw-grey-850",
+    "data-[state=on]:bg-grey-100 data-[state=on]:text-grey-850",
     // Hover
-    "hover:bg-nsw-grey-100 hover:text-nsw-grey-850",
+    "hover:bg-grey-100 hover:text-grey-850",
     // Focus
     "focus:outline focus:outline-2 focus:outline-offset-0 focus:outline-(--toggle-border)",
     // Dark mode
@@ -7328,9 +7634,9 @@ var styles3 = {
   ],
   outline: [
     // Base
-    "text-nsw-grey-800 border [--toggle-border:var(--color-nsw-grey-300)]",
+    "text-grey-800 border [--toggle-border:var(--color-grey-300)]",
     // States
-    "hover:[--toggle-border:var(--color-nsw-grey-400)]",
+    "hover:[--toggle-border:var(--color-grey-400)]",
     // Dark mode
     "dark:[--toggle-border:white]/40",
     // Dark mode states
@@ -7502,7 +7808,7 @@ function Heading({
 
 // package.json
 var package_default = {
-  version: "1.42.0"};
+  version: "1.43.0"};
 function Logo(props) {
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "NSW Government" }),
@@ -7545,7 +7851,7 @@ function Logo(props) {
 function ThemeSwitcher() {
   const { resolvedTheme, setTheme } = nextThemes.useTheme();
   const [mounted, setMounted] = React16.useState(false);
-  const classes = "fill-nsw-grey-600 dark:fill-nsw-grey-100";
+  const classes = "fill-grey-600 dark:fill-grey-100";
   React16.useEffect(() => {
     setMounted(true);
   }, []);
@@ -7593,7 +7899,7 @@ function SiteSearch({ navigation: navigation$1 }) {
         className: "relative h-10 w-full items-center justify-start sm:pr-12 md:w-40 lg:w-64",
         onClick: () => setOpen(true),
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-600 hidden lg:inline-flex", children: "Search site..." }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-600 hidden lg:inline-flex", children: "Search site..." }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex lg:hidden", children: "Search..." }),
           /* @__PURE__ */ jsxRuntime.jsxs("kbd", { className: "bg-muted pointer-events-none absolute top-2 right-2 hidden h-5 items-center gap-1 rounded border px-2 font-mono text-xs font-medium opacity-100 select-none sm:flex", children: [
             /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs", children: "\u2318" }),
@@ -7671,13 +7977,7 @@ function Header2({
               className: "group",
               href: "https://github.com/digitalnsw",
               "aria-label": "GitHub",
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                Social.Github,
-                {
-                  "data-slot": "icon",
-                  className: "fill-nsw-grey-600 dark:fill-nsw-grey-100 size-6"
-                }
-              )
+              children: /* @__PURE__ */ jsxRuntime.jsx(Social.Github, { "data-slot": "icon", className: "fill-grey-600 dark:fill-grey-100 size-6" })
             }
           ),
           children
@@ -8234,55 +8534,41 @@ function MegaMenu({ title, href, links }) {
 function Navigation({
   className,
   onLinkClick,
-  navigation: navigation$1
+  navigation
 }) {
-  const pathname = navigation.usePathname();
-  return /* @__PURE__ */ jsxRuntime.jsx("nav", { className: clsx21__default.default("text-base lg:text-sm", className), children: /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "list", className: "flex flex-col gap-9", children: navigation$1.map((section, index) => /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
-    section.links ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-display text-foreground font-medium dark:text-white", children: section.title }) : /* @__PURE__ */ jsxRuntime.jsx(
-      "ul",
-      {
-        role: "list",
-        className: "border-grey-400 dark:border-grey-200/15 mt-2 flex flex-col gap-2 border-l lg:mt-4",
-        children: /* @__PURE__ */ jsxRuntime.jsx("li", { className: "-ml-px flex flex-col items-start gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(
-          Link10__default.default,
-          {
-            href: section.href || "/",
-            onClick: onLinkClick,
-            className: clsx21__default.default(
-              "inline-block w-full cursor-pointer rounded-r-md border-l py-1 pr-2 pl-4 text-left text-base/8 sm:text-sm/6",
-              "hover:border-grey-950 hover:text-grey-950 hover:bg-primary-800/10 hover:font-semibold",
-              "dark:text-grey-400 dark:hover:border-grey-400 dark:hover:text-white",
-              section.href === pathname && "border-primary-800 text-primary-800 bg-primary-800/10 border-l font-bold dark:border-white dark:bg-white/20"
-            ),
-            children: section.title
-          }
-        ) }, index)
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "ul",
+  return /* @__PURE__ */ jsxRuntime.jsx("nav", { className: clsx21__default.default("text-base lg:text-sm", className), children: /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "list", className: "flex flex-col gap-9", children: navigation.map((section, index) => /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
+    section.links ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-display text-grey-800 font-medium dark:text-white", children: section.title }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "list", className: "mt-2 flex flex-col gap-2 border-l lg:mt-4", children: /* @__PURE__ */ jsxRuntime.jsx("li", { className: "-ml-px flex flex-col items-start gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+      NavigationLink,
       {
-        role: "list",
-        className: "border-grey-400 dark:border-grey-200/15 mt-2 flex flex-col gap-2 border-l lg:mt-4",
-        children: section.links && section.links.map((link, index2) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "-ml-px flex flex-col items-start gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(
-          Link10__default.default,
-          {
-            href: link.href,
-            onClick: onLinkClick,
-            className: clsx21__default.default(
-              "text-foreground inline-block border-l border-transparent pl-5 text-base/8 sm:pl-4 sm:text-sm/6",
-              "hover:border-grey-950 hover:text-grey-950 hover:font-semibold",
-              "dark:text-grey-400",
-              "dark:hover:border-grey-400 dark:hover:text-white",
-              link.href === pathname && "border-primary-800 text-primary-800 bg-primary-800/10 border-l font-bold dark:border-white dark:bg-white/20"
-            ),
-            children: link.title
-          }
-        ) }, index2))
+        href: section.href || "/",
+        title: section.title,
+        onClick: onLinkClick
       }
-    )
+    ) }, index) }),
+    /* @__PURE__ */ jsxRuntime.jsx("ul", { role: "list", className: "mt-2 flex flex-col gap-2 border-l lg:mt-4", children: section.links && section.links.map((link, index2) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "-ml-px flex flex-col items-start gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(NavigationLink, { href: link.href, title: link.title, onClick: onLinkClick }) }, index2)) })
   ] }, index)) }) });
 }
+function NavigationLink({
+  href,
+  title,
+  onClick
+}) {
+  const pathname = navigation.usePathname();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Link10__default.default,
+    {
+      href,
+      onClick,
+      className: clsx21__default.default(
+        "inline-block w-full cursor-pointer rounded-r-md border-l py-1 pr-2 pl-4 text-left text-base/8 sm:text-sm/6",
+        "hover:border-grey-950 hover:text-grey-950 hover:bg-primary-800/10 hover:font-semibold",
+        "dark:text-grey-400 dark:hover:border-grey-400 dark:hover:text-white",
+        href === pathname && "border-primary-800 text-primary-800 bg-primary-800/10 border-l font-bold dark:border-white dark:bg-white/20"
+      ),
+      children: title
+    }
+  );
+}
 var LayoutGroupContext = React16.createContext({});
 function useConstant(init) {
   const ref = React16.useRef(null);
@@ -16366,59 +16652,6 @@ function ResizableHandle({
     }
   );
 }
-function ScrollArea({
-  className,
-  children,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ScrollAreaPrimitive__namespace.Root,
-    {
-      "data-slot": "scroll-area",
-      className: cn("relative", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          ScrollAreaPrimitive__namespace.Viewport,
-          {
-            "data-slot": "scroll-area-viewport",
-            className: "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1",
-            children
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(ScrollBar, {}),
-        /* @__PURE__ */ jsxRuntime.jsx(ScrollAreaPrimitive__namespace.Corner, {})
-      ]
-    }
-  );
-}
-function ScrollBar({
-  className,
-  orientation = "vertical",
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    ScrollAreaPrimitive__namespace.ScrollAreaScrollbar,
-    {
-      "data-slot": "scroll-area-scrollbar",
-      orientation,
-      className: cn(
-        "flex touch-none p-px transition-colors select-none",
-        orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent",
-        orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent",
-        className
-      ),
-      ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx(
-        ScrollAreaPrimitive__namespace.ScrollAreaThumb,
-        {
-          "data-slot": "scroll-area-thumb",
-          className: "bg-border relative flex-1 rounded-full"
-        }
-      )
-    }
-  );
-}
 function Sheet({ ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Root, { "data-slot": "sheet", ...props });
 }
@@ -16587,24 +16820,16 @@ function SidebarLink({ link, pathname, onLinkClick, depth }) {
         ]
       }
     ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(CollapsibleContent2, { children: /* @__PURE__ */ jsxRuntime.jsx(
-      "ul",
+    /* @__PURE__ */ jsxRuntime.jsx(CollapsibleContent2, { children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: clsx21__default.default("mt-2 ml-5 flex flex-col gap-1 border-l pl-0"), children: link.links && link.links.map((childLink) => /* @__PURE__ */ jsxRuntime.jsx(
+      SidebarLink,
       {
-        className: clsx21__default.default(
-          "border-grey-400 dark:border-grey-200/15 mt-2 ml-5 flex flex-col gap-1 border-l pl-0"
-        ),
-        children: link.links && link.links.map((childLink) => /* @__PURE__ */ jsxRuntime.jsx(
-          SidebarLink,
-          {
-            link: childLink,
-            pathname,
-            onLinkClick,
-            depth: depth + 1
-          },
-          childLink.href
-        ))
-      }
-    ) })
+        link: childLink,
+        pathname,
+        onLinkClick,
+        depth: depth + 1
+      },
+      childLink.href
+    )) }) })
   ] }) : /* @__PURE__ */ jsxRuntime.jsx(Link10__default.default, { href: link.href, onClick: onLinkClick, className: baseLinkClasses, children: link.title }) });
 }
 var StepIndicator = React16__namespace.forwardRef(
@@ -16684,8 +16909,8 @@ var StepIndicator = React16__namespace.forwardRef(
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-9 items-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-success-450 group-hover:bg-success-500 group-hover:border-success-550 relative z-10 flex size-6 items-center justify-center rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx(Icons.check, { "aria-hidden": "true", className: "size-4 text-white" }) }) }),
                 /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-4 flex min-w-0 flex-col", children: [
-                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
-                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
+                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
+                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
                 ] })
               ]
             }
@@ -16707,8 +16932,8 @@ var StepIndicator = React16__namespace.forwardRef(
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-9 items-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "border-success-450 group-hover:bg-success-450 text-success-450 relative z-10 flex size-6 items-center justify-center rounded-full border-2 bg-white group-hover:text-white", children: /* @__PURE__ */ jsxRuntime.jsx(Icons.check, { "aria-hidden": "true", className: "size-4" }) }) }),
                 /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-4 flex min-w-0 flex-col", children: [
-                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
-                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
+                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
+                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
                 ] })
               ]
             }
@@ -16730,8 +16955,8 @@ var StepIndicator = React16__namespace.forwardRef(
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-9 items-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "border-primary-500 group-hover:border-primary-550 group-hover:bg-primary-550 text-primary-500 relative z-10 flex size-6 items-center justify-center rounded-full border-2 bg-white group-hover:text-white", children: /* @__PURE__ */ jsxRuntime.jsx(Icons.more_horiz, { "aria-hidden": "true", className: "size-4" }) }) }),
                 /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-4 flex min-w-0 flex-col", children: [
-                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
-                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
+                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
+                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
                 ] })
               ]
             }
@@ -16753,8 +16978,8 @@ var StepIndicator = React16__namespace.forwardRef(
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-9 items-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-danger-450 group-hover:bg-danger-500 group-hover:border-danger-500 relative z-10 flex size-6 items-center justify-center rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx(Icons.exclamation, { "aria-hidden": "true", className: "size-4 text-white" }) }) }),
                 /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-4 flex min-w-0 flex-col", children: [
-                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
-                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
+                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
+                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
                 ] })
               ]
             }
@@ -16776,8 +17001,8 @@ var StepIndicator = React16__namespace.forwardRef(
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "flex h-9 items-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "border-grey-300 relative z-10 flex size-6 items-center justify-center rounded-full border-2 bg-white group-hover:border-gray-400", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "group-hover:bg-grey-300 size-2 rounded-full bg-transparent" }) }) }),
                 /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-4 flex min-w-0 flex-col", children: [
-                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
-                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
+                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
+                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
                 ] })
               ]
             }
@@ -16797,10 +17022,10 @@ var StepIndicator = React16__namespace.forwardRef(
               className: "group relative flex items-center",
               onClick: onLinkClick,
               children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-9 items-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-nsw-grey-600 group-hover:bg-nsw-grey-800 relative z-10 flex size-6 items-center justify-center rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx(Icons.remove, { "aria-hidden": "true", className: "size-4 text-white" }) }) }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-9 items-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-grey-600 group-hover:bg-grey-800 relative z-10 flex size-6 items-center justify-center rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx(Icons.remove, { "aria-hidden": "true", className: "size-4 text-white" }) }) }),
                 /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-4 flex min-w-0 flex-col", children: [
-                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
-                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
+                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
+                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
                 ] })
               ]
             }
@@ -16822,8 +17047,8 @@ var StepIndicator = React16__namespace.forwardRef(
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "flex h-9 items-center", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "border-grey-300 relative z-10 flex size-6 items-center justify-center rounded-full border-2 bg-white group-hover:border-gray-400", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "group-hover:bg-grey-300 size-2 rounded-full bg-transparent" }) }) }),
                 /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "ml-4 flex min-w-0 flex-col", children: [
-                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
-                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-nsw-grey-700 hover:text-nsw-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
+                  step.title && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.title }),
+                  step.description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-grey-700 hover:text-grey-800 text-sm dark:text-slate-400 dark:hover:text-slate-300", children: step.description })
                 ] })
               ]
             }
@@ -17028,97 +17253,45 @@ function SwitchField({
   );
 }
 var colors2 = {
-  "dark/zinc": [
-    "[--switch-bg-ring:var(--color-zinc-950)]/90 [--switch-bg:var(--color-zinc-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]/25",
-    "[--switch-ring:var(--color-zinc-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:var(--color-zinc-700)]/90"
+  "dark/grey": [
+    "[--switch-bg-ring:var(--color-grey-950)]/90 [--switch-bg:var(--color-grey-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]/25",
+    "[--switch-ring:var(--color-grey-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:var(--color-grey-700)]/90"
   ],
   "dark/white": [
-    "[--switch-bg-ring:var(--color-zinc-950)]/90 [--switch-bg:var(--color-zinc-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]",
-    "[--switch-ring:var(--color-zinc-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:transparent] dark:[--switch:var(--color-zinc-900)]"
+    "[--switch-bg-ring:var(--color-grey-950)]/90 [--switch-bg:var(--color-grey-900)] dark:[--switch-bg-ring:transparent] dark:[--switch-bg:var(--color-white)]",
+    "[--switch-ring:var(--color-grey-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white] dark:[--switch-ring:transparent] dark:[--switch:var(--color-grey-900)]"
   ],
   dark: [
-    "[--switch-bg-ring:var(--color-zinc-950)]/90 [--switch-bg:var(--color-zinc-900)] dark:[--switch-bg-ring:var(--color-white)]/15",
-    "[--switch-ring:var(--color-zinc-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white]"
+    "[--switch-bg-ring:var(--color-grey-950)]/90 [--switch-bg:var(--color-grey-900)] dark:[--switch-bg-ring:var(--color-white)]/15",
+    "[--switch-ring:var(--color-grey-950)]/90 [--switch-shadow:var(--color-black)]/10 [--switch:white]"
   ],
-  zinc: [
-    "[--switch-bg-ring:var(--color-zinc-700)]/90 [--switch-bg:var(--color-zinc-600)] dark:[--switch-bg-ring:transparent]",
-    "[--switch-shadow:var(--color-black)]/10 [--switch:white] [--switch-ring:var(--color-zinc-700)]/90"
+  grey: [
+    "[--switch-bg-ring:var(--color-grey-700)]/90 [--switch-bg:var(--color-grey-600)] dark:[--switch-bg-ring:transparent]",
+    "[--switch-shadow:var(--color-black)]/10 [--switch:white] [--switch-ring:var(--color-grey-700)]/90"
   ],
   white: [
     "[--switch-bg-ring:var(--color-black)]/15 [--switch-bg:white] dark:[--switch-bg-ring:transparent]",
-    "[--switch-shadow:var(--color-black)]/10 [--switch-ring:transparent] [--switch:var(--color-zinc-950)]"
-  ],
-  red: [
-    "[--switch-bg-ring:var(--color-red-700)]/90 [--switch-bg:var(--color-red-600)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-red-700)]/90 [--switch-shadow:var(--color-red-900)]/20"
-  ],
-  orange: [
-    "[--switch-bg-ring:var(--color-orange-600)]/90 [--switch-bg:var(--color-orange-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-orange-600)]/90 [--switch-shadow:var(--color-orange-900)]/20"
-  ],
-  amber: [
-    "[--switch-bg-ring:var(--color-amber-500)]/80 [--switch-bg:var(--color-amber-400)] dark:[--switch-bg-ring:transparent]",
-    "[--switch-ring:transparent] [--switch-shadow:transparent] [--switch:var(--color-amber-950)]"
-  ],
-  yellow: [
-    "[--switch-bg-ring:var(--color-yellow-400)]/80 [--switch-bg:var(--color-yellow-300)] dark:[--switch-bg-ring:transparent]",
-    "[--switch-ring:transparent] [--switch-shadow:transparent] [--switch:var(--color-yellow-950)]"
-  ],
-  lime: [
-    "[--switch-bg-ring:var(--color-lime-400)]/80 [--switch-bg:var(--color-lime-300)] dark:[--switch-bg-ring:transparent]",
-    "[--switch-ring:transparent] [--switch-shadow:transparent] [--switch:var(--color-lime-950)]"
-  ],
-  green: [
-    "[--switch-bg-ring:var(--color-green-700)]/90 [--switch-bg:var(--color-green-600)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-green-700)]/90 [--switch-shadow:var(--color-green-900)]/20"
-  ],
-  emerald: [
-    "[--switch-bg-ring:var(--color-emerald-600)]/90 [--switch-bg:var(--color-emerald-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-emerald-600)]/90 [--switch-shadow:var(--color-emerald-900)]/20"
+    "[--switch-shadow:var(--color-black)]/10 [--switch-ring:transparent] [--switch:var(--color-grey-950)]"
   ],
-  teal: [
-    "[--switch-bg-ring:var(--color-teal-700)]/90 [--switch-bg:var(--color-teal-600)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-teal-700)]/90 [--switch-shadow:var(--color-teal-900)]/20"
-  ],
-  cyan: [
-    "[--switch-bg-ring:var(--color-cyan-400)]/80 [--switch-bg:var(--color-cyan-300)] dark:[--switch-bg-ring:transparent]",
-    "[--switch-ring:transparent] [--switch-shadow:transparent] [--switch:var(--color-cyan-950)]"
-  ],
-  sky: [
-    "[--switch-bg-ring:var(--color-sky-600)]/80 [--switch-bg:var(--color-sky-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-sky-600)]/80 [--switch-shadow:var(--color-sky-900)]/20"
-  ],
-  blue: [
-    "[--switch-bg-ring:var(--color-blue-700)]/90 [--switch-bg:var(--color-blue-600)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-blue-700)]/90 [--switch-shadow:var(--color-blue-900)]/20"
-  ],
-  indigo: [
-    "[--switch-bg-ring:var(--color-indigo-600)]/90 [--switch-bg:var(--color-indigo-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-indigo-600)]/90 [--switch-shadow:var(--color-indigo-900)]/20"
-  ],
-  violet: [
-    "[--switch-bg-ring:var(--color-violet-600)]/90 [--switch-bg:var(--color-violet-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-violet-600)]/90 [--switch-shadow:var(--color-violet-900)]/20"
-  ],
-  purple: [
-    "[--switch-bg-ring:var(--color-purple-600)]/90 [--switch-bg:var(--color-purple-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-purple-600)]/90 [--switch-shadow:var(--color-purple-900)]/20"
+  primary: [
+    "[--switch-bg-ring:var(--color-primary-800)]/90 [--switch-bg:var(--color-primary-800)] dark:[--switch-bg-ring:transparent]",
+    "[--switch:white] [--switch-ring:var(--color-primary-800)]/90 [--switch-shadow:var(--color-primary-900)]/20"
   ],
-  fuchsia: [
-    "[--switch-bg-ring:var(--color-fuchsia-600)]/90 [--switch-bg:var(--color-fuchsia-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-fuchsia-600)]/90 [--switch-shadow:var(--color-fuchsia-900)]/20"
+  secondary: [
+    "[--switch-bg-ring:var(--color-primary-200)]/80 [--switch-bg:var(--color-primary-200)] dark:[--switch-bg-ring:transparent]",
+    "[--switch-ring:transparent] [--switch-shadow:transparent] [--switch:var(--color-primary-950)]"
   ],
-  pink: [
-    "[--switch-bg-ring:var(--color-pink-600)]/90 [--switch-bg:var(--color-pink-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-pink-600)]/90 [--switch-shadow:var(--color-pink-900)]/20"
+  tertiary: [
+    "[--switch-bg-ring:var(--color-primary-600)]/80 [--switch-bg:var(--color-primary-600)] dark:[--switch-bg-ring:transparent]",
+    "[--switch:white] [--switch-ring:var(--color-primary-600)]/80 [--switch-shadow:var(--color-primary-900)]/20"
   ],
-  rose: [
-    "[--switch-bg-ring:var(--color-rose-600)]/90 [--switch-bg:var(--color-rose-500)] dark:[--switch-bg-ring:transparent]",
-    "[--switch:white] [--switch-ring:var(--color-rose-600)]/90 [--switch-shadow:var(--color-rose-900)]/20"
+  accent: [
+    "[--switch-bg-ring:var(--color-accent-700)]/90 [--switch-bg:var(--color-accent-600)] dark:[--switch-bg-ring:transparent]",
+    "[--switch:white] [--switch-ring:var(--color-accent-700)]/90 [--switch-shadow:var(--color-accent-900)]/20"
   ]
 };
 function Switch2({
-  color: color2 = "dark/zinc",
+  color: color2 = "dark/grey",
   className,
   ...props
 }) {
@@ -17136,7 +17309,7 @@ function Switch2({
         // Outline and background color in forced-colors mode so switch is still visible
         "forced-colors:outline forced-colors:[--switch-bg:Highlight] dark:forced-colors:[--switch-bg:Highlight]",
         // Unchecked
-        "bg-zinc-200 ring-1 ring-black/5 ring-inset dark:bg-white/5 dark:ring-white/15",
+        "bg-grey-200 ring-1 ring-black/5 ring-inset dark:bg-white/5 dark:ring-white/15",
         // Checked
         "data-checked:bg-(--switch-bg) data-checked:ring-(--switch-bg-ring) dark:data-checked:bg-(--switch-bg) dark:data-checked:ring-(--switch-bg-ring)",
         // Focus
@@ -17145,7 +17318,7 @@ function Switch2({
         "data-hover:ring-black/15 data-hover:data-checked:ring-(--switch-bg-ring)",
         "dark:data-hover:ring-white/25 dark:data-hover:data-checked:ring-(--switch-bg-ring)",
         // Disabled
-        "data-disabled:bg-zinc-200 data-disabled:opacity-50 data-disabled:data-checked:bg-zinc-200 data-disabled:data-checked:ring-black/5",
+        "data-disabled:bg-grey-200 data-disabled:data-checked:bg-grey-200 data-disabled:opacity-50 data-disabled:data-checked:ring-black/5",
         "dark:data-disabled:bg-white/15 dark:data-disabled:data-checked:bg-white/15 dark:data-disabled:data-checked:ring-white/15",
         // Color specific styles
         colors2[color2]
@@ -17502,7 +17675,7 @@ function Textarea({ className, ...props }) {
       "data-slot": "textarea",
       className: cn(
         // Base styles
-        "border-nsw-grey-600 dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-sm border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
+        "border-grey-600 dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-sm border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
         // Placeholder styles
         "placeholder:text-grey-500",
         // Focus styles
@@ -17534,7 +17707,25 @@ function ViewToggle({ viewMode, setViewMode }) {
     )
   ] });
 }
-function ThemeColorPalette() {
+function ThemeColorPaletteLoading() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "animate-pulse space-y-8", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-between gap-4 sm:flex-row", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-4 sm:flex-row", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-32 rounded" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-24 rounded" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-10 w-28 rounded" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-12", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-8 w-24 rounded" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-4 sm:grid-cols-4", children: [1, 2, 3, 4].map((j) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-16 rounded" }, j)) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-12 w-full rounded" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3", children: [1, 2, 3, 4, 5, 6].map((k) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-grey-200 h-24 rounded" }, k)) })
+    ] }, i)) })
+  ] });
+}
+function ThemeColorPaletteContent() {
+  const searchParams = navigation.useSearchParams();
   const baseColors = {
     brand,
     aboriginal
@@ -17546,6 +17737,44 @@ function ThemeColorPalette() {
   const [accentColor, setAccentColor] = React16.useState("red");
   const [greyColor, setGreyColor] = React16.useState("grey");
   const [sheetOpen, setSheetOpen] = React16.useState(false);
+  const [isInitialized, setIsInitialized] = React16.useState(false);
+  React16.useEffect(() => {
+    const themeParam = searchParams.get("theme");
+    const primaryParam = searchParams.get("primary");
+    const accentParam = searchParams.get("accent");
+    let newCategory = themeCategory;
+    let newPrimary = primaryColor;
+    let newAccent = accentColor;
+    if (themeParam && (themeParam === "brand" || themeParam === "aboriginal")) {
+      newCategory = themeParam;
+      setThemeCategory(themeParam);
+    }
+    const availableColors = Object.keys(colorThemes[newCategory]);
+    if (primaryParam && availableColors.includes(primaryParam)) {
+      newPrimary = primaryParam;
+      setPrimaryColor(primaryParam);
+    } else if (!availableColors.includes(newPrimary)) {
+      newPrimary = availableColors[0];
+      setPrimaryColor(newPrimary);
+    }
+    if (accentParam && availableColors.includes(accentParam) && accentParam !== newPrimary) {
+      newAccent = accentParam;
+      setAccentColor(accentParam);
+    } else {
+      const newAccentColor = availableColors.find((color2) => color2 !== newPrimary);
+      if (newAccentColor) {
+        newAccent = newAccentColor;
+        setAccentColor(newAccent);
+      }
+    }
+    const neutralKey = Object.keys(colorThemes[newCategory]).find(
+      (k) => k.toLowerCase().includes("grey")
+    );
+    if (neutralKey) {
+      setGreyColor(neutralKey);
+    }
+    setIsInitialized(true);
+  }, [searchParams, themeCategory, primaryColor, accentColor]);
   const filteredColorThemes = React16.useMemo(() => {
     const filtered = {};
     for (const category of Object.keys(colorThemes)) {
@@ -17562,6 +17791,7 @@ function ThemeColorPalette() {
     return allColors.filter((color2) => color2 !== primaryColor);
   }, [filteredColorThemes, themeCategory, primaryColor]);
   React16.useEffect(() => {
+    if (!isInitialized) return;
     const neutralKey = Object.keys(colorThemes[themeCategory]).find((k) => k.toLowerCase().includes("grey")) ?? "";
     if (neutralKey && neutralKey !== greyColor) {
       setGreyColor(neutralKey);
@@ -17580,7 +17810,7 @@ function ThemeColorPalette() {
         setAccentColor(newAccentColor);
       }
     }
-  }, [themeCategory, primaryColor, accentColor, greyColor]);
+  }, [themeCategory, primaryColor, accentColor, greyColor, isInitialized]);
   const currentColorPalette = React16.useMemo(() => {
     if (!colorThemes[themeCategory] || !colorThemes[themeCategory][primaryColor] || !colorThemes[themeCategory][accentColor]) {
       return [
@@ -17673,6 +17903,9 @@ function ThemeColorPalette() {
     }) })
   ] });
 }
+function ThemeColorPalette() {
+  return /* @__PURE__ */ jsxRuntime.jsx(React16.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(ThemeColorPaletteLoading, {}), children: /* @__PURE__ */ jsxRuntime.jsx(ThemeColorPaletteContent, {}) });
+}
 function ThemeProvider({ children, ...props }) {
   return /* @__PURE__ */ jsxRuntime.jsx(nextThemes.ThemeProvider, { ...props, children });
 }
@@ -21514,24 +21747,24 @@ var progressBarVariants = tailwindVariants.tv({
   variants: {
     variant: {
       default: {
-        background: "bg-blue-200 dark:bg-blue-500/30",
-        bar: "bg-blue-500 dark:bg-blue-500"
+        background: "bg-primary-200 dark:bg-primary-500/30",
+        bar: "bg-primary-500 dark:bg-primary-500"
       },
       neutral: {
-        background: "bg-gray-200 dark:bg-gray-500/40",
-        bar: "bg-gray-500 dark:bg-gray-500"
+        background: "bg-grey-200 dark:bg-grey-500/40",
+        bar: "bg-grey-500 dark:bg-grey-500"
       },
       warning: {
-        background: "bg-yellow-200 dark:bg-yellow-500/30",
-        bar: "bg-yellow-500 dark:bg-yellow-500"
+        background: "bg-warning-200 dark:bg-warning-500/30",
+        bar: "bg-warning-500 dark:bg-warning-500"
       },
-      error: {
-        background: "bg-red-200 dark:bg-red-500/30",
-        bar: "bg-red-500 dark:bg-red-500"
+      danger: {
+        background: "bg-danger-200 dark:bg-danger-500/30",
+        bar: "bg-danger-500 dark:bg-danger-500"
       },
       success: {
-        background: "bg-emerald-200 dark:bg-emerald-500/30",
-        bar: "bg-emerald-500 dark:bg-emerald-500"
+        background: "bg-success-200 dark:bg-success-500/30",
+        bar: "bg-success-500 dark:bg-success-500"
       }
     }
   },
@@ -21583,7 +21816,7 @@ var ProgressBar = React16__namespace.default.forwardRef(
                 // base
                 "ml-2 text-sm leading-none font-medium whitespace-nowrap",
                 // text color
-                "text-gray-900 dark:text-gray-50"
+                "text-grey-900 dark:text-grey-50"
               ),
               children: label
             }
@@ -21602,24 +21835,24 @@ var progressCircleVariants = tailwindVariants.tv({
   variants: {
     variant: {
       default: {
-        background: "stroke-blue-200 dark:stroke-blue-500/30",
-        circle: "stroke-blue-500 dark:stroke-blue-500"
+        background: "stroke-primary-200 dark:stroke-primary-500/30",
+        circle: "stroke-primary-500 dark:stroke-primary-500"
       },
       neutral: {
-        background: "stroke-gray-200 dark:stroke-gray-500/40",
-        circle: "stroke-gray-500 dark:stroke-gray-500"
+        background: "stroke-grey-200 dark:stroke-grey-500/40",
+        circle: "stroke-grey-500 dark:stroke-grey-500"
       },
       warning: {
-        background: "stroke-yellow-200 dark:stroke-yellow-500/30",
-        circle: "stroke-yellow-500 dark:stroke-yellow-500"
+        background: "stroke-warning-200 dark:stroke-warning-500/30",
+        circle: "stroke-warning-500 dark:stroke-warning-500"
       },
-      error: {
-        background: "stroke-red-200 dark:stroke-red-500/30",
-        circle: "stroke-red-500 dark:stroke-red-500"
+      danger: {
+        background: "stroke-danger-200 dark:stroke-danger-500/30",
+        circle: "stroke-danger-500 dark:stroke-danger-500"
       },
       success: {
-        background: "stroke-emerald-200 dark:stroke-emerald-500/30",
-        circle: "stroke-emerald-500 dark:stroke-emerald-500"
+        background: "stroke-success-200 dark:stroke-success-500/30",
+        circle: "stroke-success-500 dark:stroke-success-500"
       }
     }
   },
@@ -22941,6 +23174,7 @@ exports.AlertDialogTrigger = AlertDialogTrigger;
 exports.AlertTitle = AlertTitle;
 exports.AreaChart = AreaChart;
 exports.AspectRatio = AspectRatio;
+exports.AuthLayout = AuthLayout;
 exports.AvailableChartColors = AvailableChartColors;
 exports.Avatar = Avatar;
 exports.AvatarFallback = AvatarFallback;