@drawbridge/components 0.0.78 → 0.1.0

package/dist/shared/lib/helpers.mjs

@@ -0,0 +1,341 @@
+import { allowedUploadTypes, maximumUploadBytes } from "@drawbridge/drawbridge-utils/upload";
+import { capitalize, formatNumber, megabyte } from "@drawbridge/drawbridge-utils";
+import Lock from "../../icons/lock";
+import Warning from "../../icons/warning";
+const advertisementPreview = (values, options) => {
+  var _a;
+  return {
+    ...values,
+    button: ((_a = (options || []).find((option) => option.value === (values == null ? void 0 : values.action))) == null ? void 0 : _a.key) ?? null
+  };
+};
+const bust = (href, version) => href ? href + (href.includes("?") ? "&" : "?") + "query=" + encodeURIComponent(version) : null;
+const clickSummary = (click) => {
+  const parts = Object.entries(click || {}).map(([key, value]) => key + ": " + value);
+  return parts.length ? parts.join(" \xB7 ") : "None";
+};
+const fileSizeLimits = {
+  application: 2,
+  image: 5,
+  // Video goes through the presigned multipart route, which streams
+  // browser-to-bucket rather than through the api — so this is a product
+  // ceiling, not the api-protection one that keeps the single-request route
+  // at 50MB. It must stay in step with maximumUploadBytes in
+  // @drawbridge/drawbridge-utils/upload, which is what the api enforces:
+  // the client rejects before transferring, the api rejects authoritatively,
+  // and if they drift the client blocks files the api would accept.
+  video: maximumUploadBytes / megabyte
+};
+const fileSizeLabel = (type, limits) => {
+  const limit = (limits || fileSizeLimits)[type];
+  return limit >= 1024 ? formatNumber(limit / 1024) + "GB" : limit + "MB";
+};
+const fileSizes = (type = "media", limits) => {
+  const application = fileSizeLabel("application", limits) + " / pdf";
+  const image = fileSizeLabel("image", limits) + " / image";
+  const video = fileSizeLabel("video", limits) + " / video";
+  const object = {
+    all: [
+      image,
+      video,
+      application
+    ],
+    media: [
+      image,
+      video
+    ],
+    image: [
+      image
+    ],
+    video: [
+      video
+    ]
+  };
+  return object[type];
+};
+const fileGroups = (pick) => (type = "media") => {
+  const application = pick(allowedUploadTypes.application);
+  const image = pick(allowedUploadTypes.image);
+  const video = pick(allowedUploadTypes.video);
+  const object = {
+    all: [
+      ...image,
+      ...video,
+      ...application
+    ],
+    media: [
+      ...image,
+      ...video
+    ],
+    image,
+    video
+  };
+  return [...new Set(object[type])];
+};
+const fileTypes = fileGroups(Object.keys);
+const fileMimes = fileGroups(Object.values);
+const fileParts = (file) => {
+  var _a, _b, _c, _d;
+  const [type, subtype] = ((file == null ? void 0 : file.type) || "").split("/");
+  const extension = ((_b = (_a = allowedUploadTypes) == null ? void 0 : _a[type]) == null ? void 0 : _b[subtype]) ? subtype : (((_d = (_c = file == null ? void 0 : file.name) == null ? void 0 : _c.split(".")) == null ? void 0 : _d.pop()) || "").toLowerCase();
+  return {
+    extension,
+    type
+  };
+};
+const formatDateTime = (value) => {
+  if (value) {
+    const date = new Date(value);
+    const year = date.getFullYear();
+    const month = (date.getMonth() + 1).toString().padStart(2, "0");
+    const day = date.getDate().toString().padStart(2, "0");
+    const hours = date.getHours().toString().padStart(2, "0");
+    const minutes = date.getMinutes().toString().padStart(2, "0");
+    const seconds = date.getSeconds().toString().padStart(2, "0");
+    return year + "-" + month + "-" + day + "T" + hours + ":" + minutes + ":" + seconds;
+  }
+  return "";
+};
+const formatLast4 = (value) => value || value === 0 ? String(value).padStart(4, "0") : "";
+const withArticle = (word) => (/^[aeio]/i.test(String(word)) ? "an " : "a ") + word;
+const formatUserName = (user) => {
+  const array = [user == null ? void 0 : user.firstName, user == null ? void 0 : user.lastName].filter(Boolean);
+  if (array.length > 0) {
+    return array.join(" ");
+  }
+  ;
+  return user == null ? void 0 : user.email;
+};
+const grid = (count) => {
+  const grids = {
+    1: "grid grid-cols-1",
+    2: "grid grid-cols-1 gap-6 xl:grid-cols-2",
+    3: "grid grid-cols-1 gap-6 xl:grid-cols-3"
+  };
+  if (count > 3) {
+    return grids["3"];
+  } else {
+    return grids[count];
+  }
+};
+const hasCapability = (organization, key, level = "manage") => {
+  return key.split(".").reduce((value, part) => value == null ? void 0 : value[part], organization == null ? void 0 : organization.capabilities) === level;
+};
+const hasConnection = (organization, slug) => {
+  return Boolean(
+    ((organization == null ? void 0 : organization.connectionItems) || []).find((connection) => connection.slug === slug && connection.status === "active")
+  );
+};
+const connectionInGroup = (organization, group) => ((organization == null ? void 0 : organization.connectionItems) || []).find((connection) => connection.group === group && connection.status === "active") || null;
+const hasConnectionGroup = (organization, group) => Boolean(connectionInGroup(organization, group));
+const hasRestriction = (object, key) => {
+  return Boolean(((object == null ? void 0 : object.restricted) || []).includes(key));
+};
+const productAsset = (product) => {
+  if (!(product == null ? void 0 : product.image)) return null;
+  return {
+    mimetype: "image",
+    sizes: {
+      "100x100": product.image
+    },
+    updatedAt: product == null ? void 0 : product.updatedAt
+  };
+};
+const isAdmin = (permissions) => {
+  return (permissions || []).some((p) => p === "admin" || p.startsWith("admin."));
+};
+const months = [
+  {
+    key: "January",
+    value: "01"
+  },
+  {
+    key: "February",
+    value: "02"
+  },
+  {
+    key: "March",
+    value: "03"
+  },
+  {
+    key: "April",
+    value: "04"
+  },
+  {
+    key: "May",
+    value: "05"
+  },
+  {
+    key: "June",
+    value: "06"
+  },
+  {
+    key: "July",
+    value: "07"
+  },
+  {
+    key: "August",
+    value: "08"
+  },
+  {
+    key: "September",
+    value: "09"
+  },
+  {
+    key: "October",
+    value: "10"
+  },
+  {
+    key: "November",
+    value: "11"
+  },
+  {
+    key: "December",
+    value: "12"
+  }
+];
+const organizationAlerts = ({ capped, totals } = {}) => {
+  const parts = [
+    [Number((totals == null ? void 0 : totals.connectionAlerts) || 0), "connection"],
+    [Number((totals == null ? void 0 : totals.workflowAlerts) || 0), "workflow"]
+  ].filter(([count]) => count > 0);
+  const labels = parts.map(([count, noun]) => count + " " + noun + (count === 1 ? "" : "s"));
+  const singular = parts.length === 1 && parts[0][0] === 1;
+  return [
+    ...capped ? [{ message: "Entry limit reached" }] : [],
+    ...parts.length ? [{ message: labels.join(" and ") + (singular ? " needs" : " need") + " attention" }] : []
+  ];
+};
+const ratio = (part, whole) => part.toLocaleString("en-US") + " / " + whole.toLocaleString("en-US") + " \xB7 " + Math.floor(part * 100 / whole) + "%";
+const usageBadge = (allowance) => {
+  if (!allowance) return null;
+  const { actions, included, percent } = allowance;
+  return {
+    text: ratio(actions, included),
+    type: percent >= 1 ? "error" : percent >= 0.8 ? "warning" : "secondary"
+  };
+};
+const acceptingBadge = (accepting) => {
+  if (!(accepting == null ? void 0 : accepting.published)) return null;
+  const { published: published2, valid } = accepting;
+  return {
+    text: ratio(valid, published2),
+    type: valid >= published2 ? "success" : valid > 0 ? "warning" : "error"
+  };
+};
+const published = {
+  drafted: { text: "Drafted", type: "primary" },
+  published: { text: "Published", type: "success" }
+};
+const running = {
+  active: { text: "Active", type: "success" },
+  error: { text: "Error", type: "error" }
+};
+const organizationStatuses = ["active", "canceled", "incomplete", "incomplete_expired", "locked", "past_due", "paused", "suspended", "trialing", "unpaid", "unsubscribed"];
+const statuses = {
+  advertisement: published,
+  campaign: published,
+  connection: running,
+  draw: {
+    disqualified: { text: "Disqualified", type: "error" },
+    verified: { text: "Verified", type: "success" }
+  },
+  invoice: {
+    paid: { text: "Paid", type: "success" },
+    void: { text: "Void", type: "error" }
+  },
+  // A lead's status is derived per campaign from the denial records: approved or
+  // denied. Approved is every lead's normal state, so only Denied shows, as on
+  // the lead's own screen.
+  lead: {
+    denied: { text: "Denied", type: "error" }
+  },
+  // pending is a member who has been invited and not yet accepted.
+  member: {
+    pending: { text: "Invited", type: "primary" }
+  },
+  organization: Object.fromEntries(organizationStatuses.map((status) => [status, { text: capitalize(status.replace("_", " ")), type: ["active", "unsubscribed"].includes(status) ? "success" : "error" }])),
+  page: published,
+  prize: published,
+  range: {
+    active: { text: "Active", type: "success" }
+  },
+  subscription: {
+    active: { text: "Active", type: "success" },
+    canceled: { text: "Canceled", type: "error" },
+    suspended: { text: "Suspended", type: "error" }
+  },
+  workflow: running
+};
+const statusBadge = (kind, status) => {
+  var _a;
+  return ((_a = statuses[kind]) == null ? void 0 : _a[status]) || null;
+};
+const alertFor = (record) => {
+  var _a;
+  const error = (record == null ? void 0 : record.error) || ((_a = [
+    ...(record == null ? void 0 : record.errors) || [],
+    ...organizationAlerts(record || {})
+  ][0]) == null ? void 0 : _a.message);
+  const messages = {
+    canceled: "Canceled",
+    incomplete: "Outstanding invoices to be paid",
+    suspended: "Suspended"
+  };
+  if (messages[record == null ? void 0 : record.status]) return { icon: Warning, message: messages[record.status] };
+  if ((record == null ? void 0 : record.status) === "locked") return { icon: Lock, message: ["Locked", error == null ? void 0 : error.toLowerCase()].filter(Boolean).join(", ") };
+  return error ? { icon: Warning, message: error } : null;
+};
+const stripeUrl = (label, id, ...more) => {
+  const parts = [
+    "https://dashboard.stripe.com" + (process.env.NEXT_PUBLIC_STRIPE_API_KEY.includes("_test_") ? "/test" : ""),
+    label + "s",
+    id,
+    ...more
+  ];
+  return parts.filter(Boolean).join("/");
+};
+const years = ({
+  current,
+  length = 4
+}) => {
+  return Array.from(
+    {
+      length
+    },
+    (_, i) => ({
+      key: Number(current) - i,
+      value: Number(current) - i
+    })
+  );
+};
+export {
+  acceptingBadge,
+  advertisementPreview,
+  alertFor,
+  bust,
+  clickSummary,
+  connectionInGroup,
+  fileMimes,
+  fileParts,
+  fileSizeLimits,
+  fileSizes,
+  fileTypes,
+  formatDateTime,
+  formatLast4,
+  formatUserName,
+  grid,
+  hasCapability,
+  hasConnection,
+  hasConnectionGroup,
+  hasRestriction,
+  isAdmin,
+  months,
+  organizationAlerts,
+  productAsset,
+  statusBadge,
+  stripeUrl,
+  usageBadge,
+  withArticle,
+  years
+};

