1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
|
export default {
extraDependencies: ['html'],
slots: {
title: {
type: 'html',
mutable: false,
},
cover: {
type: 'html',
mutable: true,
},
},
generate: (slots, {html}) =>
html.tag('div', {class: 'content-sticky-heading-container'},
!html.isBlank(slots.cover) &&
{class: 'has-cover'},
[
html.tag('div', {class: 'content-sticky-heading-row'}, [
html.tag('h1', slots.title),
html.tag('div', {class: 'content-sticky-heading-cover-container'},
{[html.onlyIfContent]: true},
html.tag('div', {class: 'content-sticky-heading-cover'},
{[html.onlyIfContent]: true},
(() => {
if (html.isBlank(slots.cover)) {
return html.blank();
}
// Try very hard to set the cover's 'mode' slot to 'thumbnail'
// and its 'details' slot to html.blank().
let setMode = false;
let setDetails = false;
let cover = slots.cover;
while (true) {
if (!cover) {
return html.blank();
}
if (!(cover instanceof html.Template)) {
return cover;
}
// The cover from `slots` is already cloned (since it's
// mutable), but later ones are not, and for extremely scary
// content function infrastructure reasons, it is possible
// for the identity of the content of the clone-template
// to be the same as the cloned template.
if (cover !== slots.cover) {
cover = cover.clone();
}
if (!setMode) {
try {
cover.setSlot('mode', 'thumbnail');
setMode = true;
} catch {
// No mode slot, or it doesn't allow 'thumbnail'.
}
}
if (!setDetails) {
try {
cover.setSlot('details', html.blank());
setDetails = true;
} catch {
// No details slot, or it doesn't allow html.blank().
// We're setting a blank instead of null because null is
// always allowed, and can carry a different semantic
// meaning, like "put something else here by default
// instead please".
}
}
if (setMode && setDetails) {
return cover;
}
cover = cover.content;
}
})())),
]),
html.tag('div', {class: 'content-sticky-subheading-row'},
html.tag('h2', {class: 'content-sticky-subheading'})),
]),
};
|