Comments (11)
OK, I think I'm onboard. Thanks for clarifying with more reasonable examples.
So, let's flip things around a little and try to play devil's advocate for a second:
What if we took it to the next level and exposed a lightweight, but enhanced log
instance?
I'm thinking, the base would be log.message(text: string, options?: MessageOptions = { symbol: '│' })
(this is basically what you're asking for). To not deviate from the existing UI guidelines, it would output a newline before and after the logged line and use the appropriate color.
Then we could provide convenience wrappers around that, like:
log.info(text) = log.message(text, { symbol: 'ℹ' }) // would be blue
log.success(text) = log.message(text, { symbol: '✔' }) // would be green
log.warn(text) = log.message(text, { symbol: '⚠' }) // would be yellow
log.error(text) = log.message(text, { symbol: '✘' }) // would be red
One could even take it even further and add log.group()
/log.groupEnd()
which would indent the bar, but that would be for another time.
Thoughts?
// cc @natemoo-re
from clack.
Cool, cool. I can kick things off tonight, if you'd like? Free for you to build upon. I'll open and reference a PR with progress.
from clack.
I've hacked a way into it by creating a fake no-time spinner
😆 Creative! 👏
Just curious: where does note
fall short for you? What's a typical use case for what your requesting?
from clack.
Well, note
is like a big block of text spanning multiple lines with borders, title and decoration, therefore used for important messages and similar purposes.
I was aiming at just displaying a single line of text whenever convenient to communicate something to the user, but console.log will break the "continuous line" approach of the library. Therefore the hack to allow a single text line to be inside the whole thing.
Example mixed use case of text nodes and a note:
All those messages are static, not loading spinners, they don't get replaced after loading is complete and are not intended to. They serve as a "history" line of what's been happening.
from clack.
Well, note is like a big block of text spanning multiple lines with borders, title and decoration, therefore used for important messages and similar purposes.
Right.
All those messages are static, not loading spinners, they don't get replaced after loading is complete and are not intended to. They serve as a "history" line of what's been happening.
Now this is where you lose me. Looking at your example, the majority seem to be a perfect match for spinner
. Why would you/the user want to see the intermediary states in hindsight? Isn't the important part to know if a step has resolved or not? The other feedback should only be relevant while waiting, no?
I'm not saying this ain't happening, I'll let @natemoo-re be the judge here. I just don't see the point.
from clack.
Now this is where you lose me. Looking at your example, the majority seem to be a perfect match for spinner. Why would you/the user want to see the intermediary states? Isn't the important part to know if a step has resolved or not?
OK, giving it a second round of thought.
While still standing by the above: if each step is more less instant (thus no need for a spinner and getting rid of the intermediary states) in this case and all you want to do is log the completion of each step, now that I would buy.
Although not the best use case, hypothetically your example would be compressed to:
✅ Base project downloaded # (although this ought to take some time, so this should use a spinner for best UX)
✅ Template applied # (again, if there is a risk of not being instantaneous, taking more than a few hundred ms, use a spinner)
🎉 Project created!
from clack.
Although, the last step should use outro()
, IMO.
So still struggling to see a valid use case 🤷
from clack.
Maybe that wasn't the best use case for this, it was just what I was working on at the moment 😅
I can think of some other situations for this to be useful, like providing some context to the user before showing prompts:
Maybe provide some short contextual information:
Or even show some errors/information that are non-blocking with more data:
Or any other case where you just want to do a simple console.log
but want to keep it as part of the flow as well.
from clack.
That sounds great! Fits right in with what I'm building for my CLI 😄
Honestly I thought I was doing something wrong at the beginning, I just wanted to show a line of information to the user without breaking the flow 😅
from clack.
@ulken that sounds like the perfect API! Will try to get to this as soon as I can. ❤️
from clack.
@aerotoad feel free to try it out in #82.
from clack.
Related Issues (20)
- [Bug] `SelectPrompt` throws a `TypeError` when given an empty options array
- [Request] Grouped spinners? HOT 3
- [Question] Docs website for the future??
- [Question] Are spinner task groups no longer supported? HOT 6
- [Bug] Bun Incompatibility HOT 1
- [Request] Add `Error` support for `prompt.validate`
- [Bug] multiselect doesn't have `validate` option.
- [Request] prompt override
- [Request] Disable continuous terminal rewriting in CI HOT 1
- [Bug] Has anyone been able to get the @clack/prompts example working with Bun? HOT 4
- To allow the possibility of adding a JavaScript object as a value in a select value
- Spinner not showing on using silent exec HOT 2
- [Bug] Long select list glitches HOT 1
- [Request] May you give a release to take the feature [clear process listener in spinner](https://github.com/natemoo-re/clack/commit/8a6315eb39e83951676e3e61e32b6acec784f30c)
- [Bug] Keyboard input not working after await in spinner HOT 7
- [Request] p.info HOT 2
- [Bug] Typescript Select option value warning HOT 2
- Release new version
- [Request] Setting up Elm projects as well
- [Request] `Select` or `Multi-Select` provide `disable` option in `@clack/prompts`
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from clack.