@wix/web5-core 1.56.0

package/dist/esm/services/shopify/shopifyEntityResolver.js

@@ -0,0 +1,105 @@
+import { PRODUCT_BY_HANDLE_QUERY, PRODUCT_BY_ID_QUERY, COLLECTION_BY_HANDLE_QUERY, COLLECTION_BY_ID_QUERY, ARTICLE_BY_HANDLE_QUERY } from './queries.js';
+/**
+ * Check if an entityId looks like a numeric Shopify ID (not a handle).
+ * Handles are URL slugs (e.g. "classic-cotton-tee"), IDs are numeric (e.g. "10260081213719").
+ */
+function isNumericId(entityId) {
+  return /^\d+$/.test(entityId);
+}
+
+/** Build a Shopify global ID from a numeric ID and resource type */
+function toGlobalId(type, numericId) {
+  const capitalType = type.charAt(0).toUpperCase() + type.slice(1);
+  return `gid://shopify/${capitalType}/${numericId}`;
+}
+
+/**
+ * Resolve a single Shopify entity by type and ID.
+ *
+ * The entityId can be either a **handle** (URL slug like "classic-cotton-tee")
+ * or a **numeric ID** (like "10260081213719"). The resolver tries the handle
+ * query first; if the entityId is numeric and the handle query returns null,
+ * it falls back to querying by global ID.
+ *
+ * - product:    entityId = handle or numeric ID
+ * - collection: entityId = handle or numeric ID
+ * - article:    entityId = "blogHandle/articleHandle" or just "articleHandle"
+ *               (falls back to config.defaultBlogHandle when no blog prefix)
+ *
+ * Returns null if the entity is not found or on error.
+ */
+export async function resolveShopifyEntity(client, entityType, entityId, config) {
+  try {
+    switch (entityType.toLowerCase()) {
+      case 'product':
+        {
+          // Try by handle first
+          const byHandle = await client.query(PRODUCT_BY_HANDLE_QUERY, {
+            handle: entityId
+          });
+          if (byHandle.productByHandle) {
+            return byHandle.productByHandle;
+          }
+          // Fall back to global ID if it looks numeric
+          if (isNumericId(entityId)) {
+            const byId = await client.query(PRODUCT_BY_ID_QUERY, {
+              id: toGlobalId('Product', entityId)
+            });
+            return byId.product ?? null;
+          }
+          return null;
+        }
+      case 'collection':
+        {
+          const byHandle = await client.query(COLLECTION_BY_HANDLE_QUERY, {
+            handle: entityId
+          });
+          if (byHandle.collectionByHandle) {
+            return byHandle.collectionByHandle;
+          }
+          if (isNumericId(entityId)) {
+            const byId = await client.query(COLLECTION_BY_ID_QUERY, {
+              id: toGlobalId('Collection', entityId)
+            });
+            return byId.collection ?? null;
+          }
+          return null;
+        }
+      case 'article':
+        {
+          var _data$blog;
+          const {
+            blogHandle,
+            articleHandle
+          } = parseArticleEntityId(entityId, config == null ? void 0 : config.defaultBlogHandle);
+          if (!blogHandle || !articleHandle) {
+            return null;
+          }
+          const data = await client.query(ARTICLE_BY_HANDLE_QUERY, {
+            blogHandle,
+            articleHandle
+          });
+          return ((_data$blog = data.blog) == null ? void 0 : _data$blog.articleByHandle) ?? null;
+        }
+      default:
+        return null;
+    }
+  } catch (error) {
+    console.warn(`[shopify] Failed to resolve ${entityType}/${entityId}:`, error instanceof Error ? error.message : error);
+    return null;
+  }
+}
+function parseArticleEntityId(entityId, defaultBlogHandle) {
+  const slashIndex = entityId.indexOf('/');
+  if (slashIndex !== -1) {
+    return {
+      blogHandle: entityId.slice(0, slashIndex),
+      articleHandle: entityId.slice(slashIndex + 1)
+    };
+  }
+  return {
+    blogHandle: defaultBlogHandle,
+    articleHandle: entityId || undefined
+  };
+}
+//# sourceMappingURL=shopifyEntityResolver.js.map

