@drawbridge/components 0.0.77 → 0.1.0

package/dist/bridge/product-tile.js

@@ -0,0 +1,122 @@
+"use client";
+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 product_tile_exports = {};
+__export(product_tile_exports, {
+  default: () => product_tile_default
+});
+module.exports = __toCommonJS(product_tile_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_image = __toESM(require("next/image"));
+var import_drawbridge_utils = require("@drawbridge/drawbridge-utils");
+var import_button = __toESM(require("../shared/button"));
+var import_styles = require("../styles");
+const CardProduct = ({
+  title,
+  onClick,
+  stacked,
+  style,
+  variants,
+  ...rest
+}) => {
+  var _a, _b, _c, _d;
+  const available = (variants || []).filter((variant) => variant.availableForSale);
+  const price = ((_a = available[0]) == null ? void 0 : _a.price) || null;
+  const currency = ((_b = available[0]) == null ? void 0 : _b.currency) || null;
+  const image = ((_c = available[0]) == null ? void 0 : _c.image) || (rest == null ? void 0 : rest.image) || null;
+  const textSize = stacked ? "text-base" : "text-xs sm:text-sm";
+  const imageRadius = ((_d = style == null ? void 0 : style.image) == null ? void 0 : _d.radius) != null ? style.image.radius + "px" : "12px";
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_button.default,
+    {
+      ...{
+        onClick,
+        variant: "link"
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "span",
+        {
+          ...{
+            className: "block w-full text-left space-y-2"
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "div",
+              {
+                ...{
+                  className: "relative aspect-square overflow-hidden bg-gray-100 mb-5",
+                  style: {
+                    borderRadius: imageRadius
+                  }
+                },
+                children: image && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_image.default,
+                  {
+                    ...{
+                      alt: title + " image",
+                      className: "object-cover",
+                      fill: true,
+                      sizes: "50vw",
+                      src: image,
+                      unoptimized: true
+                    }
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "p",
+              {
+                ...{
+                  className: textSize + " font-bold text-center mb-1"
+                },
+                children: available.length > 0 && price ? (0, import_drawbridge_utils.formatCurrency)({
+                  code: currency,
+                  display: "parts",
+                  value: price
+                }) : "Unavailable"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "p",
+              {
+                ...{
+                  className: textSize + " font-normal leading-tight text-center line-clamp-2",
+                  // The brand heading face, as the product's own title in the shop modal.
+                  ...style && { style: (0, import_styles.headerStyle)(style) }
+                },
+                children: title
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+};
+var product_tile_default = CardProduct;

package/dist/bridge/product-tile.mjs

@@ -0,0 +1,93 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Image from "next/image";
+import { formatCurrency } from "@drawbridge/drawbridge-utils";
+import Button from "../shared/button";
+import { headerStyle } from "../styles";
+const CardProduct = ({
+  title,
+  onClick,
+  stacked,
+  style,
+  variants,
+  ...rest
+}) => {
+  var _a, _b, _c, _d;
+  const available = (variants || []).filter((variant) => variant.availableForSale);
+  const price = ((_a = available[0]) == null ? void 0 : _a.price) || null;
+  const currency = ((_b = available[0]) == null ? void 0 : _b.currency) || null;
+  const image = ((_c = available[0]) == null ? void 0 : _c.image) || (rest == null ? void 0 : rest.image) || null;
+  const textSize = stacked ? "text-base" : "text-xs sm:text-sm";
+  const imageRadius = ((_d = style == null ? void 0 : style.image) == null ? void 0 : _d.radius) != null ? style.image.radius + "px" : "12px";
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      ...{
+        onClick,
+        variant: "link"
+      },
+      children: /* @__PURE__ */ jsxs(
+        "span",
+        {
+          ...{
+            className: "block w-full text-left space-y-2"
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                ...{
+                  className: "relative aspect-square overflow-hidden bg-gray-100 mb-5",
+                  style: {
+                    borderRadius: imageRadius
+                  }
+                },
+                children: image && /* @__PURE__ */ jsx(
+                  Image,
+                  {
+                    ...{
+                      alt: title + " image",
+                      className: "object-cover",
+                      fill: true,
+                      sizes: "50vw",
+                      src: image,
+                      unoptimized: true
+                    }
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "p",
+              {
+                ...{
+                  className: textSize + " font-bold text-center mb-1"
+                },
+                children: available.length > 0 && price ? formatCurrency({
+                  code: currency,
+                  display: "parts",
+                  value: price
+                }) : "Unavailable"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "p",
+              {
+                ...{
+                  className: textSize + " font-normal leading-tight text-center line-clamp-2",
+                  // The brand heading face, as the product's own title in the shop modal.
+                  ...style && { style: headerStyle(style) }
+                },
+                children: title
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+};
+var product_tile_default = CardProduct;
+export {
+  product_tile_default as default
+};

package/dist/bridge/provider-analytics.js

@@ -0,0 +1,184 @@
+"use client";
+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 provider_analytics_exports = {};
+__export(provider_analytics_exports, {
+  Provider: () => Provider,
+  useTracking: () => useTracking
+});
+module.exports = __toCommonJS(provider_analytics_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_fetch = require("@drawbridge/drawbridge-utils/fetch");
+var import_analytics = __toESM(require("analytics"));
+var import_google_tag_manager = __toESM(require("@analytics/google-tag-manager"));
+const drawbridgeAnalytics = ({
+  subdomain,
+  slug,
+  embed
+}) => {
+  try {
+    const callback = ({ payload }) => (0, import_fetch.request)({
+      body: {
+        ...payload,
+        ...embed && { embed: true }
+      },
+      endpoint: "/subdomain/" + subdomain + "/page/" + slug + "/analytic",
+      method: "POST"
+    });
+    return {
+      name: "drawbridge-analytics",
+      page: callback,
+      track: callback
+    };
+  } catch (error) {
+    console.log(error);
+  }
+};
+const Context = (0, import_react.createContext)(null);
+const useAnalytics = () => {
+  return (0, import_react.useContext)(Context);
+};
+const useTracking = ({
+  embed = false,
+  params,
+  preview,
+  result
+}) => {
+  const analytics = useAnalytics();
+  const initialized = (0, import_react.useRef)(false);
+  const landedAt = (0, import_react.useRef)((/* @__PURE__ */ new Date()).toISOString());
+  const canTrack = ((result == null ? void 0 : result.features) || []).includes("analytics") && Boolean(result == null ? void 0 : result.valid) && !preview;
+  return (0, import_react.useMemo)(
+    () => ({
+      page: () => {
+        if (canTrack && !initialized.current) {
+          initialized.current = true;
+          analytics == null ? void 0 : analytics.page({
+            name: params == null ? void 0 : params.slug
+          });
+        }
+      },
+      track: (props, type = "click", options = {}) => {
+        if (canTrack) {
+          analytics == null ? void 0 : analytics.track(
+            type,
+            {
+              ...props,
+              url: window.location.origin + window.location.pathname,
+              search: window.location.search
+            },
+            options
+          );
+        }
+      },
+      context: () => {
+        var _a;
+        return {
+          anonymousId: ((_a = analytics == null ? void 0 : analytics.user) == null ? void 0 : _a.call(analytics, "anonymousId")) || null,
+          landedAt: landedAt.current,
+          referrer: document.referrer || null,
+          url: window.location.origin + window.location.pathname,
+          search: window.location.search,
+          ...embed && { embed: true }
+        };
+      }
+    }),
+    [analytics, canTrack, embed, params == null ? void 0 : params.slug]
+  );
+};
+const Provider = ({
+  analytics,
+  embed,
+  integrations,
+  params,
+  children
+}) => {
+  var _a, _b, _c;
+  const instance = (0, import_react.useMemo)(
+    () => {
+      var _a2, _b2, _c2;
+      const plugins = [];
+      if (Boolean(analytics)) {
+        plugins.push(drawbridgeAnalytics({ ...params, embed }));
+      }
+      ;
+      if (process.env.NEXT_PUBLIC_GOOGLE_TAG_MANAGER) {
+        plugins.push(
+          Object.assign(
+            {},
+            (0, import_google_tag_manager.default)({
+              containerId: process.env.NEXT_PUBLIC_GOOGLE_TAG_MANAGER,
+              enabled: Boolean(process.env.NEXT_PUBLIC_GOOGLE_TAG_MANAGER)
+            }),
+            {
+              name: "google-tag-manager-drawbridge"
+            }
+          )
+        );
+      }
+      ;
+      if (integrations == null ? void 0 : integrations.gtm) {
+        plugins.push(
+          Object.assign(
+            {},
+            (0, import_google_tag_manager.default)({
+              containerId: (_b2 = (_a2 = integrations == null ? void 0 : integrations.gtm) == null ? void 0 : _a2.settings) == null ? void 0 : _b2.containerId,
+              enabled: Boolean((_c2 = integrations == null ? void 0 : integrations.gtm) == null ? void 0 : _c2.enabled)
+            }),
+            {
+              name: "google-tag-manager-integration"
+            }
+          )
+        );
+      }
+      ;
+      return (0, import_analytics.default)({
+        app: "Drawbridge",
+        debug: process.env.NODE_ENV === "development",
+        plugins
+      });
+    },
+    [analytics, embed, (_b = (_a = integrations == null ? void 0 : integrations.gtm) == null ? void 0 : _a.settings) == null ? void 0 : _b.containerId, (_c = integrations == null ? void 0 : integrations.gtm) == null ? void 0 : _c.enabled, params == null ? void 0 : params.subdomain, params == null ? void 0 : params.slug]
+    // eslint-disable-line react-hooks/exhaustive-deps
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    Context.Provider,
+    {
+      ...{
+        value: instance
+      },
+      children
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Provider,
+  useTracking
+});

package/dist/bridge/provider-analytics.mjs

@@ -0,0 +1,150 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo, useRef } from "react";
+import { request } from "@drawbridge/drawbridge-utils/fetch";
+import Analytics from "analytics";
+import googleTagManager from "@analytics/google-tag-manager";
+const drawbridgeAnalytics = ({
+  subdomain,
+  slug,
+  embed
+}) => {
+  try {
+    const callback = ({ payload }) => request({
+      body: {
+        ...payload,
+        ...embed && { embed: true }
+      },
+      endpoint: "/subdomain/" + subdomain + "/page/" + slug + "/analytic",
+      method: "POST"
+    });
+    return {
+      name: "drawbridge-analytics",
+      page: callback,
+      track: callback
+    };
+  } catch (error) {
+    console.log(error);
+  }
+};
+const Context = createContext(null);
+const useAnalytics = () => {
+  return useContext(Context);
+};
+const useTracking = ({
+  embed = false,
+  params,
+  preview,
+  result
+}) => {
+  const analytics = useAnalytics();
+  const initialized = useRef(false);
+  const landedAt = useRef((/* @__PURE__ */ new Date()).toISOString());
+  const canTrack = ((result == null ? void 0 : result.features) || []).includes("analytics") && Boolean(result == null ? void 0 : result.valid) && !preview;
+  return useMemo(
+    () => ({
+      page: () => {
+        if (canTrack && !initialized.current) {
+          initialized.current = true;
+          analytics == null ? void 0 : analytics.page({
+            name: params == null ? void 0 : params.slug
+          });
+        }
+      },
+      track: (props, type = "click", options = {}) => {
+        if (canTrack) {
+          analytics == null ? void 0 : analytics.track(
+            type,
+            {
+              ...props,
+              url: window.location.origin + window.location.pathname,
+              search: window.location.search
+            },
+            options
+          );
+        }
+      },
+      context: () => {
+        var _a;
+        return {
+          anonymousId: ((_a = analytics == null ? void 0 : analytics.user) == null ? void 0 : _a.call(analytics, "anonymousId")) || null,
+          landedAt: landedAt.current,
+          referrer: document.referrer || null,
+          url: window.location.origin + window.location.pathname,
+          search: window.location.search,
+          ...embed && { embed: true }
+        };
+      }
+    }),
+    [analytics, canTrack, embed, params == null ? void 0 : params.slug]
+  );
+};
+const Provider = ({
+  analytics,
+  embed,
+  integrations,
+  params,
+  children
+}) => {
+  var _a, _b, _c;
+  const instance = useMemo(
+    () => {
+      var _a2, _b2, _c2;
+      const plugins = [];
+      if (Boolean(analytics)) {
+        plugins.push(drawbridgeAnalytics({ ...params, embed }));
+      }
+      ;
+      if (process.env.NEXT_PUBLIC_GOOGLE_TAG_MANAGER) {
+        plugins.push(
+          Object.assign(
+            {},
+            googleTagManager({
+              containerId: process.env.NEXT_PUBLIC_GOOGLE_TAG_MANAGER,
+              enabled: Boolean(process.env.NEXT_PUBLIC_GOOGLE_TAG_MANAGER)
+            }),
+            {
+              name: "google-tag-manager-drawbridge"
+            }
+          )
+        );
+      }
+      ;
+      if (integrations == null ? void 0 : integrations.gtm) {
+        plugins.push(
+          Object.assign(
+            {},
+            googleTagManager({
+              containerId: (_b2 = (_a2 = integrations == null ? void 0 : integrations.gtm) == null ? void 0 : _a2.settings) == null ? void 0 : _b2.containerId,
+              enabled: Boolean((_c2 = integrations == null ? void 0 : integrations.gtm) == null ? void 0 : _c2.enabled)
+            }),
+            {
+              name: "google-tag-manager-integration"
+            }
+          )
+        );
+      }
+      ;
+      return Analytics({
+        app: "Drawbridge",
+        debug: process.env.NODE_ENV === "development",
+        plugins
+      });
+    },
+    [analytics, embed, (_b = (_a = integrations == null ? void 0 : integrations.gtm) == null ? void 0 : _a.settings) == null ? void 0 : _b.containerId, (_c = integrations == null ? void 0 : integrations.gtm) == null ? void 0 : _c.enabled, params == null ? void 0 : params.subdomain, params == null ? void 0 : params.slug]
+    // eslint-disable-line react-hooks/exhaustive-deps
+  );
+  return /* @__PURE__ */ jsx(
+    Context.Provider,
+    {
+      ...{
+        value: instance
+      },
+      children
+    }
+  );
+};
+export {
+  Provider,
+  useTracking
+};