@mindful-web/marko-web-theme-monorail 1.0.0

package/components/blocks/newsletter-signup-banner-large.marko.js

@@ -0,0 +1,93 @@
+// Compiled using marko@4.20.2 - DO NOT EDIT
+"use strict";
+
+var marko_template = module.exports = require("marko/dist/html").t(__filename),
+    marko_componentType = "/@mindful-web/marko-web-theme-monorail$1.0.0/components/blocks/newsletter-signup-banner-large.marko",
+    marko_renderer = require("marko/dist/runtime/components/renderer"),
+    helpers_escape_xml = require("marko/dist/runtime/html/helpers/escape-xml"),
+    marko_escapeXml = helpers_escape_xml.x,
+    marko_web_element_template = require("@mindful-web/marko-web/components/element/index.marko"),
+    marko_loadTag = require("marko/dist/runtime/helpers/load-tag"),
+    marko_web_element_tag = marko_loadTag(marko_web_element_template),
+    marko_str = require("marko/dist/runtime/helpers/to-string"),
+    marko_forOf = require("marko/dist/runtime/helpers/for-of"),
+    marko_attr = require("marko/dist/runtime/html/helpers/attr"),
+    marko_classAttr = require("marko/dist/runtime/html/helpers/class-attr"),
+    marko_web_block_template = require("@mindful-web/marko-web/components/element/block.marko"),
+    marko_web_block_tag = marko_loadTag(marko_web_block_template);
+
+function render(input, out, __component, component, state) {
+  var data = input;
+
+  const blockName = "newsletter-signup-banner-large";
+
+  const { site } = out.global;
+
+  const {
+  action,
+  hiddenInputs,
+  name,
+  description,
+  disabled
+} = site.getAsObject('newsletter.signupBannerLarge');
+
+  if ((action && description) && name) {
+    marko_web_block_tag({
+        name: blockName,
+        tag: "div",
+        class: input.class,
+        renderBody: function(out) {
+          marko_web_element_tag({
+              name: "name",
+              tag: "div",
+              blockName: blockName,
+              renderBody: function(out) {
+                out.w(marko_escapeXml(name));
+              }
+            }, out, __component, "1");
+
+          marko_web_element_tag({
+              name: "description",
+              tag: "div",
+              blockName: blockName,
+              renderBody: function(out) {
+                out.w(marko_str(description));
+              }
+            }, out, __component, "2");
+
+          out.w("<form method=\"GET\"" +
+            marko_attr("action", action) +
+            marko_classAttr(blockName + "__form") +
+            "><label for=\"newsletter-signup-banner-large-email\" class=\"sr-only\">Email</label><input id=\"newsletter-signup-banner-large-email\" class=\"form-control\" placeholder=\"example@gmail.com\" type=\"email\" name=\"em\" required>");
+
+          var $for$0 = 0;
+
+          marko_forOf(hiddenInputs, function(item) {
+            var $keyScope$0 = "[" + (($for$0++) + "]");
+
+            out.w("<input type=\"hidden\"" +
+              marko_attr("name", item.name) +
+              marko_attr("value", item.value) +
+              ">");
+          });
+
+          out.w("<button class=\"btn btn-primary\" type=\"submit\"" +
+            marko_attr("disabled", disabled && "disabled") +
+            ">Sign Up</button></form>");
+        }
+      }, out, __component, "0");
+  }
+}
+
+marko_template._ = marko_renderer(render, {
+    d_: true,
+    e_: marko_componentType
+  });
+
+marko_template.meta = {
+    id: "/@mindful-web/marko-web-theme-monorail$1.0.0/components/blocks/newsletter-signup-banner-large.marko",
+    tags: [
+      "@mindful-web/marko-web/components/element/index.marko",
+      "@mindful-web/marko-web/components/element/block.marko"
+    ]
+  };

package/components/blocks/newsletter-signup-banner.marko

