[UI] Search-autocomplete

fionataeyang commented 3 years ago

`@todo`

[x] implement first iteration of component
- [x] create repository
- [x] set up local dev environment with pnpm
- [x] pnpm link the modules locally
  - [x] pnpm link --global (to make them available)
  - [x] pnpm link --global <./package.json#name>
- @output :package: repository
[x] refactor component for filter and its dependencies and tag with v0.0.0-prealpha
- @output :package: repository
- [x] refactor very old commit with domlog and old button/icon to use versions
- [x] rebase main branch on top of taged version
- [x] update package.json (new path for the dependencies)
- @output :package: v0.0.0-prealpha
[x] refactor component latest commit with new comm protocol and tag with v0.0.1-alpha
- @input :package: v0.0.0-prealpha
- [x] refactor latest commit with latest terminal/log to use versions
- [x] refactor communication protocol to use latest message standard
- [x] move terminal/logs to dev dependencies
- [x] rebase main branch on top of taged version
- [x] update package.json (new path for the dependencies)
- [x] update github page links
- [x] build new bundle.js to include changes in demo page
- @output :question: v0.0.1-alpha
[ ] refactor component latest commit with new comm protocol and tag with v0.0.3-alpha
- @input :package: v0.0.2-alpha
- [ ] set up github page using demo maker component dev dependency
- @output :question: repository#v0.0.3-alpha
[ ] implement next component version v0.0.4-alpha
- @input :question: v0.0.3-alpha
- [ ] fix bugs & add features for v0.0.4- [ ] support single select (Support a filter for search swarm key and terminal messages using)
- [x] Search input
- [x] Search input filter result
- [x] Filter result
- [x] Get feeds length
- [x] Select swarm
- [x] Add CSS style
- [x] Filter result from option's dropdown(Available/Not available/Hypercore/Hyperdrive/Cabal)
- [ ] Address type valid (current use http://)
- [x] Error style (when address is not valid)
- [ ] Refactor codes(protocol, receive, recipients)
- [ ] refactor all messages and status and update documentation
- [ ] set up github page using demo maker component dev dependency
- [ ] document component api in readme or whatever needs to show in the readme
- [ ] document apis for each screen and return available actions
  - @input :question: wireframes action bars
- [ ] document component api in readme
- [x] list all opts
- [x] list all roles
- [x] list all incoming message types
- [x] list all outgoing message types
- [ ] list all possible status the component instance can be in
- @output :factory: README.md
- [ ] install latest dev dependencies
- [ ] budo
- [ ] browserify
- [ ] datdot-terminal
- [ ] install latest specific version of dependencies
- [ ] #3
- [ ] #20
- [ ] #10
- [x] #77
- [x] #53
- [ ] #72
- [ ] update github page links
- [ ] build new bundle.js to include changes in demo page
- [ ] update package.json (new path for the dependencies)
- @output :question: v0.0.4-alpha

`@info`

Repo :open_file_folder:

-https://github.com/datdotorg/datdot-ui-autocomplete

Notes

(by @fionataeyang)

Search input is a very crucial widget for whole app search, and even it uses for searching swarm key, feeds, locations...so on. Haven't thinking about how to work with it. Because they use different message to trigger event for the different component. So, must be making a list of what search input can do for.