Skip to content

Commit e15c6be

Browse files
committed
Add some docs around embedding the webcomponent
1 parent 3dcddd1 commit e15c6be

1 file changed

Lines changed: 14 additions & 4 deletions

File tree

README.md

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -48,12 +48,22 @@ See the section about [deployment](https://facebook.github.io/create-react-app/d
4848

4949
The repo includes the Editor Web Component which shares components with the editor application but has a separate build process.
5050

51-
### `yarn stat:wc`
51+
### Embedding
5252

53-
Runs the web component in development mode.
54-
Open [http://localhost:3001](http://localhost:3001) to view it in the browser.
53+
The web component can be included in a page by using the `<editor-wc>` HTML element. It takes the following attributes
5554

56-
There is no production build setup for the web component at present.
55+
* `code`: A preset blob of code to show in the editor pane.
56+
* `sense_hat_always_enabled`: Show the Astro Pi Sense HAT emulator on page load
57+
58+
### `yarn start:wc`
59+
60+
Runs the web component in development mode. Open [http://localhost:3001](http://localhost:3001) to view it in the browser.
61+
62+
**NB** You need to have the main `yarn start` process running too.
63+
64+
It is possible to add query strings to control how the web component is configured. Any HTML attribute can be set on the query string, including `class`, `style` etc.
65+
66+
For example, to load the page with the Sense Hat always showing, add [`?sense_hat_always_enabled` to the URL](http://localhost:3001?sense_hat_always_enabled)
5767

5868
## Review apps
5969

0 commit comments

Comments
 (0)