@doneisbetter/gds-admin 2.6.3 → 2.6.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -174,11 +174,13 @@ function ContentOpsSection({
174
174
 
175
175
  // src/ContentOpsActionBar.tsx
176
176
  import { Badge, Group as Group5, Paper as Paper3, Text as Text6 } from "@mantine/core";
177
+ import { ActionBar } from "@doneisbetter/gds-core";
177
178
  import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
178
179
  function ContentOpsActionBar({
179
180
  dirty = false,
180
181
  saving = false,
181
182
  status,
183
+ actions,
182
184
  primaryAction,
183
185
  secondaryAction,
184
186
  tertiaryAction
@@ -188,7 +190,7 @@ function ContentOpsActionBar({
188
190
  /* @__PURE__ */ jsx8(Badge, { color: saving ? "violet" : dirty ? "yellow" : "teal", variant: "light", children: saving ? "Saving" : dirty ? "Unsaved changes" : "Saved" }),
189
191
  status ? typeof status === "string" ? /* @__PURE__ */ jsx8(Text6, { size: "sm", c: "dimmed", children: status }) : status : null
190
192
  ] }),
191
- /* @__PURE__ */ jsxs7(Group5, { gap: "sm", wrap: "wrap", children: [
193
+ actions ? /* @__PURE__ */ jsx8(ActionBar, { ...actions }) : /* @__PURE__ */ jsxs7(Group5, { gap: "sm", wrap: "wrap", children: [
192
194
  tertiaryAction,
193
195
  secondaryAction,
194
196
  primaryAction
@@ -1,7 +1,6 @@
1
1
  // src/AppShell.tsx
2
- import { AppShell as MantineAppShell, Burger, Divider, Group, ScrollArea, Stack, Text, Title } from "@mantine/core";
3
- import { useDisclosure } from "@mantine/hooks";
4
- import { ThemeToggle } from "@doneisbetter/gds-core";
2
+ import { Divider, Group, Stack, Text, Title } from "@mantine/core";
3
+ import { DiscoveryShell, ThemeToggle } from "@doneisbetter/gds-core";
5
4
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
6
5
  function AppShell({
7
6
  logoText = "GDS",
@@ -14,56 +13,43 @@ function AppShell({
14
13
  mobileNavigation,
15
14
  children
16
15
  }) {
17
- const [opened, { toggle }] = useDisclosure();
18
16
  const primaryNav = primaryNavigation ?? navLinks;
19
- return /* @__PURE__ */ jsxs(
20
- MantineAppShell,
17
+ return /* @__PURE__ */ jsx(
18
+ DiscoveryShell,
21
19
  {
22
- header: { height: headerContext ? 72 : 60 },
23
- footer: mobileNavigation ? { height: 68 } : void 0,
24
- navbar: {
25
- width: 250,
26
- breakpoint: "sm",
27
- collapsed: { mobile: !opened }
28
- },
29
- padding: "md",
30
- children: [
31
- /* @__PURE__ */ jsx(MantineAppShell.Header, { children: /* @__PURE__ */ jsxs(Group, { h: "100%", px: "md", justify: "space-between", align: "center", wrap: "nowrap", children: [
32
- /* @__PURE__ */ jsxs(Group, { wrap: "nowrap", style: { minWidth: 0, flex: 1 }, children: [
33
- /* @__PURE__ */ jsx(Burger, { opened, onClick: toggle, hiddenFrom: "sm", size: "sm", "aria-label": "Toggle navigation" }),
34
- /* @__PURE__ */ jsxs(Stack, { gap: 0, style: { minWidth: 0 }, children: [
35
- /* @__PURE__ */ jsx(Title, { order: 3, lineClamp: 1, children: logoText }),
36
- headerContext ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
37
- ] })
38
- ] }),
39
- /* @__PURE__ */ jsxs(Group, { wrap: "nowrap", children: [
40
- headerActions,
41
- /* @__PURE__ */ jsx(ThemeToggle, {})
42
- ] })
20
+ headerHeight: headerContext ? 72 : 60,
21
+ header: /* @__PURE__ */ jsxs(Group, { h: "100%", justify: "space-between", align: "center", wrap: "nowrap", children: [
22
+ /* @__PURE__ */ jsx(Group, { wrap: "nowrap", style: { minWidth: 0, flex: 1 }, children: /* @__PURE__ */ jsxs(Stack, { gap: 0, style: { minWidth: 0 }, children: [
23
+ /* @__PURE__ */ jsx(Title, { order: 3, lineClamp: 1, children: logoText }),
24
+ headerContext ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
43
25
  ] }) }),
44
- /* @__PURE__ */ jsx(MantineAppShell.Navbar, { p: "md", children: /* @__PURE__ */ jsx(ScrollArea, { h: "100%", type: "auto", children: /* @__PURE__ */ jsxs(Stack, { gap: "md", h: "100%", children: [
45
- primaryNav ? /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
46
- /* @__PURE__ */ jsx(Text, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
47
- primaryNav
48
- ] }) : null,
49
- secondaryNavigation ? /* @__PURE__ */ jsxs(Fragment, { children: [
50
- /* @__PURE__ */ jsx(Divider, {}),
51
- /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
52
- /* @__PURE__ */ jsx(Text, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
53
- secondaryNavigation
54
- ] })
55
- ] }) : null,
56
- accountPanel ? /* @__PURE__ */ jsxs(Fragment, { children: [
57
- /* @__PURE__ */ jsx(Divider, { mt: "auto" }),
58
- /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
59
- /* @__PURE__ */ jsx(Text, { size: "xs", fw: 700, c: "dimmed", children: "Account" }),
60
- accountPanel
61
- ] })
62
- ] }) : null
63
- ] }) }) }),
64
- mobileNavigation ? /* @__PURE__ */ jsx(MantineAppShell.Footer, { children: /* @__PURE__ */ jsx(Group, { h: "100%", px: "md", justify: "space-around", wrap: "nowrap", children: mobileNavigation }) }) : null,
65
- /* @__PURE__ */ jsx(MantineAppShell.Main, { children })
66
- ]
26
+ /* @__PURE__ */ jsxs(Group, { wrap: "nowrap", children: [
27
+ headerActions,
28
+ /* @__PURE__ */ jsx(ThemeToggle, {})
29
+ ] })
30
+ ] }),
31
+ sidebar: /* @__PURE__ */ jsxs(Stack, { gap: "md", h: "100%", children: [
32
+ primaryNav ? /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
33
+ /* @__PURE__ */ jsx(Text, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
34
+ primaryNav
35
+ ] }) : null,
36
+ secondaryNavigation ? /* @__PURE__ */ jsxs(Fragment, { children: [
37
+ /* @__PURE__ */ jsx(Divider, {}),
38
+ /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
39
+ /* @__PURE__ */ jsx(Text, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
40
+ secondaryNavigation
41
+ ] })
42
+ ] }) : null,
43
+ accountPanel ? /* @__PURE__ */ jsxs(Fragment, { children: [
44
+ /* @__PURE__ */ jsx(Divider, { mt: "auto" }),
45
+ /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
46
+ /* @__PURE__ */ jsx(Text, { size: "xs", fw: 700, c: "dimmed", children: "Account" }),
47
+ accountPanel
48
+ ] })
49
+ ] }) : null
50
+ ] }),
51
+ footer: mobileNavigation,
52
+ children
67
53
  }
68
54
  );
69
55
  }
@@ -97,21 +83,16 @@ function DataTable({ data, columns, loading = false, getRowKey }) {
97
83
 
98
84
  // src/SemanticNavLink.tsx
99
85
  import { forwardRef } from "react";
100
- import { NavLink, createPolymorphicComponent } from "@mantine/core";
101
- import { useGdsTranslation as useGdsTranslation2 } from "@doneisbetter/gds-theme";
102
- import { GdsVocabulary } from "@doneisbetter/gds-core";
86
+ import { createPolymorphicComponent } from "@mantine/core";
87
+ import { SidebarNavItem } from "@doneisbetter/gds-core";
103
88
  import { jsx as jsx3 } from "react/jsx-runtime";
104
89
  var _SemanticNavLink = forwardRef(
105
90
  ({ action, ...props }, ref) => {
106
- const { t } = useGdsTranslation2();
107
- const config = GdsVocabulary[action];
108
- const Icon = config.icon;
109
91
  return /* @__PURE__ */ jsx3(
110
- NavLink,
92
+ SidebarNavItem,
111
93
  {
112
94
  ref,
113
- label: t(config.id, config.defaultMessage),
114
- leftSection: /* @__PURE__ */ jsx3(Icon, { size: "1rem", stroke: 1.5 }),
95
+ action,
115
96
  ...props
116
97
  }
117
98
  );
package/dist/client.d.mts CHANGED
@@ -3,8 +3,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
3
3
  import * as React$1 from 'react';
4
4
  import React__default, { ReactNode, Key } from 'react';
5
5
  import * as _mantine_core from '@mantine/core';
6
- import { NavLinkProps } from '@mantine/core';
7
- import { SemanticAction } from '@doneisbetter/gds-core';
6
+ import { SidebarNavItemProps, SemanticAction } from '@doneisbetter/gds-core';
8
7
 
9
8
  interface AppShellProps {
10
9
  logoText?: string;
@@ -39,7 +38,7 @@ interface DataTableProps<T> {
39
38
  */
40
39
  declare function DataTable<T extends Record<string, unknown>>({ data, columns, loading, getRowKey }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
41
40
 
42
- interface SemanticNavLinkProps extends Omit<NavLinkProps, 'leftSection' | 'label'> {
41
+ interface SemanticNavLinkProps extends Omit<SidebarNavItemProps, 'label' | 'icon' | 'action'> {
43
42
  action: SemanticAction;
44
43
  }
45
44
  declare const SemanticNavLink: (<C = "a">(props: _mantine_core.PolymorphicComponentProps<C, SemanticNavLinkProps>) => React.ReactElement) & Omit<React$1.FunctionComponent<(SemanticNavLinkProps & {
package/dist/client.d.ts CHANGED
@@ -3,8 +3,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
3
3
  import * as React$1 from 'react';
4
4
  import React__default, { ReactNode, Key } from 'react';
5
5
  import * as _mantine_core from '@mantine/core';
6
- import { NavLinkProps } from '@mantine/core';
7
- import { SemanticAction } from '@doneisbetter/gds-core';
6
+ import { SidebarNavItemProps, SemanticAction } from '@doneisbetter/gds-core';
8
7
 
9
8
  interface AppShellProps {
10
9
  logoText?: string;
@@ -39,7 +38,7 @@ interface DataTableProps<T> {
39
38
  */
40
39
  declare function DataTable<T extends Record<string, unknown>>({ data, columns, loading, getRowKey }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
41
40
 
42
- interface SemanticNavLinkProps extends Omit<NavLinkProps, 'leftSection' | 'label'> {
41
+ interface SemanticNavLinkProps extends Omit<SidebarNavItemProps, 'label' | 'icon' | 'action'> {
43
42
  action: SemanticAction;
44
43
  }
45
44
  declare const SemanticNavLink: (<C = "a">(props: _mantine_core.PolymorphicComponentProps<C, SemanticNavLinkProps>) => React.ReactElement) & Omit<React$1.FunctionComponent<(SemanticNavLinkProps & {
package/dist/client.js CHANGED
@@ -48,7 +48,6 @@ module.exports = __toCommonJS(client_exports);
48
48
 
49
49
  // src/AppShell.tsx
50
50
  var import_core = require("@mantine/core");
51
- var import_hooks = require("@mantine/hooks");
52
51
  var import_gds_core = require("@doneisbetter/gds-core");
53
52
  var import_jsx_runtime = require("react/jsx-runtime");
54
53
  function AppShell({
@@ -62,56 +61,43 @@ function AppShell({
62
61
  mobileNavigation,
63
62
  children
64
63
  }) {
65
- const [opened, { toggle }] = (0, import_hooks.useDisclosure)();
66
64
  const primaryNav = primaryNavigation ?? navLinks;
67
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
68
- import_core.AppShell,
65
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
66
+ import_gds_core.DiscoveryShell,
69
67
  {
70
- header: { height: headerContext ? 72 : 60 },
71
- footer: mobileNavigation ? { height: 68 } : void 0,
72
- navbar: {
73
- width: 250,
74
- breakpoint: "sm",
75
- collapsed: { mobile: !opened }
76
- },
77
- padding: "md",
78
- children: [
79
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.AppShell.Header, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { h: "100%", px: "md", justify: "space-between", align: "center", wrap: "nowrap", children: [
80
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { wrap: "nowrap", style: { minWidth: 0, flex: 1 }, children: [
81
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Burger, { opened, onClick: toggle, hiddenFrom: "sm", size: "sm", "aria-label": "Toggle navigation" }),
82
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: 0, style: { minWidth: 0 }, children: [
83
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Title, { order: 3, lineClamp: 1, children: logoText }),
84
- headerContext ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
85
- ] })
86
- ] }),
87
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { wrap: "nowrap", children: [
88
- headerActions,
89
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_gds_core.ThemeToggle, {})
90
- ] })
68
+ headerHeight: headerContext ? 72 : 60,
69
+ header: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { h: "100%", justify: "space-between", align: "center", wrap: "nowrap", children: [
70
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Group, { wrap: "nowrap", style: { minWidth: 0, flex: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: 0, style: { minWidth: 0 }, children: [
71
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Title, { order: 3, lineClamp: 1, children: logoText }),
72
+ headerContext ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
91
73
  ] }) }),
92
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.AppShell.Navbar, { p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.ScrollArea, { h: "100%", type: "auto", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "md", h: "100%", children: [
93
- primaryNav ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
94
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
95
- primaryNav
96
- ] }) : null,
97
- secondaryNavigation ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
98
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, {}),
99
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
100
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
101
- secondaryNavigation
102
- ] })
103
- ] }) : null,
104
- accountPanel ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
105
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, { mt: "auto" }),
106
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
107
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "Account" }),
108
- accountPanel
109
- ] })
110
- ] }) : null
111
- ] }) }) }),
112
- mobileNavigation ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.AppShell.Footer, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Group, { h: "100%", px: "md", justify: "space-around", wrap: "nowrap", children: mobileNavigation }) }) : null,
113
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.AppShell.Main, { children })
114
- ]
74
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { wrap: "nowrap", children: [
75
+ headerActions,
76
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_gds_core.ThemeToggle, {})
77
+ ] })
78
+ ] }),
79
+ sidebar: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "md", h: "100%", children: [
80
+ primaryNav ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
81
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
82
+ primaryNav
83
+ ] }) : null,
84
+ secondaryNavigation ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
85
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, {}),
86
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
87
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
88
+ secondaryNavigation
89
+ ] })
90
+ ] }) : null,
91
+ accountPanel ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
92
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, { mt: "auto" }),
93
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
94
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "Account" }),
95
+ accountPanel
96
+ ] })
97
+ ] }) : null
98
+ ] }),
99
+ footer: mobileNavigation,
100
+ children
115
101
  }
