Skip to content

Commit 01894af

Browse files
committed
feat: add timeline and event nodes
1 parent 67054db commit 01894af

File tree

5 files changed

+264
-4
lines changed

5 files changed

+264
-4
lines changed

README.md

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,7 @@ type BodyBlock =
106106
| Video
107107
| YoutubeVideo
108108
| Text
109+
| Timeline
109110
```
110111
111112
`BodyBlock` nodes are the only things that are valid as the top level of a `Body`.
@@ -762,6 +763,30 @@ interface CustomCodeComponent extends Node {
762763
- The basic interface in Spark to make reference to this system above (eg. the git repo URL or a public S3 bucket), and provide some data for it if necessary. This will be the Custom Component storyblock.
763764
- The data Spark receives from entering a specific ID will be used to render dynamic fields (the `attributes`).
764765

766+
### Timeline
767+
768+
```ts
769+
type TimelineLayoutWidth = Extract<LayoutWidth, "full-width" | "inset-left">
770+
771+
interface Timeline extends Parent {
772+
type: "timeline"
773+
layoutWidth: TimelineLayoutWidth
774+
children: [Heading, ...Event[]]
775+
}
776+
```
777+
778+
**Timeline** nodes display events in arbitrary order.
779+
780+
### Event
781+
782+
```ts
783+
interface Event extends Parent {
784+
dateLabel: string
785+
children: Paragraph[]
786+
}
787+
```
788+
789+
**Event** nodes represents an event. They can be used in timelines.
765790

766791
## License
767792

content-tree.d.ts

Lines changed: 44 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
export declare namespace ContentTree {
2-
type BodyBlock = Paragraph | Heading | ImageSet | Flourish | BigNumber | CustomCodeComponent | Layout | List | Blockquote | Pullquote | ScrollyBlock | ThematicBreak | Table | Recommended | Tweet | Video | YoutubeVideo | Text;
2+
type BodyBlock = Paragraph | Heading | ImageSet | Flourish | BigNumber | CustomCodeComponent | Layout | List | Blockquote | Pullquote | ScrollyBlock | ThematicBreak | Table | Recommended | Tweet | Video | YoutubeVideo | Text | Timeline;
33
type LayoutWidth = "auto" | "in-line" | "inset-left" | "inset-right" | "full-bleed" | "full-grid" | "mid-grid" | "full-width";
44
type Phrasing = Text | Break | Strong | Emphasis | Strikethrough | Link;
55
interface Node {
@@ -278,8 +278,18 @@ export declare namespace ContentTree {
278278
/** Configuration data to be passed to the component. */
279279
attributes: CustomCodeComponentAttributes;
280280
}
281+
type TimelineLayoutWidth = Extract<LayoutWidth, "full-width" | "inset-left">;
282+
interface Timeline extends Parent {
283+
type: "timeline";
284+
layoutWidth: TimelineLayoutWidth;
285+
children: [Heading, ...Event[]];
286+
}
287+
interface Event extends Parent {
288+
dateLabel: string;
289+
children: Paragraph[];
290+
}
281291
namespace full {
282-
type BodyBlock = Paragraph | Heading | ImageSet | Flourish | BigNumber | CustomCodeComponent | Layout | List | Blockquote | Pullquote | ScrollyBlock | ThematicBreak | Table | Recommended | Tweet | Video | YoutubeVideo | Text;
292+
type BodyBlock = Paragraph | Heading | ImageSet | Flourish | BigNumber | CustomCodeComponent | Layout | List | Blockquote | Pullquote | ScrollyBlock | ThematicBreak | Table | Recommended | Tweet | Video | YoutubeVideo | Text | Timeline;
283293
type LayoutWidth = "auto" | "in-line" | "inset-left" | "inset-right" | "full-bleed" | "full-grid" | "mid-grid" | "full-width";
284294
type Phrasing = Text | Break | Strong | Emphasis | Strikethrough | Link;
285295
interface Node {
@@ -558,9 +568,19 @@ export declare namespace ContentTree {
558568
/** Configuration data to be passed to the component. */
559569
attributes: CustomCodeComponentAttributes;
560570
}
571+
type TimelineLayoutWidth = Extract<LayoutWidth, "full-width" | "inset-left">;
572+
interface Timeline extends Parent {
573+
type: "timeline";
574+
layoutWidth: TimelineLayoutWidth;
575+
children: [Heading, ...Event[]];
576+
}
577+
interface Event extends Parent {
578+
dateLabel: string;
579+
children: Paragraph[];
580+
}
561581
}
562582
namespace transit {
563-
type BodyBlock = Paragraph | Heading | ImageSet | Flourish | BigNumber | CustomCodeComponent | Layout | List | Blockquote | Pullquote | ScrollyBlock | ThematicBreak | Table | Recommended | Tweet | Video | YoutubeVideo | Text;
583+
type BodyBlock = Paragraph | Heading | ImageSet | Flourish | BigNumber | CustomCodeComponent | Layout | List | Blockquote | Pullquote | ScrollyBlock | ThematicBreak | Table | Recommended | Tweet | Video | YoutubeVideo | Text | Timeline;
564584
type LayoutWidth = "auto" | "in-line" | "inset-left" | "inset-right" | "full-bleed" | "full-grid" | "mid-grid" | "full-width";
565585
type Phrasing = Text | Break | Strong | Emphasis | Strikethrough | Link;
566586
interface Node {
@@ -824,9 +844,19 @@ export declare namespace ContentTree {
824844
/** How the component should be presented in the article page according to the column layout system */
825845
layoutWidth: LayoutWidth;
826846
}
847+
type TimelineLayoutWidth = Extract<LayoutWidth, "full-width" | "inset-left">;
848+
interface Timeline extends Parent {
849+
type: "timeline";
850+
layoutWidth: TimelineLayoutWidth;
851+
children: [Heading, ...Event[]];
852+
}
853+
interface Event extends Parent {
854+
dateLabel: string;
855+
children: Paragraph[];
856+
}
827857
}
828858
namespace loose {
829-
type BodyBlock = Paragraph | Heading | ImageSet | Flourish | BigNumber | CustomCodeComponent | Layout | List | Blockquote | Pullquote | ScrollyBlock | ThematicBreak | Table | Recommended | Tweet | Video | YoutubeVideo | Text;
859+
type BodyBlock = Paragraph | Heading | ImageSet | Flourish | BigNumber | CustomCodeComponent | Layout | List | Blockquote | Pullquote | ScrollyBlock | ThematicBreak | Table | Recommended | Tweet | Video | YoutubeVideo | Text | Timeline;
830860
type LayoutWidth = "auto" | "in-line" | "inset-left" | "inset-right" | "full-bleed" | "full-grid" | "mid-grid" | "full-width";
831861
type Phrasing = Text | Break | Strong | Emphasis | Strikethrough | Link;
832862
interface Node {
@@ -1105,5 +1135,15 @@ export declare namespace ContentTree {
11051135
/** Configuration data to be passed to the component. */
11061136
attributes?: CustomCodeComponentAttributes;
11071137
}
1138+
type TimelineLayoutWidth = Extract<LayoutWidth, "full-width" | "inset-left">;
1139+
interface Timeline extends Parent {
1140+
type: "timeline";
1141+
layoutWidth: TimelineLayoutWidth;
1142+
children: [Heading, ...Event[]];
1143+
}
1144+
interface Event extends Parent {
1145+
dateLabel: string;
1146+
children: Paragraph[];
1147+
}
11081148
}
11091149
}

schemas/body-tree.schema.json

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,9 @@
122122
},
123123
{
124124
"$ref": "#/definitions/ContentTree.transit.Text"
125+
},
126+
{
127+
"$ref": "#/definitions/ContentTree.transit.Timeline"
125128
}
126129
]
127130
},
@@ -185,6 +188,30 @@
185188
],
186189
"type": "object"
187190
},
191+
"ContentTree.transit.Event": {
192+
"additionalProperties": false,
193+
"properties": {
194+
"children": {
195+
"items": {
196+
"$ref": "#/definitions/ContentTree.transit.Paragraph"
197+
},
198+
"type": "array"
199+
},
200+
"data": {},
201+
"dateLabel": {
202+
"type": "string"
203+
},
204+
"type": {
205+
"type": "string"
206+
}
207+
},
208+
"required": [
209+
"children",
210+
"dateLabel",
211+
"type"
212+
],
213+
"type": "object"
214+
},
188215
"ContentTree.transit.Flourish": {
189216
"additionalProperties": false,
190217
"properties": {
@@ -1089,6 +1116,44 @@
10891116
],
10901117
"type": "object"
10911118
},
1119+
"ContentTree.transit.Timeline": {
1120+
"additionalProperties": false,
1121+
"properties": {
1122+
"children": {
1123+
"additionalItems": {
1124+
"$ref": "#/definitions/ContentTree.transit.Event"
1125+
},
1126+
"items": [
1127+
{
1128+
"$ref": "#/definitions/ContentTree.transit.Heading"
1129+
}
1130+
],
1131+
"minItems": 1,
1132+
"type": "array"
1133+
},
1134+
"data": {},
1135+
"layoutWidth": {
1136+
"$ref": "#/definitions/ContentTree.transit.TimelineLayoutWidth"
1137+
},
1138+
"type": {
1139+
"const": "timeline",
1140+
"type": "string"
1141+
}
1142+
},
1143+
"required": [
1144+
"children",
1145+
"layoutWidth",
1146+
"type"
1147+
],
1148+
"type": "object"
1149+
},
1150+
"ContentTree.transit.TimelineLayoutWidth": {
1151+
"enum": [
1152+
"full-width",
1153+
"inset-left"
1154+
],
1155+
"type": "string"
1156+
},
10921157
"ContentTree.transit.Tweet": {
10931158
"additionalProperties": false,
10941159
"properties": {

schemas/content-tree.schema.json

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,9 @@
147147
},
148148
{
149149
"$ref": "#/definitions/ContentTree.full.Text"
150+
},
151+
{
152+
"$ref": "#/definitions/ContentTree.full.Timeline"
150153
}
151154
]
152155
},
@@ -236,6 +239,30 @@
236239
],
237240
"type": "object"
238241
},
242+
"ContentTree.full.Event": {
243+
"additionalProperties": false,
244+
"properties": {
245+
"children": {
246+
"items": {
247+
"$ref": "#/definitions/ContentTree.full.Paragraph"
248+
},
249+
"type": "array"
250+
},
251+
"data": {},
252+
"dateLabel": {
253+
"type": "string"
254+
},
255+
"type": {
256+
"type": "string"
257+
}
258+
},
259+
"required": [
260+
"children",
261+
"dateLabel",
262+
"type"
263+
],
264+
"type": "object"
265+
},
239266
"ContentTree.full.Flourish": {
240267
"additionalProperties": false,
241268
"properties": {
@@ -1867,6 +1894,44 @@
18671894
],
18681895
"type": "object"
18691896
},
1897+
"ContentTree.full.Timeline": {
1898+
"additionalProperties": false,
1899+
"properties": {
1900+
"children": {
1901+
"additionalItems": {
1902+
"$ref": "#/definitions/ContentTree.full.Event"
1903+
},
1904+
"items": [
1905+
{
1906+
"$ref": "#/definitions/ContentTree.full.Heading"
1907+
}
1908+
],
1909+
"minItems": 1,
1910+
"type": "array"
1911+
},
1912+
"data": {},
1913+
"layoutWidth": {
1914+
"$ref": "#/definitions/ContentTree.full.TimelineLayoutWidth"
1915+
},
1916+
"type": {
1917+
"const": "timeline",
1918+
"type": "string"
1919+
}
1920+
},
1921+
"required": [
1922+
"children",
1923+
"layoutWidth",
1924+
"type"
1925+
],
1926+
"type": "object"
1927+
},
1928+
"ContentTree.full.TimelineLayoutWidth": {
1929+
"enum": [
1930+
"full-width",
1931+
"inset-left"
1932+
],
1933+
"type": "string"
1934+
},
18701935
"ContentTree.full.Tweet": {
18711936
"additionalProperties": false,
18721937
"properties": {

schemas/transit-tree.schema.json

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,9 @@
147147
},
148148
{
149149
"$ref": "#/definitions/ContentTree.transit.Text"
150+
},
151+
{
152+
"$ref": "#/definitions/ContentTree.transit.Timeline"
150153
}
151154
]
152155
},
@@ -210,6 +213,30 @@
210213
],
211214
"type": "object"
212215
},
216+
"ContentTree.transit.Event": {
217+
"additionalProperties": false,
218+
"properties": {
219+
"children": {
220+
"items": {
221+
"$ref": "#/definitions/ContentTree.transit.Paragraph"
222+
},
223+
"type": "array"
224+
},
225+
"data": {},
226+
"dateLabel": {
227+
"type": "string"
228+
},
229+
"type": {
230+
"type": "string"
231+
}
232+
},
233+
"required": [
234+
"children",
235+
"dateLabel",
236+
"type"
237+
],
238+
"type": "object"
239+
},
213240
"ContentTree.transit.Flourish": {
214241
"additionalProperties": false,
215242
"properties": {
@@ -1114,6 +1141,44 @@
11141141
],
11151142
"type": "object"
11161143
},
1144+
"ContentTree.transit.Timeline": {
1145+
"additionalProperties": false,
1146+
"properties": {
1147+
"children": {
1148+
"additionalItems": {
1149+
"$ref": "#/definitions/ContentTree.transit.Event"
1150+
},
1151+
"items": [
1152+
{
1153+
"$ref": "#/definitions/ContentTree.transit.Heading"
1154+
}
1155+
],
1156+
"minItems": 1,
1157+
"type": "array"
1158+
},
1159+
"data": {},
1160+
"layoutWidth": {
1161+
"$ref": "#/definitions/ContentTree.transit.TimelineLayoutWidth"
1162+
},
1163+
"type": {
1164+
"const": "timeline",
1165+
"type": "string"
1166+
}
1167+
},
1168+
"required": [
1169+
"children",
1170+
"layoutWidth",
1171+
"type"
1172+
],
1173+
"type": "object"
1174+
},
1175+
"ContentTree.transit.TimelineLayoutWidth": {
1176+
"enum": [
1177+
"full-width",
1178+
"inset-left"
1179+
],
1180+
"type": "string"
1181+
},
11171182
"ContentTree.transit.Tweet": {
11181183
"additionalProperties": false,
11191184
"properties": {

0 commit comments

Comments
 (0)