shopify-nuxt 0.0.1

package/dist/runtime/composables/useShopifyFetch.js

@@ -0,0 +1,32 @@
+import { useNuxtApp } from "#app";
+export function useShopifyFetch() {
+  if (import.meta.server) {
+    throw new Error("useShopifyFetch() can only be used on the client side");
+  }
+  const nuxtApp = useNuxtApp();
+  return async (url, options = {}) => {
+    const shopify = nuxtApp.$shopify;
+    if (!shopify) {
+      throw new Error(
+        "Shopify App Bridge is not available. Make sure the app is loaded within the Shopify Admin."
+      );
+    }
+    const token = await shopify.idToken();
+    const headers = new Headers(options.headers || {});
+    headers.set("Authorization", `Bearer ${token}`);
+    const response = await fetch(url, {
+      ...options,
+      headers
+    });
+    if (!response.ok) {
+      throw new Error(
+        `Shopify fetch failed: ${response.status} ${response.statusText}`
+      );
+    }
+    const contentType = response.headers.get("content-type");
+    if (contentType?.includes("application/json")) {
+      return { data: await response.json(), response };
+    }
+    return { data: await response.text(), response };
+  };
+}

package/dist/runtime/middleware/shopify-auth.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("nuxt/app").RouteMiddleware;
+export default _default;

package/dist/runtime/middleware/shopify-auth.js

@@ -0,0 +1,11 @@
+import { defineNuxtRouteMiddleware } from "#app";
+import { navigateTo } from "nuxt/app";
+export default defineNuxtRouteMiddleware(() => {
+  if (import.meta.server || typeof window === "undefined") {
+    return;
+  }
+  const shop = window.shopify?.config?.shop;
+  if (!shop) {
+    return navigateTo("/auth");
+  }
+});

package/dist/runtime/plugin.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/runtime/plugin.js

@@ -0,0 +1 @@
+export {};

package/dist/runtime/plugins/app-bridge.d.ts

@@ -0,0 +1,12 @@
+import type { ShopifyGlobal } from '@shopify/app-bridge-types';
+declare global {
+    interface Window {
+        shopify: ShopifyGlobal;
+    }
+}
+declare const _default: import("nuxt/app").Plugin<{
+    shopify: ShopifyGlobal;
+}> & import("nuxt/app").ObjectPlugin<{
+    shopify: ShopifyGlobal;
+}>;
+export default _default;

package/dist/runtime/plugins/app-bridge.js

@@ -0,0 +1,28 @@
+import { defineNuxtPlugin } from "#app";
+export default defineNuxtPlugin(() => {
+  if (import.meta.server || typeof window === "undefined") {
+    return;
+  }
+  console.log(
+    "[shopify-nuxt] App Bridge plugin initializing, window.shopify available:",
+    !!window.shopify
+  );
+  const bridge = new Proxy({}, {
+    get(_target, prop, receiver) {
+      if (!window.shopify) {
+        console.warn(
+          "[shopify-nuxt] window.shopify is not available yet. The CDN script may not have loaded."
+        );
+        throw new Error(
+          "Shopify App Bridge is not available. Ensure the app is loaded inside the Shopify Admin."
+        );
+      }
+      return Reflect.get(window.shopify, prop, receiver);
+    }
+  });
+  return {
+    provide: {
+      shopify: bridge
+    }
+  };
+});

package/dist/runtime/plugins/polaris.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/runtime/server/index.d.ts

@@ -0,0 +1,2 @@
+export { configureShopify, getShopifyApi, getResolvedConfig, getSessionStorage } from './services/shopify.js';
+export { registerShopifyWebhooks } from './utils/register-webhooks.js';

package/dist/runtime/server/index.js

@@ -0,0 +1,7 @@
+export {
+  configureShopify,
+  getShopifyApi,
+  getResolvedConfig,
+  getSessionStorage
+} from "./services/shopify.js";
+export { registerShopifyWebhooks } from "./utils/register-webhooks.js";

