Hi there! Is there a way to pass a parameter to a...
# kobweb
r
Hi there! Is there a way to pass a parameter to a Kobweb call when using Markdown? What I would like to achieve is something like: Markdown:
Copy code
{{{ start .some.package.CustomComponent }}}

## My subtitle
**bunch** of text with *different* ~styles~

{{{ end .some.package.CustomComponent }}}

Rest of the markdown file
Composable:
Copy code
@Composable
fun CustomComponent(content: @Composable () -> Unit) {
    Div(attrs = CustomComponentStyle.toAttrs()) {
        // other custom stuff
        content()
    }
}
And in the generated file, it would call the custom component something like this:
Copy code
@Page("/awesome-markdown")
@Layout(".MarkdownLayout")
@Composable
fun Awesome_markdown() {
    project.some.package.CustomComponent {
        org.jetbrains.compose.web.dom.P {
            org.jetbrains.compose.web.dom.B {
                org.jetbrains.compose.web.dom.Text("bunch")
            }
            org.jetbrains.compose.web.dom.Text(" of text with ")
            org.jetbrains.compose.web.dom.Em {
                org.jetbrains.compose.web.dom.Text("different")
            }
            org.jetbrains.compose.web.dom.Text(" ~styles~")
        }
    }
    // Rest of the markdown file parsed
}
Would that be possible?
d
Yes let me see if I can find an example
But Kobweb is just putting the string straight into the code as is, and it adds () for you if you don't put any
r
That is the inline approach... What I would like to achieve is similar to the
KotlinText("Kotlin")
, except it should accept the markdown content instead... That would enable the custom component to render part of the content using the markdown style, like if it was a wrapper of something
d
Hold on I do something for creating folder icons from bullets
👀 1
d
Ah yes speaker notes is also an example
r
That was exactly what I was looking for!! However, it does look like it only work as soon as you don't have multiple paragraphs 😞
d
Hmmmm
r
Copy code
{{{ .CustomComponent

First paragraph

Second paragraph

}}}
The compiler returns this:
Copy code
1: Execution failed for task ':site:kobwebxMarkdownConvert'.
> Cannot invoke "org.commonmark.node.SourceSpan.getColumnIndex()" because the return value of "org.commonmark.parser.SourceLine.getSourceSpan()" is null
And it generates correctly once I remove the empty line between first and second paragraphs
d
I'll try it out and take a look
r
Copy code
{{{ .CustomComponent
First paragraph

Second paragraph
}}}
Has the same compilation error
Do you want me opening a GitHub issue for that?
d
Sure!
r
let me create a small project with reproduction as well, give me a sec
d
You might also try
Copy code
{{{ ...
  <p>First
  <p>Second
}}}
r
With
<p>
before the paragraph line works, but it breaks all the other styles from the Markdown...
d
Ok. What about using <br> instead?
Not long term solutions, just seeing if I can unblock you
r
Let me check.
Yes, it kinds of work, but it won't add a new paragraph, as I was expecting, but at least unblock it for now
Just created a github issue for that: https://github.com/varabyte/kobweb/issues/725 I hope it is descriptive enough, giving all the context. Let me know if you need any help from my end
d
Thank you very much! I'll keep the bug up to date
r
Thx
d
So yeah, it's a bug in my markdown parser. (Basically, the official markdown Java library is poorly documented and in this case has a property which is, I guess, just null sometimes! A non-problem if it had been Kotlin, oh well)
I already have a super quick fix locally which just handles the null
I will take a bit of time to make sure this is the right fix, but one way or another, I should have a snapshot up soon that fixes it.