@parameter1/base-cms-marko-web 2.93.1 → 2.94.0

package/components/browser-component.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/browser-component.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/browser-component.marko",
     marko_component = require("./browser-component.marko"),
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_defaultValue = require("@parameter1/base-cms-marko-core/utils/default-value"),
@@ -73,7 +73,7 @@ marko_template._ = marko_renderer(render, {
   }, marko_component);
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/browser-component.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/browser-component.marko",
     component: "./browser-component.marko",
     tags: [
       "@parameter1/base-cms-marko-core/components/resolve.marko"

package/components/document/components/body-wrapper.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/document/components/body-wrapper.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/document/components/body-wrapper.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     marko_dynamicTag = require("marko/src/runtime/helpers/dynamic-tag"),
     marko_attrs = require("marko/src/runtime/html/helpers/attrs");
@@ -29,5 +29,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/document/components/body-wrapper.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/document/components/body-wrapper.marko"
   };

package/components/document/components/error.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/document/components/error.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/document/components/error.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_isDev = require("../../../utils/is-dev"),
     isDev = module_isDev.default || module_isDev,
@@ -77,7 +77,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/document/components/error.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/document/components/error.marko",
     tags: [
       "../../page/title.marko",
       "../../page/wrapper.marko"

package/components/document/components/live-reload.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/document/components/live-reload.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/document/components/live-reload.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_isDev = require("../../../utils/is-dev"),
     isDev = module_isDev.default || module_isDev,
@@ -26,5 +26,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/document/components/live-reload.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/document/components/live-reload.marko"
   };

package/components/document/container.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/document/container.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/document/container.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -47,7 +47,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/document/container.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/document/container.marko",
     tags: [
       "../page/container.marko"
     ]

package/components/document/index.marko

@@ -28,6 +28,11 @@ $ const wrapper = getAsObject(input, "bodyWrapper");
     </script>
     <!-- load lazysizes -->
     <script src="/dist/js/lazysizes/v5.3.2.js" async></script>
+    <!-- load picturefill -->
+    <script>
+      document.createElement( "picture" );
+    </script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/picturefill/3.0.3/picturefill.min.js" async></script>
 
     <${input.head} />
   </head>

package/components/document/index.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/document/index.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/document/index.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -106,7 +106,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/document/index.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/document/index.marko",
     tags: [
       "./container.marko",
       "./components/live-reload.marko",

package/components/element/block.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/element/block.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/element/block.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -40,5 +40,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/element/block.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/element/block.marko"
   };

package/components/element/components/image.marko

@@ -3,7 +3,7 @@ import { getAsArray } from "@parameter1/base-cms-object-path";
 $ const { config } = out.global;
 $ const { src, alt } = input;
 $ const lazyload = config.lazyloadImages() && input.lazyload !== false
-$ const srcset = getAsArray(input.srcset).join(",") || null;
+$ const srcset = getAsArray(input.srcset).join(", ") || null;
 
 $ const classNames = [input.class];
 $ if (lazyload) classNames.push("lazyload");

package/components/element/components/text.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/element/components/text.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/element/components/text.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     marko_dynamicTag = require("marko/src/runtime/helpers/dynamic-tag"),
     marko_str = require("marko/src/runtime/helpers/to-string"),
@@ -33,5 +33,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/element/components/text.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/element/components/text.marko"
   };

package/components/element/content/name.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/element/content/name.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/element/content/name.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_extractRender = require("../extract-render"),
     extractRender = module_extractRender.default || module_extractRender,
@@ -34,7 +34,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/element/content/name.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/element/content/name.marko",
     tags: [
       "../obj-text.marko"
     ]

package/components/element/index.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/element/index.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/element/index.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -43,5 +43,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/element/index.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/element/index.marko"
   };

package/components/element/link.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/element/link.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/element/link.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     marko_dynamicTag = require("marko/src/runtime/helpers/dynamic-tag"),
     marko_mergeAttrs = require("marko/src/runtime/html/helpers/merge-attrs");
@@ -50,5 +50,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/element/link.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/element/link.marko"
   };

package/components/element/marko.json

@@ -162,5 +162,40 @@
     "@class": "string",
     "@attrs": "object",
     "@modifiers": "array"