116
102
  );
117
103
  }
@@ -178,20 +164,15 @@ function StatsStrip({ stats }) {
178
164
  // src/SemanticNavLink.tsx
179
165
  var import_react = require("react");
180
166
  var import_core5 = require("@mantine/core");
181
- var import_gds_theme2 = require("@doneisbetter/gds-theme");
182
167
  var import_gds_core3 = require("@doneisbetter/gds-core");
183
168
  var import_jsx_runtime5 = require("react/jsx-runtime");
184
169
  var _SemanticNavLink = (0, import_react.forwardRef)(
185
170
  ({ action, ...props }, ref) => {
186
- const { t } = (0, import_gds_theme2.useGdsTranslation)();
187
- const config = import_gds_core3.GdsVocabulary[action];
188
- const Icon = config.icon;
189
171
  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
190
- import_core5.NavLink,
172
+ import_gds_core3.SidebarNavItem,
191
173
  {
192
174
  ref,
193
- label: t(config.id, config.defaultMessage),
194
- leftSection: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { size: "1rem", stroke: 1.5 }),
175
+ action,
195
176
  ...props
196
177
  }
197
178
  );
@@ -264,7 +245,7 @@ function PageHeader({
264
245
  // src/ResponsiveDataView.tsx
265
246
  var import_react2 = __toESM(require("react"));
266
247
  var import_core8 = require("@mantine/core");
267
- var import_hooks2 = require("@mantine/hooks");
248
+ var import_hooks = require("@mantine/hooks");
268
249
  var import_gds_core5 = require("@doneisbetter/gds-core");
269
250
  var import_jsx_runtime8 = require("react/jsx-runtime");
270
251
  function ResponsiveDataView({
@@ -283,7 +264,7 @@ function ResponsiveDataView({
283
264
  mobileFilters,
284
265
  getRowKey
285
266
  }) {
286
- const isMobile = (0, import_hooks2.useMediaQuery)("(max-width: 48em)");
267
+ const isMobile = (0, import_hooks.useMediaQuery)("(max-width: 48em)");
287
268
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Stack, { gap: "md", children: [
288
269
  toolbar,
289
270
  activeFilters.length ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Group, { gap: "xs", wrap: "wrap", children: activeFilters.map((filter, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
@@ -390,11 +371,13 @@ function ContentOpsSection({
390
371
 
391
372
  // src/ContentOpsActionBar.tsx
392
373
  var import_core11 = require("@mantine/core");
374
+ var import_gds_core7 = require("@doneisbetter/gds-core");
393
375
  var import_jsx_runtime12 = require("react/jsx-runtime");
394
376
  function ContentOpsActionBar({
395
377
  dirty = false,
396
378
  saving = false,
397
379
  status,
380
+ actions,
398
381
  primaryAction,
399
382
  secondaryAction,
400
383
  tertiaryAction
@@ -404,7 +387,7 @@ function ContentOpsActionBar({
404
387
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Badge, { color: saving ? "violet" : dirty ? "yellow" : "teal", variant: "light", children: saving ? "Saving" : dirty ? "Unsaved changes" : "Saved" }),
405
388
  status ? typeof status === "string" ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Text, { size: "sm", c: "dimmed", children: status }) : status : null
406
389
  ] }),
407
- /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { gap: "sm", wrap: "wrap", children: [
390
+ actions ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_gds_core7.ActionBar, { ...actions }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { gap: "sm", wrap: "wrap", children: [
408
391
  tertiaryAction,
409
392
  secondaryAction,
410
393
  primaryAction
package/dist/client.mjs CHANGED
@@ -3,7 +3,7 @@ import {
3
3
  DataTable,
4
4
  ResponsiveDataView,
5
5
  SemanticNavLink
6
- } from "./chunk-DCLRWG2B.mjs";
6
+ } from "./chunk-XZ3OB3RK.mjs";
7
7
  import {
8
8
  ContentOpsActionBar,
9
9
  ContentOpsEditor,
@@ -14,7 +14,7 @@ import {
14
14
  PageHeader,
15
15
  StatsStrip,
16
16
  WorkspaceHeader
17
- } from "./chunk-ZUUEDN7I.mjs";
17
+ } from "./chunk-CFL7O7EU.mjs";
18
18
  export {
19
19
  AppShell,
20
20
  ContentOpsActionBar,
package/dist/index.js CHANGED
@@ -48,7 +48,6 @@ module.exports = __toCommonJS(index_exports);
48
48
 
49
49
  // src/AppShell.tsx
50
50
  var import_core = require("@mantine/core");
51
- var import_hooks = require("@mantine/hooks");
52
51
  var import_gds_core = require("@doneisbetter/gds-core");
53
52
  var import_jsx_runtime = require("react/jsx-runtime");
54
53
  function AppShell({
@@ -62,56 +61,43 @@ function AppShell({
62
61
  mobileNavigation,
63
62
  children
64
63
  }) {
65
- const [opened, { toggle }] = (0, import_hooks.useDisclosure)();
66
64
  const primaryNav = primaryNavigation ?? navLinks;
67
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
68
- import_core.AppShell,
65
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
66
+ import_gds_core.DiscoveryShell,
69
67
  {
70
- header: { height: headerContext ? 72 : 60 },
71
- footer: mobileNavigation ? { height: 68 } : void 0,
72
- navbar: {
73
- width: 250,
74
- breakpoint: "sm",
75
- collapsed: { mobile: !opened }
76
- },
77
- padding: "md",
78
- children: [
79
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.AppShell.Header, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { h: "100%", px: "md", justify: "space-between", align: "center", wrap: "nowrap", children: [
80
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { wrap: "nowrap", style: { minWidth: 0, flex: 1 }, children: [
81
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Burger, { opened, onClick: toggle, hiddenFrom: "sm", size: "sm", "aria-label": "Toggle navigation" }),
82
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: 0, style: { minWidth: 0 }, children: [
83
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Title, { order: 3, lineClamp: 1, children: logoText }),
84
- headerContext ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
85
- ] })
86
- ] }),
87
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { wrap: "nowrap", children: [
88
- headerActions,
89
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_gds_core.ThemeToggle, {})
90
- ] })
68
+ headerHeight: headerContext ? 72 : 60,
69
+ header: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { h: "100%", justify: "space-between", align: "center", wrap: "nowrap", children: [
70
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Group, { wrap: "nowrap", style: { minWidth: 0, flex: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: 0, style: { minWidth: 0 }, children: [
71
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Title, { order: 3, lineClamp: 1, children: logoText }),
72
+ headerContext ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
91
73
  ] }) }),
92
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.AppShell.Navbar, { p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.ScrollArea, { h: "100%", type: "auto", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "md", h: "100%", children: [
93
- primaryNav ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
94
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
95
- primaryNav
96
- ] }) : null,
97
- secondaryNavigation ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
98
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, {}),
99
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
100
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
101
- secondaryNavigation
102
- ] })
103
- ] }) : null,
104
- accountPanel ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
105
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, { mt: "auto" }),
106
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
107
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "Account" }),
108
- accountPanel
109
- ] })
110
- ] }) : null
111
- ] }) }) }),
112
- mobileNavigation ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.AppShell.Footer, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Group, { h: "100%", px: "md", justify: "space-around", wrap: "nowrap", children: mobileNavigation }) }) : null,
113
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.AppShell.Main, { children })
114
- ]
74
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Group, { wrap: "nowrap", children: [
75
+ headerActions,
76
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_gds_core.ThemeToggle, {})
77
+ ] })
78
+ ] }),
79
+ sidebar: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "md", h: "100%", children: [
80
+ primaryNav ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
81
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
82
+ primaryNav
83
+ ] }) : null,
84
+ secondaryNavigation ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
85
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, {}),
86
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
87
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
88
+ secondaryNavigation
89
+ ] })
90
+ ] }) : null,
91
+ accountPanel ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
92
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, { mt: "auto" }),
93
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Stack, { gap: "xs", children: [
94
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { size: "xs", fw: 700, c: "dimmed", children: "Account" }),
95
+ accountPanel
96
+ ] })
97
+ ] }) : null
98
+ ] }),
99
+ footer: mobileNavigation,
100
+ children
115
101
  }
