@doneisbetter/gds-core 3.0.0 → 3.0.1

package/dist/{chunk-NBCULITN.mjs → chunk-6FX7WZZO.mjs}

@@ -3,11 +3,12 @@ import {
   FormField,
   GdsIcons,
   ListingCard,
+  NotificationCenterView,
   ReferenceSection,
   StateBlock,
   getSemanticActionLabel,
   resolveSemanticActionConfig
-} from "./chunk-P7ICTEEB.mjs";
+} from "./chunk-YP7RL2MC.mjs";
 
 // src/SemanticButton.tsx
 import { useEffect, useState } from "react";
@@ -96,12 +97,14 @@ function ConfirmDialog({
 import { ActionIcon, useMantineColorScheme, useComputedColorScheme } from "@mantine/core";
 import { useGdsTranslation as useGdsTranslation2 } from "@doneisbetter/gds-theme";
 import { jsx as jsx3 } from "react/jsx-runtime";
-function ThemeToggle({ size = "md" }) {
+function ThemeToggle({ size = "md", onColorSchemeChange }) {
   const { setColorScheme } = useMantineColorScheme();
   const computedColorScheme = useComputedColorScheme("light", { getInitialValueInEffect: true });
   const { t } = useGdsTranslation2();
   const toggleColorScheme = () => {
-    setColorScheme(computedColorScheme === "dark" ? "light" : "dark");
+    const nextScheme = computedColorScheme === "dark" ? "light" : "dark";
+    setColorScheme(nextScheme);
+    onColorSchemeChange?.(nextScheme);
   };
   const isDark = computedColorScheme === "dark";
   return /* @__PURE__ */ jsx3(
@@ -117,7 +120,7 @@ function ThemeToggle({ size = "md" }) {
 }
 
 // src/ReferenceThemeExplorer.tsx
-import { useMemo, useState as useState2 } from "react";
+import { useEffect as useEffect2, useMemo, useState as useState2 } from "react";
 import {
   Badge,
   Button as Button2,
@@ -134,61 +137,32 @@ import {
 } from "@mantine/core";
 import {
   GdsProvider,
-  createPublicBrandTheme,
-  gdsDarkPublicTheme,
-  gdsEditorialPublicTheme,
-  gdsFlatSurfaceTheme,
-  gdsTheme
+  applyGdsFontLane,
+  getGdsFontLanes,
+  getGdsThemePresets,
+  resolveGdsThemePreset
 } from "@doneisbetter/gds-theme";
 import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
 function resolvePreviewColorScheme(presetId, requestedScheme) {
-  if (presetId === "dark-public") {
+  if (presetId === "dark-public" || presetId === "neon-night") {
     return "dark";
   }
   return requestedScheme;
 }
-var themePresetCatalog = {
-  default: {
-    label: "Default runtime theme",
-    bestFor: "Balanced multi-surface products that need the baseline GDS system.",
-    summary: "The default shared runtime lane for most adopters.",
-    themeKey: "gdsTheme",
-    supportedUse: "Starter products, hybrid public/admin apps, and teams adopting all canonical contracts.",
-    avoidFor: "Avoid for products requiring a distinct editorial voice or guaranteed dark-first brand contrast."
-  },
-  "dark-public": {
-    label: "Dark public theme",
-    bestFor: "Dark-first public experiences and campaign-style landing surfaces.",
-    summary: "A darker public presentation lane with the shipped runtime rhythm intact.",
-    themeKey: "gdsDarkPublicTheme",
-    supportedUse: "Products with a deliberate dark visual baseline, low-light UX, or premium media-first surfaces.",
-    avoidFor: "Avoid when mixed mode and editorial readability are core requirements."
-  },
-  "flat-surface": {
-    label: "Flat surface theme",
-    bestFor: "Operational products that prefer quieter elevation and flatter surface contrast.",
-    summary: "Removes some visual weight without creating a second token authority.",
-    themeKey: "gdsFlatSurfaceTheme",
-    supportedUse: "Dashboards, admin surfaces, and dense content where elevation becomes distracting.",
-    avoidFor: "Avoid for brand-first storytelling or high-expressiveness hero-first pages."
-  },
-  editorial: {
-    label: "Editorial serif theme",
-    bestFor: "Documentation, editorial, and content-led experiences.",
-    summary: "Adds a more expressive public reading tone while staying inside GDS contracts.",
-    themeKey: "gdsEditorialPublicTheme",
-    supportedUse: "Guides, docs, and catalog content where reading comfort matters more than impact.",
-    avoidFor: "Avoid for dense transactional or data-first workflows with strict minimal contrast."
-  },
-  brand: {
-    label: "Brand theme generator",
-    bestFor: "Consumer teams that need controlled brand expression without forking the system.",
-    summary: "Composes the shipped helpers into a governed product-authored theme lane.",
-    themeKey: "createPublicBrandTheme(...)",
-    supportedUse: "Whitelisted public branding programs with narrow product-authored intent and policy guardrails.",
-    avoidFor: "Avoid for local style experiments or temporary visual fixes without compliance approval."
-  }
-};
+var presetCatalog = getGdsThemePresets();
+var themePresetCatalog = Object.fromEntries(
+  presetCatalog.map((preset) => [
+    preset.id,
+    {
+      label: preset.label,
+      bestFor: `Apps aligned with ${preset.label.toLowerCase()}.`,
+      summary: preset.description,
+      themeKey: preset.runtimeLane,
+      supportedUse: `General product adoption with ${preset.label}.`,
+      avoidFor: "Avoid creating a local non-canonical theme authority."
+    }
+  ])
+);
 var colorSchemeProof = [
   {
     id: "light",
@@ -269,40 +243,50 @@ function ThemePreviewSurface({
     ] })
   ] }) });
 }
-function ReferenceThemeExplorer() {
-  const [preset, setPreset] = useState2("default");
-  const [colorScheme, setColorScheme] = useState2("light");
-  const [brandPrimary, setBrandPrimary] = useState2("blue");
-  const [brandFlatSurfaces, setBrandFlatSurfaces] = useState2(true);
-  const [brandEditorialSerif, setBrandEditorialSerif] = useState2(false);
+function ReferenceThemeExplorer({
+  initialSelection,
+  onSelectionChange
+}) {
+  const [preset, setPreset] = useState2(initialSelection?.preset ?? "default");
+  const [colorScheme, setColorScheme] = useState2(initialSelection?.colorScheme ?? "light");
+  const [brandPrimary, setBrandPrimary] = useState2(initialSelection?.brandPrimary ?? "blue");
+  const [brandFlatSurfaces, setBrandFlatSurfaces] = useState2(initialSelection?.brandFlatSurfaces ?? true);
+  const [brandEditorialSerif, setBrandEditorialSerif] = useState2(initialSelection?.brandEditorialSerif ?? false);
+  const [fontLane, setFontLane] = useState2(initialSelection?.fontLane ?? "inter");
   const [comparisonEnabled, setComparisonEnabled] = useState2(false);
   const [comparisonPreset, setComparisonPreset] = useState2("editorial");
-  const resolveTheme = (presetId) => {
-    switch (presetId) {
-      case "dark-public":
-        return gdsDarkPublicTheme;
-      case "flat-surface":
-        return gdsFlatSurfaceTheme;
-      case "editorial":
-        return gdsEditorialPublicTheme;
-      case "brand":
-        return createPublicBrandTheme({
-          flatSurfaces: brandFlatSurfaces,
-          editorialSerif: brandEditorialSerif,
-          overrides: { primaryColor: brandPrimary }
-        });
-      default:
-        return gdsTheme;
-    }
-  };
+  const availableComparisonPresets = presetCatalog.filter((item) => item.id !== preset).map((item) => item.id);
+  const resolveTheme = (presetId) => applyGdsFontLane(resolveGdsThemePreset(presetId, {
+    brandPrimary,
+    brandFlatSurfaces,
+    brandEditorialSerif
+  }), fontLane);
   const selectionSummary = themePresetCatalog[preset];
   const comparisonSummary = themePresetCatalog[comparisonPreset];
-  const selectedTheme = useMemo(() => resolveTheme(preset), [preset, brandPrimary, brandFlatSurfaces, brandEditorialSerif]);
-  const comparedTheme = useMemo(() => resolveTheme(comparisonPreset), [comparisonPreset, brandPrimary, brandFlatSurfaces, brandEditorialSerif]);
+  const selectedTheme = useMemo(() => resolveTheme(preset), [preset, brandPrimary, brandFlatSurfaces, brandEditorialSerif, fontLane]);
+  const comparedTheme = useMemo(() => resolveTheme(comparisonPreset), [comparisonPreset, brandPrimary, brandFlatSurfaces, brandEditorialSerif, fontLane]);
   const effectiveColorScheme = resolvePreviewColorScheme(preset, colorScheme);
   const effectiveComparisonScheme = resolvePreviewColorScheme(comparisonPreset, colorScheme);
-  const previewKey = `${preset}-${effectiveColorScheme}-${brandPrimary}-${brandFlatSurfaces}-${brandEditorialSerif}`;
-  const comparisonPreviewKey = `${comparisonPreset}-${effectiveComparisonScheme}-${brandPrimary}-${brandFlatSurfaces}-${brandEditorialSerif}`;
+  const previewKey = `${preset}-${effectiveColorScheme}-${brandPrimary}-${brandFlatSurfaces}-${brandEditorialSerif}-${fontLane}`;
+  const comparisonPreviewKey = `${comparisonPreset}-${effectiveComparisonScheme}-${brandPrimary}-${brandFlatSurfaces}-${brandEditorialSerif}-${fontLane}`;
+  useEffect2(() => {
+    onSelectionChange?.({
+      preset,
+      colorScheme: effectiveColorScheme,
+      theme: selectedTheme,
+      fontLane,
+      runtimeKey: previewKey,
+      brandPrimary,
+      brandFlatSurfaces,
+      brandEditorialSerif
+    });
+  }, [onSelectionChange, preset, effectiveColorScheme, selectedTheme, fontLane, previewKey, brandPrimary, brandFlatSurfaces, brandEditorialSerif]);
+  useEffect2(() => {
+    if (comparisonPreset !== preset) {
+      return;
+    }
+    setComparisonPreset(availableComparisonPresets[0] ?? "editorial");
+  }, [comparisonPreset, preset, availableComparisonPresets]);
   const reset = () => {
     setPreset("default");
     setColorScheme("light");
@@ -311,6 +295,7 @@ function ReferenceThemeExplorer() {
     setBrandEditorialSerif(false);
     setComparisonEnabled(false);
     setComparisonPreset("editorial");
+    setFontLane("inter");
   };
   return /* @__PURE__ */ jsxs2(Stack, { gap: "xl", children: [
     /* @__PURE__ */ jsx4(
@@ -343,8 +328,17 @@ function ReferenceThemeExplorer() {
                 ]
               }
             ) }),
+            /* @__PURE__ */ jsx4(FormField, { label: "Webfont lane", children: /* @__PURE__ */ jsx4(
+              NativeSelect,
+              {
+                "aria-label": "Webfont lane",
+                value: fontLane,
+                onChange: (event) => setFontLane(event.currentTarget.value || "inter"),
+                data: getGdsFontLanes().map((lane) => ({ value: lane.id, label: lane.label }))
+              }
+            ) }),
             /* @__PURE__ */ jsx4(Button2, { variant: "default", size: "sm", onClick: reset, children: "Reset theme lab" }),
-            /* @__PURE__ */ jsx4(Text2, { size: "sm", c: "dimmed", children: "The reference site remounts an isolated provider here so visitors can test shipped presets without changing the whole docs shell." })
+            /* @__PURE__ */ jsx4(Text2, { size: "sm", c: "dimmed", children: "Theme changes apply to the official site shell so visitors can validate real whole-page runtime behavior." })
           ] }) }),
           /* @__PURE__ */ jsx4(Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ jsxs2(Stack, { gap: "md", children: [
             /* @__PURE__ */ jsx4(Title, { order: 4, children: "Brand builder options" }),
@@ -398,7 +392,7 @@ function ReferenceThemeExplorer() {
                 " ",
                 colorScheme
               ] }),
-              preset === "dark-public" && colorScheme !== effectiveColorScheme ? /* @__PURE__ */ jsx4(Text2, { size: "sm", c: "dimmed", children: "gdsDarkPublicTheme always renders in dark mode inside the live preview." }) : null
+              (preset === "dark-public" || preset === "neon-night") && colorScheme !== effectiveColorScheme ? /* @__PURE__ */ jsx4(Text2, { size: "sm", c: "dimmed", children: "This dark-forward preset always renders in dark mode inside the live preview." }) : null
             ] }),
             /* @__PURE__ */ jsx4(
               Checkbox,
@@ -416,7 +410,7 @@ function ReferenceThemeExplorer() {
                 value: comparisonPreset,
                 onChange: (event) => setComparisonPreset(event.currentTarget.value || "editorial"),
                 disabled: !comparisonEnabled,
-                data: Object.entries(themePresetCatalog).filter(([value]) => value !== preset).map(([value, item]) => ({ value, label: item.label }))
+                data: availableComparisonPresets.map((value) => ({ value, label: themePresetCatalog[value].label }))
               }
             ) })
           ] }) })
@@ -564,10 +558,118 @@ function GameBoardTile({
   ) });
 }
 
+// src/ListingState.client.tsx
+import { createContext, useContext, useMemo as useMemo2, useReducer } from "react";
+import { jsx as jsx6 } from "react/jsx-runtime";
+function createInitialState(config = {}) {
+  return {
+    search: "",
+    sort: config.defaultSort ?? "newest",
+    filters: [],
+    page: 1,
+    pageSize: config.defaultPageSize ?? 25,
+    selection: []
+  };
+}
+function listingQueryReducer(state, action) {
+  if (action.type === "set-search") {
+    return { ...state, search: action.value, page: 1, selection: [] };
+  }
+  if (action.type === "set-sort") {
+    return { ...state, sort: action.value, page: 1, selection: [] };
+  }
+  if (action.type === "toggle-filter") {
+    const exists = state.filters.includes(action.value);
+    return {
+      ...state,
+      filters: exists ? state.filters.filter((item) => item !== action.value) : [...state.filters, action.value],
+      page: 1,
+      selection: []
+    };
+  }
+  if (action.type === "clear-filters") {
+    return { ...state, filters: [], page: 1, selection: [] };
+  }
+  if (action.type === "set-page") {
+    return { ...state, page: Math.max(1, Math.floor(action.value)) };
+  }
+  if (action.type === "set-page-size") {
+    const nextPageSize = Math.max(1, Math.floor(action.value));
+    return { ...state, pageSize: nextPageSize, page: 1, selection: [] };
+  }
+  if (action.type === "toggle-selection") {
+    const exists = state.selection.includes(action.value);
+    return {
+      ...state,
+      selection: exists ? state.selection.filter((item) => item !== action.value) : [...state.selection, action.value]
+    };
+  }
+  if (action.type === "clear-selection") {
+    return { ...state, selection: [] };
+  }
+  return createInitialState({ defaultSort: state.sort, defaultPageSize: state.pageSize });
+}
+var ListingStateContext = createContext(null);
+function ListingProvider({
+  children,
+  config
+}) {
+  const [state, dispatch] = useReducer(listingQueryReducer, config, createInitialState);
+  const value = useMemo2(() => ({ state, dispatch }), [state]);
+  return /* @__PURE__ */ jsx6(ListingStateContext.Provider, { value, children });
+}
+function useListingState() {
+  const context = useContext(ListingStateContext);
+  if (!context) {
+    throw new Error("useListingState must be used within ListingProvider.");
+  }
+  return context;
+}
+
 // src/DiscoveryShell.tsx
+import { useEffect as useEffect3, useState as useState3 } from "react";
 import { AppShell as MantineAppShell, Box, Burger, Group as Group3, ScrollArea } from "@mantine/core";