package/dist/runtime/server/routes/auth-callback.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Handle the OAuth callback from Shopify.
+ * Validates the callback, stores the session, and redirects to the app.
+ */
+declare const _default: import("h3").EventHandlerWithFetch<import("h3").EventHandlerRequest, Promise<import("h3").HTTPResponse>>;
+export default _default;

package/dist/runtime/server/routes/auth-callback.js

@@ -0,0 +1,45 @@
+import { defineEventHandler, getQuery, sendRedirect, createError } from "h3";
+import {
+  getShopifyApi,
+  getResolvedConfig,
+  getSessionStorage
+} from "../services/shopify.js";
+import { createAdminApiContext } from "../utils/clients.js";
+export default defineEventHandler(async (event) => {
+  const api = getShopifyApi();
+  const config = getResolvedConfig();
+  const sessionStorage = getSessionStorage();
+  const query = getQuery(event);
+  try {
+    const callbackResponse = await api.auth.callback({
+      rawRequest: event.req,
+      rawResponse: event.res
+    });
+    const { session } = callbackResponse;
+    await sessionStorage.storeSession(session);
+    if (config.useOnlineTokens && session.isOnline) {
+    }
+    if (config.hooks?.afterAuth) {
+      const admin = createAdminApiContext(api, session);
+      await config.hooks.afterAuth({ session, admin });
+    }
+    if (config.webhooks) {
+      try {
+        await api.webhooks.register({ session });
+      } catch (e) {
+        console.warn("[shopify-nuxt] Failed to register webhooks:", e);
+      }
+    }
+    const shop = session.shop;
+    const host = query.host || Buffer.from(`${shop}/admin`).toString("base64");
+    const redirectUrl = `${config.appUrl}?shop=${shop}&host=${host}`;
+    return sendRedirect(event, redirectUrl, 302);
+  } catch (error) {
+    console.error("[shopify-nuxt] Auth callback error:", error);
+    throw createError({
+      statusCode: 500,
+      statusMessage: "Authentication failed",
+      data: { error: error.message }
+    });
+  }
+});

package/dist/runtime/server/routes/auth-exit-iframe.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Render the exit-iframe page.
+ * This page uses App Bridge to redirect the user out of the auth iframe.
+ */
+declare const _default: import("h3").EventHandlerWithFetch<import("h3").EventHandlerRequest, Promise<string>>;
+export default _default;

package/dist/runtime/server/routes/auth-exit-iframe.js

@@ -0,0 +1,11 @@
+import { defineEventHandler, getQuery, setResponseHeader } from "h3";
+import { getResolvedConfig } from "../services/shopify.js";
+import { renderAppBridgePage } from "../utils/helpers.js";
+export default defineEventHandler(async (event) => {
+  const config = getResolvedConfig();
+  const query = getQuery(event);
+  const destination = query.exitIframe || config.appUrl;
+  const html = renderAppBridgePage(config.apiKey, config.appUrl, destination);
+  setResponseHeader(event, "content-type", "text/html");
+  return html;
+});

package/dist/runtime/server/routes/auth-session-token.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Render the session token bounce page.
+ * For embedded apps, this page loads App Bridge which provides a session token
+ * via a search param, then redirects back to the original request.
+ */
+declare const _default: import("h3").EventHandlerWithFetch<import("h3").EventHandlerRequest, Promise<string>>;
+export default _default;

package/dist/runtime/server/routes/auth-session-token.js

@@ -0,0 +1,27 @@
+import { defineEventHandler, setResponseHeader } from "h3";
+import { getResolvedConfig } from "../services/shopify.js";
+export default defineEventHandler(async (event) => {
+  const config = getResolvedConfig();
+  const html = `<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="shopify-api-key" content="${config.apiKey}" />
+    <script src="https://cdn.shopify.com/shopifycloud/app-bridge.js"><\/script>
+  </head>
+  <body>
+    <script>
+      if (window.shopify && window.shopify.idToken) {
+        window.shopify.idToken().then(function(token) {
+          var url = new URL(window.location.href);
+          url.searchParams.set('id_token', token);
+          url.pathname = '/';
+          window.location.href = url.toString();
+        });
+      }
+    <\/script>
+  </body>
+</html>`;
+  setResponseHeader(event, "content-type", "text/html");
+  return html;
+});

