-
Notifications
You must be signed in to change notification settings - Fork 46
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Sample App] Markdown Renderer Polyfill #151
Comments
Yeah, I guess we could use a InfoBar for this that shows that its an experimental control with maybe a link to some readme that explains what that means? I'll take it along in the mock-up! |
Hmm... I'm having trouble even just trying to add a split reference to Microsoft.Toolkit.Uwp/CommunityToolkit.WinUI.UI.Controls.Markdown package in <!-- Project Head/Sample App dependencies -->
<ItemGroup Condition="'$(IsUwp)' == 'True' AND '$(IsUno)' == 'False'">
<PackageReference Include="Microsoft.Toolkit.Uwp.UI.Controls.Markdown" Version="7.1.2"/>
</ItemGroup>
<ItemGroup Condition="'$(IsWinAppSdk)' == 'True' AND '$(IsUno)' == 'False'">
<PackageReference Include="CommunityToolkit.WinUI.UI.Controls.Markdown" Version="7.1.2"/>
</ItemGroup> (See branch But it's not restoring properly... hmm. May need some help here @Arlodotexe. In the meantime, I'm going to try and clean-up the MSB4011 warnings with an idea I had for #99 |
Filed #182 to resolve underlying dependency issue needed to proceed here. |
I have the initial work by @nickrandolph ported over, tried to update Marked.js while I was at it (and added a third-party notice). However, couldn't get it to work on web assembly. It appears like it's loading the marked library, but then can't find it when it goes to execute parsing of the markdown blurb. This work is in the |
Was thinking the other day, we could just try using This would also mean that if we ever get to re-writing the MarkdownTextblock to use Markdig, we could leverage this as a stop-gap for Uno platforms until they have RichTextBlock support. (unless we also change our rendering approach). (This would also give us the opportunity to evaluate how we plug-in to Markdig and rendering for custom Markdown things and display that before we rework the Toolkit control... I think, maybe?) |
Could maybe do a similar approach with code preview to use ColorCode in order to spit out HTML to inject in the page for the code samples. |
Good news is that Markdig is working in WASM. Uno JS interop makes it pretty easy. Though need to match fonts. Also, issues with layout... so needs some more work. Probably has to do with height of control changing after initial layout pass? |
Have an initial version which works decently, though not sure how to properly color the links parsed by MarkDig, assume there's a CSS style we'd have to apply or something? I'm not sure how these things interact with Uno and how the WinUI styles work there... @Arlodotexe any thoughts? Though, if this is a good enough approach, should be simple enough to have another RichTextBlock wrapper for ColorCode which uses that on Windows and Html on WASM for the C#/XAML examples. Don't have time to do that now though. |
…ommunityToolkit#151 Works pretty well, seems to be a timing issue with layout and the image in the Rive sample I think? Slowing down in the debugger causes it not to occur, so hard to understand.
Split out from CommunityToolkit/Tooling-Windows-Submodule#72, Follow-on from PR #85
Problem Statement
Our current documentation is shown in raw Markdown instead of nice documentation.
We can use the Toolkit's
MarkdownTextblock
to resolve this, except on WASM. So we need a wrapper to make this work everywhere (in the sample app, not something we want to ship as a control).Technical Background
In #85, I wrote code to split out the markdown snippets and inject the displayed samples in the
ToolkitDocumentationRenderer
:Labs-Windows/common/CommunityToolkit.Labs.Shared/Renderers/ToolkitDocumentationRenderer.xaml.cs
Lines 121 to 141 in 8f23803
As well as a Template Selector to pick the right template to use:
Labs-Windows/common/CommunityToolkit.Labs.Shared/Renderers/ToolkitDocumentationRenderer.xaml
Lines 13 to 29 in 8f23803
So, all we should have to do is update the
DocumentTemplate
to leverage this new control that understands how to display the Markdown snippet.Solution
Fortunately, @nickrandolph started a markdown based solution using marked.js for WASM that we can use for the individual blurbs from the MVVM Toolkit Sample App, see here: CommunityToolkit/MVVM-Samples@911b355~
And he's given us permission to leverage that code from that PR which didn't get merged:
I'm not sure if his version used WebView/marked even on native platform, so that may be a difference, but the general approach and code here should be handy to reference.
We'll probably want to update the Marked version referenced from the original PR there (and not sure if they included minified version).
We'll also need to a Third Party Notice file like we have in the toolkit since we'll be including the source directly as it's JavaScript.
Open Questions
The text was updated successfully, but these errors were encountered: