@gpichot/spectacle-deck 1.0.0 → 1.0.1

package/index.mjs

@@ -1,41 +1,10 @@
 // src/index.tsx
-import React18 from "react";
-
-// ../../node_modules/.pnpm/@mdx-js+react@3.0.0_@types+react@18.2.34/node_modules/@mdx-js/react/lib/index.js
-import React from "react";
-var emptyComponents = {};
-var MDXContext = React.createContext(emptyComponents);
-function useMDXComponents(components) {
-  const contextComponents = React.useContext(MDXContext);
-  return React.useMemo(
-    function() {
-      if (typeof components === "function") {
-        return components(contextComponents);
-      }
-      return { ...contextComponents, ...components };
-    },
-    [contextComponents, components]
-  );
-}
-function MDXProvider(props) {
-  let allComponents;
-  if (props.disableParentContext) {
-    allComponents = typeof props.components === "function" ? props.components(emptyComponents) : props.components || emptyComponents;
-  } else {
-    allComponents = useMDXComponents(props.components);
-  }
-  return React.createElement(
-    MDXContext.Provider,
-    { value: allComponents },
-    props.children
-  );
-}
-
-// src/index.tsx
+import React17 from "react";
+import { MDXProvider } from "@mdx-js/react";
 import { Deck as SpectacleDeck, Slide } from "spectacle";
 
 // src/layouts/MainSectionLayout.tsx
-import React2 from "react";
+import React from "react";
 import { FlexBox } from "spectacle";
 
 // src/front.png
