From d756bee8ee4c8347930714998b43551a49330107 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Wed, 3 Apr 2024 11:56:32 -0300 Subject: content: generatePageSidebarBox, etc --- src/content/dependencies/generatePageSidebar.js | 68 +++++++++---------------- 1 file changed, 25 insertions(+), 43 deletions(-) (limited to 'src/content/dependencies/generatePageSidebar.js') diff --git a/src/content/dependencies/generatePageSidebar.js b/src/content/dependencies/generatePageSidebar.js index 10576270..a7da3d1d 100644 --- a/src/content/dependencies/generatePageSidebar.js +++ b/src/content/dependencies/generatePageSidebar.js @@ -1,10 +1,14 @@ -import {empty, filterMultipleArrays, stitchArrays} from '#sugar'; - export default { + contentDependencies: ['generatePageSidebarBox'], extraDependencies: ['html'], + relations: (relation) => ({ + box: + relation('generatePageSidebarBox'), + }), + slots: { - // Content is a flat HTML array. It'll generate one sidebar section + // Content is a flat HTML array. It'll all be placed into one sidebar box // if specified. content: { type: 'html', @@ -19,14 +23,10 @@ export default { mutable: false, }, - // Chunks of content to be split into separate sections or "boxes" in the - // sidebar. Each of these can also be associated with HTML attributes. - multipleContents: { - validate: v => v.strictArrayOf(v.isHTML), - }, - - multipleAttributes: { - validate: v => v.strictArrayOf(v.isAttributes), + // Chunks of content to be split into separate boxes in the sidebar. + boxes: { + type: 'html', + mutable: false, }, // Sticky mode controls which sidebar sections, if any, follow the @@ -62,9 +62,12 @@ export default { }, }, - generate(slots, {html}) { + generate(relations, slots, {html}) { const attributes = - html.attributes({class: 'sidebar-column'}); + html.attributes({class: [ + 'sidebar-column', + 'sidebar-multiple', + ]}); attributes.add(slots.attributes); @@ -84,38 +87,17 @@ export default { attributes.add('class', `sticky-${slots.stickyMode}`); } - let content = slots.content; + const boxes = + (!html.isBlank(slots.boxes) + ? slots.boxes + : !html.isBlank(slots.content) + ? relations.box.slot('content', slots.content) + : html.blank()); - if (html.isBlank(content)) { - if (!slots.multipleContents) { - return html.blank(); - } - - const multipleContents = slots.multipleContents.slice(); - const multipleAttributes = slots.multipleAttributes?.slice() ?? []; - - filterMultipleArrays( - multipleContents, - multipleAttributes, - content => !html.isBlank(content)); - - if (empty(multipleContents)) { - return html.blank(); - } - - attributes.add('class', 'sidebar-multiple'); - content = - stitchArrays({ - content: multipleContents, - attributes: multipleAttributes, - }).map(({content, attributes}) => - html.tag('div', {class: 'sidebar'}, - attributes, - content)); + if (html.isBlank(boxes)) { + return html.blank(); } else { - attributes.add('class', 'sidebar'); + return html.tag('div', attributes, boxes); } - - return html.tag('div', attributes, content); }, }; -- cgit 1.3.0-6-gf8a5