package/dist/runtime/server/routes/auth.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Handle the initial auth request.
+ * For token exchange flow (embedded apps), this redirects to Shopify OAuth.
+ */
+declare const _default: import("h3").EventHandlerWithFetch<import("h3").EventHandlerRequest, Promise<import("h3").HTTPResponse>>;
+export default _default;

package/dist/runtime/server/routes/auth.js

@@ -0,0 +1,23 @@
+import { defineEventHandler, getQuery, sendRedirect, createError } from "h3";
+import { getShopifyApi, getResolvedConfig } from "../services/shopify.js";
+export default defineEventHandler(async (event) => {
+  const api = getShopifyApi();
+  const config = getResolvedConfig();
+  const query = getQuery(event);
+  const shop = query.shop;
+  if (!shop) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: "Missing shop parameter"
+    });
+  }
+  const callbackUrl = `${config.appUrl}${config.auth.callbackPath}`;
+  const authUrl = await api.auth.begin({
+    shop,
+    callbackPath: callbackUrl,
+    isOnline: false,
+    rawRequest: event.req,
+    rawResponse: event.res
+  });
+  return sendRedirect(event, authUrl);
+});

package/dist/runtime/server/services/shopify.d.ts

@@ -0,0 +1,38 @@
+import { type Shopify } from '@shopify/shopify-api';
+import type { SessionStorage } from '@shopify/shopify-app-session-storage';
+import type { ShopifyRuntimeConfig, ResolvedConfig } from '../../types.js';
+/**
+ * Configure Shopify with runtime options that can't be serialized in nuxt.config.ts.
+ *
+ * Call this in a Nitro plugin (`server/plugins/shopify.ts`):
+ *
+ * ```ts
+ * import { configureShopify } from '#shopify/server'
+ *
+ * export default defineNitroPlugin(() => {
+ *   configureShopify({
+ *     sessionStorage: new PrismaSessionStorage(prisma),
+ *     hooks: {
+ *       afterAuth: async ({ session }) => {
+ *         // seed store data
+ *       }
+ *     }
+ *   })
+ * })
+ * ```
+ */
+export declare function configureShopify(config: ShopifyRuntimeConfig): void;
+/**
+ * Get the initialized Shopify API instance.
+ * Lazily creates it on first access using module options + runtime config.
+ */
+export declare function getShopifyApi(): Shopify;
+/**
+ * Get the fully resolved configuration (module options + runtime config merged).
+ */
+export declare function getResolvedConfig(): ResolvedConfig;
+/**
+ * Get the session storage instance.
+ * Throws if not configured and not a ShopifyAdmin app.
+ */
+export declare function getSessionStorage(): SessionStorage;

package/dist/runtime/server/services/shopify.js

