docs: display all signatures

[ST-DDT]

This PR changes the docs by showing all api signatures of a method instead of only the last one.

Single Signature

https://deploy-preview-3030.fakerjs.dev/api/color.html#csssupportedfunction

Multi Signature

https://deploy-preview-3030.fakerjs.dev/api/color.html#cmyk

• No Args

  

• With Options

  

Not sure whether we should merge this first and then find a way to name the signatures or vice versa.

[netlify[bot]]

✅ Deploy Preview for fakerjs ready!

Name	Link
🔨 Latest commit	9bc9a325c8c37ead4917cbd4afaf57c8596b396e
🔍 Latest deploy log	https://app.netlify.com/sites/fakerjs/deploys/66e87e4750ab95000846ca63
😎 Deploy Preview	https://deploy-preview-3030.fakerjs.dev
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[codecov[bot]]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 99.97%. Comparing base (3e47ee7) to head (9bc9a32). Report is 37 commits behind head on next.

Additional details and impacted files

@@           Coverage Diff            @@
##             next    #3030    +/-   ##
========================================
  Coverage   99.96%   99.97%            
========================================
  Files        2776     2776            
  Lines      226338   226338            
  Branches      589      943   +354     
========================================
+ Hits       226267   226275     +8     
+ Misses         71       63     -8     

see 1 file with indirect coverage changes

[Shinigami92]

thoughts: this come with some downsides regarding UX using CTRL+F also I personally don't like the "style" of the buttons, could we potentially use tabs instead? Maybe some other frameworks do have already something similar (?)

[matthewmayer]

This definitely seems confusing to navigate. There is no way to know what signature you need without clicking on all of them. Having a single table with all the parameters like currently seems more intuitive.

[ST-DDT]

This definitely seems confusing to navigate. There is no way to know what signature you need without clicking on all of them.

That would probably be solved by giving them names.

No Args	With Options

Or

String Format Options	Decimal Format Options

Having a single table with all the parameters like currently seems more intuitive.

How about greying out the ones not applying to the current signature? Or limiting the swap to only the signature and examples?

---

thoughts: this come with some downsides regarding UX using CTRL+F also I personally don't like the "style" of the buttons, could we potentially use tabs instead? Maybe some other frameworks do have already something similar (?)

Any suggestions?

[Shinigami92]

Any suggestions?

I thought about something like this: https://quasar.dev/vue-components/tab-panels#with-qtabs But even with these, the CTRL+F UX would be missing 🙁

If we dont find something nice that still works in terms of UX, we might even leave as is 🤷

[ST-DDT]

How about horizontal scrolling? That way it should be searchable.

[Shinigami92]

How about horizontal scrolling? That way it should be searchable.

maybe, feel free to try and experiment

[ST-DDT]

Horizontal UI results in weird behavior/UX and I wasn't able to make it look good (or visible that you can actually scroll there horizontally).

@xDivisionByZerox Any ideas on how to display multiple signatures?

[xDivisionByZerox]

@xDivisionByZerox Any ideas on how to display multiple signatures?

I can try to come up with a prototype tomorrow :+1:

[matthewmayer]

I'm not really sure showing multiple signatures is necessary. Given most methods have very simple signatures (just passing an options object). Showing a good set of examples is probably easier to quickly grasp than showing all the signatures.