@gpichot/spectacle-deck 1.0.0 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/map.d.ts +3 -3
- package/components/styled.d.ts +20 -20
- package/index.cjs +445 -203
- package/index.mjs +444 -202
- package/layouts/CenteredLayout.d.ts +2 -0
- package/layouts/Default3Layout.d.ts +5 -0
- package/layouts/SectionLayout.d.ts +5 -5
- package/layouts/index.d.ts +10 -5
- package/layouts/styled.d.ts +5 -5
- package/layouts/utils.d.ts +1 -0
- package/package.json +2 -1
package/index.mjs
CHANGED
|
@@ -1,41 +1,329 @@
|
|
|
1
1
|
// src/index.tsx
|
|
2
|
-
import
|
|
2
|
+
import React19 from "react";
|
|
3
|
+
import { MDXProvider } from "@mdx-js/react";
|
|
4
|
+
import { Deck as SpectacleDeck, Slide } from "spectacle";
|
|
5
|
+
|
|
6
|
+
// src/layouts/CenteredLayout.tsx
|
|
7
|
+
import React2 from "react";
|
|
8
|
+
import styled from "styled-components";
|
|
3
9
|
|
|
4
|
-
//
|
|
10
|
+
// src/layouts/utils.ts
|
|
5
11
|
import React from "react";
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
var Margins = {
|
|
13
|
+
vertical: "4rem",
|
|
14
|
+
horizontal: "7rem",
|
|
15
|
+
horizontalInternal: "2rem"
|
|
16
|
+
};
|
|
17
|
+
function getHeading(children) {
|
|
18
|
+
const allChild = React.Children.toArray(children);
|
|
19
|
+
if (allChild.length === 0)
|
|
20
|
+
return [null, allChild];
|
|
21
|
+
const [candidate, ...rest] = allChild;
|
|
22
|
+
if (!React.isValidElement(candidate))
|
|
23
|
+
return [null, allChild];
|
|
24
|
+
if (["h2", "h3"].includes(candidate.props.originalType)) {
|
|
25
|
+
return [candidate, rest];
|
|
26
|
+
}
|
|
27
|
+
return [null, allChild];
|
|
28
|
+
}
|
|
29
|
+
function getCode(children) {
|
|
30
|
+
const allChild = React.Children.toArray(children);
|
|
31
|
+
if (allChild.length === 0)
|
|
32
|
+
return [null, allChild];
|
|
33
|
+
const index = allChild.findIndex((child) => {
|
|
34
|
+
if (!React.isValidElement(child))
|
|
35
|
+
return false;
|
|
36
|
+
return child.props.originalType === "pre";
|
|
37
|
+
});
|
|
38
|
+
if (index === -1)
|
|
39
|
+
return [null, allChild];
|
|
40
|
+
const candidate = allChild[index];
|
|
41
|
+
const rest = allChild.filter((_, i) => i !== index);
|
|
42
|
+
return [candidate, rest];
|
|
43
|
+
}
|
|
44
|
+
function getMatchingMdxType(children, mdxType) {
|
|
45
|
+
const allChild = React.Children.toArray(children);
|
|
46
|
+
const matchFn = (child) => {
|
|
47
|
+
if (!React.isValidElement(child))
|
|
48
|
+
return false;
|
|
49
|
+
if (typeof child.type !== "function")
|
|
50
|
+
return false;
|
|
51
|
+
if ("mdxType" in child.type === false)
|
|
52
|
+
return false;
|
|
53
|
+
return child.type.mdxType === mdxType;
|
|
54
|
+
};
|
|
55
|
+
const matches = allChild.filter(matchFn);
|
|
56
|
+
const rest = allChild.filter((child) => !matchFn(child));
|
|
57
|
+
return [matches, rest];
|
|
58
|
+
}
|
|
59
|
+
function getCodeChildren(children) {
|
|
60
|
+
const [code, rest] = getCode(children);
|
|
61
|
+
if (code)
|
|
62
|
+
return [code, rest];
|
|
63
|
+
const [codeStepper, rest2] = getMatchingMdxType(children, "CodeStepper");
|
|
64
|
+
if (codeStepper.length > 0)
|
|
65
|
+
return [codeStepper, rest2];
|
|
66
|
+
const [codes, rest3] = getMatchingMdxType(children, "FilePane");
|
|
67
|
+
return [codes, rest3];
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
// src/layouts/CenteredLayout.tsx
|
|
71
|
+
var CenteredLayoutContent = styled.div`
|
|
72
|
+
h2,
|
|
73
|
+
h3 {
|
|
74
|
+
}
|
|
75
|
+
`;
|
|
76
|
+
var CenteredLayout = (props) => {
|
|
77
|
+
const [heading, rest] = getHeading(props.children);
|
|
78
|
+
return /* @__PURE__ */ React2.createElement(
|
|
79
|
+
"div",
|
|
80
|
+
{
|
|
81
|
+
...props,
|
|
82
|
+
style: {
|
|
83
|
+
height: "100%",
|
|
84
|
+
display: "flex",
|
|
85
|
+
flexFlow: "column",
|
|
86
|
+
alignItems: "center",
|
|
87
|
+
justifyContent: "center",
|
|
88
|
+
margin: `0 ${Margins.horizontal}`
|
|
14
89
|
}
|
|
15
|
-
return { ...contextComponents, ...components };
|
|
16
90
|
},
|
|
17
|
-
|
|
91
|
+
rest,
|
|
92
|
+
/* @__PURE__ */ React2.createElement(
|
|
93
|
+
CenteredLayoutContent,
|
|
94
|
+
{
|
|
95
|
+
style: {
|
|
96
|
+
position: "absolute",
|
|
97
|
+
opacity: 0.8,
|
|
98
|
+
marginBottom: "2rem",
|
|
99
|
+
marginTop: "2rem",
|
|
100
|
+
bottom: 0
|
|
101
|
+
}
|
|
102
|
+
},
|
|
103
|
+
heading
|
|
104
|
+
)
|
|
105
|
+
);
|
|
106
|
+
};
|
|
107
|
+
|
|
108
|
+
// src/layouts/Default3Layout.tsx
|
|
109
|
+
import React3 from "react";
|
|
110
|
+
import styled2 from "styled-components";
|
|
111
|
+
function MultipleHexagons({ position }) {
|
|
112
|
+
return /* @__PURE__ */ React3.createElement(
|
|
113
|
+
"svg",
|
|
114
|
+
{
|
|
115
|
+
viewBox: `${position === "left" ? "0" : "2"} 0 12 20`,
|
|
116
|
+
width: "12",
|
|
117
|
+
height: "20",
|
|
118
|
+
fill: "none",
|
|
119
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
120
|
+
},
|
|
121
|
+
/* @__PURE__ */ React3.createElement(
|
|
122
|
+
"path",
|
|
123
|
+
{
|
|
124
|
+
d: "M 3.913 5.381 L 2.063 4.314 L 2.063 2.173 L 3.913 1.103 L 5.761 2.173 L 5.761 4.314 L 3.913 5.381 Z M 2.38 4.128 L 3.913 5.014 L 5.444 4.128 L 5.444 2.356 L 3.913 1.47 L 2.38 2.356 L 2.38 4.128 Z",
|
|
125
|
+
fill: "#F49676"
|
|
126
|
+
}
|
|
127
|
+
),
|
|
128
|
+
/* @__PURE__ */ React3.createElement(
|
|
129
|
+
"path",
|
|
130
|
+
{
|
|
131
|
+
d: "M 8.047 5.401 L 6.197 4.334 L 6.197 2.193 L 8.047 1.123 L 9.895 2.193 L 9.895 4.334 L 8.047 5.401 Z M 6.514 4.148 L 8.047 5.034 L 9.578 4.148 L 9.578 2.376 L 8.047 1.49 L 6.514 2.376 L 6.514 4.148 Z",
|
|
132
|
+
fill: "#F49676"
|
|
133
|
+
}
|
|
134
|
+
),
|
|
135
|
+
/* @__PURE__ */ React3.createElement(
|
|
136
|
+
"path",
|
|
137
|
+
{
|
|
138
|
+
d: "M 8.071 4.548 L 6.956 3.905 L 6.956 2.615 L 8.071 1.97 L 9.184 2.615 L 9.184 3.905 L 8.071 4.548 Z",
|
|
139
|
+
fill: "#F49676"
|
|
140
|
+
}
|
|
141
|
+
),
|
|
142
|
+
/* @__PURE__ */ React3.createElement(
|
|
143
|
+
"path",
|
|
144
|
+
{
|
|
145
|
+
d: "M 5.982 8.898 L 4.132 7.831 L 4.132 5.69 L 5.982 4.62 L 7.83 5.69 L 7.83 7.831 L 5.982 8.898 Z M 4.449 7.645 L 5.982 8.531 L 7.513 7.645 L 7.513 5.873 L 5.982 4.987 L 4.449 5.873 L 4.449 7.645 Z",
|
|
146
|
+
fill: "#F49676"
|
|
147
|
+
}
|
|
148
|
+
),
|
|
149
|
+
/* @__PURE__ */ React3.createElement(
|
|
150
|
+
"path",
|
|
151
|
+
{
|
|
152
|
+
d: "M 6.006 8.045 L 4.891 7.402 L 4.891 6.112 L 6.006 5.467 L 7.119 6.112 L 7.119 7.402 L 6.006 8.045 Z",
|
|
153
|
+
fill: "#F49676"
|
|
154
|
+
}
|
|
155
|
+
),
|
|
156
|
+
/* @__PURE__ */ React3.createElement(
|
|
157
|
+
"path",
|
|
158
|
+
{
|
|
159
|
+
d: "M 8.056 12.323 L 6.206 11.256 L 6.206 9.115 L 8.056 8.045 L 9.904 9.115 L 9.904 11.256 L 8.056 12.323 Z M 6.523 11.07 L 8.056 11.956 L 9.587 11.07 L 9.587 9.298 L 8.056 8.412 L 6.523 9.298 L 6.523 11.07 Z",
|
|
160
|
+
fill: "#F49676"
|
|
161
|
+
}
|
|
162
|
+
),
|
|
163
|
+
/* @__PURE__ */ React3.createElement(
|
|
164
|
+
"path",
|
|
165
|
+
{
|
|
166
|
+
d: "M 8.08 11.47 L 6.965 10.827 L 6.965 9.537 L 8.08 8.892 L 9.193 9.537 L 9.193 10.827 L 8.08 11.47 Z",
|
|
167
|
+
fill: "#F49676"
|
|
168
|
+
}
|
|
169
|
+
),
|
|
170
|
+
/* @__PURE__ */ React3.createElement(
|
|
171
|
+
"path",
|
|
172
|
+
{
|
|
173
|
+
d: "M 10.101 8.878 L 8.251 7.811 L 8.251 5.67 L 10.101 4.6 L 11.949 5.67 L 11.949 7.811 L 10.101 8.878 Z M 8.568 7.625 L 10.101 8.511 L 11.632 7.625 L 11.632 5.853 L 10.101 4.967 L 8.568 5.853 L 8.568 7.625 Z",
|
|
174
|
+
fill: "#F49676"
|
|
175
|
+
}
|
|
176
|
+
),
|
|
177
|
+
/* @__PURE__ */ React3.createElement(
|
|
178
|
+
"path",
|
|
179
|
+
{
|
|
180
|
+
d: "M 10.125 8.025 L 9.01 7.382 L 9.01 6.092 L 10.125 5.447 L 11.238 6.092 L 11.238 7.382 L 10.125 8.025 Z",
|
|
181
|
+
fill: "#F49676"
|
|
182
|
+
}
|
|
183
|
+
),
|
|
184
|
+
/* @__PURE__ */ React3.createElement(
|
|
185
|
+
"path",
|
|
186
|
+
{
|
|
187
|
+
d: "M 12.077 12.301 L 10.227 11.234 L 10.227 9.093 L 12.077 8.023 L 13.925 9.093 L 13.925 11.234 L 12.077 12.301 Z M 10.544 11.048 L 12.077 11.934 L 13.608 11.048 L 13.608 9.276 L 12.077 8.39 L 10.544 9.276 L 10.544 11.048 Z",
|
|
188
|
+
fill: "#F49676"
|
|
189
|
+
}
|
|
190
|
+
),
|
|
191
|
+
/* @__PURE__ */ React3.createElement(
|
|
192
|
+
"path",
|
|
193
|
+
{
|
|
194
|
+
d: "M 12.101 11.448 L 10.986 10.805 L 10.986 9.515 L 12.101 8.87 L 13.214 9.515 L 13.214 10.805 L 12.101 11.448 Z",
|
|
195
|
+
fill: "#F49676"
|
|
196
|
+
}
|
|
197
|
+
),
|
|
198
|
+
/* @__PURE__ */ React3.createElement(
|
|
199
|
+
"path",
|
|
200
|
+
{
|
|
201
|
+
d: "M 10.062 15.781 L 8.212 14.714 L 8.212 12.573 L 10.062 11.503 L 11.91 12.573 L 11.91 14.714 L 10.062 15.781 Z M 8.529 14.528 L 10.062 15.414 L 11.593 14.528 L 11.593 12.756 L 10.062 11.87 L 8.529 12.756 L 8.529 14.528 Z",
|
|
202
|
+
fill: "#F49676"
|
|
203
|
+
}
|
|
204
|
+
),
|
|
205
|
+
/* @__PURE__ */ React3.createElement(
|
|
206
|
+
"path",
|
|
207
|
+
{
|
|
208
|
+
d: "M 8.029 19.193 L 6.179 18.126 L 6.179 15.985 L 8.029 14.915 L 9.877 15.985 L 9.877 18.126 L 8.029 19.193 Z M 6.496 17.94 L 8.029 18.826 L 9.56 17.94 L 9.56 16.168 L 8.029 15.282 L 6.496 16.168 L 6.496 17.94 Z",
|
|
209
|
+
fill: "#F49676"
|
|
210
|
+
}
|
|
211
|
+
),
|
|
212
|
+
/* @__PURE__ */ React3.createElement(
|
|
213
|
+
"path",
|
|
214
|
+
{
|
|
215
|
+
d: "M 6.068 15.716 L 4.218 14.649 L 4.218 12.508 L 6.068 11.438 L 7.916 12.508 L 7.916 14.649 L 6.068 15.716 Z M 4.535 14.463 L 6.068 15.349 L 7.599 14.463 L 7.599 12.691 L 6.068 11.805 L 4.535 12.691 L 4.535 14.463 Z",
|
|
216
|
+
fill: "#F49676"
|
|
217
|
+
}
|
|
218
|
+
),
|
|
219
|
+
/* @__PURE__ */ React3.createElement(
|
|
220
|
+
"path",
|
|
221
|
+
{
|
|
222
|
+
d: "M 6.092 14.863 L 4.977 14.22 L 4.977 12.93 L 6.092 12.285 L 7.205 12.93 L 7.205 14.22 L 6.092 14.863 Z",
|
|
223
|
+
fill: "#F49676"
|
|
224
|
+
}
|
|
225
|
+
),
|
|
226
|
+
/* @__PURE__ */ React3.createElement(
|
|
227
|
+
"path",
|
|
228
|
+
{
|
|
229
|
+
d: "M 4.011 12.393 L 2.161 11.326 L 2.161 9.185 L 4.011 8.115 L 5.859 9.185 L 5.859 11.326 L 4.011 12.393 Z M 2.478 11.14 L 4.011 12.026 L 5.542 11.14 L 5.542 9.368 L 4.011 8.482 L 2.478 9.368 L 2.478 11.14 Z",
|
|
230
|
+
fill: "#F49676"
|
|
231
|
+
}
|
|
232
|
+
),
|
|
233
|
+
/* @__PURE__ */ React3.createElement(
|
|
234
|
+
"path",
|
|
235
|
+
{
|
|
236
|
+
d: "M 2.083 15.773 L 0.233 14.706 L 0.233 12.565 L 2.083 11.495 L 3.931 12.565 L 3.931 14.706 L 2.083 15.773 Z M 0.55 14.52 L 2.083 15.406 L 3.614 14.52 L 3.614 12.748 L 2.083 11.862 L 0.55 12.748 L 0.55 14.52 Z",
|
|
237
|
+
fill: "#F49676"
|
|
238
|
+
}
|
|
239
|
+
),
|
|
240
|
+
/* @__PURE__ */ React3.createElement(
|
|
241
|
+
"path",
|
|
242
|
+
{
|
|
243
|
+
d: "M 2.107 14.92 L 0.992 14.277 L 0.992 12.987 L 2.107 12.342 L 3.22 12.987 L 3.22 14.277 L 2.107 14.92 Z",
|
|
244
|
+
fill: "#F49676"
|
|
245
|
+
}
|
|
246
|
+
),
|
|
247
|
+
/* @__PURE__ */ React3.createElement(
|
|
248
|
+
"path",
|
|
249
|
+
{
|
|
250
|
+
d: "M 3.966 19.231 L 2.116 18.164 L 2.116 16.023 L 3.966 14.953 L 5.814 16.023 L 5.814 18.164 L 3.966 19.231 Z M 2.433 17.978 L 3.966 18.864 L 5.497 17.978 L 5.497 16.206 L 3.966 15.32 L 2.433 16.206 L 2.433 17.978 Z",
|
|
251
|
+
fill: "#F49676"
|
|
252
|
+
}
|
|
253
|
+
),
|
|
254
|
+
/* @__PURE__ */ React3.createElement(
|
|
255
|
+
"path",
|
|
256
|
+
{
|
|
257
|
+
d: "M 3.99 18.378 L 2.875 17.735 L 2.875 16.445 L 3.99 15.8 L 5.103 16.445 L 5.103 17.735 L 3.99 18.378 Z",
|
|
258
|
+
fill: "#F49676"
|
|
259
|
+
}
|
|
260
|
+
)
|
|
18
261
|
);
|
|
19
262
|
}
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
263
|
+
var Default3SideContainer = styled2.div`
|
|
264
|
+
svg {
|
|
265
|
+
height: 100%;
|
|
266
|
+
width: auto;
|
|
267
|
+
path {
|
|
268
|
+
fill: #ffffff22;
|
|
269
|
+
transition: fill 3s;
|
|
270
|
+
&:hover {
|
|
271
|
+
fill: #ffffffbb;
|
|
272
|
+
}
|
|
273
|
+
}
|
|
26
274
|
}
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
275
|
+
`;
|
|
276
|
+
var Default2LayoutContainer = styled2.div`
|
|
277
|
+
h2,
|
|
278
|
+
h3 {
|
|
279
|
+
text-align: left;
|
|
280
|
+
color: white;
|
|
281
|
+
}
|
|
282
|
+
`;
|
|
283
|
+
var Default3Layout = ({
|
|
284
|
+
children,
|
|
285
|
+
position = "right"
|
|
286
|
+
}) => {
|
|
287
|
+
const isReversed = position === "left";
|
|
288
|
+
return /* @__PURE__ */ React3.createElement(
|
|
289
|
+
Default2LayoutContainer,
|
|
290
|
+
{
|
|
291
|
+
style: {
|
|
292
|
+
display: "flex",
|
|
293
|
+
position: "absolute",
|
|
294
|
+
flexDirection: isReversed ? "row-reverse" : "row",
|
|
295
|
+
inset: 0,
|
|
296
|
+
alignItems: "center"
|
|
297
|
+
}
|
|
298
|
+
},
|
|
299
|
+
/* @__PURE__ */ React3.createElement(
|
|
300
|
+
Default3SideContainer,
|
|
301
|
+
{
|
|
302
|
+
style: {
|
|
303
|
+
flex: 1,
|
|
304
|
+
height: "100%",
|
|
305
|
+
padding: "2rem",
|
|
306
|
+
transform: isReversed ? "scale(2) translate(25%, 4%)" : "scale(2) translate(-25%, 15%)"
|
|
307
|
+
}
|
|
308
|
+
},
|
|
309
|
+
/* @__PURE__ */ React3.createElement(MultipleHexagons, { position })
|
|
310
|
+
),
|
|
311
|
+
/* @__PURE__ */ React3.createElement(
|
|
312
|
+
"div",
|
|
313
|
+
{
|
|
314
|
+
style: {
|
|
315
|
+
flex: 4,
|
|
316
|
+
marginLeft: isReversed ? Margins.horizontal : "2rem",
|
|
317
|
+
marginRight: isReversed ? "2rem" : Margins.horizontal
|
|
318
|
+
}
|
|
319
|
+
},
|
|
320
|
+
children
|
|
321
|
+
)
|
|
31
322
|
);
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
// src/index.tsx
|
|
35
|
-
import { Deck as SpectacleDeck, Slide } from "spectacle";
|
|
323
|
+
};
|
|
36
324
|
|
|
37
325
|
// src/layouts/MainSectionLayout.tsx
|
|
38
|
-
import
|
|
326
|
+
import React4 from "react";
|
|
39
327
|
import { FlexBox } from "spectacle";
|
|
40
328
|
|
|
41
329
|
// src/front.png
|
|
@@ -45,7 +333,7 @@ var front_default = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA2QAAAfPCAYAA
|
|
|
45
333
|
var MainSectionLayout = ({
|
|
46
334
|
children
|
|
47
335
|
}) => {
|
|
48
|
-
return /* @__PURE__ */
|
|
336
|
+
return /* @__PURE__ */ React4.createElement(
|
|
49
337
|
FlexBox,
|
|
50
338
|
{
|
|
51
339
|
height: "100%",
|
|
@@ -59,14 +347,14 @@ var MainSectionLayout = ({
|
|
|
59
347
|
bottom: 0
|
|
60
348
|
}
|
|
61
349
|
},
|
|
62
|
-
/* @__PURE__ */
|
|
63
|
-
/* @__PURE__ */
|
|
350
|
+
/* @__PURE__ */ React4.createElement("div", { style: { paddingLeft: "8rem", flex: 1 } }, children),
|
|
351
|
+
/* @__PURE__ */ React4.createElement("div", { style: { flex: "0 0", height: "100%", paddingLeft: "5rem" } }, /* @__PURE__ */ React4.createElement("img", { src: front_default, alt: "Front", style: { height: "100%" } }))
|
|
64
352
|
);
|
|
65
353
|
};
|
|
66
354
|
|
|
67
355
|
// src/layouts/SectionLayout.tsx
|
|
68
|
-
import
|
|
69
|
-
var SectionLayout =
|
|
356
|
+
import styled3 from "styled-components";
|
|
357
|
+
var SectionLayout = styled3.div`
|
|
70
358
|
display: flex;
|
|
71
359
|
flex-direction: row;
|
|
72
360
|
align-items: center;
|
|
@@ -80,12 +368,12 @@ var SectionLayout = styled.div`
|
|
|
80
368
|
`;
|
|
81
369
|
|
|
82
370
|
// src/layouts/SideCodeLayout.tsx
|
|
83
|
-
import
|
|
371
|
+
import React6 from "react";
|
|
84
372
|
|
|
85
373
|
// src/layouts/columns.tsx
|
|
86
|
-
import
|
|
87
|
-
import
|
|
88
|
-
var DivWithHeading =
|
|
374
|
+
import React5 from "react";
|
|
375
|
+
import styled4 from "styled-components";
|
|
376
|
+
var DivWithHeading = styled4.div`
|
|
89
377
|
h2 {
|
|
90
378
|
margin-top: 0;
|
|
91
379
|
}
|
|
@@ -94,7 +382,7 @@ var DivWithHeading = styled2.div`
|
|
|
94
382
|
font-weight: 400;
|
|
95
383
|
}
|
|
96
384
|
`;
|
|
97
|
-
var ColumnsContainer =
|
|
385
|
+
var ColumnsContainer = styled4(DivWithHeading)`
|
|
98
386
|
display: flex;
|
|
99
387
|
flex-direction: row;
|
|
100
388
|
position: absolute;
|
|
@@ -108,15 +396,15 @@ function ColumnsLayout({
|
|
|
108
396
|
children,
|
|
109
397
|
reverse
|
|
110
398
|
}) {
|
|
111
|
-
const childrenArray =
|
|
112
|
-
return /* @__PURE__ */
|
|
399
|
+
const childrenArray = React5.Children.toArray(children);
|
|
400
|
+
return /* @__PURE__ */ React5.createElement(
|
|
113
401
|
ColumnsContainer,
|
|
114
402
|
{
|
|
115
403
|
style: {
|
|
116
404
|
flexDirection: reverse ? "row-reverse" : "row"
|
|
117
405
|
}
|
|
118
406
|
},
|
|
119
|
-
childrenArray.map((child, i) => /* @__PURE__ */
|
|
407
|
+
childrenArray.map((child, i) => /* @__PURE__ */ React5.createElement(
|
|
120
408
|
"div",
|
|
121
409
|
{
|
|
122
410
|
key: i,
|
|
@@ -134,57 +422,9 @@ function ColumnsLayout({
|
|
|
134
422
|
);
|
|
135
423
|
}
|
|
136
424
|
|
|
137
|
-
// src/layouts/utils.ts
|
|
138
|
-
import React4 from "react";
|
|
139
|
-
var Margins = {
|
|
140
|
-
vertical: "4rem",
|
|
141
|
-
horizontal: "7rem",
|
|
142
|
-
horizontalInternal: "2rem"
|
|
143
|
-
};
|
|
144
|
-
function getCode(children) {
|
|
145
|
-
const allChild = React4.Children.toArray(children);
|
|
146
|
-
if (allChild.length === 0)
|
|
147
|
-
return [null, allChild];
|
|
148
|
-
const index = allChild.findIndex((child) => {
|
|
149
|
-
if (!React4.isValidElement(child))
|
|
150
|
-
return false;
|
|
151
|
-
return child.props.originalType === "pre";
|
|
152
|
-
});
|
|
153
|
-
if (index === -1)
|
|
154
|
-
return [null, allChild];
|
|
155
|
-
const candidate = allChild[index];
|
|
156
|
-
const rest = allChild.filter((_, i) => i !== index);
|
|
157
|
-
return [candidate, rest];
|
|
158
|
-
}
|
|
159
|
-
function getMatchingMdxType(children, mdxType) {
|
|
160
|
-
const allChild = React4.Children.toArray(children);
|
|
161
|
-
const matchFn = (child) => {
|
|
162
|
-
if (!React4.isValidElement(child))
|
|
163
|
-
return false;
|
|
164
|
-
if (typeof child.type !== "function")
|
|
165
|
-
return false;
|
|
166
|
-
if ("mdxType" in child.type === false)
|
|
167
|
-
return false;
|
|
168
|
-
return child.type.mdxType === mdxType;
|
|
169
|
-
};
|
|
170
|
-
const matches = allChild.filter(matchFn);
|
|
171
|
-
const rest = allChild.filter((child) => !matchFn(child));
|
|
172
|
-
return [matches, rest];
|
|
173
|
-
}
|
|
174
|
-
function getCodeChildren(children) {
|
|
175
|
-
const [code, rest] = getCode(children);
|
|
176
|
-
if (code)
|
|
177
|
-
return [code, rest];
|
|
178
|
-
const [codeStepper, rest2] = getMatchingMdxType(children, "CodeStepper");
|
|
179
|
-
if (codeStepper.length > 0)
|
|
180
|
-
return [codeStepper, rest2];
|
|
181
|
-
const [codes, rest3] = getMatchingMdxType(children, "FilePane");
|
|
182
|
-
return [codes, rest3];
|
|
183
|
-
}
|
|
184
|
-
|
|
185
425
|
// src/layouts/SideCodeLayout.tsx
|
|
186
|
-
import
|
|
187
|
-
var CodeSide =
|
|
426
|
+
import styled5 from "styled-components";
|
|
427
|
+
var CodeSide = styled5.div`
|
|
188
428
|
pre {
|
|
189
429
|
font-size: 0.9rem;
|
|
190
430
|
}
|
|
@@ -194,7 +434,7 @@ function SidedCodeLayout({
|
|
|
194
434
|
position = "right"
|
|
195
435
|
}) {
|
|
196
436
|
const [code, rest] = getCodeChildren(children);
|
|
197
|
-
return /* @__PURE__ */
|
|
437
|
+
return /* @__PURE__ */ React6.createElement(ColumnsLayout, { reverse: position === "left" }, /* @__PURE__ */ React6.createElement(
|
|
198
438
|
"div",
|
|
199
439
|
{
|
|
200
440
|
style: {
|
|
@@ -203,7 +443,7 @@ function SidedCodeLayout({
|
|
|
203
443
|
}
|
|
204
444
|
},
|
|
205
445
|
rest
|
|
206
|
-
), /* @__PURE__ */
|
|
446
|
+
), /* @__PURE__ */ React6.createElement(
|
|
207
447
|
CodeSide,
|
|
208
448
|
{
|
|
209
449
|
style: {
|
|
@@ -219,15 +459,15 @@ function SidedCodeLayout({
|
|
|
219
459
|
}
|
|
220
460
|
|
|
221
461
|
// src/layouts/SideImageLayout.tsx
|
|
222
|
-
import
|
|
223
|
-
import
|
|
462
|
+
import React8 from "react";
|
|
463
|
+
import styled7 from "styled-components";
|
|
224
464
|
|
|
225
465
|
// src/components/Image.tsx
|
|
226
|
-
import
|
|
466
|
+
import React7 from "react";
|
|
227
467
|
|
|
228
468
|
// src/layouts/styled.ts
|
|
229
|
-
import
|
|
230
|
-
var SVGObject =
|
|
469
|
+
import styled6 from "styled-components";
|
|
470
|
+
var SVGObject = styled6.object`
|
|
231
471
|
padding: 3rem 2rem;
|
|
232
472
|
box-sizing: border-box;
|
|
233
473
|
background-color: white;
|
|
@@ -237,7 +477,7 @@ var SVGObject = styled4.object`
|
|
|
237
477
|
function Image(props) {
|
|
238
478
|
const { src, height } = props;
|
|
239
479
|
if (!(src == null ? void 0 : src.endsWith(".svg"))) {
|
|
240
|
-
return /* @__PURE__ */
|
|
480
|
+
return /* @__PURE__ */ React7.createElement(
|
|
241
481
|
"img",
|
|
242
482
|
{
|
|
243
483
|
src,
|
|
@@ -250,7 +490,7 @@ function Image(props) {
|
|
|
250
490
|
}
|
|
251
491
|
);
|
|
252
492
|
}
|
|
253
|
-
return /* @__PURE__ */
|
|
493
|
+
return /* @__PURE__ */ React7.createElement(
|
|
254
494
|
SVGObject,
|
|
255
495
|
{
|
|
256
496
|
type: "image/svg+xml",
|
|
@@ -266,7 +506,7 @@ function Image(props) {
|
|
|
266
506
|
Image.mdxType = "Image";
|
|
267
507
|
|
|
268
508
|
// src/layouts/SideImageLayout.tsx
|
|
269
|
-
var DivWithHeading2 =
|
|
509
|
+
var DivWithHeading2 = styled7.div`
|
|
270
510
|
h2 {
|
|
271
511
|
margin-top: 0;
|
|
272
512
|
}
|
|
@@ -287,7 +527,7 @@ var SidedImageLayout = ({
|
|
|
287
527
|
console.error("No image provided for SidedImageLayout");
|
|
288
528
|
return null;
|
|
289
529
|
}
|
|
290
|
-
return /* @__PURE__ */
|
|
530
|
+
return /* @__PURE__ */ React8.createElement(
|
|
291
531
|
DivWithHeading2,
|
|
292
532
|
{
|
|
293
533
|
style: {
|
|
@@ -300,7 +540,7 @@ var SidedImageLayout = ({
|
|
|
300
540
|
top: 0
|
|
301
541
|
}
|
|
302
542
|
},
|
|
303
|
-
/* @__PURE__ */
|
|
543
|
+
/* @__PURE__ */ React8.createElement(
|
|
304
544
|
"div",
|
|
305
545
|
{
|
|
306
546
|
style: {
|
|
@@ -313,7 +553,7 @@ var SidedImageLayout = ({
|
|
|
313
553
|
},
|
|
314
554
|
rest
|
|
315
555
|
),
|
|
316
|
-
/* @__PURE__ */
|
|
556
|
+
/* @__PURE__ */ React8.createElement(
|
|
317
557
|
"div",
|
|
318
558
|
{
|
|
319
559
|
style: {
|
|
@@ -325,19 +565,19 @@ var SidedImageLayout = ({
|
|
|
325
565
|
backgroundColor: "white"
|
|
326
566
|
}
|
|
327
567
|
},
|
|
328
|
-
component || /* @__PURE__ */
|
|
568
|
+
component || /* @__PURE__ */ React8.createElement(Image, { src: image })
|
|
329
569
|
)
|
|
330
570
|
);
|
|
331
571
|
};
|
|
332
572
|
|
|
333
573
|
// src/layouts/SideLayout.tsx
|
|
334
|
-
import
|
|
574
|
+
import React9 from "react";
|
|
335
575
|
function SideLayout({
|
|
336
576
|
children,
|
|
337
577
|
position = "right"
|
|
338
578
|
}) {
|
|
339
579
|
const [side, rest] = getMatchingMdxType(children, "Side");
|
|
340
|
-
return /* @__PURE__ */
|
|
580
|
+
return /* @__PURE__ */ React9.createElement(ColumnsLayout, { reverse: position === "left" }, /* @__PURE__ */ React9.createElement("div", { style: { marginLeft: Margins.horizontal } }, rest), /* @__PURE__ */ React9.createElement(
|
|
341
581
|
"div",
|
|
342
582
|
{
|
|
343
583
|
style: {
|
|
@@ -357,6 +597,8 @@ function SideLayout({
|
|
|
357
597
|
// src/layouts/index.tsx
|
|
358
598
|
var layouts_default = {
|
|
359
599
|
mainSection: MainSectionLayout,
|
|
600
|
+
centered: CenteredLayout,
|
|
601
|
+
default3: Default3Layout,
|
|
360
602
|
sidedCode: SidedCodeLayout,
|
|
361
603
|
sidedImage: SidedImageLayout,
|
|
362
604
|
side: SideLayout,
|
|
@@ -389,11 +631,11 @@ var theme_default = {
|
|
|
389
631
|
};
|
|
390
632
|
|
|
391
633
|
// src/template.tsx
|
|
392
|
-
import
|
|
634
|
+
import React10 from "react";
|
|
393
635
|
import { Box, FullScreen } from "spectacle";
|
|
394
636
|
var template = ({ slideNumber, numberOfSlides }) => {
|
|
395
637
|
const percentage = slideNumber / numberOfSlides * 100;
|
|
396
|
-
return /* @__PURE__ */
|
|
638
|
+
return /* @__PURE__ */ React10.createElement("div", { style: { position: "absolute", bottom: 0, left: 0, right: 0 } }, /* @__PURE__ */ React10.createElement(Box, { padding: "0 0 0.5em 0.7em" }, /* @__PURE__ */ React10.createElement(FullScreen, null)), /* @__PURE__ */ React10.createElement("div", { style: { width: "100%", height: "4px", background: "#ffffff11" } }, /* @__PURE__ */ React10.createElement(
|
|
397
639
|
"div",
|
|
398
640
|
{
|
|
399
641
|
style: {
|
|
@@ -407,31 +649,31 @@ var template = ({ slideNumber, numberOfSlides }) => {
|
|
|
407
649
|
};
|
|
408
650
|
|
|
409
651
|
// src/components/map.tsx
|
|
410
|
-
import
|
|
652
|
+
import React13 from "react";
|
|
411
653
|
import { mdxComponentMap } from "spectacle";
|
|
412
654
|
|
|
413
655
|
// src/components/styled.tsx
|
|
414
|
-
import
|
|
656
|
+
import React11 from "react";
|
|
415
657
|
import {
|
|
416
658
|
Link as SpectacleLink,
|
|
417
659
|
Image as SpectacleImage,
|
|
418
660
|
Heading,
|
|
419
661
|
FlexBox as FlexBox2
|
|
420
662
|
} from "spectacle";
|
|
421
|
-
import
|
|
422
|
-
var StyledImage =
|
|
663
|
+
import styled8 from "styled-components";
|
|
664
|
+
var StyledImage = styled8(SpectacleImage)`
|
|
423
665
|
object-fit: contain;
|
|
424
666
|
max-height: 30vh;
|
|
425
667
|
max-width: 70vw;
|
|
426
668
|
`;
|
|
427
|
-
var Image2 = (props) => /* @__PURE__ */
|
|
428
|
-
var CustomHeading =
|
|
669
|
+
var Image2 = (props) => /* @__PURE__ */ React11.createElement(FlexBox2, { margin: "0 0", padding: "0 0" }, /* @__PURE__ */ React11.createElement(StyledImage, { ...props }));
|
|
670
|
+
var CustomHeading = styled8(Heading)`
|
|
429
671
|
strong {
|
|
430
672
|
color: #f49676;
|
|
431
673
|
font-weight: 500;
|
|
432
674
|
}
|
|
433
675
|
`;
|
|
434
|
-
var CustomQuote =
|
|
676
|
+
var CustomQuote = styled8.blockquote`
|
|
435
677
|
margin: 1rem 0;
|
|
436
678
|
padding-left: 1.5rem;
|
|
437
679
|
padding-top: 0;
|
|
@@ -442,7 +684,7 @@ var CustomQuote = styled6.blockquote`
|
|
|
442
684
|
padding: 0 !important;
|
|
443
685
|
}
|
|
444
686
|
`;
|
|
445
|
-
var InlineCode =
|
|
687
|
+
var InlineCode = styled8.code`
|
|
446
688
|
filter: brightness(1.05);
|
|
447
689
|
zoom: 1.1;
|
|
448
690
|
&:before,
|
|
@@ -451,12 +693,12 @@ var InlineCode = styled6.code`
|
|
|
451
693
|
font-size: 0.8em;
|
|
452
694
|
}
|
|
453
695
|
`;
|
|
454
|
-
var HeadingTwo =
|
|
696
|
+
var HeadingTwo = styled8.h2`
|
|
455
697
|
font-family: Bitter, \"Helvetica Neue\", Helvetica, Arial, sans-serif;
|
|
456
698
|
font-size: 55px;
|
|
457
699
|
font-weight: 400;
|
|
458
700
|
`;
|
|
459
|
-
var HeadingThree =
|
|
701
|
+
var HeadingThree = styled8.h3`
|
|
460
702
|
font-family: Bitter, \"Helvetica Neue\", Helvetica, Arial, sans-serif;
|
|
461
703
|
font-size: 40px;
|
|
462
704
|
font-weight: 400;
|
|
@@ -469,12 +711,12 @@ var HeadingThree = styled6.h3`
|
|
|
469
711
|
`;
|
|
470
712
|
|
|
471
713
|
// src/components/CodeStepper/CodeStepper.tsx
|
|
472
|
-
import
|
|
714
|
+
import React12 from "react";
|
|
473
715
|
import ReactIs from "react-is";
|
|
474
716
|
import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
|
|
475
717
|
import gruvboxDark from "react-syntax-highlighter/dist/cjs/styles/prism/gruvbox-dark";
|
|
476
718
|
import { Stepper } from "spectacle";
|
|
477
|
-
import
|
|
719
|
+
import styled9 from "styled-components";
|
|
478
720
|
|
|
479
721
|
// src/components/CodeStepper/code-directives.ts
|
|
480
722
|
function range(start, end) {
|
|
@@ -538,7 +780,7 @@ function parseStepDirectives(directives) {
|
|
|
538
780
|
|
|
539
781
|
// src/components/CodeStepper/CodeStepper.tsx
|
|
540
782
|
var Highlighter = SyntaxHighlighter;
|
|
541
|
-
var CodeContainer =
|
|
783
|
+
var CodeContainer = styled9.div`
|
|
542
784
|
pre {
|
|
543
785
|
padding: 1rem 0rem !important;
|
|
544
786
|
background-color: transparent !important;
|
|
@@ -559,7 +801,7 @@ var CodeContainer = styled7.div`
|
|
|
559
801
|
}
|
|
560
802
|
`;
|
|
561
803
|
function useCodeSteps(code) {
|
|
562
|
-
return
|
|
804
|
+
return React12.useMemo(() => {
|
|
563
805
|
const prefixes = code.match(/(?:\/\/|<!--) @.*\n/g) || [];
|
|
564
806
|
const prefixesLength = prefixes.reduce(
|
|
565
807
|
(acc, prefix) => acc + prefix.length,
|
|
@@ -579,8 +821,8 @@ function useCodeSteps(code) {
|
|
|
579
821
|
}, [code]);
|
|
580
822
|
}
|
|
581
823
|
function getCodeDetails(children) {
|
|
582
|
-
const child =
|
|
583
|
-
if (!
|
|
824
|
+
const child = React12.Children.toArray(children)[0];
|
|
825
|
+
if (!React12.isValidElement(child)) {
|
|
584
826
|
return {
|
|
585
827
|
language: "",
|
|
586
828
|
code: ReactIs.isFragment(child) ? "" : String(child || "")
|
|
@@ -598,7 +840,7 @@ function CodeWrapper({
|
|
|
598
840
|
hasName,
|
|
599
841
|
children
|
|
600
842
|
}) {
|
|
601
|
-
return /* @__PURE__ */
|
|
843
|
+
return /* @__PURE__ */ React12.createElement(
|
|
602
844
|
"div",
|
|
603
845
|
{
|
|
604
846
|
style: {
|
|
@@ -608,7 +850,7 @@ function CodeWrapper({
|
|
|
608
850
|
borderRadius: "4px"
|
|
609
851
|
}
|
|
610
852
|
},
|
|
611
|
-
name && /* @__PURE__ */
|
|
853
|
+
name && /* @__PURE__ */ React12.createElement(
|
|
612
854
|
"span",
|
|
613
855
|
{
|
|
614
856
|
style: {
|
|
@@ -625,7 +867,7 @@ function CodeWrapper({
|
|
|
625
867
|
name
|
|
626
868
|
),
|
|
627
869
|
children,
|
|
628
|
-
hasName && /* @__PURE__ */
|
|
870
|
+
hasName && /* @__PURE__ */ React12.createElement(
|
|
629
871
|
"span",
|
|
630
872
|
{
|
|
631
873
|
style: {
|
|
@@ -640,7 +882,7 @@ function CodeWrapper({
|
|
|
640
882
|
fontStyle: "italic"
|
|
641
883
|
}
|
|
642
884
|
},
|
|
643
|
-
stepName || /* @__PURE__ */
|
|
885
|
+
stepName || /* @__PURE__ */ React12.createElement("span", { style: { visibility: "hidden" } }, "Step")
|
|
644
886
|
)
|
|
645
887
|
);
|
|
646
888
|
}
|
|
@@ -649,7 +891,7 @@ function CodeStepper({
|
|
|
649
891
|
name,
|
|
650
892
|
...props
|
|
651
893
|
}) {
|
|
652
|
-
const { language, code } =
|
|
894
|
+
const { language, code } = React12.useMemo(() => {
|
|
653
895
|
return getCodeDetails(props.children);
|
|
654
896
|
}, [props.children]);
|
|
655
897
|
const {
|
|
@@ -659,21 +901,21 @@ function CodeStepper({
|
|
|
659
901
|
hasSteps,
|
|
660
902
|
hasName
|
|
661
903
|
} = useCodeSteps(code);
|
|
662
|
-
return /* @__PURE__ */
|
|
904
|
+
return /* @__PURE__ */ React12.createElement(CodeContainer, null, import.meta.env.DEV && Boolean(prefixes == null ? void 0 : prefixes.length) && /* @__PURE__ */ React12.createElement("div", { style: { position: "absolute", top: 0, opacity: 0.5, left: 0 } }, /* @__PURE__ */ React12.createElement(Highlighter, { language, style: gruvboxDark }, prefixes.join(""))), /* @__PURE__ */ React12.createElement(
|
|
663
905
|
Stepper,
|
|
664
906
|
{
|
|
665
907
|
values: steps,
|
|
666
908
|
alwaysVisible: !hasSteps,
|
|
667
909
|
priority: priority ? priority + 1 : void 0
|
|
668
910
|
},
|
|
669
|
-
(step, _, isActive) => /* @__PURE__ */
|
|
911
|
+
(step, _, isActive) => /* @__PURE__ */ React12.createElement(
|
|
670
912
|
CodeWrapper,
|
|
671
913
|
{
|
|
672
914
|
name,
|
|
673
915
|
stepName: step == null ? void 0 : step.name,
|
|
674
916
|
hasName
|
|
675
917
|
},
|
|
676
|
-
/* @__PURE__ */
|
|
918
|
+
/* @__PURE__ */ React12.createElement(
|
|
677
919
|
Highlighter,
|
|
678
920
|
{
|
|
679
921
|
language,
|
|
@@ -723,7 +965,7 @@ CodeStepper.mdxType = "CodeStepper";
|
|
|
723
965
|
// src/components/map.tsx
|
|
724
966
|
var componentsMap = {
|
|
725
967
|
...mdxComponentMap,
|
|
726
|
-
inlineCode: (props) => /* @__PURE__ */
|
|
968
|
+
inlineCode: (props) => /* @__PURE__ */ React13.createElement(
|
|
727
969
|
InlineCode,
|
|
728
970
|
{
|
|
729
971
|
...props,
|
|
@@ -733,7 +975,7 @@ var componentsMap = {
|
|
|
733
975
|
}
|
|
734
976
|
}
|
|
735
977
|
),
|
|
736
|
-
table: (props) => /* @__PURE__ */
|
|
978
|
+
table: (props) => /* @__PURE__ */ React13.createElement(
|
|
737
979
|
"table",
|
|
738
980
|
{
|
|
739
981
|
...props,
|
|
@@ -744,7 +986,7 @@ var componentsMap = {
|
|
|
744
986
|
}
|
|
745
987
|
}
|
|
746
988
|
),
|
|
747
|
-
tr: (props) => /* @__PURE__ */
|
|
989
|
+
tr: (props) => /* @__PURE__ */ React13.createElement(
|
|
748
990
|
"tr",
|
|
749
991
|
{
|
|
750
992
|
...props,
|
|
@@ -756,7 +998,7 @@ var componentsMap = {
|
|
|
756
998
|
}
|
|
757
999
|
}
|
|
758
1000
|
),
|
|
759
|
-
td: (props) => /* @__PURE__ */
|
|
1001
|
+
td: (props) => /* @__PURE__ */ React13.createElement(
|
|
760
1002
|
"td",
|
|
761
1003
|
{
|
|
762
1004
|
...props,
|
|
@@ -769,7 +1011,7 @@ var componentsMap = {
|
|
|
769
1011
|
}
|
|
770
1012
|
}
|
|
771
1013
|
),
|
|
772
|
-
h1: (props) => /* @__PURE__ */
|
|
1014
|
+
h1: (props) => /* @__PURE__ */ React13.createElement(
|
|
773
1015
|
CustomHeading,
|
|
774
1016
|
{
|
|
775
1017
|
fontSize: "h1",
|
|
@@ -784,15 +1026,15 @@ var componentsMap = {
|
|
|
784
1026
|
},
|
|
785
1027
|
props.children
|
|
786
1028
|
),
|
|
787
|
-
h2: (props) => /* @__PURE__ */
|
|
788
|
-
h3: (props) => /* @__PURE__ */
|
|
789
|
-
img: (props) => /* @__PURE__ */
|
|
1029
|
+
h2: (props) => /* @__PURE__ */ React13.createElement(HeadingTwo, null, props.children),
|
|
1030
|
+
h3: (props) => /* @__PURE__ */ React13.createElement(HeadingThree, { ...props }),
|
|
1031
|
+
img: (props) => /* @__PURE__ */ React13.createElement(Image2, { ...props }),
|
|
790
1032
|
pre: CodeStepper,
|
|
791
|
-
li: (props) => /* @__PURE__ */
|
|
792
|
-
Side: (props) => /* @__PURE__ */
|
|
1033
|
+
li: (props) => /* @__PURE__ */ React13.createElement("li", { ...props, style: { margin: "24px 0" } }),
|
|
1034
|
+
Side: (props) => /* @__PURE__ */ React13.createElement("div", { ...props }),
|
|
793
1035
|
p: (props) => {
|
|
794
1036
|
const Text = mdxComponentMap.p;
|
|
795
|
-
return /* @__PURE__ */
|
|
1037
|
+
return /* @__PURE__ */ React13.createElement(
|
|
796
1038
|
Text,
|
|
797
1039
|
{
|
|
798
1040
|
style: { margin: "8px 0", padding: "8px 0", lineHeight: "2rem" },
|
|
@@ -800,10 +1042,10 @@ var componentsMap = {
|
|
|
800
1042
|
}
|
|
801
1043
|
);
|
|
802
1044
|
},
|
|
803
|
-
blockquote: (props) => /* @__PURE__ */
|
|
1045
|
+
blockquote: (props) => /* @__PURE__ */ React13.createElement(CustomQuote, { ...props }),
|
|
804
1046
|
a: ({ children, ...props }) => {
|
|
805
1047
|
const domain = new URL(props.href || "").hostname;
|
|
806
|
-
return /* @__PURE__ */
|
|
1048
|
+
return /* @__PURE__ */ React13.createElement("a", { ...props, style: { color: "#f49676", textDecoration: "none" } }, children, " ", /* @__PURE__ */ React13.createElement(
|
|
807
1049
|
"small",
|
|
808
1050
|
{
|
|
809
1051
|
style: {
|
|
@@ -819,14 +1061,14 @@ var componentsMap = {
|
|
|
819
1061
|
var map_default = componentsMap;
|
|
820
1062
|
|
|
821
1063
|
// src/components/FilePane.tsx
|
|
822
|
-
import
|
|
1064
|
+
import React14 from "react";
|
|
823
1065
|
function FilePane({
|
|
824
1066
|
name,
|
|
825
1067
|
children,
|
|
826
1068
|
priority,
|
|
827
1069
|
...divProps
|
|
828
1070
|
}) {
|
|
829
|
-
return
|
|
1071
|
+
return React14.isValidElement(children) ? React14.cloneElement(children, {
|
|
830
1072
|
// @ts-expect-error cloning
|
|
831
1073
|
priority,
|
|
832
1074
|
name
|
|
@@ -835,14 +1077,14 @@ function FilePane({
|
|
|
835
1077
|
FilePane.mdxType = "FilePane";
|
|
836
1078
|
|
|
837
1079
|
// src/components/ItemsColumn.tsx
|
|
838
|
-
import
|
|
1080
|
+
import React15 from "react";
|
|
839
1081
|
import { Stepper as Stepper2 } from "spectacle";
|
|
840
|
-
import
|
|
1082
|
+
import styled10 from "styled-components";
|
|
841
1083
|
import { useSpring, animated } from "react-spring";
|
|
842
1084
|
function ItemsColumn(divProps) {
|
|
843
1085
|
const { style, children, ...props } = divProps;
|
|
844
|
-
const childrenArray =
|
|
845
|
-
return /* @__PURE__ */
|
|
1086
|
+
const childrenArray = React15.Children.toArray(children);
|
|
1087
|
+
return /* @__PURE__ */ React15.createElement(Stepper2, { values: childrenArray }, (value, step) => /* @__PURE__ */ React15.createElement(
|
|
846
1088
|
"div",
|
|
847
1089
|
{
|
|
848
1090
|
style: {
|
|
@@ -856,14 +1098,14 @@ function ItemsColumn(divProps) {
|
|
|
856
1098
|
},
|
|
857
1099
|
childrenArray.map((child, index) => {
|
|
858
1100
|
const isVisible = index <= step;
|
|
859
|
-
if (!
|
|
1101
|
+
if (!React15.isValidElement(child)) {
|
|
860
1102
|
return child;
|
|
861
1103
|
}
|
|
862
|
-
return /* @__PURE__ */
|
|
1104
|
+
return /* @__PURE__ */ React15.createElement(ItemColumnWrapper, { key: index, isVisible }, child);
|
|
863
1105
|
})
|
|
864
1106
|
));
|
|
865
1107
|
}
|
|
866
|
-
var ItemColumnWrapperStyled =
|
|
1108
|
+
var ItemColumnWrapperStyled = styled10(animated.div)`
|
|
867
1109
|
* {
|
|
868
1110
|
text-align: center !important;
|
|
869
1111
|
}
|
|
@@ -874,15 +1116,15 @@ function ItemColumnWrapper({
|
|
|
874
1116
|
...props
|
|
875
1117
|
}) {
|
|
876
1118
|
const styles = useSpring({ opacity: isVisible ? 1 : 0 });
|
|
877
|
-
return /* @__PURE__ */
|
|
1119
|
+
return /* @__PURE__ */ React15.createElement(ItemColumnWrapperStyled, { style: styles, ...props }, children);
|
|
878
1120
|
}
|
|
879
1121
|
|
|
880
1122
|
// src/components/HorizontalList.tsx
|
|
881
|
-
import
|
|
1123
|
+
import React16 from "react";
|
|
882
1124
|
import { animated as animated2, useSpring as useSpring2 } from "react-spring";
|
|
883
1125
|
import { Stepper as Stepper3 } from "spectacle";
|
|
884
|
-
import
|
|
885
|
-
var Container =
|
|
1126
|
+
import styled11 from "styled-components";
|
|
1127
|
+
var Container = styled11.div`
|
|
886
1128
|
display: grid;
|
|
887
1129
|
grid-gap: 2rem;
|
|
888
1130
|
`;
|
|
@@ -890,8 +1132,8 @@ function HorizontalList({
|
|
|
890
1132
|
children,
|
|
891
1133
|
columns = 3
|
|
892
1134
|
}) {
|
|
893
|
-
const items =
|
|
894
|
-
return /* @__PURE__ */
|
|
1135
|
+
const items = React16.Children.toArray(children);
|
|
1136
|
+
return /* @__PURE__ */ React16.createElement(Stepper3, { values: items }, (_, step) => /* @__PURE__ */ React16.createElement(
|
|
895
1137
|
Container,
|
|
896
1138
|
{
|
|
897
1139
|
style: {
|
|
@@ -899,10 +1141,10 @@ function HorizontalList({
|
|
|
899
1141
|
}
|
|
900
1142
|
},
|
|
901
1143
|
items.map((item, k) => {
|
|
902
|
-
if (!
|
|
1144
|
+
if (!React16.isValidElement(item)) {
|
|
903
1145
|
return item;
|
|
904
1146
|
}
|
|
905
|
-
return
|
|
1147
|
+
return React16.cloneElement(item, {
|
|
906
1148
|
// @ts-expect-error cloning
|
|
907
1149
|
position: k + 1,
|
|
908
1150
|
isVisible: k <= step,
|
|
@@ -912,12 +1154,12 @@ function HorizontalList({
|
|
|
912
1154
|
));
|
|
913
1155
|
}
|
|
914
1156
|
function Pill({ position }) {
|
|
915
|
-
return /* @__PURE__ */
|
|
1157
|
+
return /* @__PURE__ */ React16.createElement(
|
|
916
1158
|
"div",
|
|
917
1159
|
{
|
|
918
1160
|
style: { width: 48, transform: "translate(-25%, -25%)", opacity: 0.9 }
|
|
919
1161
|
},
|
|
920
|
-
/* @__PURE__ */
|
|
1162
|
+
/* @__PURE__ */ React16.createElement(
|
|
921
1163
|
"svg",
|
|
922
1164
|
{
|
|
923
1165
|
width: "48",
|
|
@@ -926,14 +1168,14 @@ function Pill({ position }) {
|
|
|
926
1168
|
fill: "none",
|
|
927
1169
|
xmlns: "http://www.w3.org/2000/svg"
|
|
928
1170
|
},
|
|
929
|
-
/* @__PURE__ */
|
|
1171
|
+
/* @__PURE__ */ React16.createElement(
|
|
930
1172
|
"path",
|
|
931
1173
|
{
|
|
932
1174
|
d: "M8.64717 20L0 15.0094V5.00134L8.64717 0L17.289 5.00134V15.0094L8.64717 20ZM1.48222 14.141L8.64717 18.2846L15.8068 14.141V5.85902L8.64717 1.71536L1.48222 5.85902V14.141Z",
|
|
933
1175
|
fill: "#ffffff"
|
|
934
1176
|
}
|
|
935
1177
|
),
|
|
936
|
-
/* @__PURE__ */
|
|
1178
|
+
/* @__PURE__ */ React16.createElement(
|
|
937
1179
|
"text",
|
|
938
1180
|
{
|
|
939
1181
|
x: "9",
|
|
@@ -945,7 +1187,7 @@ function Pill({ position }) {
|
|
|
945
1187
|
},
|
|
946
1188
|
position
|
|
947
1189
|
),
|
|
948
|
-
/* @__PURE__ */
|
|
1190
|
+
/* @__PURE__ */ React16.createElement(
|
|
949
1191
|
"path",
|
|
950
1192
|
{
|
|
951
1193
|
d: "M 8.758 16.01 L 3.549 13.004 L 3.549 6.975 L 8.758 3.963 L 13.964 6.975 L 13.964 13.004 L 8.758 16.01 Z",
|
|
@@ -955,12 +1197,12 @@ function Pill({ position }) {
|
|
|
955
1197
|
)
|
|
956
1198
|
);
|
|
957
1199
|
}
|
|
958
|
-
var Item =
|
|
1200
|
+
var Item = styled11(animated2.div)`
|
|
959
1201
|
display: flex;
|
|
960
1202
|
flex-direction: column;
|
|
961
1203
|
font-family: Bitter, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
962
1204
|
`;
|
|
963
|
-
var ItemHead =
|
|
1205
|
+
var ItemHead = styled11.div`
|
|
964
1206
|
display: flex;
|
|
965
1207
|
flex-direction: row;
|
|
966
1208
|
font-size: 1.3rem;
|
|
@@ -970,7 +1212,7 @@ var ItemHead = styled9.div`
|
|
|
970
1212
|
margin: 0;
|
|
971
1213
|
}
|
|
972
1214
|
`;
|
|
973
|
-
var ItemContent =
|
|
1215
|
+
var ItemContent = styled11.div`
|
|
974
1216
|
> * {
|
|
975
1217
|
font-size: 1rem;
|
|
976
1218
|
padding: 4px !important;
|
|
@@ -998,11 +1240,11 @@ function HorizontalListItem({
|
|
|
998
1240
|
const opacityStyles = useSpring2({
|
|
999
1241
|
opacity: getItemOpacity({ isVisible, isLast })
|
|
1000
1242
|
});
|
|
1001
|
-
return /* @__PURE__ */
|
|
1243
|
+
return /* @__PURE__ */ React16.createElement(Item, { style: opacityStyles }, /* @__PURE__ */ React16.createElement(ItemHead, null, /* @__PURE__ */ React16.createElement(Pill, { position }), /* @__PURE__ */ React16.createElement("p", null, title)), /* @__PURE__ */ React16.createElement(ItemContent, null, children));
|
|
1002
1244
|
}
|
|
1003
1245
|
|
|
1004
1246
|
// src/components/Timeline.tsx
|
|
1005
|
-
import
|
|
1247
|
+
import React17 from "react";
|
|
1006
1248
|
import { animated as animated3, useSpring as useSpring3 } from "react-spring";
|
|
1007
1249
|
import classnames from "classnames";
|
|
1008
1250
|
import { Stepper as Stepper4 } from "spectacle";
|
|
@@ -1012,13 +1254,13 @@ var Timeline_module_default = {};
|
|
|
1012
1254
|
|
|
1013
1255
|
// src/components/Timeline.tsx
|
|
1014
1256
|
function Timeline(props) {
|
|
1015
|
-
const children =
|
|
1016
|
-
return /* @__PURE__ */
|
|
1257
|
+
const children = React17.Children.toArray(props.children);
|
|
1258
|
+
return /* @__PURE__ */ React17.createElement(Stepper4, { ...props, values: children, className: Timeline_module_default["timeline"] }, (value, step) => {
|
|
1017
1259
|
return children.map((child, index) => {
|
|
1018
|
-
if (!
|
|
1260
|
+
if (!React17.isValidElement(child)) {
|
|
1019
1261
|
return child;
|
|
1020
1262
|
}
|
|
1021
|
-
return
|
|
1263
|
+
return React17.cloneElement(child, {
|
|
1022
1264
|
// @ts-expect-error cloning
|
|
1023
1265
|
isPhantom: step < index,
|
|
1024
1266
|
isLast: step === index
|
|
@@ -1045,7 +1287,7 @@ function TimelineItem(props) {
|
|
|
1045
1287
|
opacity: getItemOpacity2({ isPhantom, isLast })
|
|
1046
1288
|
});
|
|
1047
1289
|
const colorStyles = useSpring3({ opacity: isPhantom || isLast ? 1 : 0.15 });
|
|
1048
|
-
return /* @__PURE__ */
|
|
1290
|
+
return /* @__PURE__ */ React17.createElement(
|
|
1049
1291
|
animated3.div,
|
|
1050
1292
|
{
|
|
1051
1293
|
...rest,
|
|
@@ -1054,7 +1296,7 @@ function TimelineItem(props) {
|
|
|
1054
1296
|
...appearStyles
|
|
1055
1297
|
}
|
|
1056
1298
|
},
|
|
1057
|
-
/* @__PURE__ */
|
|
1299
|
+
/* @__PURE__ */ React17.createElement(
|
|
1058
1300
|
"div",
|
|
1059
1301
|
{
|
|
1060
1302
|
className: classnames(
|
|
@@ -1062,21 +1304,21 @@ function TimelineItem(props) {
|
|
|
1062
1304
|
Timeline_module_default["timelineItemContentPhantom"]
|
|
1063
1305
|
)
|
|
1064
1306
|
},
|
|
1065
|
-
/* @__PURE__ */
|
|
1066
|
-
/* @__PURE__ */
|
|
1307
|
+
/* @__PURE__ */ React17.createElement("div", { className: Timeline_module_default["timelineItemTitle"] }, title),
|
|
1308
|
+
/* @__PURE__ */ React17.createElement("div", { className: Timeline_module_default["timelineItemBody"] }, children)
|
|
1067
1309
|
),
|
|
1068
|
-
/* @__PURE__ */
|
|
1310
|
+
/* @__PURE__ */ React17.createElement(animated3.div, { className: Timeline_module_default["timelineItemGuide"], style: colorStyles }, /* @__PURE__ */ React17.createElement(Hexagon, null), /* @__PURE__ */ React17.createElement(
|
|
1069
1311
|
animated3.div,
|
|
1070
1312
|
{
|
|
1071
1313
|
className: Timeline_module_default["timelineItemGuideLine"],
|
|
1072
1314
|
style: guideLineProps
|
|
1073
1315
|
}
|
|
1074
1316
|
)),
|
|
1075
|
-
/* @__PURE__ */
|
|
1317
|
+
/* @__PURE__ */ React17.createElement("div", { className: Timeline_module_default["timelineItemContent"] }, /* @__PURE__ */ React17.createElement("div", { className: Timeline_module_default["timelineItemTitle"] }, title), /* @__PURE__ */ React17.createElement("div", { className: Timeline_module_default["timelineItemBody"] }, children))
|
|
1076
1318
|
);
|
|
1077
1319
|
}
|
|
1078
1320
|
function Hexagon() {
|
|
1079
|
-
return /* @__PURE__ */
|
|
1321
|
+
return /* @__PURE__ */ React17.createElement(
|
|
1080
1322
|
"svg",
|
|
1081
1323
|
{
|
|
1082
1324
|
width: "18",
|
|
@@ -1085,14 +1327,14 @@ function Hexagon() {
|
|
|
1085
1327
|
fill: "none",
|
|
1086
1328
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1087
1329
|
},
|
|
1088
|
-
/* @__PURE__ */
|
|
1330
|
+
/* @__PURE__ */ React17.createElement(
|
|
1089
1331
|
"path",
|
|
1090
1332
|
{
|
|
1091
1333
|
d: "M8.64717 20L0 15.0094V5.00134L8.64717 0L17.289 5.00134V15.0094L8.64717 20ZM1.48222 14.141L8.64717 18.2846L15.8068 14.141V5.85902L8.64717 1.71536L1.48222 5.85902V14.141Z",
|
|
1092
1334
|
fill: "#F49676"
|
|
1093
1335
|
}
|
|
1094
1336
|
),
|
|
1095
|
-
/* @__PURE__ */
|
|
1337
|
+
/* @__PURE__ */ React17.createElement(
|
|
1096
1338
|
"path",
|
|
1097
1339
|
{
|
|
1098
1340
|
d: "M 8.758 16.01 L 3.549 13.004 L 3.549 6.975 L 8.758 3.963 L 13.964 6.975 L 13.964 13.004 L 8.758 16.01 Z",
|
|
@@ -1103,9 +1345,9 @@ function Hexagon() {
|
|
|
1103
1345
|
}
|
|
1104
1346
|
|
|
1105
1347
|
// src/components/IconBox.tsx
|
|
1106
|
-
import
|
|
1107
|
-
import
|
|
1108
|
-
var IconBoxContent =
|
|
1348
|
+
import React18 from "react";
|
|
1349
|
+
import styled12 from "styled-components";
|
|
1350
|
+
var IconBoxContent = styled12.div`
|
|
1109
1351
|
* {
|
|
1110
1352
|
margin: 0.2rem !important;
|
|
1111
1353
|
padding: 0 !important;
|
|
@@ -1115,7 +1357,7 @@ function IconBox({
|
|
|
1115
1357
|
children,
|
|
1116
1358
|
icon
|
|
1117
1359
|
}) {
|
|
1118
|
-
return /* @__PURE__ */
|
|
1360
|
+
return /* @__PURE__ */ React18.createElement(
|
|
1119
1361
|
"div",
|
|
1120
1362
|
{
|
|
1121
1363
|
style: {
|
|
@@ -1125,14 +1367,14 @@ function IconBox({
|
|
|
1125
1367
|
padding: "1rem 0"
|
|
1126
1368
|
}
|
|
1127
1369
|
},
|
|
1128
|
-
/* @__PURE__ */
|
|
1129
|
-
/* @__PURE__ */
|
|
1370
|
+
/* @__PURE__ */ React18.createElement("div", { style: { fontSize: 60 } }, icon),
|
|
1371
|
+
/* @__PURE__ */ React18.createElement(IconBoxContent, null, children)
|
|
1130
1372
|
);
|
|
1131
1373
|
}
|
|
1132
1374
|
|
|
1133
1375
|
// src/index.tsx
|
|
1134
1376
|
function PassThrough({ children }) {
|
|
1135
|
-
return /* @__PURE__ */
|
|
1377
|
+
return /* @__PURE__ */ React19.createElement(React19.Fragment, null, children);
|
|
1136
1378
|
}
|
|
1137
1379
|
function Layout({
|
|
1138
1380
|
children,
|
|
@@ -1144,37 +1386,37 @@ function Layout({
|
|
|
1144
1386
|
console.warn(`Layout ${layout} not found`);
|
|
1145
1387
|
}
|
|
1146
1388
|
if (Layout2) {
|
|
1147
|
-
return /* @__PURE__ */
|
|
1389
|
+
return /* @__PURE__ */ React19.createElement(Layout2, { ...frontmatter }, children);
|
|
1148
1390
|
}
|
|
1149
|
-
return /* @__PURE__ */
|
|
1391
|
+
return /* @__PURE__ */ React19.createElement(React19.Fragment, null, children);
|
|
1150
1392
|
}
|
|
1151
1393
|
var componentsMap2 = {
|
|
1152
1394
|
...map_default,
|
|
1153
1395
|
wrapper: Layout
|
|
1154
1396
|
};
|
|
1155
1397
|
function Deck({ deck }) {
|
|
1156
|
-
|
|
1398
|
+
React19.useEffect(() => {
|
|
1157
1399
|
document.title = deck.metadata.title || "Untitled";
|
|
1158
1400
|
}, [deck.metadata.title]);
|
|
1159
|
-
return /* @__PURE__ */
|
|
1401
|
+
return /* @__PURE__ */ React19.createElement(React19.StrictMode, null, /* @__PURE__ */ React19.createElement(MDXProvider, { components: componentsMap2 }, /* @__PURE__ */ React19.createElement(SpectacleDeck, { theme: theme_default, template }, deck.slides.map((slide, i) => {
|
|
1160
1402
|
const Component = slide.slideComponent;
|
|
1161
|
-
return /* @__PURE__ */
|
|
1403
|
+
return /* @__PURE__ */ React19.createElement(Slide, { key: i }, /* @__PURE__ */ React19.createElement(Component, null));
|
|
1162
1404
|
}))));
|
|
1163
1405
|
}
|
|
1164
1406
|
function Danger({ children }) {
|
|
1165
|
-
return /* @__PURE__ */
|
|
1407
|
+
return /* @__PURE__ */ React19.createElement("div", { style: { color: "red" } }, children);
|
|
1166
1408
|
}
|
|
1167
1409
|
function Doc({ children }) {
|
|
1168
|
-
return /* @__PURE__ */
|
|
1410
|
+
return /* @__PURE__ */ React19.createElement("div", { style: { color: "blue" } }, children);
|
|
1169
1411
|
}
|
|
1170
1412
|
function Information({ children }) {
|
|
1171
|
-
return /* @__PURE__ */
|
|
1413
|
+
return /* @__PURE__ */ React19.createElement("div", { style: { color: "orange" } }, children);
|
|
1172
1414
|
}
|
|
1173
1415
|
function Success({ children }) {
|
|
1174
|
-
return /* @__PURE__ */
|
|
1416
|
+
return /* @__PURE__ */ React19.createElement("div", { style: { color: "green" } }, children);
|
|
1175
1417
|
}
|
|
1176
1418
|
function Side({ children }) {
|
|
1177
|
-
return /* @__PURE__ */
|
|
1419
|
+
return /* @__PURE__ */ React19.createElement("div", null, children);
|
|
1178
1420
|
}
|
|
1179
1421
|
Side.mdxType = "Side";
|
|
1180
1422
|
export {
|