Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Atomic Fusion: Content with TOC
prototype(Some.Package:Component.ContentWithToc) < prototype(Neos.Fusion:Component) {
blocks = Neos.Fusion:RawArray
renderer = afx`
<nav>
<ul>
<Neos.Fusion:Collection collection={props.blocks} itemName="block" @children="itemRenderer">
<li>
<a href={'#c-' + iterator.cycle}>{block.label}</a>
</li>
</Neos.Fusion:Collection>
</ul>
</nav>
<Neos.Fusion:Collection collection={props.blocks} itemName="block" @children="itemRenderer">
<div id={'#c-' + iterator.cycle}>
{block.content}
</div>
</Neos.Fusion:Collection>
`
}
prototype(Some.Package:Component.ContentWithToc.Block) < prototype(Neos.Fusion:RawArray) {
label = ''
content = ''
}
root = Some.Package:Component.ContentWithToc {
blocks {
0 = Some.Package:Component.ContentWithToc.Block {
label = 'Content #1'
content = 'Lorem ipsum dolor #1'
}
1 = Some.Package:Component.ContentWithToc.Block {
label = 'Content #2'
content = 'Lorem ipsum dolor #2'
}
2 = Some.Package:Component.ContentWithToc.Block {
label = 'Content #3'
content = 'Lorem ipsum dolor #3'
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.