@drawbridge/components 0.0.78 → 0.1.1

package/dist/dashboard/card-connection.js

@@ -0,0 +1,214 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var card_connection_exports = {};
+__export(card_connection_exports, {
+  CardConnectionHeader: () => CardConnectionHeader,
+  default: () => card_connection_default
+});
+module.exports = __toCommonJS(card_connection_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_image = __toESM(require("next/image"));
+var import_link = __toESM(require("./link"));
+var import_button = __toESM(require("../shared/button"));
+var import_badge = __toESM(require("../shared/badge"));
+var import_arrow_right = __toESM(require("../icons/arrow-right"));
+var import_error = __toESM(require("../shared/error"));
+var import_drawbridge_utils = require("@drawbridge/drawbridge-utils");
+const badge = (status) => ({
+  label: status ? (0, import_drawbridge_utils.capitalize)(status) : "Not connected",
+  type: status === "active" ? "success" : status === "error" ? "error" : "secondary"
+});
+const CardConnectionHeader = ({
+  group,
+  image,
+  slug,
+  status,
+  title
+}) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "div",
+  {
+    ...{
+      className: "w-full flex items-center justify-between space-x-3"
+    },
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "div",
+        {
+          ...{
+            className: "w-full flex items-center space-x-3"
+          },
+          children: [
+            image && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_image.default,
+              {
+                ...{
+                  alt: "Connection " + slug,
+                  className: "rounded overflow-hidden border border-gray",
+                  height: 50,
+                  src: image,
+                  unoptimized: true,
+                  width: 50
+                }
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+              "div",
+              {
+                ...{
+                  className: "flex flex-col justify-center space-y-1"
+                },
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    "h3",
+                    {
+                      ...{
+                        className: "leading-none"
+                      },
+                      children: title
+                    }
+                  ),
+                  group && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    "p",
+                    {
+                      ...{
+                        className: "disabled text-sm"
+                      },
+                      children: (0, import_drawbridge_utils.capitalize)(group)
+                    }
+                  )
+                ]
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_badge.default,
+        {
+          ...{
+            className: "shrink-0",
+            type: badge(status).type
+          },
+          children: badge(status).label
+        }
+      )
+    ]
+  }
+);
+const CardConnection = ({
+  // Everything a merchant reads arrives under one key. `errors` beside it is
+  // the connection DOCUMENT's own array of scope-drift entries, which is a
+  // different thing from content.errors — the manifest's failure copy.
+  content,
+  errors,
+  group,
+  href,
+  image,
+  slug,
+  status,
+  title
+}) => {
+  const errored = status === "error" || (errors == null ? void 0 : errors.length) > 0;
+  return (
+    // The card is the link's content: a link Button lays out as it, with no box of its own.
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_button.default,
+      {
+        ...{
+          "data-guide": "section-" + slug,
+          element: import_link.default,
+          href,
+          variant: "link"
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "div",
+          {
+            ...{
+              className: "flex flex-col justify-between space-y-6 w-full h-full text-left bg-white p-6 rounded border border-gray overflow-hidden"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+                "div",
+                {
+                  ...{
+                    className: "space-y-6"
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      CardConnectionHeader,
+                      {
+                        ...{
+                          group,
+                          image,
+                          slug,
+                          status,
+                          title
+                        }
+                      }
+                    ),
+                    (content == null ? void 0 : content.excerpt) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: content.excerpt }),
+                    errored && (errors == null ? void 0 : errors.length) > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_error.default,
+                      {
+                        ...{
+                          error: errors[0].message,
+                          label: title
+                        }
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "div",
+                {
+                  ...{
+                    className: "flex items-center justify-end"
+                  },
+                  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    import_arrow_right.default,
+                    {
+                      ...{
+                        className: "w-5 h-5"
+                      }
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        )
+      }
+    )
+  );
+};
+var card_connection_default = CardConnection;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CardConnectionHeader
+});

package/dist/dashboard/card-connection.mjs

@@ -0,0 +1,181 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import Image from "next/image";
+import Link from "./link.mjs";
+import Button from "../shared/button.mjs";
+import Badge from "../shared/badge.mjs";
+import ArrowRight from "../icons/arrow-right.mjs";
+import Error from "../shared/error.mjs";
+import { capitalize } from "@drawbridge/drawbridge-utils";
+const badge = (status) => ({
+  label: status ? capitalize(status) : "Not connected",
+  type: status === "active" ? "success" : status === "error" ? "error" : "secondary"
+});
+const CardConnectionHeader = ({
+  group,
+  image,
+  slug,
+  status,
+  title
+}) => /* @__PURE__ */ jsxs(
+  "div",
+  {
+    ...{
+      className: "w-full flex items-center justify-between space-x-3"
+    },
+    children: [
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ...{
+            className: "w-full flex items-center space-x-3"
+          },
+          children: [
+            image && /* @__PURE__ */ jsx(
+              Image,
+              {
+                ...{
+                  alt: "Connection " + slug,
+                  className: "rounded overflow-hidden border border-gray",
+                  height: 50,
+                  src: image,
+                  unoptimized: true,
+                  width: 50
+                }
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                ...{
+                  className: "flex flex-col justify-center space-y-1"
+                },
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "h3",
+                    {
+                      ...{
+                        className: "leading-none"
+                      },
+                      children: title
+                    }
+                  ),
+                  group && /* @__PURE__ */ jsx(
+                    "p",
+                    {
+                      ...{
+                        className: "disabled text-sm"
+                      },
+                      children: capitalize(group)
+                    }
+                  )
+                ]
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Badge,
+        {
+          ...{
+            className: "shrink-0",
+            type: badge(status).type
+          },
+          children: badge(status).label
+        }
+      )
+    ]
+  }
+);
+const CardConnection = ({
+  // Everything a merchant reads arrives under one key. `errors` beside it is
+  // the connection DOCUMENT's own array of scope-drift entries, which is a
+  // different thing from content.errors — the manifest's failure copy.
+  content,
+  errors,
+  group,
+  href,
+  image,
+  slug,
+  status,
+  title
+}) => {
+  const errored = status === "error" || (errors == null ? void 0 : errors.length) > 0;
+  return (
+    // The card is the link's content: a link Button lays out as it, with no box of its own.
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        ...{
+          "data-guide": "section-" + slug,
+          element: Link,
+          href,
+          variant: "link"
+        },
+        children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            ...{
+              className: "flex flex-col justify-between space-y-6 w-full h-full text-left bg-white p-6 rounded border border-gray overflow-hidden"
+            },
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  ...{
+                    className: "space-y-6"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      CardConnectionHeader,
+                      {
+                        ...{
+                          group,
+                          image,
+                          slug,
+                          status,
+                          title
+                        }
+                      }
+                    ),
+                    (content == null ? void 0 : content.excerpt) && /* @__PURE__ */ jsx("p", { children: content.excerpt }),
+                    errored && (errors == null ? void 0 : errors.length) > 0 && /* @__PURE__ */ jsx(
+                      Error,
+                      {
+                        ...{
+                          error: errors[0].message,
+                          label: title
+                        }
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  ...{
+                    className: "flex items-center justify-end"
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    ArrowRight,
+                    {
+                      ...{
+                        className: "w-5 h-5"
+                      }
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        )
+      }
+    )
+  );
+};
+var card_connection_default = CardConnection;
+export {
+  CardConnectionHeader,
+  card_connection_default as default
+};

package/dist/dashboard/card-data-item.js

@@ -0,0 +1,76 @@
+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);
+var card_data_item_exports = {};
+__export(card_data_item_exports, {
+  default: () => card_data_item_default
+});
+module.exports = __toCommonJS(card_data_item_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_drawbridge_utils = require("@drawbridge/drawbridge-utils");
+const CardDataItem = ({
+  className,
+  classNameSlotLeft = "w-full",
+  classNameSlotRight = "w-full",
+  element: Element = "span",
+  label,
+  value,
+  ...rest
+}) => {
+  const classes = {
+    container: [
+      "flex w-full grow-0",
+      className
+    ],
+    slotLeft: [
+      classNameSlotLeft
+    ],
+    slotRight: [
+      classNameSlotRight
+    ]
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    Element,
+    {
+      ...{
+        className: classes.container.join(" "),
+        ...rest
+      },
+      children: [
+        label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            ...{
+              className: classes.slotLeft.join(" ")
+            },
+            children: (0, import_drawbridge_utils.capitalize)(label)
+          }
+        ),
+        (value || value === 0) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "span",
+          {
+            ...{
+              className: classes.slotRight.join(" ")
+            },
+            children: value
+          }
+        )
+      ]
+    }
+  );
+};
+var card_data_item_default = CardDataItem;

