## REPL REPL itself is a component, `l-repl`. To the right you will see source similar to that used to define the REPL in the tab menu for this website. The REPL component has lots of configuration options, so you can use it to just display example code based on source files if you want or focus users on a specific aspect of the code. Try these steps to see the flexibility of `l-repl`: 1. Delete the entire slot and its contents starting with ``. You should now see a REPL with no content in each of the displayed areas. 2. Paste `src="./repl-as-src.html"` as one of the attributes of the `l-repl`. You should now see the same code you saw to start with, except it is loaded from a file. 3. Paste `readonly` as an attribute to the `l-repl`. Now, none of the code can be edited. also, the `Save` button in the frames section disappears. (You probably realized this by now, users can save their REPL edits to `IndexedDB` locally. Next time they visit, the REPL will be in the same state it was left in ... unless it has been more than 10 days on IOS ... Apple auto clears `IndexedDB for lack of use ;-(.). 4. Delete `readonly` from the `l-repl` (Ctrl-Z should work) and paste it as an attribute to "bodyhtml" slot. Now the body can't be edited. You can do this with the other slots also. 5. Remove `previewpinned` so as not to distract the user with a preview unless it is requested. 5. Assume you want to focus the user attention of the body and script without editing. Remove the slots "headhtml" and "css". Add "readonly" to the "script" slot, or the `l-repl`. Remove `previewheight`. Add `hidetabs` to the `l-repl`. One final note, if you want to use multiple script tags, then add `maintainbody` to the `l-repl` and your scripts will be left alone, otherwise, the `l-repl` assumes you only have one script.