@@ -0,0 +1,39 @@
+import { buildImgixUrl } from "@mindful-web/image";
+
+$ const blockName = "newsletter-signup-banner";
+
+$ const { config, site, recaptcha } = out.global;
+$ const {
+  name,
+  description,
+  imagePath,
+  defaultNewsletter,
+  newsletters,
+  demographic,
+  disabled,
+  privacyPolicy,
+} = site.getAsObject("newsletter.signupBanner");
+
+$ const lang = site.config.lang || "en";
+$ const imageSrc = imagePath ? buildImgixUrl(`https://${config.website("imageHost")}/${imagePath}`, { w: 120, auto: "format,compress" }) : null;
+$ const imageSrcset = imageSrc ? `${imageSrc}&dpr=2 2x` : null;
+
+<if(name && description)>
+  <marko-web-browser-component
+    name="ThemeInlineNewsletterForm"
+    props={
+      siteName: config.website("name"),
+      name,
+      description,
+      defaultNewsletter,
+      newsletters,
+      demographic,
+      disabled,
+      imageSrc,
+      imageSrcset,
+      recaptchaSiteKey: recaptcha.siteKey,
+      privacyPolicyLink: privacyPolicy,
+      lang
+    }
+  />
+</if>

package/components/blocks/newsletter-signup-banner.marko.js

@@ -0,0 +1,69 @@
+// Compiled using marko@4.20.2 - DO NOT EDIT
+"use strict";
+
+var marko_template = module.exports = require("marko/dist/html").t(__filename),
+    marko_componentType = "/@mindful-web/marko-web-theme-monorail$1.0.0/components/blocks/newsletter-signup-banner.marko",
+    marko_renderer = require("marko/dist/runtime/components/renderer"),
+    module_image_module = require("@mindful-web/image"),
+    image_module = module_image_module.default || module_image_module,
+    buildImgixUrl = module_image_module.buildImgixUrl,
+    marko_web_browser_component_template = require("@mindful-web/marko-web/components/browser-component.marko"),
+    marko_loadTag = require("marko/dist/runtime/helpers/load-tag"),
+    marko_web_browser_component_tag = marko_loadTag(marko_web_browser_component_template);
+
+function render(input, out, __component, component, state) {
+  var data = input;
+
+  const blockName = "newsletter-signup-banner";
+
+  const { config, site, recaptcha } = out.global;
+
+  const {
+  name,
+  description,
+  imagePath,
+  defaultNewsletter,
+  newsletters,
+  demographic,
+  disabled,
+  privacyPolicy,
+} = site.getAsObject("newsletter.signupBanner");
+
+  const lang = site.config.lang || "en";
+
+  const imageSrc = imagePath ? buildImgixUrl(`https://${config.website("imageHost")}/${imagePath}`, { w: 120, auto: "format,compress" }) : null;
+
+  const imageSrcset = imageSrc ? `${imageSrc}&dpr=2 2x` : null;
+
+  if (name && description) {
+    marko_web_browser_component_tag({
+        name: "ThemeInlineNewsletterForm",
+        props: {
+            siteName: config.website("name"),
+            name: name,
+            description: description,
+            defaultNewsletter: defaultNewsletter,
+            newsletters: newsletters,
+            demographic: demographic,
+            disabled: disabled,
+            imageSrc: imageSrc,
+            imageSrcset: imageSrcset,
+            recaptchaSiteKey: recaptcha.siteKey,
+            privacyPolicyLink: privacyPolicy,
+            lang: lang
+          }
+      }, out, __component, "0");
+  }
+}
+
+marko_template._ = marko_renderer(render, {
+    d_: true,
+    e_: marko_componentType
+  });
+
+marko_template.meta = {
+    id: "/@mindful-web/marko-web-theme-monorail$1.0.0/components/blocks/newsletter-signup-banner.marko",
+    tags: [
+      "@mindful-web/marko-web/components/browser-component.marko"
+    ]
+  };

package/components/blocks/opinion.marko

@@ -0,0 +1,34 @@
+import queryFragment from "../../graphql/fragments/opinion-block";
+import sectionFragment from "../../graphql/fragments/section-info";
+
+<!-- @todo likely should change the name of this component -->
+$ const queryParams = {
+  sectionAlias: input.alias,
+  limit: 3,
+  queryFragment,
+  sectionFragment,
+};
+
+$ const blockName = "opinion";
+
+<marko-web-query|{ nodes, section }| name="website-scheduled-content" params=queryParams>
+  <marko-web-block name=blockName>
+    <marko-web-website-section-name obj=section link=true block-name=blockName class=`${blockName}__header` />
+    <theme-card-deck-flow
+      cols=3
+      nodes=nodes
+      modifiers=[blockName]
+    >
+      <@slot|{ node }|>
+        <theme-content-node
+          card=true
+          flush=true
+          full-height=true
+          node=node
+          modifiers=[blockName]
+          with-attribution=true
+        />
+      </@slot>
+    </theme-card-deck-flow>
+  </marko-web-block>
+</marko-web-query>

