@swishapp/browser/README.md

JS library to integrate Swish into a browser environment.

# Swish app for browser environments

JavaScript library for integrating Swish on a Shopify web store (themes and headless stacks).

## Installation

To load the Swish app, you can either activate the Swish embed through your theme editor or install it via NPM. We recommend using the app embed for most scenarios. For headless stacks, NPM is necessary.

## With Swish embed

Make sure to activate the Swish embed in the theme editor!

```html
<script type="module">
  const swishApp = () =>
    new Promise((r) => {
      window.swish
        ? r(window.swish)
        : document.addEventListener("swish-ready", () => r(window.swish));
    });

  const swish = await swishApp();

  const { data } = await swish.api.items.list();
</script>
```

## Code only

```ts
import { swishApp } from "/apps/wishlist/assets/browser/swish.js";

const swish = await swishApp({
  proxy: {
    baseUrl: "/apps/wishlist",
  },
});

const { data } = await swish.api.items.list();
```

# Headless stacks

The Swish browser library requires a proxy service that operates on the same domain as the store. This service facilitates the loading of additional resources and ensures secure communication with the Swish API.

Please use the [Node.js library](https://www.npmjs.com/package/@swishapp/node) to implement the app proxy.

## Documentation

For more information visit [Swish DEV docs](https://developers.swish.app/libraries/browser).