@@ -0,0 +1,89 @@
+import { nodeAdapterInitialized } from "@shopify/shopify-api/adapters/node";
+import { shopifyApi } from "@shopify/shopify-api";
+import { useRuntimeConfig } from "#imports";
+import { AppDistribution } from "../../types.js";
+if (!nodeAdapterInitialized) {
+  throw new Error("Shopify Node adapter failed to initialize");
+}
+let _shopifyApi = null;
+let _resolvedConfig = null;
+let _runtimeConfig = null;
+const LIBRARY_VERSION = "1.0.0";
+export function configureShopify(config) {
+  _runtimeConfig = config;
+  _shopifyApi = null;
+  _resolvedConfig = null;
+}
+export function getShopifyApi() {
+  if (_shopifyApi) return _shopifyApi;
+  const resolved = getResolvedConfig();
+  let appUrl;
+  try {
+    appUrl = new URL(resolved.appUrl);
+  } catch {
+    throw new Error(
+      resolved.appUrl === "" ? "Detected an empty appUrl configuration. Set NUXT_SHOPIFY_APP_URL or configure shopify.appUrl in nuxt.config.ts." : `Invalid appUrl configuration '${resolved.appUrl}'. Please provide a valid URL.`
+    );
+  }
+  const userAgentPrefix = `Shopify Nuxt Module v${LIBRARY_VERSION}`;
+  _shopifyApi = shopifyApi({
+    apiKey: resolved.apiKey,
+    apiSecretKey: resolved.apiSecretKey,
+    scopes: resolved.scopes,
+    hostName: appUrl.host,
+    hostScheme: appUrl.protocol.replace(":", ""),
+    apiVersion: resolved.apiVersion,
+    isEmbeddedApp: true,
+    isCustomStoreApp: resolved.distribution === AppDistribution.ShopifyAdmin,
+    userAgentPrefix,
+    billing: resolved.billing,
+    future: {
+      unstable_managedPricingSupport: true
+    }
+  });
+  if (resolved.webhooks) {
+    _shopifyApi.webhooks.addHandlers(resolved.webhooks);
+  }
+  return _shopifyApi;
+}
+export function getResolvedConfig() {
+  if (_resolvedConfig) return _resolvedConfig;
+  const nuxtConfig = useRuntimeConfig();
+  const moduleOpts = nuxtConfig.shopify || {};
+  const runtime = _runtimeConfig || {};
+  const authPathPrefix = moduleOpts.authPathPrefix || "/_shopify/auth";
+  const auth = {
+    path: authPathPrefix,
+    callbackPath: `${authPathPrefix}/callback`,
+    exitIframePath: `${authPathPrefix}/exit-iframe`,
+    patchSessionTokenPath: `${authPathPrefix}/session-token`,
+    loginPath: `${authPathPrefix}/login`
+  };
+  _resolvedConfig = {
+    apiKey: moduleOpts.apiKey || "",
+    apiSecretKey: moduleOpts.apiSecretKey || "",
+    scopes: moduleOpts.scopes || [],
+    appUrl: moduleOpts.appUrl || "",
+    apiVersion: moduleOpts.apiVersion || "2025-01",
+    authPathPrefix,
+    distribution: moduleOpts.distribution || AppDistribution.AppStore,
+    useOnlineTokens: moduleOpts.useOnlineTokens ?? false,
+    auth,
+    sessionStorage: runtime.sessionStorage,
+    webhooks: runtime.webhooks,
+    hooks: runtime.hooks || {},
+    billing: runtime.billing
+  };
+  return _resolvedConfig;
+}
+export function getSessionStorage() {
+  const config = getResolvedConfig();
+  if (!config.sessionStorage) {
+    if (config.distribution !== AppDistribution.ShopifyAdmin) {
+      throw new Error(
+        "No session storage configured. Call configureShopify({ sessionStorage: ... }) in a server plugin. See https://github.com/Shopify/shopify-app-js#session-storage-options for options."
+      );
+    }
+  }
+  return config.sessionStorage;
+}

package/dist/runtime/server/test-helpers/index.d.ts

@@ -0,0 +1,25 @@
+import type { Session } from '@shopify/shopify-api';
+/**
+ * Test helper that returns a mock configuration for testing.
+ *
+ * ```ts
+ * import { testConfig } from 'shopify-nuxt/test-helpers'
+ *
+ * const config = testConfig()
+ * // Use in your test setup
+ * ```
+ */
+export declare function testConfig(overrides?: Record<string, any>): {
+    apiKey: string;
+    apiSecretKey: string;
+    scopes: string[];
+    appUrl: string;
+    apiVersion: string;
+    authPathPrefix: string;
+    distribution: string;
+    useOnlineTokens: boolean;
+};
+/**
+ * Create a mock session for testing.
+ */
+export declare function testSession(overrides?: Partial<Session>): any;

package/dist/runtime/server/test-helpers/index.js

