import {html,ScanditHTMLElement,defineCustomElements,css}from'@scandit/web-datacapture-core/build/js/private/utils/index.js';var c=html`
<div id="container">
  <div class="left">
      <slot name="image-left"></slot>
  </div>
  <div class="middle">
    <div class="title overflow-text-mask"></div>
    <div class="subtitle overflow-text-mask"></div>
  </div>
  <div class="right">
    <slot name="right"></slot>
  </div>
</div>
`,t=class t extends ScanditHTMLElement{constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML=c,e.append(t.createStyleElement().cloneNode(true));}set title(e){var a;let i=(a=this.shadowRoot)==null?void 0:a.querySelector(".title");i!=null&&(i.textContent=e);}set subtitle(e){var a;let i=(a=this.shadowRoot)==null?void 0:a.querySelector(".subtitle");i!=null&&(i.textContent=e);}static create(){return document.createElement(t.tag)}static register(){defineCustomElements({[t.tag]:t});}static createStyleElement(){return css`#container{align-items:center;display:flex;flex-direction:row;gap:.625rem;justify-content:center;padding:1rem}.overflow-text-mask{-webkit-mask-image:linear-gradient(90deg,#000 95%,#0000);mask-image:linear-gradient(90deg,#000 95%,#0000);overflow-x:auto;padding-right:.3rem}#container>div{display:flex;flex:1 1 17.5%;justify-content:center}#container>div.middle{flex:1 1 65%;flex-direction:column;overflow:hidden}#container>div ::slotted([slot=image-left]){height:50px;object-fit:cover;width:50px}#container .title{color:#121619;font-size:.938rem;font-weight:600}#container .subtitle{font-size:.75rem;font-weight:400;margin-top:.25rem}`}};t.tag="scandit-image-and-text-card-layout";var n=t;n.register();export{n as a};