@gpichot/spectacle-deck 1.1.5 → 1.1.7

package/index.cjs

@@ -67,7 +67,6 @@ var Margins = {
 };
 function getHeading(children) {
   const allChild = import_react.default.Children.toArray(children);
-  console.log(allChild);
   if (allChild.length === 0)
     return [null, allChild];
   const [candidate, ...rest] = allChild;
@@ -128,7 +127,6 @@ var CenteredLayoutContent = import_styled_components.default.div`
   }
 `;
 var CenteredLayout = (props) => {
-  console.log(props);
   const [heading, rest] = getHeading(props.children);
   return /* @__PURE__ */ import_react2.default.createElement(
     "div",
@@ -674,14 +672,20 @@ var DivWithHeading2 = import_styled_components8.default.div`
     font-weight: 400;
   }
 `;
+function parseRatio(ratio) {
+  const [a, b] = ratio.split("/");
+  return { left: parseInt(a), right: parseInt(b) };
+}
 var SidedImageLayout = ({
   children,
   image,
   position,
-  height
+  height,
+  ratio: ratioProp
 }) => {
   const isReversed = position === "left";
   const [component, rest] = getMatchingMdxType(children, "Image") || image;
+  const ratio = parseRatio(ratioProp || "6/4");
   if (!image && !component.length) {
     console.error("No image provided for SidedImageLayout");
     return null;
@@ -703,7 +707,7 @@ var SidedImageLayout = ({
       "div",
       {
         style: {
-          flex: 1,
+          flex: `${ratio.left || 6} 0`,
           display: "flex",
           flexDirection: "column",
           justifyContent: "center",
@@ -716,8 +720,7 @@ var SidedImageLayout = ({
       "div",
       {
         style: {
-          flex: 1,
-          maxWidth: "40vw",
+          flex: `${ratio.right || 4} 0`,
           display: "flex",
           flexDirection: "column",
           justifyContent: "center",
@@ -1662,7 +1665,6 @@ function Layout({
 }) {
   const layout = (frontmatter == null ? void 0 : frontmatter.layout) || "default";
   const Layout2 = layout in layouts_default ? layouts_default[layout] : null;
-  console.log(layout, Layout2);
   if (layout && !Layout2) {
     console.warn(`Layout ${layout} not found`);
   }

package/index.mjs

@@ -16,7 +16,6 @@ var Margins = {
 };
 function getHeading(children) {
   const allChild = React.Children.toArray(children);
-  console.log(allChild);
   if (allChild.length === 0)
     return [null, allChild];
   const [candidate, ...rest] = allChild;
@@ -77,7 +76,6 @@ var CenteredLayoutContent = styled.div`
   }
 `;
 var CenteredLayout = (props) => {
-  console.log(props);
   const [heading, rest] = getHeading(props.children);
   return /* @__PURE__ */ React2.createElement(
     "div",
@@ -623,14 +621,20 @@ var DivWithHeading2 = styled8.div`
     font-weight: 400;
   }
 `;
+function parseRatio(ratio) {
+  const [a, b] = ratio.split("/");
+  return { left: parseInt(a), right: parseInt(b) };
+}
 var SidedImageLayout = ({
   children,
   image,
   position,
-  height
+  height,
+  ratio: ratioProp
 }) => {
   const isReversed = position === "left";
   const [component, rest] = getMatchingMdxType(children, "Image") || image;
+  const ratio = parseRatio(ratioProp || "6/4");
   if (!image && !component.length) {
     console.error("No image provided for SidedImageLayout");
     return null;
@@ -652,7 +656,7 @@ var SidedImageLayout = ({
       "div",
       {
         style: {
-          flex: 1,
+          flex: `${ratio.left || 6} 0`,
           display: "flex",
           flexDirection: "column",
           justifyContent: "center",
@@ -665,8 +669,7 @@ var SidedImageLayout = ({
       "div",
       {
         style: {
-          flex: 1,
-          maxWidth: "40vw",
+          flex: `${ratio.right || 4} 0`,
           display: "flex",
           flexDirection: "column",
           justifyContent: "center",
@@ -1615,7 +1618,6 @@ function Layout({
 }) {
   const layout = (frontmatter == null ? void 0 : frontmatter.layout) || "default";
   const Layout2 = layout in layouts_default ? layouts_default[layout] : null;
-  console.log(layout, Layout2);
   if (layout && !Layout2) {
     console.warn(`Layout ${layout} not found`);
   }

package/layouts/SideImageLayout.d.ts

@@ -1,7 +1,8 @@
 import React from "react";
-export declare const SidedImageLayout: ({ children, image, position, height, }: {
+export declare const SidedImageLayout: ({ children, image, position, height, ratio: ratioProp, }: {
     children: React.ReactNode;
     image?: string;
     position?: "left" | "right";
+    ratio?: string;
     height?: number;
 }) => React.JSX.Element;

package/layouts/index.d.ts

@@ -13,10 +13,11 @@ declare const _default: {
     }) => import("react").JSX.Element;
     quote: typeof QuoteLayout;
     sidedCode: typeof SidedCodeLayout;
-    sidedImage: ({ children, image, position, height, }: {
+    sidedImage: ({ children, image, position, height, ratio: ratioProp, }: {
         children: import("react").ReactNode;
         image?: string;
         position?: "left" | "right";
+        ratio?: string;
         height?: number;
     }) => import("react").JSX.Element;
     side: typeof SideLayout;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gpichot/spectacle-deck",
-  "version": "1.1.5",
+  "version": "1.1.7",
   "license": "MIT",
   "type": "module",
   "main": "index.cjs",