package/dist/shared/lib/icon-labels.js

@@ -0,0 +1,53 @@
+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 icon_labels_exports = {};
+__export(icon_labels_exports, {
+  iconLabel: () => iconLabel
+});
+module.exports = __toCommonJS(icon_labels_exports);
+var import_copy = __toESM(require("../../icons/copy"));
+var import_download = __toESM(require("../../icons/download"));
+var import_filter = __toESM(require("../../icons/filter"));
+var import_lock = __toESM(require("../../icons/lock"));
+var import_pencil = __toESM(require("../../icons/pencil"));
+var import_plus = __toESM(require("../../icons/plus"));
+var import_trash = __toESM(require("../../icons/trash"));
+const labels = /* @__PURE__ */ new Map([
+  [import_copy.default, "Copy"],
+  [import_download.default, "Download"],
+  [import_filter.default, "Filters"],
+  [import_lock.default, "Locked"],
+  [import_pencil.default, "Edit"],
+  [import_plus.default, "New"],
+  [import_trash.default, "Delete"]
+]);
+const iconLabel = (Icon) => labels.get(Icon);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  iconLabel
+});

package/dist/shared/lib/icon-labels.mjs

@@ -0,0 +1,20 @@
+import Copy from "../../icons/copy";
+import Download from "../../icons/download";
+import Filter from "../../icons/filter";
+import Lock from "../../icons/lock";
+import Pencil from "../../icons/pencil";
+import Plus from "../../icons/plus";
+import Trash from "../../icons/trash";
+const labels = /* @__PURE__ */ new Map([
+  [Copy, "Copy"],
+  [Download, "Download"],
+  [Filter, "Filters"],
+  [Lock, "Locked"],
+  [Pencil, "Edit"],
+  [Plus, "New"],
+  [Trash, "Delete"]
+]);
+const iconLabel = (Icon) => labels.get(Icon);
+export {
+  iconLabel
+};