@@ -45,7 +14,7 @@ var front_default = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA2QAAAfPCAYAA
 var MainSectionLayout = ({
   children
 }) => {
-  return /* @__PURE__ */ React2.createElement(
+  return /* @__PURE__ */ React.createElement(
     FlexBox,
     {
       height: "100%",
@@ -59,8 +28,8 @@ var MainSectionLayout = ({
         bottom: 0
       }
     },
-    /* @__PURE__ */ React2.createElement("div", { style: { paddingLeft: "8rem", flex: 1 } }, children),
-    /* @__PURE__ */ React2.createElement("div", { style: { flex: "0 0", height: "100%", paddingLeft: "5rem" } }, /* @__PURE__ */ React2.createElement("img", { src: front_default, alt: "Front", style: { height: "100%" } }))
+    /* @__PURE__ */ React.createElement("div", { style: { paddingLeft: "8rem", flex: 1 } }, children),
+    /* @__PURE__ */ React.createElement("div", { style: { flex: "0 0", height: "100%", paddingLeft: "5rem" } }, /* @__PURE__ */ React.createElement("img", { src: front_default, alt: "Front", style: { height: "100%" } }))
   );
 };
 
@@ -80,10 +49,10 @@ var SectionLayout = styled.div`
 `;
 
 // src/layouts/SideCodeLayout.tsx
-import React5 from "react";
+import React4 from "react";
 
 // src/layouts/columns.tsx
-import React3 from "react";
+import React2 from "react";
 import styled2 from "styled-components";
 var DivWithHeading = styled2.div`
   h2 {
@@ -108,15 +77,15 @@ function ColumnsLayout({
   children,
   reverse
 }) {
-  const childrenArray = React3.Children.toArray(children);
-  return /* @__PURE__ */ React3.createElement(
+  const childrenArray = React2.Children.toArray(children);
+  return /* @__PURE__ */ React2.createElement(
     ColumnsContainer,
     {
       style: {
         flexDirection: reverse ? "row-reverse" : "row"
       }
     },
-    childrenArray.map((child, i) => /* @__PURE__ */ React3.createElement(
+    childrenArray.map((child, i) => /* @__PURE__ */ React2.createElement(
       "div",
       {
         key: i,
@@ -135,18 +104,18 @@ function ColumnsLayout({
 }
 
 // src/layouts/utils.ts
-import React4 from "react";
+import React3 from "react";
 var Margins = {
   vertical: "4rem",
   horizontal: "7rem",
   horizontalInternal: "2rem"
 };
 function getCode(children) {
-  const allChild = React4.Children.toArray(children);
+  const allChild = React3.Children.toArray(children);
   if (allChild.length === 0)
     return [null, allChild];
   const index = allChild.findIndex((child) => {
-    if (!React4.isValidElement(child))
+    if (!React3.isValidElement(child))
       return false;
     return child.props.originalType === "pre";
   });
@@ -157,9 +126,9 @@ function getCode(children) {
   return [candidate, rest];
 }
 function getMatchingMdxType(children, mdxType) {
-  const allChild = React4.Children.toArray(children);
+  const allChild = React3.Children.toArray(children);
   const matchFn = (child) => {
-    if (!React4.isValidElement(child))
+    if (!React3.isValidElement(child))
       return false;
     if (typeof child.type !== "function")
       return false;
@@ -194,7 +163,7 @@ function SidedCodeLayout({
   position = "right"
 }) {
   const [code, rest] = getCodeChildren(children);
-  return /* @__PURE__ */ React5.createElement(ColumnsLayout, { reverse: position === "left" }, /* @__PURE__ */ React5.createElement(
+  return /* @__PURE__ */ React4.createElement(ColumnsLayout, { reverse: position === "left" }, /* @__PURE__ */ React4.createElement(
     "div",
     {
       style: {
@@ -203,7 +172,7 @@ function SidedCodeLayout({
       }
     },
     rest
-  ), /* @__PURE__ */ React5.createElement(
+  ), /* @__PURE__ */ React4.createElement(
     CodeSide,
     {
       style: {
@@ -219,11 +188,11 @@ function SidedCodeLayout({
 }
 
 // src/layouts/SideImageLayout.tsx
-import React7 from "react";
+import React6 from "react";
 import styled5 from "styled-components";
 
 // src/components/Image.tsx
-import React6 from "react";
+import React5 from "react";
 
 // src/layouts/styled.ts
 import styled4 from "styled-components";
@@ -237,7 +206,7 @@ var SVGObject = styled4.object`
 function Image(props) {
   const { src, height } = props;
   if (!(src == null ? void 0 : src.endsWith(".svg"))) {
-    return /* @__PURE__ */ React6.createElement(
+    return /* @__PURE__ */ React5.createElement(
       "img",
       {
         src,
@@ -250,7 +219,7 @@ function Image(props) {
       }
     );
   }
-  return /* @__PURE__ */ React6.createElement(
+  return /* @__PURE__ */ React5.createElement(
     SVGObject,
     {
       type: "image/svg+xml",
@@ -287,7 +256,7 @@ var SidedImageLayout = ({
     console.error("No image provided for SidedImageLayout");
     return null;
   }
-  return /* @__PURE__ */ React7.createElement(
+  return /* @__PURE__ */ React6.createElement(
     DivWithHeading2,
     {
       style: {
@@ -300,7 +269,7 @@ var SidedImageLayout = ({
         top: 0
       }
     },
-    /* @__PURE__ */ React7.createElement(
+    /* @__PURE__ */ React6.createElement(
       "div",
       {
         style: {
@@ -313,7 +282,7 @@ var SidedImageLayout = ({
       },
       rest
     ),
-    /* @__PURE__ */ React7.createElement(
+    /* @__PURE__ */ React6.createElement(
       "div",
       {
         style: {
@@ -325,19 +294,19 @@ var SidedImageLayout = ({
           backgroundColor: "white"
         }
       },
-      component || /* @__PURE__ */ React7.createElement(Image, { src: image })
+      component || /* @__PURE__ */ React6.createElement(Image, { src: image })
     )
   );
 };
 
 // src/layouts/SideLayout.tsx
-import React8 from "react";
+import React7 from "react";
 function SideLayout({
   children,
   position = "right"
 }) {
   const [side, rest] = getMatchingMdxType(children, "Side");
-  return /* @__PURE__ */ React8.createElement(ColumnsLayout, { reverse: position === "left" }, /* @__PURE__ */ React8.createElement("div", { style: { marginLeft: Margins.horizontal } }, rest), /* @__PURE__ */ React8.createElement(
+  return /* @__PURE__ */ React7.createElement(ColumnsLayout, { reverse: position === "left" }, /* @__PURE__ */ React7.createElement("div", { style: { marginLeft: Margins.horizontal } }, rest), /* @__PURE__ */ React7.createElement(
     "div",
     {
       style: {
@@ -389,11 +358,11 @@ var theme_default = {
 };
 
 // src/template.tsx
-import React9 from "react";
+import React8 from "react";
 import { Box, FullScreen } from "spectacle";
 var template = ({ slideNumber, numberOfSlides }) => {
   const percentage = slideNumber / numberOfSlides * 100;
-  return /* @__PURE__ */ React9.createElement("div", { style: { position: "absolute", bottom: 0, left: 0, right: 0 } }, /* @__PURE__ */ React9.createElement(Box, { padding: "0 0 0.5em 0.7em" }, /* @__PURE__ */ React9.createElement(FullScreen, null)), /* @__PURE__ */ React9.createElement("div", { style: { width: "100%", height: "4px", background: "#ffffff11" } }, /* @__PURE__ */ React9.createElement(
+  return /* @__PURE__ */ React8.createElement("div", { style: { position: "absolute", bottom: 0, left: 0, right: 0 } }, /* @__PURE__ */ React8.createElement(Box, { padding: "0 0 0.5em 0.7em" }, /* @__PURE__ */ React8.createElement(FullScreen, null)), /* @__PURE__ */ React8.createElement("div", { style: { width: "100%", height: "4px", background: "#ffffff11" } }, /* @__PURE__ */ React8.createElement(
     "div",
     {
       style: {
@@ -407,11 +376,11 @@ var template = ({ slideNumber, numberOfSlides }) => {
 };
 
 // src/components/map.tsx
-import React12 from "react";
+import React11 from "react";
 import { mdxComponentMap } from "spectacle";
 
 // src/components/styled.tsx
-import React10 from "react";
+import React9 from "react";
 import {
   Link as SpectacleLink,
   Image as SpectacleImage,
@@ -424,7 +393,7 @@ var StyledImage = styled6(SpectacleImage)`
   max-height: 30vh;
   max-width: 70vw;
 `;
-var Image2 = (props) => /* @__PURE__ */ React10.createElement(FlexBox2, { margin: "0 0", padding: "0 0" }, /* @__PURE__ */ React10.createElement(StyledImage, { ...props }));
+var Image2 = (props) => /* @__PURE__ */ React9.createElement(FlexBox2, { margin: "0 0", padding: "0 0" }, /* @__PURE__ */ React9.createElement(StyledImage, { ...props }));
 var CustomHeading = styled6(Heading)`
   strong {
     color: #f49676;
@@ -469,7 +438,7 @@ var HeadingThree = styled6.h3`
 `;
 
 // src/components/CodeStepper/CodeStepper.tsx
-import React11 from "react";
+import React10 from "react";
 import ReactIs from "react-is";
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
 import gruvboxDark from "react-syntax-highlighter/dist/cjs/styles/prism/gruvbox-dark";
@@ -559,7 +528,7 @@ var CodeContainer = styled7.div`
   }
 `;
 function useCodeSteps(code) {
-  return React11.useMemo(() => {
+  return React10.useMemo(() => {
     const prefixes = code.match(/(?:\/\/|<!--) @.*\n/g) || [];
     const prefixesLength = prefixes.reduce(
       (acc, prefix) => acc + prefix.length,
@@ -579,8 +548,8 @@ function useCodeSteps(code) {
   }, [code]);
 }
 function getCodeDetails(children) {
-  const child = React11.Children.toArray(children)[0];
-  if (!React11.isValidElement(child)) {
+  const child = React10.Children.toArray(children)[0];
+  if (!React10.isValidElement(child)) {
     return {
       language: "",
       code: ReactIs.isFragment(child) ? "" : String(child || "")
@@ -598,7 +567,7 @@ function CodeWrapper({
   hasName,
   children
 }) {
-  return /* @__PURE__ */ React11.createElement(
+  return /* @__PURE__ */ React10.createElement(
     "div",
     {
       style: {
@@ -608,7 +577,7 @@ function CodeWrapper({
         borderRadius: "4px"
       }
     },
-    name && /* @__PURE__ */ React11.createElement(
+    name && /* @__PURE__ */ React10.createElement(
       "span",
       {
         style: {
@@ -625,7 +594,7 @@ function CodeWrapper({
       name
     ),
     children,
-    hasName && /* @__PURE__ */ React11.createElement(
+    hasName && /* @__PURE__ */ React10.createElement(
       "span",
       {
         style: {
@@ -640,7 +609,7 @@ function CodeWrapper({
           fontStyle: "italic"
         }
       },
-      stepName || /* @__PURE__ */ React11.createElement("span", { style: { visibility: "hidden" } }, "Step")
+      stepName || /* @__PURE__ */ React10.createElement("span", { style: { visibility: "hidden" } }, "Step")
     )
   );
 }
@@ -649,7 +618,7 @@ function CodeStepper({
   name,
   ...props
 }) {
-  const { language, code } = React11.useMemo(() => {
+  const { language, code } = React10.useMemo(() => {
     return getCodeDetails(props.children);
   }, [props.children]);
   const {
@@ -659,21 +628,21 @@ function CodeStepper({
     hasSteps,
     hasName
   } = useCodeSteps(code);
-  return /* @__PURE__ */ React11.createElement(CodeContainer, null, import.meta.env.DEV && Boolean(prefixes == null ? void 0 : prefixes.length) && /* @__PURE__ */ React11.createElement("div", { style: { position: "absolute", top: 0, opacity: 0.5, left: 0 } }, /* @__PURE__ */ React11.createElement(Highlighter, { language, style: gruvboxDark }, prefixes.join(""))), /* @__PURE__ */ React11.createElement(
+  return /* @__PURE__ */ React10.createElement(CodeContainer, null, import.meta.env.DEV && Boolean(prefixes == null ? void 0 : prefixes.length) && /* @__PURE__ */ React10.createElement("div", { style: { position: "absolute", top: 0, opacity: 0.5, left: 0 } }, /* @__PURE__ */ React10.createElement(Highlighter, { language, style: gruvboxDark }, prefixes.join(""))), /* @__PURE__ */ React10.createElement(
     Stepper,
     {
       values: steps,
       alwaysVisible: !hasSteps,
       priority: priority ? priority + 1 : void 0
     },
-    (step, _, isActive) => /* @__PURE__ */ React11.createElement(
+    (step, _, isActive) => /* @__PURE__ */ React10.createElement(
       CodeWrapper,
       {
         name,
         stepName: step == null ? void 0 : step.name,
         hasName
       },
-      /* @__PURE__ */ React11.createElement(
+      /* @__PURE__ */ React10.createElement(
         Highlighter,
         {
           language,
@@ -723,7 +692,7 @@ CodeStepper.mdxType = "CodeStepper";
 // src/components/map.tsx
 var componentsMap = {
   ...mdxComponentMap,
-  inlineCode: (props) => /* @__PURE__ */ React12.createElement(
+  inlineCode: (props) => /* @__PURE__ */ React11.createElement(
     InlineCode,
     {
       ...props,
@@ -733,7 +702,7 @@ var componentsMap = {
       }
     }
   ),
-  table: (props) => /* @__PURE__ */ React12.createElement(
+  table: (props) => /* @__PURE__ */ React11.createElement(
     "table",
     {
       ...props,
@@ -744,7 +713,7 @@ var componentsMap = {
       }
     }
   ),
-  tr: (props) => /* @__PURE__ */ React12.createElement(
+  tr: (props) => /* @__PURE__ */ React11.createElement(
     "tr",
     {
       ...props,
@@ -756,7 +725,7 @@ var componentsMap = {
       }
     }
   ),
-  td: (props) => /* @__PURE__ */ React12.createElement(
+  td: (props) => /* @__PURE__ */ React11.createElement(
     "td",
     {
       ...props,
@@ -769,7 +738,7 @@ var componentsMap = {
       }
     }
   ),
-  h1: (props) => /* @__PURE__ */ React12.createElement(
+  h1: (props) => /* @__PURE__ */ React11.createElement(
     CustomHeading,
     {
       fontSize: "h1",
@@ -784,15 +753,15 @@ var componentsMap = {
     },
     props.children
   ),
-  h2: (props) => /* @__PURE__ */ React12.createElement(HeadingTwo, null, props.children),
-  h3: (props) => /* @__PURE__ */ React12.createElement(HeadingThree, { ...props }),
-  img: (props) => /* @__PURE__ */ React12.createElement(Image2, { ...props }),
+  h2: (props) => /* @__PURE__ */ React11.createElement(HeadingTwo, null, props.children),
+  h3: (props) => /* @__PURE__ */ React11.createElement(HeadingThree, { ...props }),
+  img: (props) => /* @__PURE__ */ React11.createElement(Image2, { ...props }),
   pre: CodeStepper,
-  li: (props) => /* @__PURE__ */ React12.createElement("li", { ...props, style: { margin: "24px 0" } }),
-  Side: (props) => /* @__PURE__ */ React12.createElement("div", { ...props }),
+  li: (props) => /* @__PURE__ */ React11.createElement("li", { ...props, style: { margin: "24px 0" } }),
+  Side: (props) => /* @__PURE__ */ React11.createElement("div", { ...props }),
   p: (props) => {
     const Text = mdxComponentMap.p;
-    return /* @__PURE__ */ React12.createElement(
+    return /* @__PURE__ */ React11.createElement(
       Text,
       {
         style: { margin: "8px 0", padding: "8px 0", lineHeight: "2rem" },
@@ -800,10 +769,10 @@ var componentsMap = {
       }
     );
   },
-  blockquote: (props) => /* @__PURE__ */ React12.createElement(CustomQuote, { ...props }),
+  blockquote: (props) => /* @__PURE__ */ React11.createElement(CustomQuote, { ...props }),
   a: ({ children, ...props }) => {
     const domain = new URL(props.href || "").hostname;
-    return /* @__PURE__ */ React12.createElement("a", { ...props, style: { color: "#f49676", textDecoration: "none" } }, children, " ", /* @__PURE__ */ React12.createElement(
+    return /* @__PURE__ */ React11.createElement("a", { ...props, style: { color: "#f49676", textDecoration: "none" } }, children, " ", /* @__PURE__ */ React11.createElement(
       "small",
       {
         style: {
@@ -819,14 +788,14 @@ var componentsMap = {
 var map_default = componentsMap;
 
 // src/components/FilePane.tsx
-import React13 from "react";
+import React12 from "react";
 function FilePane({
   name,
   children,
   priority,
   ...divProps
 }) {
-  return React13.isValidElement(children) ? React13.cloneElement(children, {
+  return React12.isValidElement(children) ? React12.cloneElement(children, {
     // @ts-expect-error cloning
     priority,
     name
@@ -835,14 +804,14 @@ function FilePane({
 FilePane.mdxType = "FilePane";
 
 // src/components/ItemsColumn.tsx
-import React14 from "react";
+import React13 from "react";
 import { Stepper as Stepper2 } from "spectacle";
 import styled8 from "styled-components";
 import { useSpring, animated } from "react-spring";
 function ItemsColumn(divProps) {
   const { style, children, ...props } = divProps;
-  const childrenArray = React14.Children.toArray(children);
-  return /* @__PURE__ */ React14.createElement(Stepper2, { values: childrenArray }, (value, step) => /* @__PURE__ */ React14.createElement(
+  const childrenArray = React13.Children.toArray(children);
+  return /* @__PURE__ */ React13.createElement(Stepper2, { values: childrenArray }, (value, step) => /* @__PURE__ */ React13.createElement(
     "div",
     {
       style: {
@@ -856,10 +825,10 @@ function ItemsColumn(divProps) {
     },
     childrenArray.map((child, index) => {
       const isVisible = index <= step;
-      if (!React14.isValidElement(child)) {
+      if (!React13.isValidElement(child)) {
         return child;
       }
-      return /* @__PURE__ */ React14.createElement(ItemColumnWrapper, { key: index, isVisible }, child);
+      return /* @__PURE__ */ React13.createElement(ItemColumnWrapper, { key: index, isVisible }, child);
     })
   ));
 }
@@ -874,11 +843,11 @@ function ItemColumnWrapper({
   ...props
 }) {
   const styles = useSpring({ opacity: isVisible ? 1 : 0 });
-  return /* @__PURE__ */ React14.createElement(ItemColumnWrapperStyled, { style: styles, ...props }, children);
+  return /* @__PURE__ */ React13.createElement(ItemColumnWrapperStyled, { style: styles, ...props }, children);
 }
 
 // src/components/HorizontalList.tsx
-import React15 from "react";
+import React14 from "react";
 import { animated as animated2, useSpring as useSpring2 } from "react-spring";
 import { Stepper as Stepper3 } from "spectacle";
 import styled9 from "styled-components";
@@ -890,8 +859,8 @@ function HorizontalList({
   children,
   columns = 3
 }) {
-  const items = React15.Children.toArray(children);
-  return /* @__PURE__ */ React15.createElement(Stepper3, { values: items }, (_, step) => /* @__PURE__ */ React15.createElement(
+  const items = React14.Children.toArray(children);
+  return /* @__PURE__ */ React14.createElement(Stepper3, { values: items }, (_, step) => /* @__PURE__ */ React14.createElement(
     Container,
     {
       style: {
@@ -899,10 +868,10 @@ function HorizontalList({
       }
     },
     items.map((item, k) => {
-      if (!React15.isValidElement(item)) {
+      if (!React14.isValidElement(item)) {
         return item;
       }
-      return React15.cloneElement(item, {
+      return React14.cloneElement(item, {
         // @ts-expect-error cloning
         position: k + 1,
         isVisible: k <= step,
@@ -912,12 +881,12 @@ function HorizontalList({
   ));
 }
 function Pill({ position }) {
-  return /* @__PURE__ */ React15.createElement(
+  return /* @__PURE__ */ React14.createElement(
     "div",
     {
       style: { width: 48, transform: "translate(-25%, -25%)", opacity: 0.9 }
     },
-    /* @__PURE__ */ React15.createElement(
+    /* @__PURE__ */ React14.createElement(
       "svg",
       {
         width: "48",
@@ -926,14 +895,14 @@ function Pill({ position }) {
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg"
       },
-      /* @__PURE__ */ React15.createElement(
+      /* @__PURE__ */ React14.createElement(
         "path",
         {
           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",
           fill: "#ffffff"
         }
       ),
-      /* @__PURE__ */ React15.createElement(
+      /* @__PURE__ */ React14.createElement(
         "text",
         {
           x: "9",
@@ -945,7 +914,7 @@ function Pill({ position }) {
         },
         position
       ),
-      /* @__PURE__ */ React15.createElement(
+      /* @__PURE__ */ React14.createElement(
         "path",
         {
           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",
@@ -998,11 +967,11 @@ function HorizontalListItem({
   const opacityStyles = useSpring2({
     opacity: getItemOpacity({ isVisible, isLast })
   });
-  return /* @__PURE__ */ React15.createElement(Item, { style: opacityStyles }, /* @__PURE__ */ React15.createElement(ItemHead, null, /* @__PURE__ */ React15.createElement(Pill, { position }), /* @__PURE__ */ React15.createElement("p", null, title)), /* @__PURE__ */ React15.createElement(ItemContent, null, children));
+  return /* @__PURE__ */ React14.createElement(Item, { style: opacityStyles }, /* @__PURE__ */ React14.createElement(ItemHead, null, /* @__PURE__ */ React14.createElement(Pill, { position }), /* @__PURE__ */ React14.createElement("p", null, title)), /* @__PURE__ */ React14.createElement(ItemContent, null, children));
 }
 
 // src/components/Timeline.tsx
-import React16 from "react";
+import React15 from "react";
 import { animated as animated3, useSpring as useSpring3 } from "react-spring";
 import classnames from "classnames";
 import { Stepper as Stepper4 } from "spectacle";
@@ -1012,13 +981,13 @@ var Timeline_module_default = {};
 
 // src/components/Timeline.tsx
 function Timeline(props) {
-  const children = React16.Children.toArray(props.children);
-  return /* @__PURE__ */ React16.createElement(Stepper4, { ...props, values: children, className: Timeline_module_default["timeline"] }, (value, step) => {
+  const children = React15.Children.toArray(props.children);
+  return /* @__PURE__ */ React15.createElement(Stepper4, { ...props, values: children, className: Timeline_module_default["timeline"] }, (value, step) => {
     return children.map((child, index) => {
-      if (!React16.isValidElement(child)) {
+      if (!React15.isValidElement(child)) {
         return child;
       }
-      return React16.cloneElement(child, {
+      return React15.cloneElement(child, {
         // @ts-expect-error cloning
         isPhantom: step < index,
         isLast: step === index
@@ -1045,7 +1014,7 @@ function TimelineItem(props) {
     opacity: getItemOpacity2({ isPhantom, isLast })
   });
   const colorStyles = useSpring3({ opacity: isPhantom || isLast ? 1 : 0.15 });
-  return /* @__PURE__ */ React16.createElement(
+  return /* @__PURE__ */ React15.createElement(
     animated3.div,
     {
       ...rest,
@@ -1054,7 +1023,7 @@ function TimelineItem(props) {
         ...appearStyles
       }
     },
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(
       "div",
       {
         className: classnames(
@@ -1062,21 +1031,21 @@ function TimelineItem(props) {
           Timeline_module_default["timelineItemContentPhantom"]
         )
       },
-      /* @__PURE__ */ React16.createElement("div", { className: Timeline_module_default["timelineItemTitle"] }, title),
-      /* @__PURE__ */ React16.createElement("div", { className: Timeline_module_default["timelineItemBody"] }, children)
+      /* @__PURE__ */ React15.createElement("div", { className: Timeline_module_default["timelineItemTitle"] }, title),
+      /* @__PURE__ */ React15.createElement("div", { className: Timeline_module_default["timelineItemBody"] }, children)
     ),
-    /* @__PURE__ */ React16.createElement(animated3.div, { className: Timeline_module_default["timelineItemGuide"], style: colorStyles }, /* @__PURE__ */ React16.createElement(Hexagon, null), /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(animated3.div, { className: Timeline_module_default["timelineItemGuide"], style: colorStyles }, /* @__PURE__ */ React15.createElement(Hexagon, null), /* @__PURE__ */ React15.createElement(
       animated3.div,
       {
         className: Timeline_module_default["timelineItemGuideLine"],
         style: guideLineProps
       }
     )),
-    /* @__PURE__ */ React16.createElement("div", { className: Timeline_module_default["timelineItemContent"] }, /* @__PURE__ */ React16.createElement("div", { className: Timeline_module_default["timelineItemTitle"] }, title), /* @__PURE__ */ React16.createElement("div", { className: Timeline_module_default["timelineItemBody"] }, children))
+    /* @__PURE__ */ React15.createElement("div", { className: Timeline_module_default["timelineItemContent"] }, /* @__PURE__ */ React15.createElement("div", { className: Timeline_module_default["timelineItemTitle"] }, title), /* @__PURE__ */ React15.createElement("div", { className: Timeline_module_default["timelineItemBody"] }, children))
   );
 }
 function Hexagon() {
-  return /* @__PURE__ */ React16.createElement(
+  return /* @__PURE__ */ React15.createElement(
     "svg",
     {
       width: "18",
@@ -1085,14 +1054,14 @@ function Hexagon() {
       fill: "none",
       xmlns: "http://www.w3.org/2000/svg"
     },
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(
       "path",
       {
         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",
         fill: "#F49676"
       }
     ),
-    /* @__PURE__ */ React16.createElement(
+    /* @__PURE__ */ React15.createElement(
       "path",
       {
         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,7 +1072,7 @@ function Hexagon() {
 }
 
 // src/components/IconBox.tsx
-import React17 from "react";
+import React16 from "react";
 import styled10 from "styled-components";
 var IconBoxContent = styled10.div`
   * {
@@ -1115,7 +1084,7 @@ function IconBox({
   children,
   icon
 }) {
-  return /* @__PURE__ */ React17.createElement(
+  return /* @__PURE__ */ React16.createElement(
     "div",
     {
       style: {
@@ -1125,14 +1094,14 @@ function IconBox({
         padding: "1rem 0"
       }
     },
-    /* @__PURE__ */ React17.createElement("div", { style: { fontSize: 60 } }, icon),
-    /* @__PURE__ */ React17.createElement(IconBoxContent, null, children)
+    /* @__PURE__ */ React16.createElement("div", { style: { fontSize: 60 } }, icon),
+    /* @__PURE__ */ React16.createElement(IconBoxContent, null, children)
   );
 }
 
 // src/index.tsx
 function PassThrough({ children }) {
-  return /* @__PURE__ */ React18.createElement(React18.Fragment, null, children);
+  return /* @__PURE__ */ React17.createElement(React17.Fragment, null, children);
 }
 function Layout({
   children,
@@ -1144,37 +1113,37 @@ function Layout({
     console.warn(`Layout ${layout} not found`);
   }
   if (Layout2) {
-    return /* @__PURE__ */ React18.createElement(Layout2, { ...frontmatter }, children);
+    return /* @__PURE__ */ React17.createElement(Layout2, { ...frontmatter }, children);
   }
-  return /* @__PURE__ */ React18.createElement(React18.Fragment, null, children);
+  return /* @__PURE__ */ React17.createElement(React17.Fragment, null, children);
 }
 var componentsMap2 = {
   ...map_default,
   wrapper: Layout
 };
 function Deck({ deck }) {
-  React18.useEffect(() => {
+  React17.useEffect(() => {
     document.title = deck.metadata.title || "Untitled";
   }, [deck.metadata.title]);
-  return /* @__PURE__ */ React18.createElement(React18.StrictMode, null, /* @__PURE__ */ React18.createElement(MDXProvider, { components: componentsMap2 }, /* @__PURE__ */ React18.createElement(SpectacleDeck, { theme: theme_default, template }, deck.slides.map((slide, i) => {
+  return /* @__PURE__ */ React17.createElement(React17.StrictMode, null, /* @__PURE__ */ React17.createElement(MDXProvider, { components: componentsMap2 }, /* @__PURE__ */ React17.createElement(SpectacleDeck, { theme: theme_default, template }, deck.slides.map((slide, i) => {
     const Component = slide.slideComponent;
-    return /* @__PURE__ */ React18.createElement(Slide, { key: i }, /* @__PURE__ */ React18.createElement(Component, null));
+    return /* @__PURE__ */ React17.createElement(Slide, { key: i }, /* @__PURE__ */ React17.createElement(Component, null));
   }))));
 }
 function Danger({ children }) {
-  return /* @__PURE__ */ React18.createElement("div", { style: { color: "red" } }, children);
+  return /* @__PURE__ */ React17.createElement("div", { style: { color: "red" } }, children);
 }
 function Doc({ children }) {
-  return /* @__PURE__ */ React18.createElement("div", { style: { color: "blue" } }, children);
+  return /* @__PURE__ */ React17.createElement("div", { style: { color: "blue" } }, children);
 }
 function Information({ children }) {
-  return /* @__PURE__ */ React18.createElement("div", { style: { color: "orange" } }, children);
+  return /* @__PURE__ */ React17.createElement("div", { style: { color: "orange" } }, children);
 }
 function Success({ children }) {
-  return /* @__PURE__ */ React18.createElement("div", { style: { color: "green" } }, children);
+  return /* @__PURE__ */ React17.createElement("div", { style: { color: "green" } }, children);
 }
 function Side({ children }) {
-  return /* @__PURE__ */ React18.createElement("div", null, children);
+  return /* @__PURE__ */ React17.createElement("div", null, children);
 }
 Side.mdxType = "Side";
 export {