package/components/blocks/opinion.marko.js

@@ -0,0 +1,95 @@
+// Compiled using marko@4.20.2 - DO NOT EDIT
+"use strict";
+
+var marko_template = module.exports = require("marko/dist/html").t(__filename),
+    marko_componentType = "/@mindful-web/marko-web-theme-monorail$1.0.0/components/blocks/opinion.marko",
+    marko_component = require("./opinion.marko"),
+    marko_renderer = require("marko/dist/runtime/components/renderer"),
+    module_queryFragment = require("../../graphql/fragments/opinion-block"),
+    queryFragment = module_queryFragment.default || module_queryFragment,
+    module_sectionFragment = require("../../graphql/fragments/section-info"),
+    sectionFragment = module_sectionFragment.default || module_sectionFragment,
+    marko_web_website_section_name_template = require("@mindful-web/marko-web/components/element/website-section/name.marko"),
+    marko_loadTag = require("marko/dist/runtime/helpers/load-tag"),
+    marko_web_website_section_name_tag = marko_loadTag(marko_web_website_section_name_template),
+    theme_content_node_template = require("../nodes/content.marko"),
+    theme_content_node_tag = marko_loadTag(theme_content_node_template),
+    theme_card_deck_flow_template = require("../flows/card-deck.marko"),
+    theme_card_deck_flow_tag = marko_loadTag(theme_card_deck_flow_template),
+    marko_web_block_template = require("@mindful-web/marko-web/components/element/block.marko"),
+    marko_web_block_tag = marko_loadTag(marko_web_block_template),
+    marko_web_query_template = require("@mindful-web/marko-core/components/queries/index.marko"),
+    marko_web_query_tag = marko_loadTag(marko_web_query_template);
+
+function render(input, out, __component, component, state) {
+  var data = input;
+
+  const queryParams = {
+  sectionAlias: input.alias,
+  limit: 3,
+  queryFragment,
+  sectionFragment,
+};
+
+  const blockName = "opinion";
+
+  marko_web_query_tag({
+      collapsible: true,
+      name: "website-scheduled-content",
+      params: queryParams,
+      renderBody: function(out, { nodes, section }) {
+        marko_web_block_tag({
+            name: blockName,
+            tag: "div",
+            renderBody: function(out) {
+              marko_web_website_section_name_tag({
+                  obj: section,
+                  link: true,
+                  blockName: blockName,
+                  class: blockName + "__header"
+                }, out, __component, "2");
+
+              theme_card_deck_flow_tag({
+                  cols: 3,
+                  nodes: nodes,
+                  modifiers: [
+                      blockName
+                    ],
+                  slots: [
+                      {
+                          renderBody: function(out, { node }) {
+                            theme_content_node_tag({
+                                card: true,
+                                flush: true,
+                                fullHeight: true,
+                                node: node,
+                                modifiers: [
+                                    blockName
+                                  ],
+                                withAttribution: true
+                              }, out, __component, "5");
+                          }
+                        }
+                    ]
+                }, out, __component, "3");
+            }
+          }, out, __component, "1");
+      }
+    }, out, __component, "0");
+}
+
+marko_template._ = marko_renderer(render, {
+    e_: marko_componentType
+  }, marko_component);
+
+marko_template.meta = {
+    id: "/@mindful-web/marko-web-theme-monorail$1.0.0/components/blocks/opinion.marko",
+    component: "./opinion.marko",
+    tags: [
+      "@mindful-web/marko-web/components/element/website-section/name.marko",
+      "../nodes/content.marko",
+      "../flows/card-deck.marko",
+      "@mindful-web/marko-web/components/element/block.marko",
+      "@mindful-web/marko-core/components/queries/index.marko"
+    ]
+  };

package/components/blocks/primary-image.marko