package/dist/esm/services/shopify/shopifyEntityResolver.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PRODUCT_BY_HANDLE_QUERY","PRODUCT_BY_ID_QUERY","COLLECTION_BY_HANDLE_QUERY","COLLECTION_BY_ID_QUERY","ARTICLE_BY_HANDLE_QUERY","isNumericId","entityId","test","toGlobalId","type","numericId","capitalType","charAt","toUpperCase","slice","resolveShopifyEntity","client","entityType","config","toLowerCase","byHandle","query","handle","productByHandle","byId","id","product","collectionByHandle","collection","_data$blog","blogHandle","articleHandle","parseArticleEntityId","defaultBlogHandle","data","blog","articleByHandle","error","console","warn","Error","message","slashIndex","indexOf","undefined"],"sources":["../../../../src/services/shopify/shopifyEntityResolver.ts"],"sourcesContent":["import type { ShopifyStorefrontClient } from './shopifyStorefrontClient';\nimport type {\n  ShopifyStorefrontConfig,\n  ShopifyProduct,\n  ShopifyCollection,\n  ShopifyArticle,\n  ProductByHandleResponse,\n  CollectionByHandleResponse,\n  ArticleByHandleResponse,\n} from './types';\nimport {\n  PRODUCT_BY_HANDLE_QUERY,\n  PRODUCT_BY_ID_QUERY,\n  COLLECTION_BY_HANDLE_QUERY,\n  COLLECTION_BY_ID_QUERY,\n  ARTICLE_BY_HANDLE_QUERY,\n} from './queries';\n\ntype ShopifyEntity = ShopifyProduct | ShopifyCollection | ShopifyArticle;\n\n/**\n * Check if an entityId looks like a numeric Shopify ID (not a handle).\n * Handles are URL slugs (e.g. \"classic-cotton-tee\"), IDs are numeric (e.g. \"10260081213719\").\n */\nfunction isNumericId(entityId: string): boolean {\n  return /^\\d+$/.test(entityId);\n}\n\n/** Build a Shopify global ID from a numeric ID and resource type */\nfunction toGlobalId(type: string, numericId: string): string {\n  const capitalType = type.charAt(0).toUpperCase() + type.slice(1);\n  return `gid://shopify/${capitalType}/${numericId}`;\n}\n\n/**\n * Resolve a single Shopify entity by type and ID.\n *\n * The entityId can be either a **handle** (URL slug like \"classic-cotton-tee\")\n * or a **numeric ID** (like \"10260081213719\"). The resolver tries the handle\n * query first; if the entityId is numeric and the handle query returns null,\n * it falls back to querying by global ID.\n *\n * - product:    entityId = handle or numeric ID\n * - collection: entityId = handle or numeric ID\n * - article:    entityId = \"blogHandle/articleHandle\" or just \"articleHandle\"\n *               (falls back to config.defaultBlogHandle when no blog prefix)\n *\n * Returns null if the entity is not found or on error.\n */\nexport async function resolveShopifyEntity(\n  client: ShopifyStorefrontClient,\n  entityType: string,\n  entityId: string,\n  config?: ShopifyStorefrontConfig,\n): Promise<ShopifyEntity | null> {\n  try {\n    switch (entityType.toLowerCase()) {\n      case 'product': {\n        // Try by handle first\n        const byHandle = await client.query<ProductByHandleResponse>(\n          PRODUCT_BY_HANDLE_QUERY,\n          { handle: entityId },\n        );\n        if (byHandle.productByHandle) {\n          return byHandle.productByHandle;\n        }\n        // Fall back to global ID if it looks numeric\n        if (isNumericId(entityId)) {\n          const byId = await client.query<{ product: ShopifyProduct | null }>(\n            PRODUCT_BY_ID_QUERY,\n            { id: toGlobalId('Product', entityId) },\n          );\n          return byId.product ?? null;\n        }\n        return null;\n      }\n\n      case 'collection': {\n        const byHandle = await client.query<CollectionByHandleResponse>(\n          COLLECTION_BY_HANDLE_QUERY,\n          { handle: entityId },\n        );\n        if (byHandle.collectionByHandle) {\n          return byHandle.collectionByHandle;\n        }\n        if (isNumericId(entityId)) {\n          const byId = await client.query<{\n            collection: ShopifyCollection | null;\n          }>(COLLECTION_BY_ID_QUERY, {\n            id: toGlobalId('Collection', entityId),\n          });\n          return byId.collection ?? null;\n        }\n        return null;\n      }\n\n      case 'article': {\n        const { blogHandle, articleHandle } = parseArticleEntityId(\n          entityId,\n          config?.defaultBlogHandle,\n        );\n        if (!blogHandle || !articleHandle) {\n          return null;\n        }\n        const data = await client.query<ArticleByHandleResponse>(\n          ARTICLE_BY_HANDLE_QUERY,\n          { blogHandle, articleHandle },\n        );\n        return data.blog?.articleByHandle ?? null;\n      }\n\n      default:\n        return null;\n    }\n  } catch (error) {\n    console.warn(\n      `[shopify] Failed to resolve ${entityType}/${entityId}:`,\n      error instanceof Error ? error.message : error,\n    );\n    return null;\n  }\n}\n\nfunction parseArticleEntityId(\n  entityId: string,\n  defaultBlogHandle?: string,\n): { blogHandle: string | undefined; articleHandle: string | undefined } {\n  const slashIndex = entityId.indexOf('/');\n  if (slashIndex !== -1) {\n    return {\n      blogHandle: entityId.slice(0, slashIndex),\n      articleHandle: entityId.slice(slashIndex + 1),\n    };\n  }\n  return {\n    blogHandle: defaultBlogHandle,\n    articleHandle: entityId || undefined,\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/services/shopify/shopifyStorefrontClient.js

@@ -0,0 +1,52 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+const DEFAULT_API_VERSION = '2025-01';
+
+/**
+ * Lightweight GraphQL client for the Shopify Storefront API.
+ *
+ * Uses native fetch — no external dependencies.
+ *
+ * When a `storefrontAccessToken` is provided, it's sent via
+ * the `X-Shopify-Storefront-Access-Token` header (required for
+ * cross-origin / localhost / headless access).
+ *
+ * Tokenless access (no token) only works from the store's own domain.
+ */
+export class ShopifyStorefrontClient {
+  constructor(config) {
+    _defineProperty(this, "endpoint", void 0);
+    _defineProperty(this, "accessToken", void 0);
+    const domain = config.storeDomain.replace(/\/$/, '');
+    const version = config.apiVersion || DEFAULT_API_VERSION;
+    const protocol = domain.startsWith('http') ? '' : 'https://';
+    this.endpoint = `${protocol}${domain}/api/${version}/graphql.json`;
+    this.accessToken = config.storefrontAccessToken;
+  }
+  async query(graphql, variables) {
+    var _json$errors;
+    const headers = {
+      'Content-Type': 'application/json'
+    };
+    if (this.accessToken) {
+      headers['X-Shopify-Storefront-Access-Token'] = this.accessToken;
+    }
+    const res = await fetch(this.endpoint, {
+      method: 'POST',
+      headers,
+      body: JSON.stringify({
+        query: graphql,
+        variables
+      })
+    });
+    if (!res.ok) {
+      throw new Error(`Shopify Storefront API error: ${res.status} ${res.statusText}`);
+    }
+    const json = await res.json();
+    if ((_json$errors = json.errors) != null && _json$errors.length) {
+      const messages = json.errors.map(e => e.message);
+      throw new Error(`Shopify GraphQL errors: ${messages.join('; ')}`);
+    }
+    return json.data;
+  }
+}
+//# sourceMappingURL=shopifyStorefrontClient.js.map

package/dist/esm/services/shopify/shopifyStorefrontClient.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DEFAULT_API_VERSION","ShopifyStorefrontClient","constructor","config","_defineProperty","domain","storeDomain","replace","version","apiVersion","protocol","startsWith","endpoint","accessToken","storefrontAccessToken","query","graphql","variables","_json$errors","headers","res","fetch","method","body","JSON","stringify","ok","Error","status","statusText","json","errors","length","messages","map","e","message","join","data"],"sources":["../../../../src/services/shopify/shopifyStorefrontClient.ts"],"sourcesContent":["import type { ShopifyStorefrontConfig } from './types';\n\nconst DEFAULT_API_VERSION = '2025-01';\n\n/**\n * Lightweight GraphQL client for the Shopify Storefront API.\n *\n * Uses native fetch — no external dependencies.\n *\n * When a `storefrontAccessToken` is provided, it's sent via\n * the `X-Shopify-Storefront-Access-Token` header (required for\n * cross-origin / localhost / headless access).\n *\n * Tokenless access (no token) only works from the store's own domain.\n */\nexport class ShopifyStorefrontClient {\n  private readonly endpoint: string;\n  private readonly accessToken: string | undefined;\n\n  constructor(config: ShopifyStorefrontConfig) {\n    const domain = config.storeDomain.replace(/\\/$/, '');\n    const version = config.apiVersion || DEFAULT_API_VERSION;\n    const protocol = domain.startsWith('http') ? '' : 'https://';\n    this.endpoint = `${protocol}${domain}/api/${version}/graphql.json`;\n    this.accessToken = config.storefrontAccessToken;\n  }\n\n  async query<T>(\n    graphql: string,\n    variables?: Record<string, unknown>,\n  ): Promise<T> {\n    const headers: Record<string, string> = {\n      'Content-Type': 'application/json',\n    };\n    if (this.accessToken) {\n      headers['X-Shopify-Storefront-Access-Token'] = this.accessToken;\n    }\n\n    const res = await fetch(this.endpoint, {\n      method: 'POST',\n      headers,\n      body: JSON.stringify({ query: graphql, variables }),\n    });\n\n    if (!res.ok) {\n      throw new Error(\n        `Shopify Storefront API error: ${res.status} ${res.statusText}`,\n      );\n    }\n\n    const json = await res.json();\n\n    if (json.errors?.length) {\n      const messages = json.errors.map((e: { message: string }) => e.message);\n      throw new Error(`Shopify GraphQL errors: ${messages.join('; ')}`);\n    }\n\n    return json.data as T;\n  }\n}\n"],"mappings":";AAEA,MAAMA,mBAAmB,GAAG,SAAS;;AAErC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,uBAAuB,CAAC;EAInCC,WAAWA,CAACC,MAA+B,EAAE;IAAAC,eAAA;IAAAA,eAAA;IAC3C,MAAMC,MAAM,GAAGF,MAAM,CAACG,WAAW,CAACC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC;IACpD,MAAMC,OAAO,GAAGL,MAAM,CAACM,UAAU,IAAIT,mBAAmB;IACxD,MAAMU,QAAQ,GAAGL,MAAM,CAACM,UAAU,CAAC,MAAM,CAAC,GAAG,EAAE,GAAG,UAAU;IAC5D,IAAI,CAACC,QAAQ,GAAG,GAAGF,QAAQ,GAAGL,MAAM,QAAQG,OAAO,eAAe;IAClE,IAAI,CAACK,WAAW,GAAGV,MAAM,CAACW,qBAAqB;EACjD;EAEA,MAAMC,KAAKA,CACTC,OAAe,EACfC,SAAmC,EACvB;IAAA,IAAAC,YAAA;IACZ,MAAMC,OAA+B,GAAG;MACtC,cAAc,EAAE;IAClB,CAAC;IACD,IAAI,IAAI,CAACN,WAAW,EAAE;MACpBM,OAAO,CAAC,mCAAmC,CAAC,GAAG,IAAI,CAACN,WAAW;IACjE;IAEA,MAAMO,GAAG,GAAG,MAAMC,KAAK,CAAC,IAAI,CAACT,QAAQ,EAAE;MACrCU,MAAM,EAAE,MAAM;MACdH,OAAO;MACPI,IAAI,EAAEC,IAAI,CAACC,SAAS,CAAC;QAAEV,KAAK,EAAEC,OAAO;QAAEC;MAAU,CAAC;IACpD,CAAC,CAAC;IAEF,IAAI,CAACG,GAAG,CAACM,EAAE,EAAE;MACX,MAAM,IAAIC,KAAK,CACb,iCAAiCP,GAAG,CAACQ,MAAM,IAAIR,GAAG,CAACS,UAAU,EAC/D,CAAC;IACH;IAEA,MAAMC,IAAI,GAAG,MAAMV,GAAG,CAACU,IAAI,CAAC,CAAC;IAE7B,KAAAZ,YAAA,GAAIY,IAAI,CAACC,MAAM,aAAXb,YAAA,CAAac,MAAM,EAAE;MACvB,MAAMC,QAAQ,GAAGH,IAAI,CAACC,MAAM,CAACG,GAAG,CAAEC,CAAsB,IAAKA,CAAC,CAACC,OAAO,CAAC;MACvE,MAAM,IAAIT,KAAK,CAAC,2BAA2BM,QAAQ,CAACI,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;IACnE;IAEA,OAAOP,IAAI,CAACQ,IAAI;EAClB;AACF","ignoreList":[]}

package/dist/esm/services/shopify/transformShopifyEntity.js

@@ -0,0 +1,130 @@
+function formatShopifyDate(isoDate) {
+  const date = new Date(isoDate);
+  if (isNaN(date.getTime())) {
+    return undefined;
+  }
+  const day = date.getDate();
+  const month = date.toLocaleString('en-US', {
+    month: 'short'
+  });
+  const year = date.getFullYear();
+  return `${day} ${month} ${year}`;
+}
+function formatPrice(money) {
+  const amount = parseFloat(money.amount);
+  const formatted = amount.toFixed(2);
+  return `${formatted} ${money.currencyCode}`;
+}
+function extractSizes(product) {
+  const sizes = product.variants.edges.flatMap(e => e.node.selectedOptions.filter(o => o.name.toLowerCase() === 'size').map(o => o.value));
+  const unique = [...new Set(sizes)];
+  return unique.length > 0 ? unique : undefined;
+}
+
+/**
+ * Extract variant ID → size label mapping for add-to-cart.
+ * Shopify global IDs look like "gid://shopify/ProductVariant/12345" —
+ * we extract just the numeric part for the Ajax API.
+ */
+function extractVariants(product) {
+  const variants = product.variants.edges.map(e => {
+    const sizeOption = e.node.selectedOptions.find(o => o.name.toLowerCase() === 'size');
+    const numericId = e.node.id.replace(/^gid:\/\/shopify\/ProductVariant\//, '');
+    return {
+      label: (sizeOption == null ? void 0 : sizeOption.value) || e.node.title,
+      variantId: numericId,
+      available: e.node.availableForSale,
+      selectedOptions: e.node.selectedOptions.map(o => ({
+        name: o.name,
+        value: o.value
+      })),
+      price: formatPrice(e.node.price),
+      compareAtPrice: e.node.compareAtPrice ? formatPrice(e.node.compareAtPrice) : undefined
+    };
+  });
+  return variants.length > 0 ? variants : undefined;
+}
+function getSecondaryImage(product) {
+  const images = product.images.edges.map(e => e.node.url);
+  return images.length > 1 ? images[1] : undefined;
+}
+function getAllImages(product) {
+  const images = product.images.edges.map(e => e.node.url);
+  return images.length > 0 ? images : undefined;
+}
+function getCompareAtPrice(product) {
+  var _product$compareAtPri;
+  const compare = (_product$compareAtPri = product.compareAtPriceRange) == null ? void 0 : _product$compareAtPri.minVariantPrice;
+  if (!compare) {
+    return undefined;
+  }
+  const min = product.priceRange.minVariantPrice;
+  if (parseFloat(compare.amount) <= parseFloat(min.amount)) {
+    return undefined;
+  }
+  return formatPrice(compare);
+}
+export function transformShopifyProduct(product) {
+  var _product$featuredImag, _product$options;
+  return {
+    url: product.onlineStoreUrl || '',
+    title: product.title,
+    type: 'product',
+    description: product.description,
+    imageUrl: (_product$featuredImag = product.featuredImage) == null ? void 0 : _product$featuredImag.url,
+    secondaryImageUrl: getSecondaryImage(product),
+    vendor: product.vendor,
+    price: formatPrice(product.priceRange.minVariantPrice),
+    compareAtPrice: getCompareAtPrice(product),
+    sizes: extractSizes(product),
+    variants: extractVariants(product),
+    allImages: getAllImages(product),
+    options: (_product$options = product.options) != null && _product$options.length ? product.options : undefined,
+    tags: product.tags.length ? product.tags : undefined
+  };
+}
+export function transformShopifyCollection(collection) {
+  var _collection$image;
+  return {
+    url: collection.onlineStoreUrl || '',
+    title: collection.title,
+    type: 'collection',
+    description: collection.description,
+    imageUrl: (_collection$image = collection.image) == null ? void 0 : _collection$image.url
+  };
+}
+export function transformShopifyArticle(article) {
+  var _article$image, _article$authorV;
+  return {
+    url: article.onlineStoreUrl || '',
+    title: article.title,
+    type: 'article',
+    description: article.excerpt || undefined,
+    imageUrl: (_article$image = article.image) == null ? void 0 : _article$image.url,
+    publishDate: formatShopifyDate(article.publishedAt),
+    author: ((_article$authorV = article.authorV2) == null ? void 0 : _article$authorV.name) || undefined,
+    tags: article.tags.length ? article.tags : undefined
+  };
+}
+
+/**
+ * Transform any resolved Shopify entity to the standard EntityItemData shape.
+ * Detects the entity type by checking for type-specific fields.
+ */
+export function transformShopifyEntityToItemData(entity, entityType) {
+  switch (entityType.toLowerCase()) {
+    case 'product':
+      return transformShopifyProduct(entity);
+    case 'collection':
+      return transformShopifyCollection(entity);
+    case 'article':
+      return transformShopifyArticle(entity);
+    default:
+      return {
+        url: '',
+        title: entity.title || '',
+        type: entityType
+      };
+  }
+}
+//# sourceMappingURL=transformShopifyEntity.js.map

package/dist/esm/services/shopify/transformShopifyEntity.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["formatShopifyDate","isoDate","date","Date","isNaN","getTime","undefined","day","getDate","month","toLocaleString","year","getFullYear","formatPrice","money","amount","parseFloat","formatted","toFixed","currencyCode","extractSizes","product","sizes","variants","edges","flatMap","e","node","selectedOptions","filter","o","name","toLowerCase","map","value","unique","Set","length","extractVariants","sizeOption","find","numericId","id","replace","label","title","variantId","available","availableForSale","price","compareAtPrice","getSecondaryImage","images","url","getAllImages","getCompareAtPrice","_product$compareAtPri","compare","compareAtPriceRange","minVariantPrice","min","priceRange","transformShopifyProduct","_product$featuredImag","_product$options","onlineStoreUrl","type","description","imageUrl","featuredImage","secondaryImageUrl","vendor","allImages","options","tags","transformShopifyCollection","collection","_collection$image","image","transformShopifyArticle","article","_article$image","_article$authorV","excerpt","publishDate","publishedAt","author","authorV2","transformShopifyEntityToItemData","entity","entityType"],"sources":["../../../../src/services/shopify/transformShopifyEntity.ts"],"sourcesContent":["import type { EntityItemData } from '../../component/types';\nimport type {\n  ShopifyProduct,\n  ShopifyCollection,\n  ShopifyArticle,\n} from './types';\n\nfunction formatShopifyDate(isoDate: string): string | undefined {\n  const date = new Date(isoDate);\n  if (isNaN(date.getTime())) {\n    return undefined;\n  }\n  const day = date.getDate();\n  const month = date.toLocaleString('en-US', { month: 'short' });\n  const year = date.getFullYear();\n  return `${day} ${month} ${year}`;\n}\n\nfunction formatPrice(\n  money: ShopifyProduct['priceRange']['minVariantPrice'],\n): string {\n  const amount = parseFloat(money.amount);\n  const formatted = amount.toFixed(2);\n  return `${formatted} ${money.currencyCode}`;\n}\n\nfunction extractSizes(product: ShopifyProduct): string[] | undefined {\n  const sizes = product.variants.edges.flatMap((e) =>\n    e.node.selectedOptions\n      .filter((o) => o.name.toLowerCase() === 'size')\n      .map((o) => o.value),\n  );\n  const unique = [...new Set(sizes)];\n  return unique.length > 0 ? unique : undefined;\n}\n\n/**\n * Extract variant ID → size label mapping for add-to-cart.\n * Shopify global IDs look like \"gid://shopify/ProductVariant/12345\" —\n * we extract just the numeric part for the Ajax API.\n */\nfunction extractVariants(product: ShopifyProduct): EntityItemData['variants'] {\n  const variants = product.variants.edges.map((e) => {\n    const sizeOption = e.node.selectedOptions.find(\n      (o) => o.name.toLowerCase() === 'size',\n    );\n    const numericId = e.node.id.replace(\n      /^gid:\\/\\/shopify\\/ProductVariant\\//,\n      '',\n    );\n    return {\n      label: sizeOption?.value || e.node.title,\n      variantId: numericId,\n      available: e.node.availableForSale,\n      selectedOptions: e.node.selectedOptions.map((o) => ({\n        name: o.name,\n        value: o.value,\n      })),\n      price: formatPrice(e.node.price),\n      compareAtPrice: e.node.compareAtPrice\n        ? formatPrice(e.node.compareAtPrice)\n        : undefined,\n    };\n  });\n  return variants.length > 0 ? variants : undefined;\n}\n\nfunction getSecondaryImage(product: ShopifyProduct): string | undefined {\n  const images = product.images.edges.map((e) => e.node.url);\n  return images.length > 1 ? images[1] : undefined;\n}\n\nfunction getAllImages(product: ShopifyProduct): string[] | undefined {\n  const images = product.images.edges.map((e) => e.node.url);\n  return images.length > 0 ? images : undefined;\n}\n\nfunction getCompareAtPrice(product: ShopifyProduct): string | undefined {\n  const compare = product.compareAtPriceRange?.minVariantPrice;\n  if (!compare) {\n    return undefined;\n  }\n  const min = product.priceRange.minVariantPrice;\n  if (parseFloat(compare.amount) <= parseFloat(min.amount)) {\n    return undefined;\n  }\n  return formatPrice(compare);\n}\n\nexport function transformShopifyProduct(\n  product: ShopifyProduct,\n): EntityItemData {\n  return {\n    url: product.onlineStoreUrl || '',\n    title: product.title,\n    type: 'product',\n    description: product.description,\n    imageUrl: product.featuredImage?.url,\n    secondaryImageUrl: getSecondaryImage(product),\n    vendor: product.vendor,\n    price: formatPrice(product.priceRange.minVariantPrice),\n    compareAtPrice: getCompareAtPrice(product),\n    sizes: extractSizes(product),\n    variants: extractVariants(product),\n    allImages: getAllImages(product),\n    options: product.options?.length ? product.options : undefined,\n    tags: product.tags.length ? product.tags : undefined,\n  };\n}\n\nexport function transformShopifyCollection(\n  collection: ShopifyCollection,\n): EntityItemData {\n  return {\n    url: collection.onlineStoreUrl || '',\n    title: collection.title,\n    type: 'collection',\n    description: collection.description,\n    imageUrl: collection.image?.url,\n  };\n}\n\nexport function transformShopifyArticle(\n  article: ShopifyArticle,\n): EntityItemData {\n  return {\n    url: article.onlineStoreUrl || '',\n    title: article.title,\n    type: 'article',\n    description: article.excerpt || undefined,\n    imageUrl: article.image?.url,\n    publishDate: formatShopifyDate(article.publishedAt),\n    author: article.authorV2?.name || undefined,\n    tags: article.tags.length ? article.tags : undefined,\n  };\n}\n\n/**\n * Transform any resolved Shopify entity to the standard EntityItemData shape.\n * Detects the entity type by checking for type-specific fields.\n */\nexport function transformShopifyEntityToItemData(\n  entity: ShopifyProduct | ShopifyCollection | ShopifyArticle,\n  entityType: string,\n): EntityItemData {\n  switch (entityType.toLowerCase()) {\n    case 'product':\n      return transformShopifyProduct(entity as ShopifyProduct);\n    case 'collection':\n      return transformShopifyCollection(entity as ShopifyCollection);\n    case 'article':\n      return transformShopifyArticle(entity as ShopifyArticle);\n    default:\n      return {\n        url: '',\n        title: (entity as { title?: string }).title || '',\n        type: entityType,\n      };\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/services/shopify/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/esm/services/shopify/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["../../../../src/services/shopify/types.ts"],"sourcesContent":["/**\n * Configuration for connecting to a Shopify Storefront API instance.\n */\nexport interface ShopifyStorefrontConfig {\n  /** The Shopify store domain, e.g. \"my-store.myshopify.com\" */\n  storeDomain: string;\n  /**\n   * Public Storefront Access Token.\n   * Required when calling from outside the store's own domain (e.g. localhost, headless apps).\n   * Tokenless access only works from the store's own origin.\n   *\n   * Get one from: Shopify Admin → Settings → Apps → Develop apps → Storefront API access token,\n   * or via the Headless channel.\n   */\n  storefrontAccessToken?: string;\n  /** Storefront API version, e.g. \"2025-01\". Defaults to \"2025-01\". */\n  apiVersion?: string;\n  /** Default blog handle used when an article entityId has no blog prefix */\n  defaultBlogHandle?: string;\n}\n\n// ---------------------------------------------------------------------------\n// Storefront API GraphQL response shapes\n// ---------------------------------------------------------------------------\n\nexport interface ShopifyImage {\n  url: string;\n  altText: string | null;\n}\n\nexport interface ShopifyMoneyV2 {\n  amount: string;\n  currencyCode: string;\n}\n\nexport interface ShopifyVariantOption {\n  name: string;\n  value: string;\n}\n\nexport interface ShopifyVariant {\n  id: string;\n  title: string;\n  availableForSale: boolean;\n  selectedOptions: ShopifyVariantOption[];\n  price: ShopifyMoneyV2;\n  compareAtPrice: ShopifyMoneyV2 | null;\n  image: ShopifyImage | null;\n}\n\nexport interface ShopifyProduct {\n  id: string;\n  title: string;\n  handle: string;\n  description: string;\n  descriptionHtml: string;\n  featuredImage: ShopifyImage | null;\n  images: { edges: { node: ShopifyImage }[] };\n  onlineStoreUrl: string | null;\n  tags: string[];\n  vendor: string;\n  productType: string;\n  priceRange: {\n    minVariantPrice: ShopifyMoneyV2;\n    maxVariantPrice: ShopifyMoneyV2;\n  };\n  compareAtPriceRange: {\n    minVariantPrice: ShopifyMoneyV2;\n  };\n  options: { name: string; values: string[] }[];\n  variants: { edges: { node: ShopifyVariant }[] };\n}\n\nexport interface ShopifyCollection {\n  id: string;\n  title: string;\n  handle: string;\n  description: string;\n  descriptionHtml: string;\n  image: ShopifyImage | null;\n  onlineStoreUrl: string | null;\n}\n\nexport interface ShopifyArticle {\n  id: string;\n  title: string;\n  handle: string;\n  excerpt: string | null;\n  contentHtml: string;\n  image: ShopifyImage | null;\n  authorV2: { name: string } | null;\n  publishedAt: string;\n  tags: string[];\n  onlineStoreUrl: string | null;\n}\n\n// ---------------------------------------------------------------------------\n// GraphQL response wrappers\n// ---------------------------------------------------------------------------\n\nexport interface ProductByHandleResponse {\n  productByHandle: ShopifyProduct | null;\n}\n\nexport interface CollectionByHandleResponse {\n  collectionByHandle: ShopifyCollection | null;\n}\n\nexport interface ArticleByHandleResponse {\n  blog: { articleByHandle: ShopifyArticle | null } | null;\n}\n"],"mappings":"","ignoreList":[]}

package/dist/esm/styles/base-tokens.css

@@ -0,0 +1,152 @@
+/*
+ * Base design tokens — shared defaults for all client packages.
+ * Each client overrides these in their own globals.css :root block.
+ */
+@import './prompt-input-tokens.css';
+
+:root {
+  /* Color tokens — HSL triplets */
+  --background: 0 0% 100%;
+  --foreground: 0 0% 3.9%;
+  --card: 0 0% 100%;
+  --card-foreground: 0 0% 3.9%;
+  --popover: 0 0% 100%;
+  --popover-foreground: 0 0% 3.9%;
+  --primary: 0 0% 9%;
+  --primary-foreground: 0 0% 98%;
+  --secondary: 0 0% 96.1%;
+  --secondary-foreground: 0 0% 9%;
+  --muted: 0 0% 96.1%;
+  --muted-foreground: 0 0% 45.1%;
+  --accent: 0 0% 96.1%;
+  --accent-foreground: 0 0% 9%;
+  --destructive: 0 84.2% 60.2%;
+  --destructive-foreground: 0 0% 98%;
+  --border: 0 0% 89.8%;
+  --input: 0 0% 89.8%;
+  --ring: 0 0% 3.9%;
+
+  /* Chart colors */
+  --chart-1: 180 60% 65%;
+  --chart-2: 120 50% 60%;
+  --chart-3: 40 50% 70%;
+  --chart-4: 200 70% 60%;
+  --chart-5: 320 60% 70%;
+
+  /* Sidebar colors */
+  --sidebar: 0 0% 100%;
+  --sidebar-foreground: 0 0% 3.9%;
+  --sidebar-primary: 0 0% 9%;
+  --sidebar-primary-foreground: 0 0% 98%;
+  --sidebar-accent: 0 0% 96.1%;
+  --sidebar-accent-foreground: 0 0% 9%;
+  --sidebar-border: 0 0% 89.8%;
+  --sidebar-ring: 0 0% 3.9%;
+
+  /* Typography tokens */
+  --font-sans: ui-sans-serif, system-ui, sans-serif;
+  --font-serif: serif;
+  --font-mono: ui-monospace, monospace;
+  /* Display font — used for headings and callouts. Defaults to the body font
+   * so non-overriding clients render identically; clients (e.g. circana) can
+   * set this to a distinct family. */
+  --font-display: var(--font-sans);
+
+  /* Spacing & shape tokens */
+  --radius: 0.5rem;
+  --tracking-normal: -0.02em;
+  --spacing: 0.25rem;
+
+  /* Shadow tokens */
+  --shadow-2xs: 0px 1px 2px 0px hsl(0 0% 0% / 0.03);
+  --shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.04);
+  --shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
+  --shadow: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
+  --shadow-md: 0px 4px 6px -1px hsl(0 0% 0% / 0.1), 0px 2px 4px -2px hsl(0 0% 0% / 0.1);
+  --shadow-lg: 0px 10px 15px -3px hsl(0 0% 0% / 0.1), 0px 4px 6px -4px hsl(0 0% 0% / 0.1);
+  --shadow-xl: 0px 20px 25px -5px hsl(0 0% 0% / 0.1), 0px 8px 10px -6px hsl(0 0% 0% / 0.1);
+  --shadow-2xl: 0px 25px 50px -12px hsl(0 0% 0% / 0.25);
+
+  /* Component-level typography tokens */
+  --heading-lg-color: hsl(var(--foreground));
+  --heading-lg-gradient-from: hsl(var(--primary));
+  --heading-lg-gradient-to: hsl(var(--primary));
+  --heading-h3-color: hsl(var(--primary));
+  --heading-feature-color: hsl(var(--primary));
+  --section-description-color: hsl(var(--muted-foreground));
+  --section-description-font-size: 20px;
+  --section-description-line-height: 30px;
+  --section-description-font-size-tablet: 24px;
+  --section-description-line-height-tablet: 36px;
+  --markdown-content-color: hsl(var(--muted-foreground));
+  --card-title-color: hsl(var(--primary));
+  --card-title-gradient-color: hsl(var(--primary));
+  --description-text-color: hsl(var(--foreground));
+  --body-text-color: hsl(var(--foreground));
+  --body-text-font-size: 18px;
+  --body-text-line-height: 28px;
+  --body-small-text-color: hsl(var(--foreground));
+  --body-small-text-font-size: 15px;
+  --body-small-text-line-height: 24px;
+  --hero-content-color: #FFF;
+  --hero-button-active-color: hsl(var(--primary));
+  --solution-label-color: hsl(var(--muted-foreground));
+  --view-solution-link-color: hsl(var(--primary));
+
+  /* Semantic text & border colors */
+  --text-muted: hsl(var(--muted-foreground));
+  --text-accent: hsl(var(--primary));
+  --text-accent-hover: hsl(var(--primary));
+  --accent-border: hsl(var(--primary));
+  --border-subtle: hsl(var(--border));
+
+  /* Section spacing tokens (responsive) */
+  --section-padding-y-mobile: 4rem;
+  --section-padding-y-tablet: 6rem;
+  --section-padding-y-desktop: 6rem;
+  --section-padding-x-mobile: 1.5rem;
+  --section-padding-x-desktop: 5rem;
+
+  /* Callout tokens */
+  --callout-icon-color: var(--body-text-color);
+  --callout-text-color: var(--body-text-color);
+  --callout-icon-size: 0.55em;
+  --callout-stream-delay: 0s;
+  --callout-star-duration: 2000;
+  --callout-star-delay: 400;
+
+  /* Prose defaults */
+  --tw-prose-body: hsl(var(--foreground));
+
+}
+
+.dark {
+  --background: 0 0% 3.9%;
+  --foreground: 0 0% 98%;
+  --card: 0 0% 3.9%;
+  --card-foreground: 0 0% 98%;
+  --popover: 0 0% 3.9%;
+  --popover-foreground: 0 0% 98%;
+  --primary: 0 0% 98%;
+  --primary-foreground: 0 0% 9%;
+  --secondary: 0 0% 14.9%;
+  --secondary-foreground: 0 0% 98%;
+  --muted: 0 0% 14.9%;
+  --muted-foreground: 0 0% 63.9%;
+  --accent: 0 0% 14.9%;
+  --accent-foreground: 0 0% 98%;
+  --destructive: 0 62.8% 30.6%;
+  --destructive-foreground: 0 0% 98%;
+  --border: 0 0% 14.9%;
+  --input: 0 0% 14.9%;
+  --ring: 0 0% 83.1%;
+
+  --sidebar: 0 0% 3.9%;
+  --sidebar-foreground: 0 0% 98%;
+  --sidebar-primary: 0 0% 98%;
+  --sidebar-primary-foreground: 0 0% 9%;
+  --sidebar-accent: 0 0% 14.9%;
+  --sidebar-accent-foreground: 0 0% 98%;
+  --sidebar-border: 0 0% 14.9%;
+  --sidebar-ring: 0 0% 83.1%;
+}