116
102
  );
117
103
  }
@@ -178,20 +164,15 @@ function StatsStrip({ stats }) {
178
164
  // src/SemanticNavLink.tsx
179
165
  var import_react = require("react");
180
166
  var import_core5 = require("@mantine/core");
181
- var import_gds_theme2 = require("@doneisbetter/gds-theme");
182
167
  var import_gds_core3 = require("@doneisbetter/gds-core");
183
168
  var import_jsx_runtime5 = require("react/jsx-runtime");
184
169
  var _SemanticNavLink = (0, import_react.forwardRef)(
185
170
  ({ action, ...props }, ref) => {
186
- const { t } = (0, import_gds_theme2.useGdsTranslation)();
187
- const config = import_gds_core3.GdsVocabulary[action];
188
- const Icon = config.icon;
189
171
  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
190
- import_core5.NavLink,
172
+ import_gds_core3.SidebarNavItem,
191
173
  {
192
174
  ref,
193
- label: t(config.id, config.defaultMessage),
194
- leftSection: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { size: "1rem", stroke: 1.5 }),
175
+ action,
195
176
  ...props
196
177
  }
197
178
  );
@@ -264,7 +245,7 @@ function PageHeader({
264
245
  // src/ResponsiveDataView.tsx
265
246
  var import_react2 = __toESM(require("react"));
266
247
  var import_core8 = require("@mantine/core");
267
- var import_hooks2 = require("@mantine/hooks");
248
+ var import_hooks = require("@mantine/hooks");
268
249
  var import_gds_core5 = require("@doneisbetter/gds-core");
269
250
  var import_jsx_runtime8 = require("react/jsx-runtime");
270
251
  function ResponsiveDataView({
@@ -283,7 +264,7 @@ function ResponsiveDataView({
283
264
  mobileFilters,
284
265
  getRowKey
285
266
  }) {
286
- const isMobile = (0, import_hooks2.useMediaQuery)("(max-width: 48em)");
267
+ const isMobile = (0, import_hooks.useMediaQuery)("(max-width: 48em)");
287
268
  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Stack, { gap: "md", children: [
288
269
  toolbar,
289
270
  activeFilters.length ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Group, { gap: "xs", wrap: "wrap", children: activeFilters.map((filter, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
@@ -390,11 +371,13 @@ function ContentOpsSection({
390
371
 
391
372
  // src/ContentOpsActionBar.tsx
392
373
  var import_core11 = require("@mantine/core");
374
+ var import_gds_core7 = require("@doneisbetter/gds-core");
393
375
  var import_jsx_runtime12 = require("react/jsx-runtime");
394
376
  function ContentOpsActionBar({
395
377
  dirty = false,
396
378
  saving = false,
397
379
  status,
380
+ actions,
398
381
  primaryAction,
399
382
  secondaryAction,
400
383
  tertiaryAction
@@ -404,7 +387,7 @@ function ContentOpsActionBar({
404
387
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Badge, { color: saving ? "violet" : dirty ? "yellow" : "teal", variant: "light", children: saving ? "Saving" : dirty ? "Unsaved changes" : "Saved" }),
405
388
  status ? typeof status === "string" ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Text, { size: "sm", c: "dimmed", children: status }) : status : null
406
389
  ] }),
407
- /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { gap: "sm", wrap: "wrap", children: [
390
+ actions ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_gds_core7.ActionBar, { ...actions }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { gap: "sm", wrap: "wrap", children: [
408
391
  tertiaryAction,
409
392
  secondaryAction,
410
393
  primaryAction
package/dist/index.mjs CHANGED
@@ -3,7 +3,7 @@ import {
3
3
  DataTable,
4
4
  ResponsiveDataView,
5
5
  SemanticNavLink
6
- } from "./chunk-DCLRWG2B.mjs";
6
+ } from "./chunk-XZ3OB3RK.mjs";
7
7
  import {
8
8
  ContentOpsActionBar,
9
9
  ContentOpsEditor,
@@ -14,7 +14,7 @@ import {
14
14
  PageHeader,
15
15
  StatsStrip,
16
16
  WorkspaceHeader
17
- } from "./chunk-ZUUEDN7I.mjs";
17
+ } from "./chunk-CFL7O7EU.mjs";
18
18
  export {
19
19
  AppShell,
20
20
  ContentOpsActionBar,
package/dist/server.d.mts CHANGED
@@ -1,5 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import { ReactNode } from 'react';
3
+ import { ActionBarProps } from '@doneisbetter/gds-core';
3
4
 
4
5
  interface FormSectionProps {
5
6
  title: string;
@@ -72,11 +73,12 @@ interface ContentOpsActionBarProps {
72
73
  dirty?: boolean;
73
74
  saving?: boolean;
74
75
  status?: ReactNode;
76
+ actions?: ActionBarProps;
75
77
  primaryAction?: ReactNode;
76
78
  secondaryAction?: ReactNode;
77
79
  tertiaryAction?: ReactNode;
78
80
  }
79
- declare function ContentOpsActionBar({ dirty, saving, status, primaryAction, secondaryAction, tertiaryAction, }: ContentOpsActionBarProps): react_jsx_runtime.JSX.Element;
81
+ declare function ContentOpsActionBar({ dirty, saving, status, actions, primaryAction, secondaryAction, tertiaryAction, }: ContentOpsActionBarProps): react_jsx_runtime.JSX.Element;
80
82
 
81
83
  interface ContentOpsEditorProps {
82
84
  header?: ReactNode;
package/dist/server.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import { ReactNode } from 'react';
3
+ import { ActionBarProps } from '@doneisbetter/gds-core';
3
4
 
4
5
  interface FormSectionProps {
5
6
  title: string;
@@ -72,11 +73,12 @@ interface ContentOpsActionBarProps {
72
73
  dirty?: boolean;
73
74
  saving?: boolean;
74
75
  status?: ReactNode;
76
+ actions?: ActionBarProps;
75
77
  primaryAction?: ReactNode;
76
78
  secondaryAction?: ReactNode;
77
79
  tertiaryAction?: ReactNode;
78
80
  }
79
- declare function ContentOpsActionBar({ dirty, saving, status, primaryAction, secondaryAction, tertiaryAction, }: ContentOpsActionBarProps): react_jsx_runtime.JSX.Element;
81
+ declare function ContentOpsActionBar({ dirty, saving, status, actions, primaryAction, secondaryAction, tertiaryAction, }: ContentOpsActionBarProps): react_jsx_runtime.JSX.Element;
80
82
 
81
83
  interface ContentOpsEditorProps {
82
84
  header?: ReactNode;
package/dist/server.js CHANGED
@@ -168,11 +168,13 @@ function ContentOpsSection({
168
168
 
169
169
  // src/ContentOpsActionBar.tsx
170
170
  var import_core6 = require("@mantine/core");
171
+ var import_gds_core3 = require("@doneisbetter/gds-core");
171
172
  var import_jsx_runtime7 = require("react/jsx-runtime");
172
173
  function ContentOpsActionBar({
173
174
  dirty = false,
174
175
  saving = false,
175
176
  status,
177
+ actions,
176
178
  primaryAction,
177
179
  secondaryAction,
178
180
  tertiaryAction
@@ -182,7 +184,7 @@ function ContentOpsActionBar({
182
184
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core6.Badge, { color: saving ? "violet" : dirty ? "yellow" : "teal", variant: "light", children: saving ? "Saving" : dirty ? "Unsaved changes" : "Saved" }),
183
185
  status ? typeof status === "string" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core6.Text, { size: "sm", c: "dimmed", children: status }) : status : null
184
186
  ] }),
185
- /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core6.Group, { gap: "sm", wrap: "wrap", children: [
187
+ actions ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_gds_core3.ActionBar, { ...actions }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core6.Group, { gap: "sm", wrap: "wrap", children: [
186
188
  tertiaryAction,
187
189
  secondaryAction,
188
190
  primaryAction
package/dist/server.mjs CHANGED
@@ -7,7 +7,7 @@ import {
7
7
  PageHeader,
8
8
  StatsStrip,
9
9
  WorkspaceHeader
10
- } from "./chunk-ZUUEDN7I.mjs";
10
+ } from "./chunk-CFL7O7EU.mjs";
11
11
  export {
12
12
  ContentOpsActionBar,
13
13
  ContentOpsEditor,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@doneisbetter/gds-admin",
3
- "version": "2.6.3",
3
+ "version": "2.6.4",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.ts",
@@ -38,8 +38,8 @@
38
38
  "dev": "tsup --watch"
39
39
  },
40
40
  "peerDependencies": {
41
- "@doneisbetter/gds-core": "^2.6.3",
42
- "@doneisbetter/gds-theme": "^2.6.3",
41
+ "@doneisbetter/gds-core": "^2.6.4",
42
+ "@doneisbetter/gds-theme": "^2.6.4",
43
43
  "@mantine/core": "^7.9.0 || ^8.3.0 || ^9.0.0",
44
44
  "@mantine/hooks": "^7.9.0 || ^8.3.0 || ^9.0.0",
45
45
  "@tabler/icons-react": "^3.5.0",