package/dist/shared/lib/yup.js

@@ -0,0 +1,83 @@
+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 yup_exports = {};
+__export(yup_exports, {
+  default: () => yup_default,
+  resolver: () => resolver
+});
+module.exports = __toCommonJS(yup_exports);
+var import_yup = require("@hookform/resolvers/yup");
+var import_helpers = require("./helpers");
+var yup = __toESM(require("@drawbridge/drawbridge-utils/yup"));
+const resolver = import_yup.yupResolver;
+yup.addMethod(yup.mixed, "file", function(limits) {
+  return this.test({
+    name: "file-validate",
+    test: async function(value) {
+      var _a, _b;
+      const { createError, path } = this;
+      const mb = Number((value == null ? void 0 : value.size) / (1024 * 1024)).toFixed(2);
+      const type = (_b = (_a = value == null ? void 0 : value.type) == null ? void 0 : _a.split("/")) == null ? void 0 : _b[0];
+      const size = (limits || import_helpers.fileSizeLimits)[type];
+      if (mb > size) {
+        return createError({
+          message: "File size is larger than " + size + "MB",
+          path
+        });
+      }
+      return true;
+    }
+  });
+});
+yup.addMethod(yup.array, "unique", function(key) {
+  return this.test({
+    name: "unique",
+    test: async function(value) {
+      const { createError, path } = this;
+      if (!value || value.length === 0) {
+        return true;
+      }
+      ;
+      const items = value.map((item) => item == null ? void 0 : item[key]);
+      const unique = new Set(items);
+      if (unique.size !== items.length) {
+        return createError({
+          message: ({ label }) => label + " cannot have duplicates",
+          path
+        });
+      }
+      ;
+      return true;
+    }
+  });
+});
+var yup_default = yup;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  resolver
+});

