{"version":3,"file":"index.mjs","names":[],"sources":["../../../node_modules/react/cjs/react-jsx-runtime.production.js","../../../node_modules/react/jsx-runtime.js","../../../src/react/components/AppProvider/AppProvider.tsx","../../../src/react/components/AppProxyProvider/AppProxyProvider.tsx","../../../src/react/components/AppProxyLink/AppProxyLink.tsx"],"sourcesContent":["/**\n * @license React\n * react-jsx-runtime.production.js\n *\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n\"use strict\";\nvar REACT_ELEMENT_TYPE = Symbol.for(\"react.transitional.element\"),\n  REACT_FRAGMENT_TYPE = Symbol.for(\"react.fragment\");\nfunction jsxProd(type, config, maybeKey) {\n  var key = null;\n  void 0 !== maybeKey && (key = \"\" + maybeKey);\n  void 0 !== config.key && (key = \"\" + config.key);\n  if (\"key\" in config) {\n    maybeKey = {};\n    for (var propName in config)\n      \"key\" !== propName && (maybeKey[propName] = config[propName]);\n  } else maybeKey = config;\n  config = maybeKey.ref;\n  return {\n    $$typeof: REACT_ELEMENT_TYPE,\n    type: type,\n    key: key,\n    ref: void 0 !== config ? config : null,\n    props: maybeKey\n  };\n}\nexports.Fragment = REACT_FRAGMENT_TYPE;\nexports.jsx = jsxProd;\nexports.jsxs = jsxProd;\n","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n  module.exports = require('./cjs/react-jsx-runtime.production.js');\n} else {\n  module.exports = require('./cjs/react-jsx-runtime.development.js');\n}\n","import React, {useEffect} from 'react';\nimport {useNavigate} from '@tanstack/react-router';\n\ninterface BaseProps {\n  children: React.ReactNode;\n  /**\n   * Optional slot to render router devtools (for example, `<TanStackRouterDevtools />`).\n   *\n   * This lets apps mount devtools in one place without this package depending on\n   * a specific devtools package.\n   */\n  routerDevtools?: React.ReactNode;\n  /**\n   * Controls whether `routerDevtools` should be rendered.\n   *\n   * Defaults to `true` so you can keep the element wired up and disable it\n   * conditionally (for example, in production).\n   */\n  enableRouterDevtools?: boolean;\n}\n\ninterface EmbeddedProps extends BaseProps {\n  /**\n   * If this route should be rendered inside the Shopify admin.\n   *\n   * Setting this to true will include the App Bridge script on the page.\n   * If true and the route is loaded outside the Shopify admin, then the user will be redirected to the Shopify admin.\n   *\n   * Setting this to false will not include the App Bridge script on the page.\n   *\n   * {@link https://shopify.dev/docs/apps/admin/embedded-app-home}\n   */\n  embedded: true;\n  /**\n   * The API key for your Shopify app. This is the `Client ID` from the Partner Dashboard.\n   *\n   * When using the Shopify CLI, this is the `SHOPIFY_API_KEY` environment variable. If you're using the environment\n   * variable, then you need to pass it from the loader to the component.\n   */\n  apiKey: string;\n}\n\ninterface NonEmbeddedProps extends BaseProps {\n  /**\n   * If this route should be rendered inside the Shopify admin.\n   *\n   * Setting this to false means only Polaris Web components will be added to the route, not App Bridge.\n   *\n   * Setting this to true will include the App Bridge script on the page.\n   *\n   * {@link https://shopify.dev/docs/apps/admin/embedded-app-home}\n   */\n  embedded?: false;\n}\n\n/**\n * Props for the `AppProvider` component.\n * @publicDocs\n */\nexport type AppProviderProps = NonEmbeddedProps | EmbeddedProps;\n\n/**\n * Sets up your app to look like the admin\n *\n * Adds Polaris Web components to the route.\n * If embedded is true and apiKey is provided, then the App Bridge script will be added to the page.\n *\n * {@link https://shopify.dev/docs/apps/admin/embedded-app-home}\n * {@link https://shopify.dev/docs/api/app-home/using-polaris-components}\n * {@link https://shopify.dev/tools/app-bridge}\n *\n * @example\n * <caption>Set up AppProvider for an embedded route</caption>\n * <description>Wrap your route in the `AppProvider` component and pass in your API key.</description>\n * ```ts\n * // /app/routes/**\\/*.ts\n * import {useLoaderData} from '@tanstack/react-router';\n * import {authenticate} from '~/shopify.server';\n * import {AppProvider} from '@yan-ad/shopify-app-tanstack/react';\n *\n * export async function loader({ request }) {\n *   await authenticate.admin(request);\n *\n *   return { apiKey: process.env.SHOPIFY_API_KEY };\n * }\n *\n * export default function App() {\n *   const { apiKey } = useLoaderData();\n *\n *   return (\n *     <AppProvider embedded apiKey={apiKey}>\n *       <Outlet />\n *     </AppProvider>\n *   );\n * }\n * ```\n *\n * @example\n * <caption>Set up AppProvider for a non-embedded route</caption>\n * <description>Add Polaris web components to the route, without adding the App Bridge script.</description>\n * ```ts\n * // /app/routes/**\\/*.ts\n * import {AppProvider} from '@yan-ad/shopify-app-tanstack/react';\n *\n * export default function App() {\n *   return (\n *     <AppProvider embedded={false}>\n *       <Outlet />\n *     </AppProvider>\n *   );\n * }\n * ```\n */\nexport function AppProvider(props: AppProviderProps) {\n  const shouldRenderRouterDevtools =\n    props.enableRouterDevtools !== false && props.routerDevtools;\n\n  return (\n    <>\n      {props.embedded && <AppBridge apiKey={props.apiKey} />}\n      <script src=\"https://cdn.shopify.com/shopifycloud/polaris.js\" />\n      {props.children}\n      {shouldRenderRouterDevtools}\n    </>\n  );\n}\n\ninterface AppBridgeProps {\n  apiKey: EmbeddedProps['apiKey'];\n}\n\nfunction AppBridge({apiKey}: AppBridgeProps) {\n  const navigate = useNavigate();\n\n  useEffect(() => {\n    const handleNavigate = (event: Event) => {\n      const href = (event.target as HTMLElement)?.getAttribute('href');\n      if (href) {\n        navigate({href});\n      }\n    };\n\n    document.addEventListener('shopify:navigate', handleNavigate);\n\n    return () => {\n      document.removeEventListener('shopify:navigate', handleNavigate);\n    };\n  }, [navigate]);\n\n  return (\n    <script\n      src=\"https://cdn.shopify.com/shopifycloud/app-bridge.js\"\n      data-api-key={apiKey}\n    />\n  );\n}\n","import {createContext, useEffect, useState} from 'react';\n\n/**\n * Props for the `AppProxyProvider` component.\n * @publicDocs\n */\nexport interface AppProxyProviderProps {\n  /**\n   * The URL where the app is hosted. You can set this from the `SHOPIFY_APP_URL` environment variable.\n   */\n  appUrl: string;\n\n  /**\n   * The children to render.\n   */\n  children?: React.ReactNode;\n}\n\ntype FormatUrlFunction = (\n  url: string | undefined,\n  addOrigin?: boolean,\n) => string | undefined;\n\ninterface AppProxyProviderContextProps {\n  appUrl: string;\n  formatUrl: FormatUrlFunction;\n  requestUrl?: URL;\n}\n\nexport const AppProxyProviderContext =\n  createContext<AppProxyProviderContextProps | null>(null);\n\n/**\n * Sets up a page to render behind a Shopify app proxy, enabling JavaScript and CSS to be loaded from the app.\n *\n * > Caution:\n * Because React Router doesn't support URL rewriting, any route using this component should <b>match the pathname of the proxy\n * URL exactly</b>, and <b>end in a trailing slash</b> (e.g., `https://<shop>/apps/proxy/`).\n *\n * @example\n * <caption>Wrap a route with an AppProxyProvider component.</caption>\n * <description>Wrap your route component in the `AppProxyProvider` component and pass in your app URL.</description>\n * ```ts\n * // /app/routes/**\\/*.ts\n * import {authenticate} from '~/shopify.server';\n * import {AppProxyProvider} from '@yan-ad/shopify-app-tanstack/react';\n *\n * export async function loader({ request }) {\n *   await authenticate.public.appProxy(request);\n *\n *   return json({ appUrl: process.env.SHOPIFY_APP_URL });\n * }\n *\n * export default function App() {\n *   const { appUrl } = useLoaderData();\n *\n *   return (\n *     <AppProxyProvider appUrl={appUrl}>\n *       Page content\n *     </AppProxyProvider>\n *   );\n * }\n * ```\n */\nexport function AppProxyProvider(props: AppProxyProviderProps) {\n  const {children, appUrl} = props;\n  const [requestUrl, setRequestUrl] = useState<URL | undefined>();\n\n  useEffect(\n    () => setRequestUrl(new URL(window.location.href)),\n    [setRequestUrl],\n  );\n\n  return (\n    <AppProxyProviderContext.Provider\n      value={{appUrl, requestUrl, formatUrl: formatProxyUrl(requestUrl)}}\n    >\n      <base href={appUrl} />\n\n      {children}\n    </AppProxyProviderContext.Provider>\n  );\n}\n\nfunction formatProxyUrl(requestUrl: URL | undefined): FormatUrlFunction {\n  return (url: string | undefined, addOrigin = true) => {\n    if (!url) {\n      return url;\n    }\n\n    let finalUrl = url;\n\n    if (addOrigin && requestUrl && finalUrl.startsWith('/')) {\n      finalUrl = new URL(`${requestUrl.origin}${url}`).href;\n    }\n    if (!finalUrl.endsWith('/')) {\n      finalUrl = `${finalUrl}/`;\n    }\n\n    return finalUrl;\n  };\n}\n","import {forwardRef, useContext} from 'react';\n\nimport {AppProxyProviderContext} from '../AppProxyProvider';\n\nexport interface AppProxyLinkProps extends React.DetailedHTMLProps<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  HTMLAnchorElement\n> {\n  href: string;\n}\n\n/**\n * Sets up an `<a />` HTML element that works when rendered behind an app proxy.\n *\n * Supports any properties accepted by the `<a />` HTML element.\n *\n * @example\n * <caption>Link to a different route.</caption>\n * <description>Use an `AppProxyLink` within an `AppProxyProvider` to link to a different proxied route.</description>\n * ```ts\n * // /app/routes/**\\/*.ts\n * import {authenticate} from '~/shopify.server';\n * import {AppProxyProvider, AppProxyLink} from '@yan-ad/shopify-app-tanstack/react';\n *\n * export async function loader({ request }) {\n *   await authenticate.public.appProxy(request);\n *\n *   return json({ appUrl: process.env.SHOPIFY_APP_URL });\n * }\n *\n * export default function App() {\n *   const { appUrl } = useLoaderData();\n *\n *   return (\n *     <AppProxyProvider appUrl={appUrl}>\n *       <AppProxyLink href=\"/other-proxy-route\">Link to another route</AppProxyLink>\n *     </AppProxyProvider>\n *   );\n * }\n * ```\n * @publicDocs\n */\nexport const AppProxyLink = forwardRef<HTMLAnchorElement, AppProxyLinkProps>(\n  function AppProxyLink(props, ref) {\n    const context = useContext(AppProxyProviderContext);\n\n    if (!context) {\n      throw new Error(\n        'AppProxyLink must be used within an AppProxyProvider component',\n      );\n    }\n\n    const {children, href, ...otherProps} = props;\n\n    return (\n      <a href={context.formatUrl(href)} {...otherProps} ref={ref}>\n        {children}\n      </a>\n    );\n  },\n);\n"],"x_google_ignoreList":[0,1],"mappings":"wOAWA,IAAI,EAAqB,OAAO,IAAI,6BAA6B,CAC/D,EAAsB,OAAO,IAAI,iBAAiB,CACpD,SAAS,EAAQ,EAAM,EAAQ,EAAU,CACvC,IAAI,EAAM,KAGV,GAFW,IAAX,IAAK,KAAmB,EAAM,GAAK,GACxB,EAAO,MAAlB,IAAK,KAAqB,EAAM,GAAK,EAAO,KACxC,QAAS,EAEX,IAAK,IAAI,IADT,GAAW,EAAE,CACQ,EACT,IAAV,QAAuB,EAAS,GAAY,EAAO,SAChD,EAAW,EAElB,MADA,GAAS,EAAS,IACX,CACL,SAAU,EACJ,OACD,MACL,IAAgB,IAAX,IAAK,GAAwB,KAAT,EACzB,MAAO,EACR,CAEH,EAAQ,SAAW,EACnB,EAAQ,IAAM,EACd,EAAQ,KAAO,kBC9Bb,EAAO,QAAA,GAAA,MC8GT,SAAgB,EAAY,EAAyB,CACnD,IAAM,EACJ,EAAM,uBAAyB,IAAS,EAAM,eAEhD,OACE,EAAA,EAAA,MAAA,EAAA,SAAA,CAAA,SAAA,CACG,EAAM,WAAY,EAAA,EAAA,KAAC,EAAD,CAAW,OAAQ,EAAM,OAAU,CAAA,EACtD,EAAA,EAAA,KAAC,SAAD,CAAQ,IAAI,kDAAoD,CAAA,CAC/D,EAAM,SACN,EACA,CAAA,CAAA,CAQP,SAAS,EAAU,CAAC,UAAyB,CAC3C,IAAM,EAAW,GAAa,CAiB9B,OAfA,MAAgB,CACd,IAAM,EAAkB,GAAiB,CACvC,IAAM,EAAQ,EAAM,QAAwB,aAAa,OAAO,CAC5D,GACF,EAAS,CAAC,OAAK,CAAC,EAMpB,OAFA,SAAS,iBAAiB,mBAAoB,EAAe,KAEhD,CACX,SAAS,oBAAoB,mBAAoB,EAAe,GAEjE,CAAC,EAAS,CAAC,EAGZ,EAAA,EAAA,KAAC,SAAD,CACE,IAAI,qDACJ,eAAc,EACd,CAAA,CC5HN,IAAa,EACX,EAAmD,KAAK,CAkC1D,SAAgB,EAAiB,EAA8B,CAC7D,GAAM,CAAC,WAAU,UAAU,EACrB,CAAC,EAAY,GAAiB,GAA2B,CAO/D,OALA,MACQ,EAAc,IAAI,IAAI,OAAO,SAAS,KAAK,CAAC,CAClD,CAAC,EAAc,CAChB,EAGC,EAAA,EAAA,MAAC,EAAwB,SAAzB,CACE,MAAO,CAAC,SAAQ,aAAY,UAAW,EAAe,EAAW,CAAC,UADpE,EAGE,EAAA,EAAA,KAAC,OAAD,CAAM,KAAM,EAAU,CAAA,CAErB,EACgC,GAIvC,SAAS,EAAe,EAAgD,CACtE,OAAQ,EAAyB,EAAY,KAAS,CACpD,GAAI,CAAC,EACH,OAAO,EAGT,IAAI,EAAW,EASf,OAPI,GAAa,GAAc,EAAS,WAAW,IAAI,GACrD,EAAW,IAAI,IAAI,GAAG,EAAW,SAAS,IAAM,CAAC,MAE9C,EAAS,SAAS,IAAI,GACzB,EAAW,GAAG,EAAS,IAGlB,GCzDX,IAAa,EAAe,EAC1B,SAAsB,EAAO,EAAK,CAChC,IAAM,EAAU,EAAW,EAAwB,CAEnD,GAAI,CAAC,EACH,MAAU,MACR,iEACD,CAGH,GAAM,CAAC,WAAU,OAAM,GAAG,GAAc,EAExC,OACE,EAAA,EAAA,KAAC,IAAD,CAAG,KAAM,EAAQ,UAAU,EAAK,CAAE,GAAI,EAAiB,MACpD,WACC,CAAA,EAGT"}