> ## Documentation Index
> Fetch the complete documentation index at: https://swish.app/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Utilities

> Reference for Swish SDK utility functions and UI element creation.

The SDK exposes helper functions under `swish.utils` and `swish.ui` for common tasks that don't fit into the other namespaces.

## `swish.utils`

### `copyToClipboard(text)`

Copy a string to the user's clipboard. Returns a result object indicating success or failure.

```js theme={null}
const result = await swish.utils.copyToClipboard(
  "https://example.com/list/abc",
);

if (result.ok) {
  swish.intents.invoke("show:toast", {
    text: "Link copied!",
    variant: "compact",
  });
} else {
  console.error(result.issues);
}
```

| Parameter | Type | Required | Description |
| - | - | - | - |
| `text` | `string` | Yes | The text to copy. |

**Returns** `Promise<{ ok: true } | { ok: false; issues: string[] }>`

Falls back gracefully when the Clipboard API is unavailable (e.g. insecure contexts), returning `{ ok: false, issues: ["Clipboard API not available"] }`.

### `createShareUrl({ publicListId })`

Generate a shareable URL for a public list. The URL is constructed from your store's domain and the configured `listDetailPagePath`.

```js theme={null}
const url = swish.utils.createShareUrl({
  publicListId: "abc123",
});

// https://my-store.com/apps/wishlist?public-list-id=abc123
```

| Parameter | Type | Required | Description |
| - | - | - | - |
| `publicListId` | `string` | Yes | The public list ID. |

**Returns** `URL`

## `swish.ui`

### `createElement(name)`

Create a Swish UI custom element programmatically. The element is returned as an `HTMLElement` that you can append to the DOM.

```js theme={null}
const saveButton = await swish.ui.createElement("save-button");
document.querySelector(".product-actions").appendChild(saveButton);
```

| Parameter | Type | Required | Description |
| - | - | - | - |
| `name` | `string` | Yes | The element type (e.g. `"save-button"`, `"header-button"`). |

**Returns** `Promise<HTMLElement>`

> [!TIP]
>
> For most use cases, [placements](https://swish.app/docs/references/sdk/placements.md) are a better fit
>
> * they handle DOM observation, mounting, and cleanup automatically. Use
>   `createElement` when you need full manual control over element lifecycle.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.