-
Notifications
You must be signed in to change notification settings - Fork 84
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Observable Inputs README on GitHub should not reference viewof #344
Labels
documentation
Improvements or additions to documentation
Comments
Merged
Probably best to drop the |
Here's the patch I'm thinking of sending when we release framework: diff --git a/README.md b/README.md
index 0a72565..c9eb48d 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,15 @@
# Observable Inputs
-**Observable Inputs** are lightweight user interface components — buttons, sliders, dropdowns, tables, and the like — to help you explore data and build interactive displays in [Observable notebooks](https://observablehq.com). Each input can be used as an [Observable view](https://observablehq.com/@observablehq/introduction-to-views). For example, to allow a number *x* to be manipulated by a slider:
+**Observable Inputs** are lightweight user interface components — buttons, sliders, dropdowns, tables, and the like — to help you explore data and build interactive displays in [Observable](https://observablehq.com). Each input exposes a _value_ property that reflects its current value, and emits an _input_ event when the value changes. For example, to allow a number *x* to be manipulated by a slider:
+
+```js
+const slider = Inputs.range([0, 100]);
+slider.addEventListener((event) => {
+ // do something with event.value
+});
+```
+
+In Observable notebooks, the [`viewof`](https://observablehq.com/@observablehq/introduction-to-views) keyword can be used as a shortcut to display the view and create its reactive value *x* as a generator:
```js
viewof x = Inputs.range([0, 100])
@@ -12,10 +21,18 @@ Now you can reference the live value of *x* in any cell, *e.g.*:
md`The value of *x* is ${x}.`
```
-Any cell that references *x* will run automatically when the *viewof x* slider is moved. For live examples, see:
+Any cell that references *x* will run automatically when the slider is moved. For live examples, see:
https://observablehq.com/@observablehq/inputs
+In [Observable Framework](https://observablehq/com/framework), the reactivity is ensured with the *view* function, that both displays the input and returns the value generator. Write:
+
+```js
+const x = view(Inputs.range([0, 100]));
+```
+
+For live examples, see the [Framework Inputs](https://observablehq.com/framework/javascript/inputs) documentation.
+
Observable Inputs provides basic inputs:
* [Button](#button) - do something when a button is clicked
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The Observable Inputs page on github describes using the viewof keyword, which is not available in the cli.
The text was updated successfully, but these errors were encountered: