@shopify/admin-ui-extensions
TypeScript icon, indicating that this package has built-in type declarations

1.1.0 • Public • Published

Admin UI Extensions

Admin UI Extensions is a library that enables developers to write custom JavaScript to be sent to and rendered within the Shopify Admin UI on Web, Android, and iOS. It makes use of Shopify's remote-ui library, which exposes the methods to create a RemoteRoot -- a root node that communicates operations (adding or removing children, changing properties of components, etc.) through a MessageChannel to the Shopify app.

Usage

There are two ways to use Admin UI Extensions components in your extension - vanilla JS and React.

With the vanilla JS approach, adding a button looks like the following:

import {extend, Button} from '@shopify/admin-ui-extensions';

extend('Playground', (root) => {
  const button = root.createComponent(Button, {
    title: 'Press Me',
    primary: true,
    onPress: () => console.log('Pressed'),
    disabled: false,
  });

  root.appendChild(button);
  root.mount();
});

You can find more component usage examples alongside each component in packages/admin-ui-extensions/src/components

To use the React implementation, check out packages/admin-ui-extensions-react.

Readme

Keywords

none

Package Sidebar

Install

npm i @shopify/admin-ui-extensions

Weekly Downloads

4,955

Version

1.1.0

License

MIT

Unpacked Size

172 kB

Total Files

277

Last publish

Collaborators

  • jaimie.rockburn
  • blittle
  • shopify-admin
  • maryharte
  • crisfmb
  • pmoloney89
  • netlohan
  • st999999
  • justin-irl
  • megswim
  • wcandillon
  • nathanpjf
  • shopify-dep
  • goodforonefare
  • lemonmade
  • vsumner
  • wizardlyhel
  • antoine.grant
  • tsov
  • andyw8-shopify
  • henrytao
  • hannachen
  • vividviolet
  • bpscott