Components: add FilePicker component
#3971
Conversation
TooTallNate
force-pushed
the
add/component-file-picker
branch
from
225d489 to
bb644d0
Compare
| @@ -28,6 +28,7 @@ | |||
| "commander": "2.3.0", | |||
| "component-classes": "1.2.1", | |||
| "component-closest": "0.1.4", | |||
| "component-file-picker": "0.2.1", | |||
There was a problem hiding this comment.
Do I need to do something with npm-shrinkwrap.json about this?
There was a problem hiding this comment.
yup, install clingwrap and clingwrap component-file-picker.
might need to be using npm@2.14.12 when you do it too? that bit is still unclear to me. @gwwar might be able to shed some light on it.
There was a problem hiding this comment.
https://github.com/Automattic/wp-calypso/blob/master/docs/shrinkwrap.md#modifying-dependencies
And we're currently using node 4.3.0 with npm 2.14.12
Feel free to ping me, if the instructions don't make sense
TooTallNate
changed the title
FilePicker componentFilePicker component
TooTallNate
added
[Status] Needs Review
| } | ||
|
|
||
| onSingle( files ) { | ||
| alert( 'Selected file: ' + JSON.stringify( files[0].name ) ); |
There was a problem hiding this comment.
maybe switch these to use debug ?
There was a problem hiding this comment.
You think so? For a doc example I thought it would be good to see the "results" of the user action kind of in-your-face. Gridicons uses prompt() for example, which is similar.
We should have some standard way of displaying results in the docs (a built-in log-dump thing would be cool).
TooTallNate
force-pushed
the
add/component-file-picker
branch
from
d5dae6b to
68e1d26
Compare
Opens a native browser file picker dialog when the user clicks
the contents of the component. Usage looks something like:
<FilePicker multiple accept="image/*" onPick={ console.log.bind(console) } >
<a href="#">Select a few images!</a>
</FilePicker>
Will be used for Reader's OPML "Import" button, but
is generic enough to turn into a reusable component.
No need for an extracted `renderPickers()` function that only gets called once, that's an anti-pattern.
TooTallNate
force-pushed
the
add/component-file-picker
branch
from
94a6832 to
82713b6
Compare
|
looks good! 🚢 |
blowery
added
[Status] Ready to Merge
and removed
[Status] Needs Review
Opens a native browser file picker dialog when the user clicks the contents of the component. Usage looks something like:
Will be used for Reader's OPML "Import" button, but is generic enough to turn into a reusable component.
This is my first React component!! In general I'm looking for feedback regarding implementation, and if this is a good use of a reusable component at all. I was skeptical at first since it's inherently a "functional component" (that is, has no UI built-in) but the more I thought about it, the more I thought it made sense with respect to a classic
<input type="file">element. But perhaps there's a better React mechanism then I'm doing here that I don't yet know of.Thanks in advance!
/cc @blowery @jancavan