@@ -0,0 +1,25 @@
+export function testConfig(overrides) {
+  return {
+    apiKey: "test-api-key",
+    apiSecretKey: "test-api-secret-key",
+    scopes: ["read_products"],
+    appUrl: "https://test-app.example.com",
+    apiVersion: "2025-01",
+    authPathPrefix: "/_shopify/auth",
+    distribution: "app_store",
+    useOnlineTokens: false,
+    ...overrides
+  };
+}
+export function testSession(overrides) {
+  return {
+    id: "offline_test-shop.myshopify.com",
+    shop: "test-shop.myshopify.com",
+    state: "active",
+    isOnline: false,
+    accessToken: "test-access-token",
+    scope: "read_products",
+    isActive: () => true,
+    ...overrides
+  };
+}

package/dist/runtime/server/test-helpers/package.json

@@ -0,0 +1,4 @@
+{
+  "main": "./index.mjs",
+  "types": "./index.d.mts"
+}

package/dist/runtime/server/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "../../../.nuxt/tsconfig.server.json",
+}

package/dist/runtime/server/utils/authenticate-admin.d.ts

@@ -0,0 +1,17 @@
+import type { H3Event } from 'h3';
+import type { AdminContext } from '../../types.js';
+/**
+ * Authenticate an admin request and return an authenticated admin context.
+ *
+ * Use this in your server API routes to interact with the Shopify Admin API:
+ *
+ * ```ts
+ * // server/api/products.ts
+ * export default defineEventHandler(async (event) => {
+ *   const { admin, session } = await useShopifyAdmin(event)
+ *   const response = await admin.graphql(`{ shop { name } }`)
+ *   return response
+ * })
+ * ```
+ */
+export declare function useShopifyAdmin(event: H3Event): Promise<AdminContext>;

package/dist/runtime/server/utils/authenticate-admin.js

@@ -0,0 +1,197 @@
+import { getQuery, createError } from "h3";
+import {
+  getShopifyApi,
+  getResolvedConfig,
+  getSessionStorage
+} from "../services/shopify.js";
+import { createAdminApiContext } from "./clients.js";
+import {
+  getSessionTokenHeader,
+  getSessionTokenFromUrlParam,
+  validateSessionToken,
+  ensureCORSHeaders,
+  isBotRequest,
+  getShopFromEvent,
+  renderAppBridgePage
+} from "./helpers.js";
+import { AppDistribution } from "../../types.js";
+export async function useShopifyAdmin(event) {
+  const api = getShopifyApi();
+  const config = getResolvedConfig();
+  const sessionStorage = getSessionStorage();
+  if (isBotRequest(event)) {
+    throw createError({
+      statusCode: 410,
+      statusMessage: "Gone"
+    });
+  }
+  if (event.method === "OPTIONS") {
+    ensureCORSHeaders(event);
+    throw createError({
+      statusCode: 204,
+      statusMessage: "No Content"
+    });
+  }
+  const headerToken = getSessionTokenHeader(event);
+  const paramToken = getSessionTokenFromUrlParam(event);
+  const sessionToken = headerToken || paramToken;
+  if (!sessionToken) {
+    const shop2 = getShopFromEvent(event);
+    if (!shop2) {
+      throw createError({
+        statusCode: 400,
+        statusMessage: "Missing shop parameter"
+      });
+    }
+    const query = getQuery(event);
+    const host = query.host;
+    if (!host) {
+      throw createError({
+        statusCode: 302,
+        statusMessage: "Redirect",
+        data: {
+          redirect: `${config.auth.path}?shop=${shop2}`
+        }
+      });
+    }
+    throw createError({
+      statusCode: 401,
+      statusMessage: "Unauthorized - No session token"
+    });
+  }
+  let payload;
+  let shop;
+  let sessionId;
+  if (config.distribution !== AppDistribution.ShopifyAdmin) {
+    payload = await validateSessionToken(sessionToken);
+    const dest = new URL(payload.dest);
+    shop = dest.hostname;
+    sessionId = config.useOnlineTokens ? api.session.getJwtSessionId(shop, payload.sub) : api.session.getOfflineId(shop);
+  } else {
+    shop = getShopFromEvent(event) || "";
+    sessionId = await api.session.getCurrentId({
+      isOnline: config.useOnlineTokens,
+      rawRequest: event.req,
+      rawResponse: event.res
+    }) || "";
+  }
+  const existingSession = sessionId ? await sessionStorage.loadSession(sessionId) : void 0;
+  let session;
+  if (existingSession && existingSession.isActive(api.config.scopes)) {
+    session = existingSession;
+  } else {
+    if (config.distribution === AppDistribution.ShopifyAdmin) {
+      if (!existingSession) {
+        throw createError({
+          statusCode: 401,
+          statusMessage: "No session found for this shop"
+        });
+      }
+      session = existingSession;
+    } else {
+      session = await performTokenExchange(
+        api,
+        config,
+        sessionStorage,
+        shop,
+        sessionToken
+      );
+    }
+  }
+  const admin = createAdminApiContext(api, session);
+  const billing = createBillingContext(api, config, session, event);
+  const cors = (response) => {
+    response.headers.set("Access-Control-Allow-Origin", config.appUrl);
+    response.headers.set("Access-Control-Allow-Credentials", "true");
+    return response;
+  };
+  const redirect = (url, init) => {
+    const target = init?.target || "_self";
+    if (url.startsWith("shopify://") || target !== "_self") {
+      return new Response(
+        renderAppBridgePage(config.apiKey, config.appUrl, url),
+        {
+          status: 200,
+          headers: { "Content-Type": "text/html" }
+        }
+      );
+    }
+    return new Response(null, {
+      status: 302,
+      headers: { Location: url }
+    });
+  };
+  return {
+    session,
+    admin,
+    sessionToken: payload,
+    billing,
+    cors,
+    redirect
+  };
+}
+async function performTokenExchange(api, config, sessionStorage, shop, sessionToken) {
+  const { session: onlineSession } = await api.auth.tokenExchange({
+    shop,
+    sessionToken,
+    requestedTokenType: config.useOnlineTokens ? "online" : "offline"
+  });
+  await sessionStorage.storeSession(onlineSession);
+  if (config.useOnlineTokens) {
+    const { session: offlineSession } = await api.auth.tokenExchange({
+      shop,
+      sessionToken,
+      requestedTokenType: "offline"
+    });
+    await sessionStorage.storeSession(offlineSession);
+  }
+  if (config.hooks?.afterAuth) {
+    const admin = createAdminApiContext(api, onlineSession);
+    await config.hooks.afterAuth({ session: onlineSession, admin });
+  }
+  return onlineSession;
+}
+function createBillingContext(api, config, session, _event) {
+  return {
+    require: async (options) => {
+      if (!config.billing) {
+        throw new Error(
+          "Billing is not configured. Add billing config to configureShopify()."
+        );
+      }
+      const plans = Array.isArray(options.plans) ? options.plans : [options.plans];
+      const hasPayment = await api.billing.check({ session, plans });
+      if (!hasPayment) {
+        const confirmationUrl = await api.billing.request({
+          session,
+          plan: plans[0],
+          isTest: true
+        });
+        throw new Response(null, {
+          status: 302,
+          headers: { Location: confirmationUrl }
+        });
+      }
+    },
+    check: async (options) => {
+      if (!config.billing) return { hasActivePayment: false };
+      const plans = options?.plans ? Array.isArray(options.plans) ? options.plans : [options.plans] : Object.keys(config.billing);
+      return api.billing.check({ session, plans });
+    },
+    request: async (options) => {
+      if (!config.billing) {
+        throw new Error("Billing is not configured.");
+      }
+      const confirmationUrl = await api.billing.request({
+        session,
+        plan: options.plan,
+        isTest: options.isTest ?? true,
+        returnUrl: options.returnUrl
+      });
+      return new Response(null, {
+        status: 302,
+        headers: { Location: confirmationUrl }
+      });
+    }
+  };
+}