Skip to content
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.

Sign up for GitHub

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

use event.target.value in Generators.input #1808

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

use event.target.value in Generators.input #1808

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
28b8e96
use event.target.value
Fil Nov 11, 2024
d8ab40b
Merge branch 'main' into fil/event.target
Fil Nov 13, 2024
23cb090
Merge branch 'main' into fil/event.target
mbostock Nov 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/client/stdlib/generators/input.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ export function input(element) {
return observe((change) => {
const event = eventof(element);
let value = valueof(element);
const inputted = () => change(valueof(element));
const inputted = (event) => change(valueof(event.target));
Comment on lines 6 to +7
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The fact that the initial value is valueof(element) while subsequent values are valueof(event.target) suggests that this may not be desirable. I see the benefit of being able to listen to a parent element, but in that case, how to determine the initial value of the generator? The generator would need to search within the container for an element that exposes a value. (And pick the first of multiple, arbitrarily?)

We could have the resize helper proxy the value of the returned element. Then you could say:

```js
const chart = resize((width) => scatterPlot(width));
const value = Generators.input(chart);
```

<div class="grid grid-cols-1">
  <div class="card">${chart}</div>
</div>

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good remark, I hadn't thought about the initial value. I think I'd prefer the “search” approach because it would be easier to use — and also because it fits my mental model of an event that bubbles up (wants to be seen and useful).

element.addEventListener(event, inputted);
if (value !== undefined) change(value);
return () => element.removeEventListener(event, inputted);
Expand Down