'use client';
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var core=require("@gem-sdk/core"),Row_liquid=require("../../../grid/components/row/Row.liquid.js"),system=require("@gem-sdk/system"),classes=require("./common/classes.js"),styles=require("./common/styles.js"),helpers=require("./common/helpers.js");const CollectionBanner=({builderAttrs:e,builderProps:s,setting:l,style:t,children:a,rawChildren:r,advanced:n})=>{let{link:i,layout:o,width:c,verticalGutter:m,horizontalAlign:y,verticalAlign:d}=l??{};helpers.updateBackroundImageSrc({setting:l,collectionSrc:`{% if collection.image %} {{ collection.image.src | image_url}}  {% else %} ${helpers.defaultImageUrl} {% endif  %}`});let g=system.createClass({...classes.getClassContainerBanner({builderProps:s,setting:l,advanced:n})}),u=system.createClass({...classes.getClassContainerBackgoundImage({setting:l})}),C=system.createClass({...classes.getClassOverlayBanner({setting:l})}),$=system.createClass({...classes.getClassLinkBanner()}),p=system.createStyle({...styles.getDimension({setting:l,style:t})}),v=system.createStyle({...styles.getStyleOverlay({setting:l})}),k=system.createStyle({...styles.getStyleContainerBackgoundImage({setting:l,hasCollectionImage:!1})});return core.template`
    <div ${{...e}} class="${g}" style="${p}">
      <div
        aria-label="Background Image"
        role="banner"
        class="${u}"
        style="${k}"
      >
      </div>
      <div aria-label="Overlay" role="banner" class="${C}" style="${v}"> </div>
      ${core.RenderIf(!!i?.link,`<a
          href="${i?.link}"
          target="${i?.target}"
          class="${$}"
        > </a>`)}
      ${Row_liquid.default({setting:{layout:o,horizontalAlign:y,verticalAlign:d},styles:{verticalGutter:m,width:c,fullWidth:{desktop:!1,tablet:!1,mobile:!1}},style:t,children:a,rawChildren:r})}
    </div>
  `};exports.default=CollectionBanner;