@@ -0,0 +1,125 @@
+import { buildImgixUrl, getRelativeCropRectangleHeight } from "@mindful-web/image";
+import { getAsObject, getAsArray, get } from "@mindful-web/object-path";
+import defaultValue from "@mindful-web/marko-core/utils/default-value";
+
+$ const blockName = "primary-image";
+$ const image = getAsObject(input, "obj");
+$ const hasImage = Boolean(image.src);
+
+$ const forceDisplay = defaultValue(input.forceDisplay);
+$ let display = forceDisplay || image.primaryImageDisplay || "center";
+$ const { isLogo } = image;
+
+$ const withCaption = defaultValue(input.withCaption, true);
+$ const withCredit = defaultValue(input.withCredit, true);
+$ const withDisplayName = defaultValue(input.withDisplayName, true);
+
+$ const fluidWidth = defaultValue(input.fluidWidth, 880);
+$ const alignedWidth = defaultValue(input.alignedWidth, 300);
+$ const shouldFill = defaultValue(input.shouldFill, false);
+$ const lazyload = defaultValue(input.lazyload, false);
+$ const initialImageWidth = defaultValue(input.initialImageWidth, 350);
+
+$ if (display === "center" && isLogo) {
+  // force logos to the right when set to center
+  display = "right";
+}
+
+$ const modifiers = [...getAsArray(input, "modifiers")];
+$ if (["left", "right"].includes(display)) {
+  modifiers.push("aligned");
+}
+$ modifiers.push(`aligned-${display}`);
+
+$ const maxWidth = input.maxWidth || 880;
+$ const fluid = !["left", "right"].includes(display);
+$ if (fluid) modifiers.push("fluid");
+
+$ const imageOptions = {};
+$ if (fluid) {
+  imageOptions.w = fluidWidth;
+  if (shouldFill && !isLogo) {
+    imageOptions.fit = "fillmax";
+    imageOptions.fill = "blur";
+  }
+} else {
+  imageOptions.w = alignedWidth;
+};
+
+$ const src = buildImgixUrl(image.src, imageOptions);
+$ const srcset = [src, `${buildImgixUrl(src, { dpr: 2 })} 2x`];
+$ const srcMid = buildImgixUrl(src, { w: 700 });
+$ const srcsetMid = [srcMid, `${buildImgixUrl(srcMid, { dpr: 2 })} 2x`];
+$ const srcMin = buildImgixUrl(src, { w: 400 });
+$ const srcsetMin = [srcMin, `${buildImgixUrl(srcMin, { dpr: 2 })} 2x`];
+$ const sources = [];
+$ if (fluid) {
+  sources.push(
+    {
+      srcset: srcset,
+      media: "(min-width: 900px)",
+      width: maxWidth,
+      height: getRelativeCropRectangleHeight({ width: maxWidth, cropRectangle: image.cropRectangle }),
+    },
+    {
+      srcset: srcsetMid,
+      media: "(min-width: 576px)",
+      width: 700,
+      height: getRelativeCropRectangleHeight({ width: 700, cropRectangle: image.cropRectangle }),
+    }
+  );
+} else {
+  const alignedSrc = buildImgixUrl(src, { w: alignedWidth });
+  const alignedSrcset = [alignedSrc, `${buildImgixUrl(alignedSrc, { dpr: 2 })} 2x`];
+  sources.push(
+    {
+      srcset: alignedSrcset,
+      media: "(min-width: 576px)",
+      width: alignedWidth,
+      height: getRelativeCropRectangleHeight({ width: alignedWidth, cropRectangle: image.cropRectangle }),
+    }
+  );
+};
+
+$ const imageAttrs = {};
+$ if (image.id) imageAttrs["data-image-id"] = image.id;
+
+$ const height = getRelativeCropRectangleHeight({ width: initialImageWidth, cropRectangle: image.cropRectangle });
+$ if (height) {
+  imageAttrs.width = initialImageWidth;
+  imageAttrs.height = height;
+};
+
+<if(hasImage && display !== "none")>
+
+  <marko-web-block
+    name=blockName
+    modifiers=modifiers
+  >
+    <if(withDisplayName)>
+      <marko-web-image-display-name block-name=blockName obj=image />
+    </if>
+    <div class=`${blockName}__wrapper`>
+      <marko-web-picture>
+        <for|s| of=sources>
+          <@source srcset=s.srcset media=s.media width=s.width height=s.height />
+        </for>
+        <@image
+          src=srcMin
+          srcset=srcsetMin
+          class=[`${blockName}__image`]
+          alt=image.alt
+          attrs=imageAttrs
+          lazyload=lazyload
+        />
+      </marko-web-picture>
+    </div>
+
+    <if(withCaption)>
+      <marko-web-image-caption block-name=blockName obj=image />
+    </if>
+    <if(withCredit)>
+      <marko-web-image-credit block-name=blockName obj=image />
+    </if>
+  </marko-web-block>
+</if>