package/dist/dashboard/card-data-item.mjs

@@ -0,0 +1,57 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { capitalize } from "@drawbridge/drawbridge-utils";
+const CardDataItem = ({
+  className,
+  classNameSlotLeft = "w-full",
+  classNameSlotRight = "w-full",
+  element: Element = "span",
+  label,
+  value,
+  ...rest
+}) => {
+  const classes = {
+    container: [
+      "flex w-full grow-0",
+      className
+    ],
+    slotLeft: [
+      classNameSlotLeft
+    ],
+    slotRight: [
+      classNameSlotRight
+    ]
+  };
+  return /* @__PURE__ */ jsxs(
+    Element,
+    {
+      ...{
+        className: classes.container.join(" "),
+        ...rest
+      },
+      children: [
+        label && /* @__PURE__ */ jsx(
+          "span",
+          {
+            ...{
+              className: classes.slotLeft.join(" ")
+            },
+            children: capitalize(label)
+          }
+        ),
+        (value || value === 0) && /* @__PURE__ */ jsx(
+          "span",
+          {
+            ...{
+              className: classes.slotRight.join(" ")
+            },
+            children: value
+          }
+        )
+      ]
+    }
+  );
+};
+var card_data_item_default = CardDataItem;
+export {
+  card_data_item_default as default
+};