Skip to content

Beta

These App Bridge components are new and have not yet been tested in a live Shopify admin. Their API may change in a minor release while in beta. If something doesn't work, please open an issue.

AppWindow ​

Before you start, see Install; for open, see Modal.

AppWindow renders s-app-window, which the @shopify/app-bridge-types docs describe as "a fullscreen modal window in the Shopify admin". src is required: "the URL is loaded in an iframe when the window opens".

vue
<script setup lang="ts">
import { ref } from 'vue'
import { AppWindow } from 'polaris-vue-elements/app-bridge'

const open = ref(false)
</script>

<template>
  <button @click="open = true">Edit in bulk</button>
  <AppWindow id="bulk-editor" src="/bulk-editor" v-model:open="open" />
</template>

open, v-model:open, show/hide and hiding on unmount work as for Modal. It has no slot.

Released under the MIT License. Vue logo by Evan You, CC BY-NC-SA 4.0.