@doneisbetter/gds-admin 2.6.1

package/dist/server.js

@@ -0,0 +1,272 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/server.ts
+var server_exports = {};
+__export(server_exports, {
+  ContentOpsActionBar: () => ContentOpsActionBar,
+  ContentOpsEditor: () => ContentOpsEditor,
+  ContentOpsSection: () => ContentOpsSection,
+  FormSection: () => FormSection,
+  InfoCard: () => InfoCard,
+  PageHeader: () => PageHeader,
+  StatsStrip: () => StatsStrip,
+  WorkspaceHeader: () => WorkspaceHeader
+});
+module.exports = __toCommonJS(server_exports);
+
+// src/FormSection.tsx
+var import_core = require("@mantine/core");
+var import_jsx_runtime = require("react/jsx-runtime");
+function FormSection({ title, description, children, withDivider = true }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Box, { mb: "xl", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_core.Box, { mb: "md", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Title, { order: 4, children: title }),
+      description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Text, { c: "dimmed", size: "sm", children: description })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Stack, { gap: "md", children }),
+    withDivider && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Divider, { my: "xl" })
+  ] });
+}
+
+// src/StatsStrip.tsx
+var import_core2 = require("@mantine/core");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function StatsStrip({ stats }) {
+  const items = stats.map((stat, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Paper, { p: "lg", withBorder: true, radius: "md", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_core2.Group, { justify: "space-between", align: "flex-end", gap: "xs", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_core2.Box, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Text, { c: "dimmed", tt: "uppercase", fw: 700, size: "xs", children: stat.label }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Text, { fw: 700, size: "xl", mt: "sm", children: stat.value })
+    ] }),
+    stat.diff !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_core2.Text, { c: stat.diff > 0 ? "teal" : "red", size: "sm", fw: 600, children: [
+      stat.diff > 0 ? "+" : "",
+      stat.diff,
+      "%"
+    ] })
+  ] }) }, index));
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.SimpleGrid, { cols: { base: 1, sm: 2, md: 3 }, spacing: "md", children: items });
+}
+
+// src/InfoCard.tsx
+var import_core3 = require("@mantine/core");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function InfoCard({ title, value, description, icon, color = "blue" }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Card, { p: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core3.Group, { justify: "space-between", align: "flex-start", wrap: "nowrap", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core3.Box, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Text, { tt: "uppercase", fw: 700, c: "dimmed", size: "xs", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Text, { fw: 700, size: "xl", mt: "sm", children: value }),
+      description && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.Text, { c: "dimmed", size: "sm", mt: "xs", children: description })
+    ] }),
+    icon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.ThemeIcon, { size: "xl", radius: "md", variant: "light", color, children: icon })
+  ] }) });
+}
+
+// src/PageHeader.tsx
+var import_core4 = require("@mantine/core");
+var import_gds_core = require("@doneisbetter/gds-core");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function PageHeader({
+  title,
+  description,
+  subtitle,
+  eyebrow,
+  breadcrumbs,
+  status,
+  primaryAction,
+  secondaryActions,
+  overflowActions = []
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Stack, { gap: "sm", mb: "xl", children: [
+    breadcrumbs?.length ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Breadcrumbs, { children: breadcrumbs }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Box, { style: { minWidth: 0, flex: 1 }, children: [
+        eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Text, { c: "dimmed", size: "sm", fw: 700, mb: 4, children: eyebrow }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Title, { order: 1, children: title }),
+        subtitle ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Text, { c: "dimmed", mt: "xs", size: "sm", children: subtitle }) : null,
+        description && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Text, { c: "dimmed", mt: "xs", size: "lg", children: description }),
+        status ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Group, { mt: "sm", gap: "sm", children: status }) : null
+      ] }),
+      (secondaryActions || primaryAction || overflowActions.length) && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Group, { wrap: "wrap", justify: "flex-end", children: [
+        secondaryActions,
+        primaryAction,
+        overflowActions.length ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core4.Menu, { shadow: "md", width: 220, withinPortal: true, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Menu.Target, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.ActionIcon, { variant: "default", size: "lg", "aria-label": "More actions", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_gds_core.GdsIcons.Menu, { size: "1rem" }) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Menu.Dropdown, { children: overflowActions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            import_core4.Menu.Item,
+            {
+              component: action.href ? "a" : "button",
+              href: action.href,
+              onClick: action.onClick,
+              color: action.color,
+              disabled: action.disabled,
+              children: action.label
+            },
+            `${String(action.label)}-${index}`
+          )) })
+        ] }) : null
+      ] })
+    ] })
+  ] });
+}
+
+// src/WorkspaceHeader.tsx
+var import_core5 = require("@mantine/core");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function WorkspaceHeader({
+  breadcrumbs,
+  eyebrow,
+  title,
+  description,
+  primaryAction,
+  secondaryActions
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Stack, { gap: "sm", mb: "xl", children: [
+    breadcrumbs?.length ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Breadcrumbs, { children: breadcrumbs }) : null,
+    eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Text, { size: "sm", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Group, { justify: "space-between", align: "flex-start", gap: "md", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Stack, { gap: 6, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Title, { order: 1, children: title }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.Text, { c: "dimmed", maw: 640, children: description }) : null
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_core5.Group, { gap: "sm", children: [
+        secondaryActions,
+        primaryAction
+      ] })
+    ] })
+  ] });
+}
+
+// src/ContentOpsSection.tsx
+var import_gds_core2 = require("@doneisbetter/gds-core");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function ContentOpsSection({
+  id,
+  title,
+  description,
+  action,
+  children,
+  tone = "default"
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_gds_core2.SectionPanel, { id, title, description, action, tone, children });
+}
+
+// src/ContentOpsActionBar.tsx
+var import_core6 = require("@mantine/core");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function ContentOpsActionBar({
+  dirty = false,
+  saving = false,
+  status,
+  primaryAction,
+  secondaryAction,
+  tertiaryAction
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core6.Paper, { withBorder: true, radius: "xl", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core6.Group, { justify: "space-between", align: "center", gap: "md", wrap: "wrap", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core6.Group, { gap: "sm", wrap: "wrap", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core6.Badge, { color: saving ? "violet" : dirty ? "yellow" : "teal", variant: "light", children: saving ? "Saving" : dirty ? "Unsaved changes" : "Saved" }),
+      status ? typeof status === "string" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core6.Text, { size: "sm", c: "dimmed", children: status }) : status : null
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core6.Group, { gap: "sm", wrap: "wrap", children: [
+      tertiaryAction,
+      secondaryAction,
+      primaryAction
+    ] })
+  ] }) });
+}
+
+// src/ContentOpsEditor.tsx
+var import_core8 = require("@mantine/core");
+
+// src/EditorScaffold.tsx
+var import_core7 = require("@mantine/core");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function EditorScaffold({
+  header,
+  context,
+  form,
+  preview,
+  settings,
+  footer,
+  stickyFooter = false
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core7.Stack, { gap: "lg", children: [
+    header,
+    context,
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core7.Grid, { gutter: "lg", align: "start", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core7.Grid.Col, { span: { base: 12, md: preview ? 7 : 8 }, children: form }),
+      preview || settings ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core7.Grid.Col, { span: { base: 12, md: preview ? 5 : 4 }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core7.Stack, { gap: "lg", children: [
+        preview,
+        settings
+      ] }) }) : null
+    ] }),
+    footer ? stickyFooter ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      import_core7.Paper,
+      {
+        withBorder: true,
+        radius: "xl",
+        p: "md",
+        style: {
+          position: "sticky",
+          bottom: "1rem",
+          zIndex: 10
+        },
+        children: footer
+      }
+    ) : footer : null
+  ] });
+}
+
+// src/ContentOpsEditor.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function ContentOpsEditor({
+  header,
+  context,
+  status,
+  sections,
+  actionBar,
+  preview,
+  settings
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Stack, { gap: "lg", children: [
+    header,
+    status,
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      EditorScaffold,
+      {
+        context,
+        form: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Stack, { gap: "lg", children: sections }),
+        preview,
+        settings,
+        footer: actionBar,
+        stickyFooter: true
+      }
+    )
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ContentOpsActionBar,
+  ContentOpsEditor,
+  ContentOpsSection,
+  FormSection,
+  InfoCard,
+  PageHeader,
+  StatsStrip,
+  WorkspaceHeader
+});

