diff --git a/site/src/components/Repl/Output/PropEditor.svelte b/site/src/components/Repl/Output/PropEditor.svelte
deleted file mode 100644
index 4ea6ce5e7f..0000000000
--- a/site/src/components/Repl/Output/PropEditor.svelte
+++ /dev/null
@@ -1,71 +0,0 @@
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/site/src/components/Repl/Output/ReplProxy.js b/site/src/components/Repl/Output/ReplProxy.js
index 44b77b84dd..7ae56e35b7 100644
--- a/site/src/components/Repl/Output/ReplProxy.js
+++ b/site/src/components/Repl/Output/ReplProxy.js
@@ -57,11 +57,6 @@ export default class ReplProxy {
this.handleCommandMessage(event.data);
}
- if (action === 'prop_update') {
- const { prop, value } = args;
- this.handlers.onPropUpdate(prop, value)
- }
-
if (action === 'fetch_progress') {
this.handlers.onFetchProgress(args.remaining)
}
@@ -71,14 +66,6 @@ export default class ReplProxy {
return this.iframeCommand('eval', { script });
}
- setProp(prop, value) {
- return this.iframeCommand('set_prop', {prop, value})
- }
-
- bindProps(props) {
- return this.iframeCommand('bind_props', { props })
- }
-
handleLinks() {
return this.iframeCommand('catch_clicks', {});
}
diff --git a/site/src/components/Repl/Output/Viewer.svelte b/site/src/components/Repl/Output/Viewer.svelte
index eec904526f..08ae0f9639 100644
--- a/site/src/components/Repl/Output/Viewer.svelte
+++ b/site/src/components/Repl/Output/Viewer.svelte
@@ -6,9 +6,8 @@
import { decode } from 'sourcemap-codec';
const dispatch = createEventDispatcher();
- const { bundle, values, navigate } = getContext('REPL');
+ const { bundle, navigate } = getContext('REPL');
- export let props;
export let error; // TODO should this be exposed as a prop?
export function setProp(prop, value) {
@@ -26,13 +25,6 @@
onMount(() => {
proxy = new ReplProxy(iframe, {
- onPropUpdate: (prop, value) => {
- dispatch('binding', { prop, value });
- values.update(values => Object.assign({}, values, {
- [prop]: value
- }));
- },
-
onFetchProgress: progress => {
pending_imports = progress;
}
@@ -84,13 +76,10 @@
window._svelteTransitionManager = null;
window.component = new SvelteComponent({
- target: document.body,
- props: ${JSON.stringify($values)}
+ target: document.body
});
`);
- await proxy.bindProps(props);
-
error = null;
} catch (e) {
const loc = getLocationFromStack(e.stack, $bundle.dom.map);
diff --git a/site/src/components/Repl/Output/index.svelte b/site/src/components/Repl/Output/index.svelte
index ce67ca5f7a..9212b516ed 100644
--- a/site/src/components/Repl/Output/index.svelte
+++ b/site/src/components/Repl/Output/index.svelte
@@ -4,7 +4,6 @@
import Viewer from './Viewer.svelte';
import CompilerOptions from './CompilerOptions.svelte';
import Compiler from './Compiler.js';
- import PropEditor from './PropEditor.svelte';
import CodeMirror from '../CodeMirror.svelte';
const { values, register_output } = getContext('REPL');
@@ -13,9 +12,6 @@
export let sourceErrorLoc;
export let runtimeError;
export let embedded;
- export let show_props;
-
- let props;
let compile_options = {
generate: 'dom',
@@ -39,7 +35,6 @@
js_editor.set(compiled.js, 'js');
css_editor.set(compiled.css, 'css');
- if (compiled.props) props = compiled.props;
},
update: async selected => {
@@ -49,7 +44,6 @@
js_editor.update(compiled.js);
css_editor.update(compiled.css);
- if (compiled.props) props = compiled.props;
}
});
@@ -119,19 +113,6 @@
color: var(--text);
}
- .props {
- display: grid;
- padding: 0.5em;
- grid-template-columns: auto 1fr;
- grid-auto-rows: min-content;
- grid-gap: 0.5em;
- overflow-y: auto;
- }
-
- .props code {
- top: .1rem;
- }
-
.tab-content {
position: absolute;
width: 100%;
@@ -166,44 +147,11 @@
-
-
-
-
-
-
- {#if show_props}
- Props editor
-
- {#if props}
- {#if props.length > 0}
-
- {#each props.sort() as prop (prop)}
-
{prop}
-
-
-
- {/each}
-
- {:else}
-
- {/if}
- {/if}
- {/if}
-
-
+
diff --git a/site/src/components/Repl/index.svelte b/site/src/components/Repl/index.svelte
index 30757f1868..aa9a9fed93 100644
--- a/site/src/components/Repl/index.svelte
+++ b/site/src/components/Repl/index.svelte
@@ -11,7 +11,6 @@
export let version = 'beta'; // TODO change this to latest when the time comes
export let embedded = false;
export let orientation = 'columns';
- export let show_props = true;
export function toJSON() {
// TODO there's a bug here — Svelte hoists this function because
@@ -22,14 +21,12 @@
return {
imports: $bundle.imports,
- components: $components,
- values: $values
+ components: $components
};
}
export function set(data) {
components.set(data.components);
- values.set(data.values);
selected.set(data.components[0]);
module_editor.set($selected.source, $selected.type);
@@ -40,7 +37,6 @@
const { name, type } = $selected || {};
components.set(data.components);
- values.set(data.values);
const matched_component = data.components.find(file => file.name === name && file.type === type);
selected.set(matched_component || data.components[0]);
@@ -57,7 +53,6 @@
const dispatch = createEventDispatcher();
const components = writable([]);
- const values = writable({});
const selected = writable(null);
const bundle = writable(null);
@@ -66,7 +61,6 @@
setContext('REPL', {
components,
- values,
selected,
bundle,
@@ -227,7 +221,7 @@
diff --git a/site/src/routes/repl/_components/AppControls/index.svelte b/site/src/routes/repl/_components/AppControls/index.svelte
index 9f1b6a47a7..427137ae45 100644
--- a/site/src/routes/repl/_components/AppControls/index.svelte
+++ b/site/src/routes/repl/_components/AppControls/index.svelte
@@ -1,5 +1,4 @@