-import { useDisclosure } from "@mantine/hooks";
-import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+import { useMediaQuery as useMediaQuery2 } from "@mantine/hooks";
+import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+function useDiscoveryShellState({
+  defaultSidebarOpen = false,
+  sidebarStorageKey,
+  onSidebarOpenedChange
+} = {}) {
+  const [opened, setOpenedState] = useState3(defaultSidebarOpen);
+  useEffect3(() => {
+    if (!sidebarStorageKey || typeof window === "undefined") {
+      return;
+    }
+    const stored = window.localStorage.getItem(sidebarStorageKey);
+    if (stored === "open") {
+      setOpenedState(true);
+    }
+    if (stored === "closed") {
+      setOpenedState(false);
+    }
+  }, [sidebarStorageKey]);
+  const persistAndNotify = (next) => {
+    if (sidebarStorageKey && typeof window !== "undefined") {
+      window.localStorage.setItem(sidebarStorageKey, next ? "open" : "closed");
+    }
+    onSidebarOpenedChange?.(next);
+  };
+  const setOpened = (next) => {
+    setOpenedState(next);
+    persistAndNotify(next);
+  };
+  const open = () => setOpened(true);
+  const close = () => setOpened(false);
+  const toggle = () => {
+    setOpenedState((current) => {
+      const next = !current;
+      persistAndNotify(next);
+      return next;
+    });
+  };
+  return { opened, open, close, toggle, setOpened };
+}
 function DiscoveryShell({
   header,
   sidebar,
@@ -575,13 +677,29 @@ function DiscoveryShell({
   children,
   mobileNavigationLabel = "Toggle navigation",
   defaultSidebarOpen = false,
+  sidebarStorageKey,
+  sidebarOpened,
+  onSidebarOpenedChange,
   stickySidebar = true,
+  desktopCollapsible = false,
+  desktopNavigationLabel = "Toggle sidebar",
   sidebarWidth = 280,
   headerHeight = 60,
   shellPadding = "md",
   collapseBreakpoint = "sm"
 }) {
-  const [opened, { toggle, close }] = useDisclosure(defaultSidebarOpen);
+  const breakpointByAlias = {
+    xs: "36em",
+    sm: "48em",
+    md: "62em",
+    lg: "75em",
+    xl: "88em"
+  };
+  const isMobile = useMediaQuery2(`(max-width: ${breakpointByAlias[collapseBreakpoint]})`);
+  const shellState = useDiscoveryShellState({ defaultSidebarOpen, sidebarStorageKey, onSidebarOpenedChange });
+  const opened = sidebarOpened ?? shellState.opened;
+  const close = onSidebarOpenedChange ? () => onSidebarOpenedChange(false) : shellState.close;
+  const toggle = onSidebarOpenedChange ? () => onSidebarOpenedChange(!opened) : shellState.toggle;
   return /* @__PURE__ */ jsxs3(
     MantineAppShell,
     {
@@ -590,12 +708,15 @@ function DiscoveryShell({
       navbar: {
         width: sidebarWidth,
         breakpoint: collapseBreakpoint,
-        collapsed: { mobile: !opened }
+        collapsed: {
+          mobile: !opened,
+          desktop: desktopCollapsible ? !opened : false
+        }
       },
       padding: shellPadding,
       children: [
-        /* @__PURE__ */ jsx6(MantineAppShell.Header, { children: /* @__PURE__ */ jsxs3(Group3, { h: "100%", px: "md", gap: "sm", wrap: "nowrap", children: [
-          /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(MantineAppShell.Header, { children: /* @__PURE__ */ jsxs3(Group3, { h: "100%", px: "md", gap: "sm", wrap: "nowrap", children: [
+          /* @__PURE__ */ jsx7(
             Burger,
             {
               opened,
@@ -605,9 +726,19 @@ function DiscoveryShell({
               "aria-label": mobileNavigationLabel
             }
           ),
-          /* @__PURE__ */ jsx6(Box, { style: { flex: 1, minWidth: 0 }, children: header })
+          desktopCollapsible ? /* @__PURE__ */ jsx7(
+            Burger,
+            {
+              opened,
+              onClick: toggle,
+              visibleFrom: collapseBreakpoint,
+              size: "sm",
+              "aria-label": desktopNavigationLabel
+            }
+          ) : null,
+          /* @__PURE__ */ jsx7(Box, { style: { flex: 1, minWidth: 0 }, children: header })
         ] }) }),
-        /* @__PURE__ */ jsx6(MantineAppShell.Navbar, { p: "md", "data-sticky-sidebar": stickySidebar || void 0, children: /* @__PURE__ */ jsx6(ScrollArea, { h: "100%", type: "auto", children: /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(MantineAppShell.Navbar, { p: "md", "data-sticky-sidebar": stickySidebar || void 0, children: /* @__PURE__ */ jsx7(ScrollArea, { h: "100%", type: "auto", children: /* @__PURE__ */ jsx7(
           Box,
           {
             h: "100%",
@@ -618,27 +749,37 @@ function DiscoveryShell({
             children: sidebar
           }
         ) }) }),
-        footer ? /* @__PURE__ */ jsx6(MantineAppShell.Footer, { children: /* @__PURE__ */ jsx6(Group3, { h: "100%", px: "md", justify: "space-around", wrap: "nowrap", children: footer }) }) : null,
-        /* @__PURE__ */ jsx6(MantineAppShell.Main, { onClick: () => close(), children })
+        footer ? /* @__PURE__ */ jsx7(MantineAppShell.Footer, { children: /* @__PURE__ */ jsx7(Group3, { h: "100%", px: "md", justify: "space-around", wrap: "nowrap", children: footer }) }) : null,
+        /* @__PURE__ */ jsx7(
+          MantineAppShell.Main,
+          {
+            onClick: () => {
+              if (isMobile) {
+                close();
+              }
+            },
+            children
+          }
+        )
       ]
     }
   );
 }
 
 // src/DocsShell.tsx
-import { useState as useState3 } from "react";
+import { useState as useState4 } from "react";
 import { Box as Box2, Burger as Burger2, Container, Divider, Group as Group4, Stack as Stack2, Text as Text4, Transition } from "@mantine/core";
-import { Fragment, jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
 function DocsShellSidebar({ primaryNavigation, secondaryNavigation }) {
   return /* @__PURE__ */ jsxs4(Stack2, { gap: "md", h: "100%", children: [
     primaryNavigation ? /* @__PURE__ */ jsxs4(Stack2, { gap: "xs", children: [
-      /* @__PURE__ */ jsx7(Text4, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
+      /* @__PURE__ */ jsx8(Text4, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
       primaryNavigation
     ] }) : null,
     secondaryNavigation ? /* @__PURE__ */ jsxs4(Fragment, { children: [
-      /* @__PURE__ */ jsx7(Divider, {}),
+      /* @__PURE__ */ jsx8(Divider, {}),
       /* @__PURE__ */ jsxs4(Stack2, { gap: "xs", children: [
-        /* @__PURE__ */ jsx7(Text4, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
+        /* @__PURE__ */ jsx8(Text4, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
         secondaryNavigation
       ] })
     ] }) : null
@@ -662,14 +803,14 @@ function DocsShell({
   children,
   contentWidth = "full"
 }) {
-  const [mobileNavOpen, setMobileNavOpen] = useState3(false);
-  return /* @__PURE__ */ jsx7(
+  const [mobileNavOpen, setMobileNavOpen] = useState4(false);
+  return /* @__PURE__ */ jsx8(
     DiscoveryShell,
     {
       header: /* @__PURE__ */ jsxs4(Group4, { h: "100%", justify: "space-between", align: "center", wrap: "nowrap", gap: "md", children: [
         /* @__PURE__ */ jsxs4(Group4, { gap: "sm", align: "center", wrap: "nowrap", style: { minWidth: 0 }, children: [
           mobileNavigationMode === "inline-collapse" && mobileNavigation ? /* @__PURE__ */ jsxs4(Fragment, { children: [
-            /* @__PURE__ */ jsx7(
+            /* @__PURE__ */ jsx8(
               Burger2,
               {
                 opened: mobileNavOpen,
@@ -679,14 +820,14 @@ function DocsShell({
                 "aria-label": "Toggle docs navigation"
               }
             ),
-            /* @__PURE__ */ jsx7(Transition, { mounted: mobileNavOpen, transition: "pop", duration: 120, children: (styles) => /* @__PURE__ */ jsx7(Box2, { style: styles, children: /* @__PURE__ */ jsx7(Box2, { mt: "xs", p: "sm", style: { borderRadius: 8, border: "1px solid var(--mantine-color-default-border)" }, children: mobileNavigation }) }) })
+            /* @__PURE__ */ jsx8(Transition, { mounted: mobileNavOpen, transition: "pop", duration: 120, children: (styles) => /* @__PURE__ */ jsx8(Box2, { style: styles, children: /* @__PURE__ */ jsx8(Box2, { mt: "xs", p: "sm", style: { borderRadius: 8, border: "1px solid var(--mantine-color-default-border)" }, children: mobileNavigation }) }) })
           ] }) : null,
-          /* @__PURE__ */ jsx7(Box2, { style: { minWidth: 0 }, children: brand }),
-          headerContext ? /* @__PURE__ */ jsx7(Text4, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
+          /* @__PURE__ */ jsx8(Box2, { style: { minWidth: 0 }, children: brand }),
+          headerContext ? /* @__PURE__ */ jsx8(Text4, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
         ] }),
-        /* @__PURE__ */ jsx7(Group4, { gap: "sm", wrap: "nowrap", style: { minWidth: 0 }, children: actions })
+        /* @__PURE__ */ jsx8(Group4, { gap: "sm", wrap: "nowrap", style: { minWidth: 0 }, children: actions })
       ] }),
-      sidebar: /* @__PURE__ */ jsx7(
+      sidebar: /* @__PURE__ */ jsx8(
         DocsShellSidebar,
         {
           primaryNavigation,
@@ -696,7 +837,7 @@ function DocsShell({
       footer,
       mobileNavigationLabel: "Open docs navigation",
       headerHeight: 72,
-      children: /* @__PURE__ */ jsx7(Container, { size: resolveContentContainerSize(contentWidth), px: "md", py: "lg", w: "100%", children })
+      children: /* @__PURE__ */ jsx8(Container, { size: resolveContentContainerSize(contentWidth), px: "md", py: "lg", w: "100%", children })
     }
   );
 }
@@ -705,14 +846,14 @@ function DocsShell({
 import { forwardRef } from "react";
 import { Box as Box3, NavLink, Stack as Stack3, Text as Text5, createPolymorphicComponent } from "@mantine/core";
 import { useGdsTranslation as useGdsTranslation3 } from "@doneisbetter/gds-theme";
-import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
 function SidebarNav({ children, ariaLabel = "Primary navigation", gap = "md" }) {
-  return /* @__PURE__ */ jsx8(Stack3, { component: "nav", "aria-label": ariaLabel, gap, h: "100%", children });
+  return /* @__PURE__ */ jsx9(Stack3, { component: "nav", "aria-label": ariaLabel, gap, h: "100%", children });
 }
 function SidebarNavSection({ label, children, pushToBottom = false }) {
   return /* @__PURE__ */ jsxs5(Stack3, { gap: "xs", mt: pushToBottom ? "auto" : void 0, children: [
-    label ? /* @__PURE__ */ jsx8(Text5, { size: "xs", fw: 700, c: "dimmed", children: label }) : null,
-    /* @__PURE__ */ jsx8(Stack3, { gap: 4, children })
+    label ? /* @__PURE__ */ jsx9(Text5, { size: "xs", fw: 700, c: "dimmed", children: label }) : null,
+    /* @__PURE__ */ jsx9(Stack3, { gap: 4, children })
   ] });
 }
 var _SidebarNavItem = forwardRef(
@@ -731,14 +872,14 @@ var _SidebarNavItem = forwardRef(
     const config = action ? resolveSemanticActionConfig(action, vocabularyPacks) : null;
     const Icon = config?.icon;
     const resolvedLabel = label ?? (action ? getSemanticActionLabel(action, t, vocabularyPacks) : void 0);
-    return /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx9(
       NavLink,
       {
         ref,
         label: resolvedLabel,
         description,
-        leftSection: icon ?? (Icon ? /* @__PURE__ */ jsx8(Icon, { size: "1rem", stroke: 1.5 }) : void 0),
-        rightSection: badge ? /* @__PURE__ */ jsx8(Box3, { children: badge }) : props.rightSection,
+        leftSection: icon ?? (Icon ? /* @__PURE__ */ jsx9(Icon, { size: "1rem", stroke: 1.5 }) : void 0),
+        rightSection: badge ? /* @__PURE__ */ jsx9(Box3, { children: badge }) : props.rightSection,
         "aria-label": ariaLabel ?? (typeof resolvedLabel === "string" ? resolvedLabel : void 0),
         "aria-current": props.active ? "page" : ariaCurrent,
         ...props
@@ -749,11 +890,11 @@ var _SidebarNavItem = forwardRef(
 var SidebarNavItem = createPolymorphicComponent(_SidebarNavItem);
 
 // src/DocsCodeBlock.tsx
-import { useState as useState4 } from "react";
+import { useState as useState5 } from "react";
 import { ActionIcon as ActionIcon2, Code as Code2, Group as Group5, Paper as Paper3, Stack as Stack4, Text as Text6 } from "@mantine/core";
-import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
 function DocsCodeBlock({ code, language, title, withCopy = true }) {
-  const [copied, setCopied] = useState4(false);
+  const [copied, setCopied] = useState5(false);
   const handleCopy = async () => {
     if (!navigator?.clipboard) {
       return;
@@ -762,13 +903,13 @@ function DocsCodeBlock({ code, language, title, withCopy = true }) {
     setCopied(true);
     window.setTimeout(() => setCopied(false), 1200);
   };
-  return /* @__PURE__ */ jsx9(Paper3, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ jsxs6(Stack4, { gap: "sm", children: [
+  return /* @__PURE__ */ jsx10(Paper3, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ jsxs6(Stack4, { gap: "sm", children: [
     title || withCopy ? /* @__PURE__ */ jsxs6(Group5, { justify: "space-between", align: "center", children: [
       /* @__PURE__ */ jsxs6(Stack4, { gap: 0, children: [
-        title ? /* @__PURE__ */ jsx9(Text6, { fw: 600, children: title }) : null,
-        language ? /* @__PURE__ */ jsx9(Text6, { size: "xs", c: "dimmed", children: language }) : null
+        title ? /* @__PURE__ */ jsx10(Text6, { fw: 600, children: title }) : null,
+        language ? /* @__PURE__ */ jsx10(Text6, { size: "xs", c: "dimmed", children: language }) : null
       ] }),
-      withCopy ? /* @__PURE__ */ jsx9(
+      withCopy ? /* @__PURE__ */ jsx10(
         ActionIcon2,
         {
           variant: "subtle",
@@ -776,18 +917,18 @@ function DocsCodeBlock({ code, language, title, withCopy = true }) {
           onClick: () => {
             void handleCopy();
           },
-          children: /* @__PURE__ */ jsx9(GdsIcons.Copy, { size: "1rem" })
+          children: /* @__PURE__ */ jsx10(GdsIcons.Copy, { size: "1rem" })
         }
       ) : null
     ] }) : null,
-    /* @__PURE__ */ jsx9(Code2, { block: true, children: code })
+    /* @__PURE__ */ jsx10(Code2, { block: true, children: code })
   ] }) });
 }
 
 // src/ShareButtonGroup.tsx
-import { useState as useState5 } from "react";
+import { useState as useState6 } from "react";
 import { ActionIcon as ActionIcon3, Button as Button3, Group as Group6, Stack as Stack5, Text as Text7 } from "@mantine/core";
-import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 var channelLabels = {
   native: "Share",
   copy: "Copy link",
@@ -822,9 +963,9 @@ function ShareAction({
   const label = channelLabels[channel];
   const Icon = channel === "copy" ? GdsIcons.Copy : channel === "mail" ? GdsIcons.Mail : channel === "message" ? GdsIcons.Message : GdsIcons.Refer;
   if (compact) {
-    return href ? /* @__PURE__ */ jsx10(ActionIcon3, { component: "a", href, target: "_blank", rel: "noreferrer", variant: "subtle", size: "lg", "aria-label": label, children: /* @__PURE__ */ jsx10(Icon, { size: "1rem", stroke: 1.75 }) }) : /* @__PURE__ */ jsx10(ActionIcon3, { variant: "subtle", size: "lg", "aria-label": label, onClick, children: /* @__PURE__ */ jsx10(Icon, { size: "1rem", stroke: 1.75 }) });
+    return href ? /* @__PURE__ */ jsx11(ActionIcon3, { component: "a", href, target: "_blank", rel: "noreferrer", variant: "subtle", size: "lg", "aria-label": label, children: /* @__PURE__ */ jsx11(Icon, { size: "1rem", stroke: 1.75 }) }) : /* @__PURE__ */ jsx11(ActionIcon3, { variant: "subtle", size: "lg", "aria-label": label, onClick, children: /* @__PURE__ */ jsx11(Icon, { size: "1rem", stroke: 1.75 }) });
   }
-  return href ? /* @__PURE__ */ jsx10(Button3, { component: "a", href, target: "_blank", rel: "noreferrer", variant: "default", leftSection: /* @__PURE__ */ jsx10(Icon, { size: "1rem", stroke: 1.75 }), children: label }) : /* @__PURE__ */ jsx10(Button3, { variant: "default", leftSection: /* @__PURE__ */ jsx10(Icon, { size: "1rem", stroke: 1.75 }), onClick, children: label });
+  return href ? /* @__PURE__ */ jsx11(Button3, { component: "a", href, target: "_blank", rel: "noreferrer", variant: "default", leftSection: /* @__PURE__ */ jsx11(Icon, { size: "1rem", stroke: 1.75 }), children: label }) : /* @__PURE__ */ jsx11(Button3, { variant: "default", leftSection: /* @__PURE__ */ jsx11(Icon, { size: "1rem", stroke: 1.75 }), onClick, children: label });
 }
 function ShareButtonGroup({
   url,
@@ -835,8 +976,8 @@ function ShareButtonGroup({
   label = "Share this",
   description
 }) {
-  const [copied, setCopied] = useState5(false);
-  const [shared, setShared] = useState5(false);
+  const [copied, setCopied] = useState6(false);
+  const [shared, setShared] = useState6(false);
   const hrefs = encodeShare(url, title, text);
   async function handleCopy() {
     await navigator.clipboard?.writeText?.(url);
@@ -854,27 +995,27 @@ function ShareButtonGroup({
   }
   return /* @__PURE__ */ jsxs7(Stack5, { gap: "sm", children: [
     /* @__PURE__ */ jsxs7(Stack5, { gap: 2, children: [
-      /* @__PURE__ */ jsx10(Text7, { fw: 600, children: label }),
-      description ? /* @__PURE__ */ jsx10(Text7, { size: "sm", c: "dimmed", children: description }) : null
+      /* @__PURE__ */ jsx11(Text7, { fw: 600, children: label }),
+      description ? /* @__PURE__ */ jsx11(Text7, { size: "sm", c: "dimmed", children: description }) : null
     ] }),
-    /* @__PURE__ */ jsx10(Group6, { gap: "sm", wrap: "wrap", children: channels.map((channel) => {
+    /* @__PURE__ */ jsx11(Group6, { gap: "sm", wrap: "wrap", children: channels.map((channel) => {
       if (channel === "copy") {
-        return /* @__PURE__ */ jsx10(ShareAction, { channel, compact, onClick: () => void handleCopy() }, channel);
+        return /* @__PURE__ */ jsx11(ShareAction, { channel, compact, onClick: () => void handleCopy() }, channel);
       }
       if (channel === "native") {
-        return /* @__PURE__ */ jsx10(ShareAction, { channel, compact, onClick: () => void handleNativeShare() }, channel);
+        return /* @__PURE__ */ jsx11(ShareAction, { channel, compact, onClick: () => void handleNativeShare() }, channel);
       }
-      return /* @__PURE__ */ jsx10(ShareAction, { channel, compact, href: hrefs[channel] }, channel);
+      return /* @__PURE__ */ jsx11(ShareAction, { channel, compact, href: hrefs[channel] }, channel);
     }) }),
-    copied ? /* @__PURE__ */ jsx10(Text7, { size: "sm", c: "teal", children: "Link copied." }) : null,
-    shared ? /* @__PURE__ */ jsx10(Text7, { size: "sm", c: "teal", children: "Share sheet opened." }) : null
+    copied ? /* @__PURE__ */ jsx11(Text7, { size: "sm", c: "teal", children: "Link copied." }) : null,
+    shared ? /* @__PURE__ */ jsx11(Text7, { size: "sm", c: "teal", children: "Share sheet opened." }) : null
   ] });
 }
 
 // src/UploadDropzone.tsx
-import { useRef, useState as useState6 } from "react";
+import { useRef, useState as useState7 } from "react";
 import { Badge as Badge2, Box as Box4, Button as Button4, Group as Group7, Stack as Stack6, Text as Text8 } from "@mantine/core";
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 function UploadDropzone({
   title,
   description,
@@ -894,7 +1035,7 @@ function UploadDropzone({
   readonly = false
 }) {
   const inputRef = useRef(null);
-  const [dragging, setDragging] = useState6(false);
+  const [dragging, setDragging] = useState7(false);
   const UploadIcon = GdsIcons.Upload;
   const effectiveState = readonly ? "readonly" : dragging ? "drag-active" : state;
   const isDisabled = readonly || effectiveState === "upload-pending";
@@ -929,7 +1070,7 @@ function UploadDropzone({
       },
       "aria-invalid": isError || void 0,
       children: [
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(
           "input",
           {
             ref: inputRef,
@@ -942,22 +1083,22 @@ function UploadDropzone({
           }
         ),
         /* @__PURE__ */ jsxs8(Stack6, { align: mode === "inline" ? "flex-start" : "center", ta: mode === "inline" ? "left" : "center", gap: "sm", children: [
-          /* @__PURE__ */ jsx11(UploadIcon, { size: "1.5rem" }),
-          /* @__PURE__ */ jsx11(Badge2, { variant: "light", color: isError ? "red" : effectiveState === "selected" ? "blue" : effectiveState === "upload-pending" ? "violet" : "gray", children: effectiveState.replace("-", " ") }),
-          /* @__PURE__ */ jsx11(Text8, { fw: 600, children: title }),
-          description ? /* @__PURE__ */ jsx11(Text8, { size: "sm", c: "dimmed", children: description }) : null,
+          /* @__PURE__ */ jsx12(UploadIcon, { size: "1.5rem" }),
+          /* @__PURE__ */ jsx12(Badge2, { variant: "light", color: isError ? "red" : effectiveState === "selected" ? "blue" : effectiveState === "upload-pending" ? "violet" : "gray", children: effectiveState.replace("-", " ") }),
+          /* @__PURE__ */ jsx12(Text8, { fw: 600, children: title }),
+          description ? /* @__PURE__ */ jsx12(Text8, { size: "sm", c: "dimmed", children: description }) : null,
           acceptedTypesLabel || maxSizeLabel ? /* @__PURE__ */ jsxs8(Group7, { gap: "xs", justify: mode === "inline" ? "flex-start" : "center", children: [
-            acceptedTypesLabel ? /* @__PURE__ */ jsx11(Badge2, { variant: "outline", color: "gray", children: acceptedTypesLabel }) : null,
-            maxSizeLabel ? /* @__PURE__ */ jsx11(Badge2, { variant: "outline", color: "gray", children: maxSizeLabel }) : null
+            acceptedTypesLabel ? /* @__PURE__ */ jsx12(Badge2, { variant: "outline", color: "gray", children: acceptedTypesLabel }) : null,
+            maxSizeLabel ? /* @__PURE__ */ jsx12(Badge2, { variant: "outline", color: "gray", children: maxSizeLabel }) : null
           ] }) : null,
           selectedFiles.length ? /* @__PURE__ */ jsxs8(Text8, { size: "sm", children: [
             "Selected: ",
             selectedFiles.join(", ")
           ] }) : null,
-          policyText ? /* @__PURE__ */ jsx11(Text8, { size: "sm", c: isError ? "red.7" : "dimmed", children: policyText }) : null,
-          error ? /* @__PURE__ */ jsx11(Text8, { size: "sm", c: "red.7", role: "alert", children: error }) : null,
+          policyText ? /* @__PURE__ */ jsx12(Text8, { size: "sm", c: isError ? "red.7" : "dimmed", children: policyText }) : null,
+          error ? /* @__PURE__ */ jsx12(Text8, { size: "sm", c: "red.7", role: "alert", children: error }) : null,
           /* @__PURE__ */ jsxs8(Group7, { children: [
-            /* @__PURE__ */ jsx11(Button4, { variant: "light", onClick: () => inputRef.current?.click(), disabled: isDisabled, children: actionLabel }),
+            /* @__PURE__ */ jsx12(Button4, { variant: "light", onClick: () => inputRef.current?.click(), disabled: isDisabled, children: actionLabel }),
             retryAction,
             removeAction
           ] })
@@ -970,7 +1111,7 @@ function UploadDropzone({
 // src/AccessRecoveryPanel.tsx
 import { Group as Group8 } from "@mantine/core";
 import { useGdsTranslation as useGdsTranslation4 } from "@doneisbetter/gds-theme";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var stateBlockVariantByState = {
   unauthenticated: "permission",
   "expired-session": "info",
@@ -1050,7 +1191,7 @@ function ActionGroup({
   if (actions.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsx12(Group8, { gap: "sm", justify: "center", wrap: "wrap", children: actions.map((actionConfig, index) => /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(Group8, { gap: "sm", justify: "center", wrap: "wrap", children: actions.map((actionConfig, index) => /* @__PURE__ */ jsx13(
     SemanticButton,
     {
       action: actionConfig.action,
@@ -1084,14 +1225,14 @@ function AccessRecoveryPanel({
     onBack,
     supportAction
   });
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(
     StateBlock,
     {
       variant: stateBlockVariantByState[state],
       compact,
       title: title ?? t(`gds.accessRecovery.${state}.title`, defaultCopy.title),
       description: description ?? t(`gds.accessRecovery.${state}.description`, defaultCopy.description),
-      action: /* @__PURE__ */ jsx12(
+      action: /* @__PURE__ */ jsx13(
         ActionGroup,
         {
           primaryAction: primaryAction ?? defaults.primary,
@@ -1103,12 +1244,555 @@ function AccessRecoveryPanel({
   );
 }
 
+// src/GdsForm.client.tsx
+import { createContext as createContext2, useContext as useContext2, useMemo as useMemo3, useReducer as useReducer2 } from "react";
+import { Alert, Anchor, Stack as Stack7, Text as Text9 } from "@mantine/core";
+import { jsx as jsx14 } from "react/jsx-runtime";
+function createFieldState(value) {
+  return { value, touched: false, dirty: false };
+}
+function createSnapshot(values) {
+  const fields = Object.entries(values).reduce((acc, [field, value]) => {
+    acc[field] = createFieldState(value);
+    return acc;
+  }, {});
+  return { fields, issues: [], submitState: "idle" };
+}
+function gdsFormReducer(state, action) {
+  switch (action.type) {
+    case "set-field": {
+      const current = state.fields[action.field] ?? createFieldState("");
+      return {
+        ...state,
+        fields: {
+          ...state.fields,
+          [action.field]: {
+            value: action.value,
+            touched: current.touched,
+            dirty: true
+          }
+        }
+      };
+    }
+    case "touch-field": {
+      const current = state.fields[action.field] ?? createFieldState("");
+      return {
+        ...state,
+        fields: {
+          ...state.fields,
+          [action.field]: { ...current, touched: true }
+        }
+      };
+    }
+    case "set-issues":
+      return { ...state, issues: [...action.issues] };
+    case "set-submit-state":
+      return { ...state, submitState: action.submitState, submitError: action.submitError };
+    case "reset":
+      return createSnapshot(action.values ?? {});
+    default:
+      return state;
+  }
+}
+function sortIssues(issues) {
+  const weight = { blocking: 0, warning: 1, info: 2 };
+  return [...issues].sort((a, b) => weight[a.severity] - weight[b.severity]);
+}
+function useGdsForm({
+  initialValues,
+  validate,
+  validateAsync,
+  onSubmit
+}) {
+  const [snapshot, dispatch] = useReducer2(gdsFormReducer, initialValues, createSnapshot);
+  const submit = async () => {
+    dispatch({ type: "set-submit-state", submitState: "validating" });
+    const syncIssues = sortIssues(validate ? validate(snapshot) : []);
+    let mergedIssues = syncIssues;
+    if (syncIssues.filter((issue) => issue.severity === "blocking").length === 0 && validateAsync) {
+      const asyncIssues = sortIssues(await validateAsync(snapshot));
+      mergedIssues = sortIssues([...syncIssues, ...asyncIssues]);
+    }
+    dispatch({ type: "set-issues", issues: mergedIssues });
+    if (mergedIssues.some((issue) => issue.severity === "blocking")) {
+      dispatch({ type: "set-submit-state", submitState: "error", submitError: "Please resolve blocking validation issues." });
+      return false;
+    }
+    dispatch({ type: "set-submit-state", submitState: "submitting" });
+    try {
+      await onSubmit(
+        Object.entries(snapshot.fields).reduce((acc, [field, state]) => {
+          acc[field] = state.value;
+          return acc;
+        }, {})
+      );
+      dispatch({ type: "set-submit-state", submitState: "success" });
+      return true;
+    } catch (error) {
+      dispatch({
+        type: "set-submit-state",
+        submitState: "error",
+        submitError: error instanceof Error ? error.message : "Submission failed."
+      });
+      return false;
+    }
+  };
+  return useMemo3(
+    () => ({
+      snapshot,
+      setFieldValue: (field, value) => dispatch({ type: "set-field", field, value }),
+      touchField: (field) => dispatch({ type: "touch-field", field }),
+      submit,
+      retrySubmit: submit
+    }),
+    [snapshot]
+  );
+}
+var GdsFormContext = createContext2(null);
+function GdsFormProvider({ snapshot, children }) {
+  return /* @__PURE__ */ jsx14(GdsFormContext.Provider, { value: { snapshot }, children });
+}
+function useGdsFormSnapshot() {
+  const context = useContext2(GdsFormContext);
+  if (!context) {
+    throw new Error("useGdsFormSnapshot must be used within GdsFormProvider.");
+  }
+  return context.snapshot;
+}
+function FormErrorSummary({ title = "Please review the following issues." }) {
+  const snapshot = useGdsFormSnapshot();
+  const blocking = snapshot.issues.filter((issue) => issue.severity === "blocking");
+  if (blocking.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx14(Alert, { color: "red", title, children: /* @__PURE__ */ jsx14(Stack7, { gap: 4, children: blocking.map((issue) => /* @__PURE__ */ jsx14(Anchor, { href: `#${issue.field}`, children: issue.message }, `${issue.field}-${issue.message}`)) }) });
+}
+function ValidatedFieldMessage({ field }) {
+  const snapshot = useGdsFormSnapshot();
+  const issue = snapshot.issues.find((item) => item.field === field && item.severity === "blocking");
+  if (!issue) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx14(Text9, { size: "xs", c: "red.7", id: `${field}-error`, children: issue.message });
+}
+
+// src/AdvancedDataTable.client.tsx
+import { useMemo as useMemo4, useState as useState8 } from "react";
+import { Checkbox as Checkbox2, Group as Group9, ScrollArea as ScrollArea2, SegmentedControl, Stack as Stack8, Table, Text as Text10 } from "@mantine/core";
+import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+function compareValues(a, b) {
+  if (typeof a === "number" && typeof b === "number") {
+    return a - b;
+  }
+  return String(a).localeCompare(String(b), void 0, { numeric: true, sensitivity: "base" });
+}
+function AdvancedDataTable({
+  rows,
+  columns,
+  rowId,
+  loading = false,
+  error = null,
+  density: densityProp,
+  stickyHeader = true,
+  stickyHeaderOffset = 0,
+  selectedRowIds,
+  onSelectedRowIdsChange,
+  sortBy: sortByProp,
+  sortDirection: sortDirectionProp,
+  onSortChange,
+  responsiveFallback = "stacked-cards"
+}) {
+  const [densityState, setDensityState] = useState8(densityProp ?? "comfortable");
+  const [sortState, setSortState] = useState8({ key: sortByProp ?? null, direction: sortDirectionProp ?? "asc" });
+  const [selectionState, setSelectionState] = useState8([]);
+  const density = densityProp ?? densityState;
+  const sortBy = sortByProp ?? sortState.key;
+  const sortDirection = sortDirectionProp ?? sortState.direction;
+  const selection = selectedRowIds ?? selectionState;
+  const sortedRows = useMemo4(() => {
+    if (!sortBy) {
+      return rows;
+    }
+    const column = columns.find((item) => item.key === sortBy);
+    if (!column) {
+      return rows;
+    }
+    const next = [...rows].sort((left, right) => {
+      const leftValue = column.sortAccessor ? column.sortAccessor(left) : String(left[column.key] ?? "");
+      const rightValue = column.sortAccessor ? column.sortAccessor(right) : String(right[column.key] ?? "");
+      const result = compareValues(leftValue, rightValue);
+      return sortDirection === "asc" ? result : -result;
+    });
+    return next;
+  }, [rows, columns, sortBy, sortDirection]);
+  const allIds = useMemo4(() => sortedRows.map((row, index) => rowId(row, index)), [sortedRows, rowId]);
+  const allSelected = allIds.length > 0 && allIds.every((id) => selection.includes(id));
+  if (error) {
+    return /* @__PURE__ */ jsx15(StateBlock, { variant: "error", title: "Unable to load table", description: error, compact: true });
+  }
+  if (loading) {
+    return /* @__PURE__ */ jsx15(StateBlock, { variant: "loading", title: "Loading table", description: "Preparing enterprise data grid.", compact: true });
+  }
+  if (!rows.length) {
+    return /* @__PURE__ */ jsx15(
+      StateBlock,
+      {
+        variant: "empty",
+        title: "No rows available",
+        description: "Adjust filters or broaden scope to populate this table.",
+        compact: true
+      }
+    );
+  }
+  const horizontalSpacing = density === "compact" ? "xs" : "md";
+  const verticalSpacing = density === "compact" ? 6 : 10;
+  return /* @__PURE__ */ jsxs9(Stack8, { gap: "sm", children: [
+    /* @__PURE__ */ jsxs9(Group9, { justify: "space-between", align: "center", children: [
+      /* @__PURE__ */ jsxs9(Text10, { size: "sm", fw: 600, children: [
+        rows.length,
+        " rows"
+      ] }),
+      /* @__PURE__ */ jsx15(
+        SegmentedControl,
+        {
+          size: "xs",
+          value: density,
+          onChange: (value) => setDensityState(value),
+          data: [
+            { label: "Compact", value: "compact" },
+            { label: "Comfortable", value: "comfortable" }
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx15(ScrollArea2, { children: /* @__PURE__ */ jsxs9(
+      Table,
+      {
+        stickyHeader,
+        stickyHeaderOffset,
+        withTableBorder: true,
+        highlightOnHover: true,
+        striped: true,
+        horizontalSpacing,
+        verticalSpacing,
+        children: [
+          /* @__PURE__ */ jsx15(Table.Thead, { children: /* @__PURE__ */ jsxs9(Table.Tr, { children: [
+            /* @__PURE__ */ jsx15(Table.Th, { children: /* @__PURE__ */ jsx15(
+              Checkbox2,
+              {
+                "aria-label": "Select all rows",
+                checked: allSelected,
+                indeterminate: !allSelected && selection.length > 0,
+                onChange: (event) => {
+                  const next = event.currentTarget.checked ? allIds : [];
+                  if (onSelectedRowIdsChange) {
+                    onSelectedRowIdsChange(next);
+                  } else {
+                    setSelectionState(next);
+                  }
+                }
+              }
+            ) }),
+            columns.map((column) => /* @__PURE__ */ jsx15(Table.Th, { style: column.width ? { width: column.width } : void 0, children: column.sortable ? /* @__PURE__ */ jsx15(
+              "button",
+              {
+                type: "button",
+                "aria-label": `Sort by ${column.label}`,
+                onClick: () => {
+                  const nextDirection = sortBy === column.key && sortDirection === "asc" ? "desc" : "asc";
+                  if (onSortChange) {
+                    onSortChange(column.key, nextDirection);
+                  } else {
+                    setSortState({ key: column.key, direction: nextDirection });
+                  }
+                },
+                children: column.label
+              }
+            ) : column.label }, column.key))
+          ] }) }),
+          /* @__PURE__ */ jsx15(Table.Tbody, { children: sortedRows.map((row, index) => {
+            const id = rowId(row, index);
+            const checked = selection.includes(id);
+            return /* @__PURE__ */ jsxs9(Table.Tr, { children: [
+              /* @__PURE__ */ jsx15(Table.Td, { children: /* @__PURE__ */ jsx15(
+                Checkbox2,
+                {
+                  "aria-label": `Select row ${id}`,
+                  checked,
+                  onChange: () => {
+                    const next = checked ? selection.filter((item) => item !== id) : [...selection, id];
+                    if (onSelectedRowIdsChange) {
+                      onSelectedRowIdsChange(next);
+                    } else {
+                      setSelectionState(next);
+                    }
+                  }
+                }
+              ) }),
+              columns.map((column) => /* @__PURE__ */ jsx15(Table.Td, { children: column.render ? column.render(row) : String(row[column.key] ?? "") }, column.key))
+            ] }, id);
+          }) })
+        ]
+      }
+    ) }),
+    responsiveFallback === "stacked-cards" ? /* @__PURE__ */ jsx15(Stack8, { gap: "xs", children: sortedRows.slice(0, 3).map((row, index) => {
+      const id = rowId(row, index);
+      return /* @__PURE__ */ jsx15(
+        StateBlock,
+        {
+          variant: "info",
+          compact: true,
+          title: String(row[columns[0]?.key] ?? id),
+          description: columns.slice(1, 3).map((column) => `${column.label}: ${String(row[column.key] ?? "")}`).join(" | ")
+        },
+        `card-${id}`
+      );
+    }) }) : null
+  ] });
+}
+
+// src/OverlayManager.client.tsx
+import { createContext as createContext3, useContext as useContext3, useMemo as useMemo5, useState as useState9 } from "react";
+import { jsx as jsx16 } from "react/jsx-runtime";
+var OverlayManagerContext = createContext3(null);
+function OverlayManagerProvider({ children }) {
+  const [stack, setStack] = useState9([]);
+  const value = useMemo5(() => ({
+    stack,
+    registerOverlay: (overlay) => {
+      setStack((current) => {
+        const without = current.filter((item) => item.id !== overlay.id);
+        return [...without, overlay];
+      });
+    },
+    unregisterOverlay: (id) => {
+      setStack((current) => current.filter((item) => item.id !== id));
+    },
+    isTopMost: (id) => stack.length > 0 && stack[stack.length - 1]?.id === id,
+    requestClose: (id, reason) => {
+      if (stack.length === 0 || stack[stack.length - 1]?.id !== id) {
+        return null;
+      }
+      return reason;
+    }
+  }), [stack]);
+  return /* @__PURE__ */ jsx16(OverlayManagerContext.Provider, { value, children });
+}
+function useOverlayManager() {
+  const context = useContext3(OverlayManagerContext);
+  if (!context) {
+    throw new Error("useOverlayManager must be used within OverlayManagerProvider.");
+  }
+  return context;
+}
+
+// src/CommandPalette.client.tsx
+import { createContext as createContext4, useContext as useContext4, useEffect as useEffect4, useMemo as useMemo6, useState as useState10 } from "react";
+import { ActionIcon as ActionIcon4, Group as Group10, Modal as Modal2, Stack as Stack9, Text as Text11, TextInput as TextInput2 } from "@mantine/core";
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+var CommandPaletteContext = createContext4(null);
+function normalize(text) {
+  return text.trim().toLowerCase();
+}
+function scoreCommand(command, query, recentUse) {
+  const q = normalize(query);
+  if (!q) {
+    return 0;
+  }
+  const label = normalize(command.label);
+  const keywords = command.keywords?.map(normalize) ?? [];
+  const prefix = label.startsWith(q) ? 1 : 0;
+  const keyword = keywords.some((item) => item.includes(q)) ? 1 : 0;
+  const recent = recentUse[command.id] ? 1 : 0;
+  return 0.6 * prefix + 0.3 * keyword + 0.1 * recent;
+}
+function CommandRegistryProvider({ children }) {
+  const [commands, setCommands] = useState10([]);
+  const [opened, setOpened] = useState10(false);
+  const value = useMemo6(() => ({
+    commands,
+    registerCommands: (next) => setCommands(next),
+    open: () => setOpened(true),
+    close: () => setOpened(false)
+  }), [commands]);
+  return /* @__PURE__ */ jsxs10(CommandPaletteContext.Provider, { value, children: [
+    children,
+    /* @__PURE__ */ jsx17(CommandPalette, { opened, onClose: () => setOpened(false) })
+  ] });
+}
+function useCommandLauncher() {
+  const context = useContext4(CommandPaletteContext);
+  if (!context) {
+    throw new Error("useCommandLauncher must be used within CommandRegistryProvider.");
+  }
+  return {
+    open: context.open,
+    close: context.close,
+    registerCommands: context.registerCommands
+  };
+}
+function CommandPalette({ opened, onClose }) {
+  const contextValue = useContext4(CommandPaletteContext);
+  if (!contextValue) {
+    throw new Error("CommandPalette must be used within CommandRegistryProvider.");
+  }
+  const registry = contextValue;
+  const [query, setQuery] = useState10("");
+  const [recentUse, setRecentUse] = useState10({});
+  const enabledCommands = registry.commands.filter((command) => command.enabledWhen ? command.enabledWhen() : true);
+  const filteredCommands = [...enabledCommands].map((command) => ({ command, score: scoreCommand(command, query, recentUse) })).filter(({ command, score }) => normalize(query) === "" || score > 0 || normalize(command.label).includes(normalize(query))).sort((a, b) => b.score - a.score).map((item) => item.command);
+  useEffect4(() => {
+    function onKeyDown(event) {
+      if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "k") {
+        event.preventDefault();
+        registry.open();
+      }
+      if (event.key === "Escape" && opened) {
+        onClose();
+      }
+    }
+    window.addEventListener("keydown", onKeyDown);
+    return () => window.removeEventListener("keydown", onKeyDown);
+  }, [registry, opened, onClose]);
+  return /* @__PURE__ */ jsx17(Modal2, { opened, onClose, title: "Quick actions", centered: true, children: /* @__PURE__ */ jsxs10(Stack9, { gap: "sm", children: [
+    /* @__PURE__ */ jsx17(
+      TextInput2,
+      {
+        "aria-label": "Command search",
+        placeholder: "Search commands",
+        value: query,
+        onChange: (event) => setQuery(event.currentTarget.value)
+      }
+    ),
+    filteredCommands.length === 0 ? /* @__PURE__ */ jsx17(Text11, { size: "sm", c: "dimmed", children: "No matching commands." }) : filteredCommands.map((command) => /* @__PURE__ */ jsxs10(Group10, { justify: "space-between", wrap: "nowrap", children: [
+      /* @__PURE__ */ jsx17(
+        "button",
+        {
+          type: "button",
+          onClick: async () => {
+            await command.run();
+            setRecentUse((current) => ({ ...current, [command.id]: Date.now() }));
+            onClose();
+          },
+          "aria-label": command.label,
+          children: command.label
+        }
+      ),
+      command.shortcut ? /* @__PURE__ */ jsx17(Text11, { size: "xs", c: "dimmed", children: command.shortcut }) : null
+    ] }, command.id)),
+    /* @__PURE__ */ jsx17(Group10, { justify: "flex-end", children: /* @__PURE__ */ jsx17(ActionIcon4, { variant: "subtle", "aria-label": "Close command palette", onClick: onClose, children: /* @__PURE__ */ jsx17(GdsIcons.Close, { size: "1rem" }) }) })
+  ] }) });
+}
+
+// src/Notifications.client.tsx
+import { createContext as createContext5, useContext as useContext5, useMemo as useMemo7, useState as useState11 } from "react";
+import { jsx as jsx18 } from "react/jsx-runtime";
+var GdsNotificationContext = createContext5(null);
+function GdsNotificationProvider({ children }) {
+  const [notifications, setNotifications] = useState11([]);
+  const value = useMemo7(() => ({
+    notifications,
+    notify: (message) => {
+      setNotifications((current) => {
+        const rest = current.filter((item) => item.id !== message.id);
+        return [...rest, message];
+      });
+      if (typeof message.autoCloseMs === "number" && message.autoCloseMs > 0) {
+        window.setTimeout(() => {
+          setNotifications((current) => current.filter((item) => item.id !== message.id));
+        }, message.autoCloseMs);
+      }
+    },
+    dismiss: (id) => {
+      setNotifications((current) => current.filter((item) => item.id !== id));
+    },
+    clear: () => {
+      setNotifications([]);
+    }
+  }), [notifications]);
+  return /* @__PURE__ */ jsx18(GdsNotificationContext.Provider, { value, children });
+}
+function useGdsNotifications() {
+  const context = useContext5(GdsNotificationContext);
+  if (!context) {
+    throw new Error("useGdsNotifications must be used within GdsNotificationProvider.");
+  }
+  return context;
+}
+function NotificationCenter({
+  title = "Notifications",
+  emptyMessage = "No active notifications."
+}) {
+  const { notifications, dismiss, clear } = useGdsNotifications();
+  return /* @__PURE__ */ jsx18(
+    NotificationCenterView,
+    {
+      title,
+      emptyMessage,
+      notifications,
+      onDismiss: dismiss,
+      onClear: clear
+    }
+  );
+}
+
+// src/Telemetry.client.tsx
+import { createContext as createContext6, useContext as useContext6, useMemo as useMemo8 } from "react";
+import { jsx as jsx19 } from "react/jsx-runtime";
+var GdsTelemetryContext = createContext6(null);
+function hashToUnit(value) {
+  let hash = 0;
+  for (let index = 0; index < value.length; index += 1) {
+    hash = (hash << 5) - hash + value.charCodeAt(index);
+    hash |= 0;
+  }
+  return Math.abs(hash % 1e3) / 1e3;
+}
+function redactContext(context) {
+  if (!context) {
+    return context;
+  }
+  return Object.entries(context).reduce((acc, [key, value]) => {
+    if (key.toLowerCase().includes("email") || key.toLowerCase().includes("name") || key.toLowerCase().includes("phone")) {
+      return acc;
+    }
+    acc[key] = value;
+    return acc;
+  }, {});
+}
+function GdsTelemetryProvider({ children, sink, sampleRate = 1 }) {
+  const value = useMemo8(() => ({
+    emit: (event) => {
+      if (hashToUnit(event.correlationId) > sampleRate) {
+        return;
+      }
+      sink?.({
+        ...event,
+        context: redactContext(event.context),
+        ts: Date.now()
+      });
+    }
+  }), [sampleRate, sink]);
+  return /* @__PURE__ */ jsx19(GdsTelemetryContext.Provider, { value, children });
+}
+function useGdsTelemetry() {
+  const context = useContext6(GdsTelemetryContext);
+  if (!context) {
+    throw new Error("useGdsTelemetry must be used within GdsTelemetryProvider.");
+  }
+  return context;
+}
+
 export {
   SemanticButton,
   ConfirmDialog,
   ThemeToggle,
   ReferenceThemeExplorer,
   GameBoardTile,
+  listingQueryReducer,
+  ListingProvider,
+  useListingState,
+  useDiscoveryShellState,
   DiscoveryShell,
   DocsShell,
   SidebarNav,
@@ -1117,5 +1801,22 @@ export {
   DocsCodeBlock,
   ShareButtonGroup,
   UploadDropzone,
-  AccessRecoveryPanel
+  AccessRecoveryPanel,
+  gdsFormReducer,
+  useGdsForm,
+  GdsFormProvider,
+  useGdsFormSnapshot,
+  FormErrorSummary,
+  ValidatedFieldMessage,
+  AdvancedDataTable,
+  OverlayManagerProvider,
+  useOverlayManager,
+  CommandRegistryProvider,
+  useCommandLauncher,
+  CommandPalette,
+  GdsNotificationProvider,
+  useGdsNotifications,
+  NotificationCenter,
+  GdsTelemetryProvider,
+  useGdsTelemetry
 };