package/components/blocks/primary-image.marko.js

@@ -0,0 +1,228 @@
+// Compiled using marko@4.20.2 - DO NOT EDIT
+"use strict";
+
+var marko_template = module.exports = require("marko/dist/html").t(__filename),
+    marko_componentType = "/@mindful-web/marko-web-theme-monorail$1.0.0/components/blocks/primary-image.marko",
+    marko_renderer = require("marko/dist/runtime/components/renderer"),
+    module_image_module = require("@mindful-web/image"),
+    image_module = module_image_module.default || module_image_module,
+    buildImgixUrl = module_image_module.buildImgixUrl,
+    getRelativeCropRectangleHeight = module_image_module.getRelativeCropRectangleHeight,
+    module_objectPath_module = require("@mindful-web/object-path"),
+    objectPath_module = module_objectPath_module.default || module_objectPath_module,
+    getAsObject = module_objectPath_module.getAsObject,
+    getAsArray = module_objectPath_module.getAsArray,
+    get = module_objectPath_module.get,
+    module_defaultValue = require("@mindful-web/marko-core/utils/default-value"),
+    defaultValue = module_defaultValue.default || module_defaultValue,
+    marko_web_image_display_name_template = require("@mindful-web/marko-web/components/element/image/display-name.marko"),
+    marko_loadTag = require("marko/dist/runtime/helpers/load-tag"),
+    marko_web_image_display_name_tag = marko_loadTag(marko_web_image_display_name_template),
+    marko_forOf = require("marko/dist/runtime/helpers/for-of"),
+    marko_loadNestedTag = require("marko/dist/runtime/helpers/load-nested-tag"),
+    marko_web_picture_source_nested_tag = marko_loadNestedTag("sources", 1),
+    marko_mergeNestedTagsHelper = require("marko/dist/runtime/helpers/merge-nested-tags"),
+    marko_web_picture_template = require("@mindful-web/marko-web/components/element/picture.marko"),
+    marko_web_picture_tag = marko_loadTag(marko_web_picture_template),
+    marko_classAttr = require("marko/dist/runtime/html/helpers/class-attr"),
+    marko_web_image_caption_template = require("@mindful-web/marko-web/components/element/image/caption.marko"),
+    marko_web_image_caption_tag = marko_loadTag(marko_web_image_caption_template),
+    marko_web_image_credit_template = require("@mindful-web/marko-web/components/element/image/credit.marko"),
+    marko_web_image_credit_tag = marko_loadTag(marko_web_image_credit_template),
+    marko_web_block_template = require("@mindful-web/marko-web/components/element/block.marko"),
+    marko_web_block_tag = marko_loadTag(marko_web_block_template);
+
+function render(input, out, __component, component, state) {
+  var data = input;
+
+  const blockName = "primary-image";
+
+  const image = getAsObject(input, "obj");
+
+  const hasImage = Boolean(image.src);
+
+  const forceDisplay = defaultValue(input.forceDisplay);
+
+  let display = forceDisplay || image.primaryImageDisplay || "center";
+
+  const { isLogo } = image;
+
+  const withCaption = defaultValue(input.withCaption, true);
+
+  const withCredit = defaultValue(input.withCredit, true);
+
+  const withDisplayName = defaultValue(input.withDisplayName, true);
+
+  const fluidWidth = defaultValue(input.fluidWidth, 880);
+
+  const alignedWidth = defaultValue(input.alignedWidth, 300);
+
+  const shouldFill = defaultValue(input.shouldFill, false);
+
+  const lazyload = defaultValue(input.lazyload, false);
+
+  const initialImageWidth = defaultValue(input.initialImageWidth, 350);
+
+  if (display === "center" && isLogo) {
+  // force logos to the right when set to center
+  display = "right";
+}
+
+  const modifiers = [...getAsArray(input, "modifiers")];
+
+  if (["left", "right"].includes(display)) {
+  modifiers.push("aligned");
+}
+
+  modifiers.push(`aligned-${display}`);
+
+  const maxWidth = input.maxWidth || 880;
+
+  const fluid = !["left", "right"].includes(display);
+
+  if (fluid) modifiers.push("fluid");
+
+  const imageOptions = {};
+
+  if (fluid) {
+  imageOptions.w = fluidWidth;
+  if (shouldFill && !isLogo) {
+    imageOptions.fit = "fillmax";
+    imageOptions.fill = "blur";
+  }
+} else {
+  imageOptions.w = alignedWidth;
+};
+
+  const src = buildImgixUrl(image.src, imageOptions);
+
+  const srcset = [src, `${buildImgixUrl(src, { dpr: 2 })} 2x`];
+
+  const srcMid = buildImgixUrl(src, { w: 700 });
+
+  const srcsetMid = [srcMid, `${buildImgixUrl(srcMid, { dpr: 2 })} 2x`];
+
+  const srcMin = buildImgixUrl(src, { w: 400 });
+
+  const srcsetMin = [srcMin, `${buildImgixUrl(srcMin, { dpr: 2 })} 2x`];
+
+  const sources = [];
+
+  if (fluid) {
+  sources.push(
+    {
+      srcset: srcset,
+      media: "(min-width: 900px)",
+      width: maxWidth,
+      height: getRelativeCropRectangleHeight({ width: maxWidth, cropRectangle: image.cropRectangle }),
+    },
+    {
+      srcset: srcsetMid,
+      media: "(min-width: 576px)",
+      width: 700,
+      height: getRelativeCropRectangleHeight({ width: 700, cropRectangle: image.cropRectangle }),
+    }
+  );
+} else {
+  const alignedSrc = buildImgixUrl(src, { w: alignedWidth });
+  const alignedSrcset = [alignedSrc, `${buildImgixUrl(alignedSrc, { dpr: 2 })} 2x`];
+  sources.push(
+    {
+      srcset: alignedSrcset,
+      media: "(min-width: 576px)",
+      width: alignedWidth,
+      height: getRelativeCropRectangleHeight({ width: alignedWidth, cropRectangle: image.cropRectangle }),
+    }
+  );
+};
+
+  const imageAttrs = {};
+
+  if (image.id) imageAttrs["data-image-id"] = image.id;
+
+  const height = getRelativeCropRectangleHeight({ width: initialImageWidth, cropRectangle: image.cropRectangle });
+
+  if (height) {
+  imageAttrs.width = initialImageWidth;
+  imageAttrs.height = height;
+};
+
+  if (hasImage && (display !== "none")) {
+    marko_web_block_tag({
+        name: blockName,
+        tag: "div",
+        modifiers: modifiers,
+        renderBody: function(out) {
+          if (withDisplayName) {
+            marko_web_image_display_name_tag({
+                blockName: blockName,
+                obj: image
+              }, out, __component, "1");
+          }
+
+          out.w("<div" +
+            marko_classAttr(blockName + "__wrapper") +
+            ">");
+
+          marko_web_picture_tag(marko_mergeNestedTagsHelper({
+              image: {
+                  lazyload: lazyload,
+                  src: srcMin,
+                  srcset: srcsetMin,
+                  class: [
+                      blockName + "__image"
+                    ],
+                  alt: image.alt,
+                  attrs: imageAttrs
+                },
+              renderBody: function(out, $nestedTagmarko_web_picture$0) {
+                var $for$0 = 0;
+
+                marko_forOf(sources, function(s) {
+                  var $keyScope$0 = "[" + (($for$0++) + "]");
+
+                  marko_web_picture_source_nested_tag({
+                      srcset: s.srcset,
+                      media: s.media,
+                      width: s.width,
+                      height: s.height
+                    }, $nestedTagmarko_web_picture$0);
+                });
+              }
+            }), out, __component, "3");
+
+          out.w("</div>");
+
+          if (withCaption) {
+            marko_web_image_caption_tag({
+                blockName: blockName,
+                obj: image
+              }, out, __component, "6");
+          }
+
+          if (withCredit) {
+            marko_web_image_credit_tag({
+                blockName: blockName,
+                obj: image
+              }, out, __component, "7");
+          }
+        }
+      }, out, __component, "0");
+  }
+}
+
+marko_template._ = marko_renderer(render, {
+    d_: true,
+    e_: marko_componentType
+  });
+
+marko_template.meta = {
+    id: "/@mindful-web/marko-web-theme-monorail$1.0.0/components/blocks/primary-image.marko",
+    tags: [
+      "@mindful-web/marko-web/components/element/image/display-name.marko",
+      "@mindful-web/marko-web/components/element/picture.marko",
+      "@mindful-web/marko-web/components/element/image/caption.marko",
+      "@mindful-web/marko-web/components/element/image/credit.marko",
+      "@mindful-web/marko-web/components/element/block.marko"
+    ]
+  };