package/dist/server.mjs

@@ -0,0 +1,20 @@
+import {
+  ContentOpsActionBar,
+  ContentOpsEditor,
+  ContentOpsSection,
+  FormSection,
+  InfoCard,
+  PageHeader,
+  StatsStrip,
+  WorkspaceHeader
+} from "./chunk-ZUUEDN7I.mjs";
+export {
+  ContentOpsActionBar,
+  ContentOpsEditor,
+  ContentOpsSection,
+  FormSection,
+  InfoCard,
+  PageHeader,
+  StatsStrip,
+  WorkspaceHeader
+};

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@doneisbetter/gds-admin",
+  "version": "2.6.1",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/sovereignsquad/general-design-system.git",
+    "directory": "packages/gds-admin"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./client": {
+      "types": "./dist/client.d.ts",
+      "import": "./dist/client.mjs",
+      "require": "./dist/client.js"
+    },
+    "./server": {
+      "types": "./dist/server.d.ts",
+      "import": "./dist/server.mjs",
+      "require": "./dist/server.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch"
+  },
+  "peerDependencies": {
+    "@doneisbetter/gds-core": "^2.6.1",
+    "@doneisbetter/gds-theme": "^2.6.1",
+    "@mantine/core": "^7.9.0 || ^8.3.0",
+    "@mantine/hooks": "^7.9.0 || ^8.3.0",
+    "@tabler/icons-react": "^3.5.0",
+    "react": "^18.2.0 || ^19.0.0",
+    "react-dom": "^18.2.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@doneisbetter/gds-core": "*",
+    "@doneisbetter/gds-theme": "*",
+    "@mantine/core": "^7.9.0",
+    "@mantine/hooks": "^7.9.0",
+    "@tabler/icons-react": "^3.5.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  }
+}