@doneisbetter/gds-admin 2.6.1
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.
- package/dist/chunk-DCLRWG2B.mjs +174 -0
- package/dist/chunk-ZUUEDN7I.mjs +238 -0
- package/dist/client.d.mts +88 -0
- package/dist/client.d.ts +88 -0
- package/dist/client.js +458 -0
- package/dist/client.mjs +32 -0
- package/dist/index.d.mts +6 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.js +458 -0
- package/dist/index.mjs +32 -0
- package/dist/server.d.mts +92 -0
- package/dist/server.d.ts +92 -0
- package/dist/server.js +272 -0
- package/dist/server.mjs +20 -0
- package/package.json +58 -0
package/dist/client.js
ADDED
|
@@ -0,0 +1,458 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// src/client.ts
|
|
31
|
+
var client_exports = {};
|
|
32
|
+
__export(client_exports, {
|
|
33
|
+
AppShell: () => AppShell,
|
|
34
|
+
ContentOpsActionBar: () => ContentOpsActionBar,
|
|
35
|
+
ContentOpsEditor: () => ContentOpsEditor,
|
|
36
|
+
ContentOpsSection: () => ContentOpsSection,
|
|
37
|
+
DataTable: () => DataTable,
|
|
38
|
+
EditorScaffold: () => EditorScaffold,
|
|
39
|
+
FormSection: () => FormSection,
|
|
40
|
+
InfoCard: () => InfoCard,
|
|
41
|
+
PageHeader: () => PageHeader,
|
|
42
|
+
ResponsiveDataView: () => ResponsiveDataView,
|
|
43
|
+
SemanticNavLink: () => SemanticNavLink,
|
|
44
|
+
StatsStrip: () => StatsStrip,
|
|
45
|
+
WorkspaceHeader: () => WorkspaceHeader
|
|
46
|
+
});
|
|
47
|
+
module.exports = __toCommonJS(client_exports);
|
|
48
|
+
|
|
49
|
+
// src/AppShell.tsx
|
|
50
|
+
var import_core = require("@mantine/core");
|
|
51
|
+
var import_hooks = require("@mantine/hooks");
|
|
52
|
+
var import_gds_core = require("@doneisbetter/gds-core");
|
|
53
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
54
|
+
function AppShell({
|
|
55
|
+
logoText = "GDS",
|
|
56
|
+
navLinks,
|
|
57
|
+
primaryNavigation,
|
|
58
|
+
secondaryNavigation,
|
|
59
|
+
accountPanel,
|
|
60
|
+
headerContext,
|
|
61
|
+
headerActions,
|
|
62
|
+
mobileNavigation,
|
|
63
|
+
children
|
|
64
|
+
}) {
|
|
65
|
+
const [opened, { toggle }] = (0, import_hooks.useDisclosure)();
|
|
66
|
+
const primaryNav = primaryNavigation ?? navLinks;
|
|
67
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
68
|
+
import_core.AppShell,
|
|
69
|
+
{
|
|
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
|
+
] })
|
|
91
|
+
] }) }),
|
|
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
|
+
]
|
|
115
|
+
}
|
|
116
|
+
);
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
// src/DataTable.tsx
|
|
120
|
+
var import_core2 = require("@mantine/core");
|
|
121
|
+
var import_gds_theme = require("@doneisbetter/gds-theme");
|
|
122
|
+
var import_gds_core2 = require("@doneisbetter/gds-core");
|
|
123
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
124
|
+
function DataTable({ data, columns, loading = false, getRowKey }) {
|
|
125
|
+
const { t } = (0, import_gds_theme.useGdsTranslation)();
|
|
126
|
+
if (!data.length && !loading) {
|
|
127
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Paper, { p: "xl", withBorder: true, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
128
|
+
import_gds_core2.StateBlock,
|
|
129
|
+
{
|
|
130
|
+
variant: "empty",
|
|
131
|
+
title: t("gds.state.emptyDataTitle", "No data available"),
|
|
132
|
+
description: t("gds.state.emptyData", "No data available."),
|
|
133
|
+
compact: true
|
|
134
|
+
}
|
|
135
|
+
) });
|
|
136
|
+
}
|
|
137
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_core2.Paper, { withBorder: true, pos: "relative", style: { overflow: "hidden" }, children: [
|
|
138
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.LoadingOverlay, { visible: loading, zIndex: 1e3, overlayProps: { radius: "sm", blur: 2 } }),
|
|
139
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_core2.Table, { striped: true, highlightOnHover: true, children: [
|
|
140
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Table.Thead, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Table.Tr, { children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Table.Th, { children: col.label }, col.key)) }) }),
|
|
141
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Table.Tbody, { children: data.map((item, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Table.Tr, { children: columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Table.Td, { children: col.render ? col.render(item) : item[col.key] }, col.key)) }, getRowKey ? getRowKey(item, rowIndex) : rowIndex)) })
|
|
142
|
+
] })
|
|
143
|
+
] });
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
// src/FormSection.tsx
|
|
147
|
+
var import_core3 = require("@mantine/core");
|
|
148
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
149
|
+
function FormSection({ title, description, children, withDivider = true }) {
|
|
150
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core3.Box, { mb: "xl", children: [
|
|
151
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core3.Box, { mb: "md", children: [
|
|
152
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Title, { order: 4, children: title }),
|
|
153
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Text, { c: "dimmed", size: "sm", children: description })
|
|
154
|
+
] }),
|
|
155
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Stack, { gap: "md", children }),
|
|
156
|
+
withDivider && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Divider, { my: "xl" })
|
|
157
|
+
] });
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
// src/StatsStrip.tsx
|
|
161
|
+
var import_core4 = require("@mantine/core");
|
|
162
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
163
|
+
function StatsStrip({ stats }) {
|
|
164
|
+
const items = stats.map((stat, index) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Paper, { p: "lg", withBorder: true, radius: "md", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Group, { justify: "space-between", align: "flex-end", gap: "xs", children: [
|
|
165
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Box, { children: [
|
|
166
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Text, { c: "dimmed", tt: "uppercase", fw: 700, size: "xs", children: stat.label }),
|
|
167
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Text, { fw: 700, size: "xl", mt: "sm", children: stat.value })
|
|
168
|
+
] }),
|
|
169
|
+
stat.diff !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Text, { c: stat.diff > 0 ? "teal" : "red", size: "sm", fw: 600, children: [
|
|
170
|
+
stat.diff > 0 ? "+" : "",
|
|
171
|
+
stat.diff,
|
|
172
|
+
"%"
|
|
173
|
+
] })
|
|
174
|
+
] }) }, index));
|
|
175
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.SimpleGrid, { cols: { base: 1, sm: 2, md: 3 }, spacing: "md", children: items });
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
// src/SemanticNavLink.tsx
|
|
179
|
+
var import_react = require("react");
|
|
180
|
+
var import_core5 = require("@mantine/core");
|
|
181
|
+
var import_gds_theme2 = require("@doneisbetter/gds-theme");
|
|
182
|
+
var import_gds_core3 = require("@doneisbetter/gds-core");
|
|
183
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
184
|
+
var _SemanticNavLink = (0, import_react.forwardRef)(
|
|
185
|
+
({ 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
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
190
|
+
import_core5.NavLink,
|
|
191
|
+
{
|
|
192
|
+
ref,
|
|
193
|
+
label: t(config.id, config.defaultMessage),
|
|
194
|
+
leftSection: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { size: "1rem", stroke: 1.5 }),
|
|
195
|
+
...props
|
|
196
|
+
}
|
|
197
|
+
);
|
|
198
|
+
}
|
|
199
|
+
);
|
|
200
|
+
var SemanticNavLink = (0, import_core5.createPolymorphicComponent)(_SemanticNavLink);
|
|
201
|
+
|
|
202
|
+
// src/InfoCard.tsx
|
|
203
|
+
var import_core6 = require("@mantine/core");
|
|
204
|
+
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
205
|
+
function InfoCard({ title, value, description, icon, color = "blue" }) {
|
|
206
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Card, { p: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_core6.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
|
|
207
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_core6.Box, { children: [
|
|
208
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Text, { tt: "uppercase", fw: 700, c: "dimmed", size: "xs", children: title }),
|
|
209
|
+
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Text, { fw: 700, size: "xl", mt: "sm", children: value }),
|
|
210
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Text, { c: "dimmed", size: "sm", mt: "xs", children: description })
|
|
211
|
+
] }),
|
|
212
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.ThemeIcon, { size: "xl", radius: "md", variant: "light", color, children: icon })
|
|
213
|
+
] }) });
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
// src/PageHeader.tsx
|
|
217
|
+
var import_core7 = require("@mantine/core");
|
|
218
|
+
var import_gds_core4 = require("@doneisbetter/gds-core");
|
|
219
|
+
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
220
|
+
function PageHeader({
|
|
221
|
+
title,
|
|
222
|
+
description,
|
|
223
|
+
subtitle,
|
|
224
|
+
eyebrow,
|
|
225
|
+
breadcrumbs,
|
|
226
|
+
status,
|
|
227
|
+
primaryAction,
|
|
228
|
+
secondaryActions,
|
|
229
|
+
overflowActions = []
|
|
230
|
+
}) {
|
|
231
|
+
return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Stack, { gap: "sm", mb: "xl", children: [
|
|
232
|
+
breadcrumbs?.length ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Breadcrumbs, { children: breadcrumbs }) : null,
|
|
233
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
|
|
234
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Box, { style: { minWidth: 0, flex: 1 }, children: [
|
|
235
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Text, { c: "dimmed", size: "sm", fw: 700, mb: 4, children: eyebrow }) : null,
|
|
236
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Title, { order: 1, children: title }),
|
|
237
|
+
subtitle ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Text, { c: "dimmed", mt: "xs", size: "sm", children: subtitle }) : null,
|
|
238
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Text, { c: "dimmed", mt: "xs", size: "lg", children: description }),
|
|
239
|
+
status ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Group, { mt: "sm", gap: "sm", children: status }) : null
|
|
240
|
+
] }),
|
|
241
|
+
(secondaryActions || primaryAction || overflowActions.length) && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Group, { wrap: "wrap", justify: "flex-end", children: [
|
|
242
|
+
secondaryActions,
|
|
243
|
+
primaryAction,
|
|
244
|
+
overflowActions.length ? /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Menu, { shadow: "md", width: 220, withinPortal: true, children: [
|
|
245
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Menu.Target, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.ActionIcon, { variant: "default", size: "lg", "aria-label": "More actions", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_gds_core4.GdsIcons.Menu, { size: "1rem" }) }) }),
|
|
246
|
+
/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Menu.Dropdown, { children: overflowActions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
247
|
+
import_core7.Menu.Item,
|
|
248
|
+
{
|
|
249
|
+
component: action.href ? "a" : "button",
|
|
250
|
+
href: action.href,
|
|
251
|
+
onClick: action.onClick,
|
|
252
|
+
color: action.color,
|
|
253
|
+
disabled: action.disabled,
|
|
254
|
+
children: action.label
|
|
255
|
+
},
|
|
256
|
+
`${String(action.label)}-${index}`
|
|
257
|
+
)) })
|
|
258
|
+
] }) : null
|
|
259
|
+
] })
|
|
260
|
+
] })
|
|
261
|
+
] });
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
// src/ResponsiveDataView.tsx
|
|
265
|
+
var import_react2 = __toESM(require("react"));
|
|
266
|
+
var import_core8 = require("@mantine/core");
|
|
267
|
+
var import_hooks2 = require("@mantine/hooks");
|
|
268
|
+
var import_gds_core5 = require("@doneisbetter/gds-core");
|
|
269
|
+
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
270
|
+
function ResponsiveDataView({
|
|
271
|
+
data,
|
|
272
|
+
columns,
|
|
273
|
+
renderCard,
|
|
274
|
+
loading = false,
|
|
275
|
+
error,
|
|
276
|
+
errorAction,
|
|
277
|
+
emptyTitle = "No results yet",
|
|
278
|
+
emptyDescription = "Try changing filters or create a new record.",
|
|
279
|
+
emptyAction,
|
|
280
|
+
activeFilters = [],
|
|
281
|
+
toolbar,
|
|
282
|
+
filterDrawer,
|
|
283
|
+
mobileFilters,
|
|
284
|
+
getRowKey
|
|
285
|
+
}) {
|
|
286
|
+
const isMobile = (0, import_hooks2.useMediaQuery)("(max-width: 48em)");
|
|
287
|
+
return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Stack, { gap: "md", children: [
|
|
288
|
+
toolbar,
|
|
289
|
+
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)(
|
|
290
|
+
import_core8.Badge,
|
|
291
|
+
{
|
|
292
|
+
variant: "light",
|
|
293
|
+
color: "violet",
|
|
294
|
+
rightSection: filter.onRemove ? "\xD7" : void 0,
|
|
295
|
+
style: filter.onRemove ? { cursor: "pointer" } : void 0,
|
|
296
|
+
onClick: filter.onRemove,
|
|
297
|
+
children: filter.label
|
|
298
|
+
},
|
|
299
|
+
`${filter.label}-${index}`
|
|
300
|
+
)) }) : null,
|
|
301
|
+
mobileFilters && isMobile ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Stack, { gap: "xs", children: mobileFilters }) : null,
|
|
302
|
+
filterDrawer && isMobile ? filterDrawer : null,
|
|
303
|
+
error ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_gds_core5.StateBlock, { variant: "error", title: "Unable to load data", description: error, action: errorAction, compact: true }) : null,
|
|
304
|
+
!error && loading ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_gds_core5.StateBlock, { variant: "loading", title: "Loading records", description: "The shared registry surface is synchronizing.", compact: true }) : null,
|
|
305
|
+
!error && !loading && data.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_gds_core5.StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, action: emptyAction, compact: true }) : null,
|
|
306
|
+
!error && isMobile && data.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.SimpleGrid, { cols: { base: 1, sm: 2 }, spacing: "md", children: data.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react2.default.Fragment, { children: renderCard(item, index) }, getRowKey ? getRowKey(item, index) : index)) }) : null,
|
|
307
|
+
!error && !isMobile ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(DataTable, { data, columns, loading, getRowKey }) : null
|
|
308
|
+
] });
|
|
309
|
+
}
|
|
310
|
+
|
|
311
|
+
// src/WorkspaceHeader.tsx
|
|
312
|
+
var import_core9 = require("@mantine/core");
|
|
313
|
+
var import_jsx_runtime9 = require("react/jsx-runtime");
|
|
314
|
+
function WorkspaceHeader({
|
|
315
|
+
breadcrumbs,
|
|
316
|
+
eyebrow,
|
|
317
|
+
title,
|
|
318
|
+
description,
|
|
319
|
+
primaryAction,
|
|
320
|
+
secondaryActions
|
|
321
|
+
}) {
|
|
322
|
+
return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core9.Stack, { gap: "sm", mb: "xl", children: [
|
|
323
|
+
breadcrumbs?.length ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Breadcrumbs, { children: breadcrumbs }) : null,
|
|
324
|
+
eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Text, { size: "sm", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
|
|
325
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core9.Group, { justify: "space-between", align: "flex-start", gap: "md", children: [
|
|
326
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core9.Stack, { gap: 6, children: [
|
|
327
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Title, { order: 1, children: title }),
|
|
328
|
+
description ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Text, { c: "dimmed", maw: 640, children: description }) : null
|
|
329
|
+
] }),
|
|
330
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core9.Group, { gap: "sm", children: [
|
|
331
|
+
secondaryActions,
|
|
332
|
+
primaryAction
|
|
333
|
+
] })
|
|
334
|
+
] })
|
|
335
|
+
] });
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
// src/EditorScaffold.tsx
|
|
339
|
+
var import_core10 = require("@mantine/core");
|
|
340
|
+
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
341
|
+
function EditorScaffold({
|
|
342
|
+
header,
|
|
343
|
+
context,
|
|
344
|
+
form,
|
|
345
|
+
preview,
|
|
346
|
+
settings,
|
|
347
|
+
footer,
|
|
348
|
+
stickyFooter = false
|
|
349
|
+
}) {
|
|
350
|
+
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core10.Stack, { gap: "lg", children: [
|
|
351
|
+
header,
|
|
352
|
+
context,
|
|
353
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core10.Grid, { gutter: "lg", align: "start", children: [
|
|
354
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core10.Grid.Col, { span: { base: 12, md: preview ? 7 : 8 }, children: form }),
|
|
355
|
+
preview || settings ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core10.Grid.Col, { span: { base: 12, md: preview ? 5 : 4 }, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core10.Stack, { gap: "lg", children: [
|
|
356
|
+
preview,
|
|
357
|
+
settings
|
|
358
|
+
] }) }) : null
|
|
359
|
+
] }),
|
|
360
|
+
footer ? stickyFooter ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
361
|
+
import_core10.Paper,
|
|
362
|
+
{
|
|
363
|
+
withBorder: true,
|
|
364
|
+
radius: "xl",
|
|
365
|
+
p: "md",
|
|
366
|
+
style: {
|
|
367
|
+
position: "sticky",
|
|
368
|
+
bottom: "1rem",
|
|
369
|
+
zIndex: 10
|
|
370
|
+
},
|
|
371
|
+
children: footer
|
|
372
|
+
}
|
|
373
|
+
) : footer : null
|
|
374
|
+
] });
|
|
375
|
+
}
|
|
376
|
+
|
|
377
|
+
// src/ContentOpsSection.tsx
|
|
378
|
+
var import_gds_core6 = require("@doneisbetter/gds-core");
|
|
379
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
380
|
+
function ContentOpsSection({
|
|
381
|
+
id,
|
|
382
|
+
title,
|
|
383
|
+
description,
|
|
384
|
+
action,
|
|
385
|
+
children,
|
|
386
|
+
tone = "default"
|
|
387
|
+
}) {
|
|
388
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_gds_core6.SectionPanel, { id, title, description, action, tone, children });
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
// src/ContentOpsActionBar.tsx
|
|
392
|
+
var import_core11 = require("@mantine/core");
|
|
393
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
394
|
+
function ContentOpsActionBar({
|
|
395
|
+
dirty = false,
|
|
396
|
+
saving = false,
|
|
397
|
+
status,
|
|
398
|
+
primaryAction,
|
|
399
|
+
secondaryAction,
|
|
400
|
+
tertiaryAction
|
|
401
|
+
}) {
|
|
402
|
+
return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Paper, { withBorder: true, radius: "xl", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { justify: "space-between", align: "center", gap: "md", wrap: "wrap", children: [
|
|
403
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { gap: "sm", wrap: "wrap", children: [
|
|
404
|
+
/* @__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
|
+
status ? typeof status === "string" ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Text, { size: "sm", c: "dimmed", children: status }) : status : null
|
|
406
|
+
] }),
|
|
407
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { gap: "sm", wrap: "wrap", children: [
|
|
408
|
+
tertiaryAction,
|
|
409
|
+
secondaryAction,
|
|
410
|
+
primaryAction
|
|
411
|
+
] })
|
|
412
|
+
] }) });
|
|
413
|
+
}
|
|
414
|
+
|
|
415
|
+
// src/ContentOpsEditor.tsx
|
|
416
|
+
var import_core12 = require("@mantine/core");
|
|
417
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
418
|
+
function ContentOpsEditor({
|
|
419
|
+
header,
|
|
420
|
+
context,
|
|
421
|
+
status,
|
|
422
|
+
sections,
|
|
423
|
+
actionBar,
|
|
424
|
+
preview,
|
|
425
|
+
settings
|
|
426
|
+
}) {
|
|
427
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_core12.Stack, { gap: "lg", children: [
|
|
428
|
+
header,
|
|
429
|
+
status,
|
|
430
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
|
431
|
+
EditorScaffold,
|
|
432
|
+
{
|
|
433
|
+
context,
|
|
434
|
+
form: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Stack, { gap: "lg", children: sections }),
|
|
435
|
+
preview,
|
|
436
|
+
settings,
|
|
437
|
+
footer: actionBar,
|
|
438
|
+
stickyFooter: true
|
|
439
|
+
}
|
|
440
|
+
)
|
|
441
|
+
] });
|
|
442
|
+
}
|
|
443
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
444
|
+
0 && (module.exports = {
|
|
445
|
+
AppShell,
|
|
446
|
+
ContentOpsActionBar,
|
|
447
|
+
ContentOpsEditor,
|
|
448
|
+
ContentOpsSection,
|
|
449
|
+
DataTable,
|
|
450
|
+
EditorScaffold,
|
|
451
|
+
FormSection,
|
|
452
|
+
InfoCard,
|
|
453
|
+
PageHeader,
|
|
454
|
+
ResponsiveDataView,
|
|
455
|
+
SemanticNavLink,
|
|
456
|
+
StatsStrip,
|
|
457
|
+
WorkspaceHeader
|
|
458
|
+
});
|
package/dist/client.mjs
ADDED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import {
|
|
2
|
+
AppShell,
|
|
3
|
+
DataTable,
|
|
4
|
+
ResponsiveDataView,
|
|
5
|
+
SemanticNavLink
|
|
6
|
+
} from "./chunk-DCLRWG2B.mjs";
|
|
7
|
+
import {
|
|
8
|
+
ContentOpsActionBar,
|
|
9
|
+
ContentOpsEditor,
|
|
10
|
+
ContentOpsSection,
|
|
11
|
+
EditorScaffold,
|
|
12
|
+
FormSection,
|
|
13
|
+
InfoCard,
|
|
14
|
+
PageHeader,
|
|
15
|
+
StatsStrip,
|
|
16
|
+
WorkspaceHeader
|
|
17
|
+
} from "./chunk-ZUUEDN7I.mjs";
|
|
18
|
+
export {
|
|
19
|
+
AppShell,
|
|
20
|
+
ContentOpsActionBar,
|
|
21
|
+
ContentOpsEditor,
|
|
22
|
+
ContentOpsSection,
|
|
23
|
+
DataTable,
|
|
24
|
+
EditorScaffold,
|
|
25
|
+
FormSection,
|
|
26
|
+
InfoCard,
|
|
27
|
+
PageHeader,
|
|
28
|
+
ResponsiveDataView,
|
|
29
|
+
SemanticNavLink,
|
|
30
|
+
StatsStrip,
|
|
31
|
+
WorkspaceHeader
|
|
32
|
+
};
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { AppShell, AppShellProps, DataTable, DataTableColumn, DataTableProps, EditorScaffold, EditorScaffoldProps, ResponsiveDataView, ResponsiveDataViewFilterChip, ResponsiveDataViewProps, SemanticNavLink, SemanticNavLinkProps } from './client.mjs';
|
|
2
|
+
export { ContentOpsActionBar, ContentOpsActionBarProps, ContentOpsEditor, ContentOpsEditorProps, ContentOpsSection, ContentOpsSectionProps, FormSection, FormSectionProps, InfoCard, InfoCardProps, PageHeader, PageHeaderOverflowAction, PageHeaderProps, StatItem, StatsStrip, StatsStripProps, WorkspaceHeader, WorkspaceHeaderProps } from './server.mjs';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'react';
|
|
5
|
+
import '@mantine/core';
|
|
6
|
+
import '@doneisbetter/gds-core';
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { AppShell, AppShellProps, DataTable, DataTableColumn, DataTableProps, EditorScaffold, EditorScaffoldProps, ResponsiveDataView, ResponsiveDataViewFilterChip, ResponsiveDataViewProps, SemanticNavLink, SemanticNavLinkProps } from './client.js';
|
|
2
|
+
export { ContentOpsActionBar, ContentOpsActionBarProps, ContentOpsEditor, ContentOpsEditorProps, ContentOpsSection, ContentOpsSectionProps, FormSection, FormSectionProps, InfoCard, InfoCardProps, PageHeader, PageHeaderOverflowAction, PageHeaderProps, StatItem, StatsStrip, StatsStripProps, WorkspaceHeader, WorkspaceHeaderProps } from './server.js';
|
|
3
|
+
import 'react/jsx-runtime';
|
|
4
|
+
import 'react';
|
|
5
|
+
import '@mantine/core';
|
|
6
|
+
import '@doneisbetter/gds-core';
|