+  },
+  "<marko-web-picture>": {
+    "template": "./picture.marko",
+    "<image>": {
+      "@src": "string",
+      "@srcset": "array",
+      "@alt": "string",
+      "@lazyload": {
+        "type": "boolean",
+        "default-value": true
+      },
+      "@class": "string",
+      "@attrs": "object",
+      "@link": "object"
+    },
+    "<link>": {
+      "<before>": {},
+      "<after>": {},
+      "@href": "string",
+      "@target": "string",
+      "@title": "string",
+      "@rel": "string",
+      "@class": "string",
+      "@attrs": "object"
+    },
+    "@sources <source>[]": {
+      "@media": {
+        "type": "string",
+        "required": true
+      },
+      "@srcset": {
+        "type": "array",
+        "required": true
+      }
+    }
   }
 }

package/components/element/obj-text.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/element/obj-text.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/element/obj-text.marko",
     marko_component = require("./obj-text.marko"),
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_objectLink = require("./object-link"),
@@ -44,7 +44,7 @@ marko_template._ = marko_renderer(render, {
   }, marko_component);
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/element/obj-text.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/element/obj-text.marko",
     component: "./obj-text.marko",
     tags: [
       "./text.marko",

package/components/element/obj.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/element/obj.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/element/obj.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -57,5 +57,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/element/obj.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/element/obj.marko"
   };

package/components/element/picture.marko

@@ -0,0 +1,36 @@
+import { getAsArray } from "@parameter1/base-cms-object-path";
+
+$ const { link, sources = [], image } = input;
+
+$ const hasImage = Boolean(image.src);
+
+<if(hasImage)>
+  <if(link)>
+    <marko-core-link
+      before=link.before
+      after=link.after
+      href=link.href
+      target=link.target
+      title=link.title
+      rel=link.rel
+      class=link.class
+      attrs=link.attrs
+    >
+      <marko-web-picture image=image sources=sources />
+    </marko-core-link>
+  </if>
+  <else>
+    <picture>
+      <for|s| of=sources>
+        $ const srcset = image.lazyload ? null : s.srcset.join(", ");
+        $ const dataSrcset = image.lazyload ? s.srcset.join(", ") : null;
+        <source
+          srcset=srcset
+          data-srcset=dataSrcset
+          media=s.media
+        >
+      </for>
+      <image ...image />
+    </picture>
+  </else>
+</if>

package/components/element/text.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/element/text.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/element/text.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     text_template = require("./components/text.marko"),
     marko_loadTag = require("marko/src/runtime/helpers/load-tag"),