package/dist/shared/lib/yup.mjs

@@ -0,0 +1,50 @@
+import { yupResolver } from "@hookform/resolvers/yup";
+import { fileSizeLimits } from "./helpers";
+import * as yup from "@drawbridge/drawbridge-utils/yup";
+const resolver = yupResolver;
+yup.addMethod(yup.mixed, "file", function(limits) {
+  return this.test({
+    name: "file-validate",
+    test: async function(value) {
+      var _a, _b;
+      const { createError, path } = this;
+      const mb = Number((value == null ? void 0 : value.size) / (1024 * 1024)).toFixed(2);
+      const type = (_b = (_a = value == null ? void 0 : value.type) == null ? void 0 : _a.split("/")) == null ? void 0 : _b[0];
+      const size = (limits || fileSizeLimits)[type];
+      if (mb > size) {
+        return createError({
+          message: "File size is larger than " + size + "MB",
+          path
+        });
+      }
+      return true;
+    }
+  });
+});
+yup.addMethod(yup.array, "unique", function(key) {
+  return this.test({
+    name: "unique",
+    test: async function(value) {
+      const { createError, path } = this;
+      if (!value || value.length === 0) {
+        return true;
+      }
+      ;
+      const items = value.map((item) => item == null ? void 0 : item[key]);
+      const unique = new Set(items);
+      if (unique.size !== items.length) {
+        return createError({
+          message: ({ label }) => label + " cannot have duplicates",
+          path
+        });
+      }
+      ;
+      return true;
+    }
+  });
+});
+var yup_default = yup;
+export {
+  yup_default as default,
+  resolver
+};

package/dist/shared/loader.js

@@ -0,0 +1,124 @@
+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 loader_exports = {};
+__export(loader_exports, {
+  LoaderDynamic: () => LoaderDynamic,
+  LogoLoader: () => LogoLoader,
+  default: () => loader_default
+});
+module.exports = __toCommonJS(loader_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_logo_mark = __toESM(require("../icons/logo-mark"));
+var import_loader = __toESM(require("../icons/loader"));
+const LogoLoader = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  "div",
+  {
+    ...{
+      className: "flex items-center justify-center w-full h-dvh bg-gray-light"
+    },
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_logo_mark.default,
+      {
+        ...{
+          className: "w-12 h-12 text-black animate-bounce"
+        }
+      }
+    )
+  }
+);
+const LoaderComponent = ({
+  children,
+  className
+}) => {
+  const classes = [
+    "z-10 absolute top-0 left-0 w-full h-full flex items-center justify-center"
+  ];
+  if (className) {
+    classes.push(className);
+  }
+  ;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      ...{
+        className: classes.join(" ")
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "div",
+        {
+          ...{
+            className: "w-full text-center space-y-6"
+          },
+          children: [
+            children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "div",
+              {
+                ...{
+                  className: "space-y-6"
+                },
+                children
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_loader.default,
+              {
+                ...{
+                  className: "w-6 h-6 m-auto"
+                }
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+};
+const LoaderDynamic = () => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      ...{
+        className: "flex items-center justify-center w-full h-full p-6"
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_loader.default,
+        {
+          ...{
+            className: "w-6 h-6 m-auto"
+          }
+        }
+      )
+    }
+  );
+};
+var loader_default = LoaderComponent;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  LoaderDynamic,
+  LogoLoader
+});