Embed like behavior for example code

[fredboyle]

We have a use for using the lovely embed functionality but not to show existing previews but to show a documentation specific code example in action.

This is helpful to show code in action as individual parts of the component API are discussed in a documentation page. It also helps us show the actual source code used to generate the live example without creating previews for every possible scenario we want to discuss.

We could use a params based preview but unfortunately the source shows the param variables and not the actual values passed.

Example scenario:
Render a button with a custom label only. Label value of "Button label".

Example source:

render(ButtonComponent.new(label: label, id: id, options: { css: css_class, kind: kind, disabled: disabled })

Instead of:

render(ButtonComponent.new(label: "Button label")

Is there a method to accomplish this currently? Essentially pass a custom component method call to embed and let it work its magic?

[sorr-bulletproof]

We too would like to be able to do this. I have created a Lookbook with different components and wanted our developers to be able to set the options using Params and then the SOURCE to update to show the exact code they need to copy and paste. Is there anyway to do this?
Thanks!

[allmarkedup]

@fredboyle I really like the idea but unfortunately this is not possible at the moment, and would be quite tricky to implement as the whole of Lookbook's parsing/rendering/display model is built around analysing Preview classes and methods. It's an interesting idea though and I'll definitely keep it in mind for future updates in case there is a way to make something along these lines work.

@sorr-bulletproof I think what you are suggesting here is slightly different, but would also be super valuable - I have wanted the same thing myself many times, the params are great but it does mean that the source view is not very useful for copy and pasting when they are being used. This is also a non-trivial thing to figure out but I'll definitely have a think about this one too.

[sorr-bulletproof]

@allmarkedup Thank you for the reply! This is the last thing from us adopting Lookbook in our design process. Thank you again!