@@ -68,7 +68,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/element/text.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/element/text.marko",
     tags: [
       "./components/text.marko",
       "./link.marko"

package/components/load-more/index.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/load-more/index.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/load-more/index.marko",
     marko_component = require("./index.marko"),
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
@@ -108,7 +108,7 @@ marko_template._ = marko_renderer(render, {
   }, marko_component);
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/load-more/index.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/load-more/index.marko",
     component: "./",
     tags: [
       "../browser-component.marko",

package/components/load-more/trigger.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/load-more/trigger.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/load-more/trigger.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     marko_web_browser_component_template = require("../browser-component.marko"),
     marko_loadTag = require("marko/src/runtime/helpers/load-tag"),
@@ -33,7 +33,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/load-more/trigger.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/load-more/trigger.marko",
     tags: [
       "../browser-component.marko"
     ]

package/components/node-list/body.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/body.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/body.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -43,7 +43,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/body.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/body.marko",
     tags: [
       "./element.marko"
     ]

package/components/node-list/element.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/element.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/element.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     marko_assign = require("marko/src/runtime/helpers/assign"),
     marko_web_element_template = require("../element"),
@@ -28,7 +28,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/element.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/element.marko",
     tags: [
       "../element"
     ]

package/components/node-list/footer.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/footer.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/footer.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -43,7 +43,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/footer.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/footer.marko",
     tags: [
       "./element.marko"
     ]

package/components/node-list/header.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/header.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/header.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -43,7 +43,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/header.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/header.marko",
     tags: [
       "./element.marko"
     ]

package/components/node-list/index.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/index.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/index.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -83,7 +83,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/index.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/index.marko",
     tags: [
       "./header.marko",
       "./body.marko",

package/components/node-list/node.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/node.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/node.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -42,7 +42,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/node.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/node.marko",
     tags: [
       "./element.marko"
     ]

package/components/node-list/nodes.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/nodes.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/nodes.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -118,7 +118,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/node-list/nodes.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/node-list/nodes.marko",
     tags: [
       "./node.marko",
       "./element.marko"

package/components/page/container.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/page/container.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/page/container.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -42,5 +42,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/page/container.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/page/container.marko"
   };

package/components/page/description.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/page/description.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/page/description.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     marko_attr = require("marko/src/runtime/html/helpers/attr");
 
@@ -22,5 +22,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/page/description.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/page/description.marko"
   };

package/components/page/layouts/default.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/page/layouts/default.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/page/layouts/default.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     marko_web_default_page_metadata_template = require("../metadata/default.marko"),
     marko_loadTag = require("marko/src/runtime/helpers/load-tag"),
@@ -54,7 +54,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/page/layouts/default.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/page/layouts/default.marko",
     tags: [
       "../metadata/default.marko"
     ]

package/components/page/metadata/components/common.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/page/metadata/components/common.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/page/metadata/components/common.marko",
     marko_component = require("./common.marko"),
     marko_renderer = require("marko/src/runtime/components/renderer"),
     marko_web_page_title_template = require("../../title.marko"),
@@ -98,7 +98,7 @@ marko_template._ = marko_renderer(render, {
   }, marko_component);
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/page/metadata/components/common.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/page/metadata/components/common.marko",
     component: "./common.marko",
     tags: [
       "../../title.marko",

package/components/page/metadata/default.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/page/metadata/default.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/page/metadata/default.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     common_template = require("./components/common.marko"),
     marko_loadTag = require("marko/src/runtime/helpers/load-tag"),
@@ -22,7 +22,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/page/metadata/default.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/page/metadata/default.marko",
     tags: [
       "./components/common.marko"
     ]

package/components/page/rel-canonical.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/page/rel-canonical.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/page/rel-canonical.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsUtils_module = require("@parameter1/base-cms-utils"),
     baseCmsUtils_module = module_baseCmsUtils_module.default || module_baseCmsUtils_module,
@@ -38,5 +38,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/page/rel-canonical.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/page/rel-canonical.marko"
   };

package/components/page/title.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/page/title.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/page/title.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsUtils_module = require("@parameter1/base-cms-utils"),
     baseCmsUtils_module = module_baseCmsUtils_module.default || module_baseCmsUtils_module,
@@ -42,5 +42,5 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/page/title.marko"
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/page/title.marko"
   };

package/components/page/wrapper.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/page/wrapper.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/page/wrapper.marko",
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsObjectPath_module = require("@parameter1/base-cms-object-path"),
     baseCmsObjectPath_module = module_baseCmsObjectPath_module.default || module_baseCmsObjectPath_module,
@@ -56,7 +56,7 @@ marko_template._ = marko_renderer(render, {
   });
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/page/wrapper.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/page/wrapper.marko",
     tags: [
       "../element"
     ]

package/components/resolve/page.marko.js

@@ -2,7 +2,7 @@
 "use strict";
 
 var marko_template = module.exports = require("marko/src/html").t(__filename),
-    marko_componentType = "/@parameter1/base-cms-marko-web$2.92.0/components/resolve/page.marko",
+    marko_componentType = "/@parameter1/base-cms-marko-web$2.93.1/components/resolve/page.marko",
     marko_component = require("./page.marko"),
     marko_renderer = require("marko/src/runtime/components/renderer"),
     module_baseCmsUtils_module = require("@parameter1/base-cms-utils"),
@@ -41,7 +41,7 @@ marko_template._ = marko_renderer(render, {
   }, marko_component);
 
 marko_template.meta = {
-    id: "/@parameter1/base-cms-marko-web$2.92.0/components/resolve/page.marko",
+    id: "/@parameter1/base-cms-marko-web$2.93.1/components/resolve/page.marko",
     component: "./page.marko",
     tags: [
       "@parameter1/base-cms-marko-core/components/resolve.marko"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parameter1/base-cms-marko-web",
-  "version": "2.93.1",
+  "version": "2.94.0",
   "description": "Core Marko+Express components for BaseCMS websites",
   "author": "Jacob Bare <jacob@parameter1.com>",
   "main": "index.js",
@@ -16,10 +16,10 @@
   "dependencies": {
     "@godaddy/terminus": "^4.9.0",
     "@parameter1/base-cms-apollo-ssr": "^2.45.0",
-    "@parameter1/base-cms-embedded-media": "^2.93.1",
+    "@parameter1/base-cms-embedded-media": "^2.94.0",
     "@parameter1/base-cms-express-apollo": "^2.45.0",
     "@parameter1/base-cms-graphql-fragment-types": "^2.45.0",
-    "@parameter1/base-cms-image": "^2.92.0",
+    "@parameter1/base-cms-image": "^2.94.0",
     "@parameter1/base-cms-inflector": "^2.0.0",
     "@parameter1/base-cms-marko-node-require": "^2.57.0",
     "@parameter1/base-cms-object-path": "^2.75.1",
@@ -46,5 +46,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "0599cbf2458e6a4835c45af2e9cc1c6c07d1d33b"
+  "gitHead": "cc0b6b748532a40ada246d3f1233c3142d78365c"
 }

package/utils/embedded-media/image.js

@@ -1,3 +1,5 @@
+const { buildImgixUrl } = require('@parameter1/base-cms-image');
+
 const stringifyAttrs = attrs => Object.keys(attrs).reduce((arr, key) => {
   const value = attrs[key];
   if (value) arr.push(`${key}="${value}"`);
@@ -10,23 +12,50 @@ module.exports = (tag, { config } = {}, { lazyloadImages } = {}) => {
   const alt = tag.get('alt');
   const caption = tag.get('caption');
   const credit = tag.get('credit');
+  const align = tag.get('align');
+
+  const width = tag.get('width');
+  const height = tag.get('height');
 
   const attrs = {
     'data-embed-type': tag.type,
     'data-embed-id': tag.id,
-    'data-embed-align': tag.get('align'),
+    'data-embed-align': align,
   };
 
+  const minWidth = 400;
+  const maxWidth = (align) ? minWidth : 700;
+
+  const maxSrcset = `${buildImgixUrl(src, { w: maxWidth })}, ${buildImgixUrl(src, { w: maxWidth, dpr: 2 })} 2x`;
+
+  const sources = [
+    {
+      srcset: lazyload ? null : maxSrcset,
+      'data-srcset': lazyload ? maxSrcset : null,
+      media: '(min-width: 576px)',
+    },
+  ].map(source => `<source ${stringifyAttrs(source)}>`).join('');
+
+  const minSrc = buildImgixUrl(src, { w: minWidth });
+  const minSrcset = `${buildImgixUrl(src, { w: minWidth, dpr: 2 })} 2x`;
+
+  const transparentImg = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==';
   const imgAttrs = {
     class: lazyload ? 'lazyload' : null,
-    src: lazyload ? 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' : src,
-    'data-src': lazyload ? src : null,
+    src: lazyload ? transparentImg : minSrc,
+    srcset: lazyload ? null : minSrcset,
+    'data-src': lazyload ? minSrc : null,
+    'data-srcset': lazyload ? minSrcset : null,
     'data-image-id': tag.id,
     alt,
+    width: (width && height) ? minWidth : null,
+    height: (height && height) ? Math.round(height / width * minWidth) : null,
   };
+
   const captionElement = caption ? `<span class="caption">${caption}</span>` : '';
   const creditElement = credit ? `<span class="credit">${credit}</span>` : '';
 
-  const img = `<img ${stringifyAttrs(imgAttrs)}>${captionElement}${creditElement}`;
-  return `<span ${stringifyAttrs(attrs)}>${img}</span>`;
+  const img = `<img ${stringifyAttrs(imgAttrs)}>`;
+  const picture = `<picture>${sources}${img}${captionElement}${creditElement}</picture>`;
+  return `<span ${stringifyAttrs(attrs)}>${picture}</span>`;
 };