@florid-kit/components 0.8.2 → 0.8.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/index.js +29 -22
  2. package/index.mjs +60 -52
  3. package/package.json +1 -1
package/index.js CHANGED
@@ -122,7 +122,10 @@
122
122
  <rect x="1" width="2" height="8" fill="#3F2B2E"/>
123
123
  <rect x="5" width="2" height="8" fill="#3F2B2E"/>
124
124
  </svg>
125
- `,K={wishlist:ye,playerv:me,chevronRight:we,chevronLeft:xe,icoPlus:Le,icoMinus:Ie,"star-0":$e,"star-25":_e,"star-50":Ce,"star-75":ke,"star-100":Ae,cross:Se,search:Ee,arrowLeft:Oe,arrowTop:Pe,cart:Be,notifyme:ze,triangledown:De,triangleup:He,checkstroke:Me,pause:Te};/**
125
+ `,je=`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
126
+ <path d="M10.5037 5.99925C10.7795 5.99925 11.0037 6.22311 11.0037 6.49925V14.2922L13.1462 12.1448C13.3411 11.9498 13.6573 11.95 13.8523 12.1448H13.8533C14.0482 12.34 14.0481 12.6565 13.8533 12.8518L10.8572 15.8518C10.6618 16.0471 10.3455 16.0471 10.1501 15.8518L7.15406 12.8518C6.96522 12.6557 6.96774 12.3444 7.15992 12.1516C7.35242 11.9588 7.66416 11.9556 7.86011 12.1448L10.0046 14.2922V6.49925C10.0046 6.22319 10.228 5.99938 10.5037 5.99925ZM5.15699 0.145737C5.35218 -0.0485278 5.66791 -0.0486304 5.86304 0.145737L8.85913 3.14574C9.04829 3.34183 9.04562 3.65402 8.85327 3.84691C8.66066 4.03978 8.34902 4.04225 8.15308 3.85277L6.00952 1.70628V9.49925C6.0095 9.77533 5.78621 9.99918 5.5105 9.99925C5.23473 9.99925 5.0115 9.77538 5.01148 9.49925V1.70628L2.86695 3.85179C2.74288 3.98695 2.55447 4.04321 2.37671 3.99828C2.1991 3.95328 2.06051 3.81475 2.01538 3.63695C1.97026 3.45902 2.02608 3.27015 2.16089 3.14574L5.15699 0.145737Z" fill="#001022"/>
127
+ </svg>
128
+ `,K={wishlist:ye,playerv:me,chevronRight:we,chevronLeft:xe,icoPlus:Le,icoMinus:Ie,"star-0":$e,"star-25":_e,"star-50":Ce,"star-75":ke,"star-100":Ae,cross:Se,search:Ee,arrowLeft:Oe,arrowTop:Pe,cart:Be,notifyme:ze,triangledown:De,triangleup:He,checkstroke:Me,pause:Te,mapDualArrow:je};/**
126
129
  * @license
127
130
  * Copyright 2017 Google LLC
128
131
  * SPDX-License-Identifier: BSD-3-Clause
@@ -134,7 +137,7 @@
134
137
  * @license
135
138
  * Copyright 2017 Google LLC
136
139
  * SPDX-License-Identifier: BSD-3-Clause
137
- */class yt extends ft{}yt.directiveName="unsafeSVG",yt.resultType=2;const H=Zt(yt);var je=Object.defineProperty,Ue=Object.getOwnPropertyDescriptor,w=(o,t,e,n)=>{for(var i=n>1?void 0:n?Ue(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&je(t,e,i),i};const Re=be(b);let u=class extends Re{constructor(){super(...arguments),this.type="submit",this.value="",this.variant="primary",this.text="",this.textsecond="",this.fullwidth=!1,this.disabled=!1,this.startIconModel="search",this.endIconModel="chevronRight",this.startIcon=!1,this.endIcon=!1,this.panelTarget="",this.href="",this.target=""}get name(){return this.getAttribute("name")??""}set name(o){this.setAttribute("name",o)}get form(){return this[Ct].form}handleClick(){if(this.panelTarget){const o=document.getElementById(this.panelTarget);o!=null&&o.openPanel&&typeof o.openPanel=="function"?o.openPanel():console.warn(`[o-button] No side panel with id="${this.panelTarget}" found or it does not have an openPanel method.`)}}render(){return this.href?this.renderLink():this.renderButton()}renderIcon(o){const t=o==="start"?this.startIconModel:this.endIconModel;if(!t)return d;const e=K[t].replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return l`<span class="${o==="start"?"icon-start":"icon-end"}">${H(e)}</span>`}renderButton(){const o=this.text||this.textsecond;return l`
140
+ */class yt extends ft{}yt.directiveName="unsafeSVG",yt.resultType=2;const H=Zt(yt);var Ue=Object.defineProperty,Re=Object.getOwnPropertyDescriptor,w=(o,t,e,n)=>{for(var i=n>1?void 0:n?Re(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Ue(t,e,i),i};const Fe=be(b);let u=class extends Fe{constructor(){super(...arguments),this.type="submit",this.value="",this.variant="primary",this.text="",this.textsecond="",this.fullwidth=!1,this.disabled=!1,this.startIconModel="search",this.endIconModel="chevronRight",this.startIcon=!1,this.endIcon=!1,this.panelTarget="",this.href="",this.target=""}get name(){return this.getAttribute("name")??""}set name(o){this.setAttribute("name",o)}get form(){return this[Ct].form}handleClick(){if(this.panelTarget){const o=document.getElementById(this.panelTarget);o!=null&&o.openPanel&&typeof o.openPanel=="function"?o.openPanel():console.warn(`[o-button] No side panel with id="${this.panelTarget}" found or it does not have an openPanel method.`)}}render(){return this.href?this.renderLink():this.renderButton()}renderIcon(o){const t=o==="start"?this.startIconModel:this.endIconModel;if(!t)return d;const e=K[t].replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return l`<span class="${o==="start"?"icon-start":"icon-end"}">${H(e)}</span>`}renderButton(){const o=this.text||this.textsecond;return l`
138
141
  <button type=${this.type} class="button" ?disabled=${this.disabled} @click=${this.handleClick}>
139
142
  ${this.startIcon?this.renderIcon("start"):d}
140
143
  ${o?l`
@@ -303,7 +306,11 @@
303
306
  width: var(--button-endicon-svg-width, 8px);
304
307
  }
305
308
 
306
- //Icon movment on hover
309
+ :host([underlined]) [href] span:not([class*="icon-"]) {
310
+ border-bottom: var(--border-M, 1px) solid var(--color-border-primary);
311
+ }
312
+
313
+ //Icon movement on hover
307
314
  :host([variant="tertiary"][endIcon]) .icon-end {
308
315
  display: inline-flex;
309
316
  align-items: center;
@@ -314,7 +321,7 @@
314
321
  transform: translateX(4px);
315
322
  }
316
323
  //End icon movment on hover
317
- `;w([a()],u.prototype,"type",2);w([a({reflect:!0})],u.prototype,"value",2);w([a({type:String,reflect:!0})],u.prototype,"variant",2);w([a({type:String})],u.prototype,"text",2);w([a({type:String})],u.prototype,"textsecond",2);w([a({type:Boolean,reflect:!0})],u.prototype,"fullwidth",2);w([a({type:Boolean,reflect:!0})],u.prototype,"disabled",2);w([a({type:String,reflect:!0})],u.prototype,"startIconModel",2);w([a({type:String,reflect:!0})],u.prototype,"endIconModel",2);w([a({type:Boolean,reflect:!0,attribute:"starticon"})],u.prototype,"startIcon",2);w([a({type:Boolean,reflect:!0,attribute:"endicon"})],u.prototype,"endIcon",2);w([a({type:String,attribute:"paneltarget",reflect:!0})],u.prototype,"panelTarget",2);w([a({type:String})],u.prototype,"href",2);w([a({type:String})],u.prototype,"target",2);u=w([x("o-button")],u);var Fe=Object.defineProperty,Ne=Object.getOwnPropertyDescriptor,ht=(o,t,e,n)=>{for(var i=n>1?void 0:n?Ne(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Fe(t,e,i),i};let q=class extends b{constructor(){super(...arguments),this.status="empty",this.ariaDescribedBy="a-product-name",this.label="Add to wishlist",this.toggleStatus=()=>{this.status=this.status==="empty"?"filled":"empty",this.setAttribute("aria-pressed",String(this.status==="filled")),this.dispatchEvent(new CustomEvent("wishlist-toggle",{detail:{status:this.status},bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this.setAttribute("tabindex","0"),this.setAttribute("role","button"),this.setAttribute("aria-pressed",String(this.status==="filled"))}firstUpdated(){this.addEventListener("click",this.toggleStatus),this.addEventListener("keydown",this.handleKeydown)}handleKeydown(o){(o.key==="Enter"||o.key===" ")&&(o.preventDefault(),this.toggleStatus())}render(){const o=K.wishlist.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return l`
324
+ `;w([a()],u.prototype,"type",2);w([a({reflect:!0})],u.prototype,"value",2);w([a({type:String,reflect:!0})],u.prototype,"variant",2);w([a({type:String})],u.prototype,"text",2);w([a({type:String})],u.prototype,"textsecond",2);w([a({type:Boolean,reflect:!0})],u.prototype,"fullwidth",2);w([a({type:Boolean,reflect:!0})],u.prototype,"disabled",2);w([a({type:String,reflect:!0})],u.prototype,"startIconModel",2);w([a({type:String,reflect:!0})],u.prototype,"endIconModel",2);w([a({type:Boolean,reflect:!0,attribute:"starticon"})],u.prototype,"startIcon",2);w([a({type:Boolean,reflect:!0,attribute:"endicon"})],u.prototype,"endIcon",2);w([a({type:String,attribute:"paneltarget",reflect:!0})],u.prototype,"panelTarget",2);w([a({type:String})],u.prototype,"href",2);w([a({type:String})],u.prototype,"target",2);u=w([x("o-button")],u);var Ne=Object.defineProperty,Ve=Object.getOwnPropertyDescriptor,ht=(o,t,e,n)=>{for(var i=n>1?void 0:n?Ve(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Ne(t,e,i),i};let q=class extends b{constructor(){super(...arguments),this.status="empty",this.ariaDescribedBy="a-product-name",this.label="Add to wishlist",this.toggleStatus=()=>{this.status=this.status==="empty"?"filled":"empty",this.setAttribute("aria-pressed",String(this.status==="filled")),this.dispatchEvent(new CustomEvent("wishlist-toggle",{detail:{status:this.status},bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this.setAttribute("tabindex","0"),this.setAttribute("role","button"),this.setAttribute("aria-pressed",String(this.status==="filled"))}firstUpdated(){this.addEventListener("click",this.toggleStatus),this.addEventListener("keydown",this.handleKeydown)}handleKeydown(o){(o.key==="Enter"||o.key===" ")&&(o.preventDefault(),this.toggleStatus())}render(){const o=K.wishlist.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return l`
318
325
  <button type="button" aria-describedby="${this.ariaDescribedBy}" class="wishlist-button">
319
326
  <span class="sr-only">${this.label}</span>
320
327
  ${H(o)}
@@ -387,7 +394,7 @@
387
394
  * @license
388
395
  * Copyright 2018 Google LLC
389
396
  * SPDX-License-Identifier: BSD-3-Clause
390
- */const $=o=>o??d;var Ve=Object.defineProperty,Ze=Object.getOwnPropertyDescriptor,S=(o,t,e,n)=>{for(var i=n>1?void 0:n?Ze(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Ve(t,e,i),i};let _=class extends b{constructor(){super(...arguments),this.bgstyle="background-light",this.size="medium",this.status="empty",this.type="button",this.strokewidth="1",this.icon="wishlist",this.disabled=!1,this.showSrLabel=!1,this.srLabel=""}updated(o){super.updated(o),this.style.setProperty("--icon-stroke-width",this.strokewidth)}render(){const o=K[this.icon]??"",t=`icon-${this.icon}`,e=o.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"'),n=this.showSrLabel?l`<span class="sr-only">${this.srLabel}</span>`:null,i=this.showSrLabel?null:"icon";return l`
397
+ */const $=o=>o??d;var Ze=Object.defineProperty,qe=Object.getOwnPropertyDescriptor,S=(o,t,e,n)=>{for(var i=n>1?void 0:n?qe(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Ze(t,e,i),i};let _=class extends b{constructor(){super(...arguments),this.bgstyle="background-light",this.size="medium",this.status="empty",this.type="button",this.strokewidth="1",this.icon="wishlist",this.disabled=!1,this.showSrLabel=!1,this.srLabel=""}updated(o){super.updated(o),this.style.setProperty("--icon-stroke-width",this.strokewidth)}render(){const o=K[this.icon]??"",t=`icon-${this.icon}`,e=o.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"'),n=this.showSrLabel?l`<span class="sr-only">${this.srLabel}</span>`:null,i=this.showSrLabel?null:"icon";return l`
391
398
  ${this.type==="span"?l`
392
399
  <span class="icon icon-button ${this.size} ${this.bgstyle} ${this.status} ${t}" ?disabled="${this.disabled}">
393
400
  ${H(e)}
@@ -605,7 +612,7 @@
605
612
  .sr-only {
606
613
  display: none;
607
614
  }
608
- `;S([a({type:String,reflect:!0})],_.prototype,"bgstyle",2);S([a({type:String,reflect:!0})],_.prototype,"size",2);S([a({type:String,reflect:!0})],_.prototype,"status",2);S([a({type:String,reflect:!0})],_.prototype,"type",2);S([a({type:String})],_.prototype,"strokewidth",2);S([a({type:String})],_.prototype,"icon",2);S([a({type:Boolean,reflect:!0})],_.prototype,"disabled",2);S([a({type:Boolean})],_.prototype,"showSrLabel",2);S([a({type:String})],_.prototype,"srLabel",2);_=S([x("o-icon-button")],_);var qe=Object.defineProperty,We=Object.getOwnPropertyDescriptor,N=(o,t,e,n)=>{for(var i=n>1?void 0:n?We(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&qe(t,e,i),i};let I=class extends b{constructor(){super(...arguments),this.href="",this.target="",this.template="standard",this.inverse=!1,this.endIcon=!1,this.reverseEndIcon=!1}_handleClick(o){(!this.href||this.href==="#")&&o.preventDefault()}render(){const o=this.href||"#";return l`
615
+ `;S([a({type:String,reflect:!0})],_.prototype,"bgstyle",2);S([a({type:String,reflect:!0})],_.prototype,"size",2);S([a({type:String,reflect:!0})],_.prototype,"status",2);S([a({type:String,reflect:!0})],_.prototype,"type",2);S([a({type:String})],_.prototype,"strokewidth",2);S([a({type:String})],_.prototype,"icon",2);S([a({type:Boolean,reflect:!0})],_.prototype,"disabled",2);S([a({type:Boolean})],_.prototype,"showSrLabel",2);S([a({type:String})],_.prototype,"srLabel",2);_=S([x("o-icon-button")],_);var We=Object.defineProperty,Ke=Object.getOwnPropertyDescriptor,N=(o,t,e,n)=>{for(var i=n>1?void 0:n?Ke(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&We(t,e,i),i};let I=class extends b{constructor(){super(...arguments),this.href="",this.target="",this.template="standard",this.inverse=!1,this.endIcon=!1,this.reverseEndIcon=!1}_handleClick(o){(!this.href||this.href==="#")&&o.preventDefault()}render(){const o=this.href||"#";return l`
609
616
  <a
610
617
  href="${o}"
611
618
  target="${$(this.target||void 0)}"
@@ -718,7 +725,7 @@
718
725
  height: 1px;
719
726
  }
720
727
  /* End of underline effect */
721
- `;N([a({type:String})],I.prototype,"href",2);N([a({type:String})],I.prototype,"target",2);N([a({type:String,reflect:!0})],I.prototype,"template",2);N([a({type:Boolean,reflect:!0})],I.prototype,"inverse",2);N([a({type:Boolean,reflect:!0})],I.prototype,"endIcon",2);N([a({type:Boolean,reflect:!0})],I.prototype,"reverseEndIcon",2);I=N([x("o-link")],I);var Ke=Object.defineProperty,Ge=Object.getOwnPropertyDescriptor,dt=(o,t,e,n)=>{for(var i=n>1?void 0:n?Ge(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Ke(t,e,i),i};let W=class extends b{constructor(){super(...arguments),this.rating=0}getStarKeys(){const o=[];for(let t=0;t<5;t++){const e=this.rating-t;let n;e>=1?n=100:e<=0?n=0:n=Math.round(e*100/25)*25,o.push(`star-${n}`)}return o}render(){const o=this.getStarKeys();return l`
728
+ `;N([a({type:String})],I.prototype,"href",2);N([a({type:String})],I.prototype,"target",2);N([a({type:String,reflect:!0})],I.prototype,"template",2);N([a({type:Boolean,reflect:!0})],I.prototype,"inverse",2);N([a({type:Boolean,reflect:!0})],I.prototype,"endIcon",2);N([a({type:Boolean,reflect:!0})],I.prototype,"reverseEndIcon",2);I=N([x("o-link")],I);var Ge=Object.defineProperty,Xe=Object.getOwnPropertyDescriptor,dt=(o,t,e,n)=>{for(var i=n>1?void 0:n?Xe(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Ge(t,e,i),i};let W=class extends b{constructor(){super(...arguments),this.rating=0}getStarKeys(){const o=[];for(let t=0;t<5;t++){const e=this.rating-t;let n;e>=1?n=100:e<=0?n=0:n=Math.round(e*100/25)*25,o.push(`star-${n}`)}return o}render(){const o=this.getStarKeys();return l`
722
729
  <div class="rating">
723
730
  <div class="stars">
724
731
  ${o.map(t=>l`<span class="star">${H(K[t]??"")}</span>`)}
@@ -758,7 +765,7 @@
758
765
  text-decoration: underline;
759
766
  cursor: pointer;
760
767
  }
761
- `;dt([a({type:Number})],W.prototype,"rating",2);dt([a({type:String})],W.prototype,"reviewCount",2);dt([a({type:String})],W.prototype,"href",2);W=dt([x("o-rating")],W);var Xe=Object.defineProperty,Je=Object.getOwnPropertyDescriptor,y=(o,t,e,n)=>{for(var i=n>1?void 0:n?Je(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Xe(t,e,i),i};let g=class extends b{constructor(){super(...arguments),this.open=!1,this.showHeader=!0,this.showFooter=!1,this.showHeaderStartIcon=!1,this.headerTitle="",this.closeButtonLabel="Close the modal",this.firstButtonLabel="Close",this.firstButtonVariant="primary",this.secondaryButtonLabel="",this.secondaryButtonVariant="secondary",this.disablePortal=!1,this.zIndex=99,this.initialized=!1,this.previousFocusedElement=null,this.handleKeyDown=o=>{this.open&&(o.key==="Escape"?this.closePanel():o.key==="Tab"&&this.trapFocus(o))}}connectedCallback(){super.connectedCallback(),!this.disablePortal&&this.parentElement!==document.body&&document.body.appendChild(this),window.addEventListener("keydown",this.handleKeyDown),this.updateComplete.then(()=>{this.initialized=!0})}disconnectedCallback(){document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),window.removeEventListener("keydown",this.handleKeyDown),super.disconnectedCallback()}trapFocus(o){const t=this.getFocusableElements();if(t.length===0)return;const e=t[0],n=t[t.length-1];o.shiftKey&&document.activeElement===e?(o.preventDefault(),n.focus()):!o.shiftKey&&document.activeElement===n&&(o.preventDefault(),e.focus())}getFocusableElements(){const o=this.renderRoot.querySelector(".panel");return o?Array.from(o.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(t=>!t.hasAttribute("disabled")):[]}openPanel(){this.previousFocusedElement=document.activeElement,this.open=!0,document.body.style.overflow="hidden",document.body.setAttribute("data-side-panel","open"),this.updateComplete.then(()=>{const o=this.getFocusableElements()[0];o==null||o.focus()})}closePanel(){var o;this.open=!1,document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),(o=this.previousFocusedElement)==null||o.focus(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))}handleFirstClick(){typeof this.onFirstButtonClick=="function"&&this.onFirstButtonClick(),this.closePanel()}handleSecondaryClick(){typeof this.onSecondaryButtonClick=="function"&&this.onSecondaryButtonClick(),this.closePanel()}updated(){this.style.setProperty("--z-overlay",`${this.zIndex}`),this.style.setProperty("--z-panel",`${this.zIndex+1}`)}render(){return l`
768
+ `;dt([a({type:Number})],W.prototype,"rating",2);dt([a({type:String})],W.prototype,"reviewCount",2);dt([a({type:String})],W.prototype,"href",2);W=dt([x("o-rating")],W);var Je=Object.defineProperty,Ye=Object.getOwnPropertyDescriptor,y=(o,t,e,n)=>{for(var i=n>1?void 0:n?Ye(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Je(t,e,i),i};let g=class extends b{constructor(){super(...arguments),this.open=!1,this.showHeader=!0,this.showFooter=!1,this.showHeaderStartIcon=!1,this.headerTitle="",this.closeButtonLabel="Close the modal",this.firstButtonLabel="Close",this.firstButtonVariant="primary",this.secondaryButtonLabel="",this.secondaryButtonVariant="secondary",this.disablePortal=!1,this.zIndex=99,this.initialized=!1,this.previousFocusedElement=null,this.handleKeyDown=o=>{this.open&&(o.key==="Escape"?this.closePanel():o.key==="Tab"&&this.trapFocus(o))}}connectedCallback(){super.connectedCallback(),!this.disablePortal&&this.parentElement!==document.body&&document.body.appendChild(this),window.addEventListener("keydown",this.handleKeyDown),this.updateComplete.then(()=>{this.initialized=!0})}disconnectedCallback(){document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),window.removeEventListener("keydown",this.handleKeyDown),super.disconnectedCallback()}trapFocus(o){const t=this.getFocusableElements();if(t.length===0)return;const e=t[0],n=t[t.length-1];o.shiftKey&&document.activeElement===e?(o.preventDefault(),n.focus()):!o.shiftKey&&document.activeElement===n&&(o.preventDefault(),e.focus())}getFocusableElements(){const o=this.renderRoot.querySelector(".panel");return o?Array.from(o.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(t=>!t.hasAttribute("disabled")):[]}openPanel(){this.previousFocusedElement=document.activeElement,this.open=!0,document.body.style.overflow="hidden",document.body.setAttribute("data-side-panel","open"),this.updateComplete.then(()=>{const o=this.getFocusableElements()[0];o==null||o.focus()})}closePanel(){var o;this.open=!1,document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),(o=this.previousFocusedElement)==null||o.focus(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))}handleFirstClick(){typeof this.onFirstButtonClick=="function"&&this.onFirstButtonClick(),this.closePanel()}handleSecondaryClick(){typeof this.onSecondaryButtonClick=="function"&&this.onSecondaryButtonClick(),this.closePanel()}updated(){this.style.setProperty("--z-overlay",`${this.zIndex}`),this.style.setProperty("--z-panel",`${this.zIndex+1}`)}render(){return l`
762
769
  <div class="overlay" style="z-index: ${this.zIndex}" @click=${this.closePanel}></div>
763
770
  <div
764
771
  class="panel"
@@ -944,7 +951,7 @@
944
951
  --line-height: var(--line-height-280);
945
952
  }
946
953
  }
947
- `;y([a({type:Boolean,reflect:!0})],g.prototype,"open",2);y([a({type:Boolean,reflect:!0})],g.prototype,"showHeader",2);y([a({type:Boolean,reflect:!0})],g.prototype,"showFooter",2);y([a({type:Boolean,reflect:!0})],g.prototype,"showHeaderStartIcon",2);y([a({type:String,reflect:!0})],g.prototype,"headerTitle",2);y([a({type:String,reflect:!0})],g.prototype,"closeButtonLabel",2);y([a({type:String,reflect:!0})],g.prototype,"firstButtonLabel",2);y([a({type:String,reflect:!0})],g.prototype,"firstButtonVariant",2);y([a({type:Function})],g.prototype,"onFirstButtonClick",2);y([a({type:String,reflect:!0})],g.prototype,"secondaryButtonLabel",2);y([a({type:String,reflect:!0})],g.prototype,"secondaryButtonVariant",2);y([a({type:Function})],g.prototype,"onSecondaryButtonClick",2);y([a({type:Boolean,reflect:!0})],g.prototype,"disablePortal",2);y([a({type:Number,reflect:!0})],g.prototype,"zIndex",2);y([a({type:Boolean,reflect:!0})],g.prototype,"initialized",2);g=y([x("o-side-panel")],g);var Ye=Object.defineProperty,Qe=Object.getOwnPropertyDescriptor,M=(o,t,e,n)=>{for(var i=n>1?void 0:n?Qe(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Ye(t,e,i),i};let A=class extends b{constructor(){super(...arguments),this.thumbnails=[],this.activeIndex=0,this.disabledIndexes=[],this.maxWidth="100%",this.altressource="visual",this.focusedIndex=0,this.playerIconTemplate=l`
954
+ `;y([a({type:Boolean,reflect:!0})],g.prototype,"open",2);y([a({type:Boolean,reflect:!0})],g.prototype,"showHeader",2);y([a({type:Boolean,reflect:!0})],g.prototype,"showFooter",2);y([a({type:Boolean,reflect:!0})],g.prototype,"showHeaderStartIcon",2);y([a({type:String,reflect:!0})],g.prototype,"headerTitle",2);y([a({type:String,reflect:!0})],g.prototype,"closeButtonLabel",2);y([a({type:String,reflect:!0})],g.prototype,"firstButtonLabel",2);y([a({type:String,reflect:!0})],g.prototype,"firstButtonVariant",2);y([a({type:Function})],g.prototype,"onFirstButtonClick",2);y([a({type:String,reflect:!0})],g.prototype,"secondaryButtonLabel",2);y([a({type:String,reflect:!0})],g.prototype,"secondaryButtonVariant",2);y([a({type:Function})],g.prototype,"onSecondaryButtonClick",2);y([a({type:Boolean,reflect:!0})],g.prototype,"disablePortal",2);y([a({type:Number,reflect:!0})],g.prototype,"zIndex",2);y([a({type:Boolean,reflect:!0})],g.prototype,"initialized",2);g=y([x("o-side-panel")],g);var Qe=Object.defineProperty,to=Object.getOwnPropertyDescriptor,M=(o,t,e,n)=>{for(var i=n>1?void 0:n?to(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&Qe(t,e,i),i};let A=class extends b{constructor(){super(...arguments),this.thumbnails=[],this.activeIndex=0,this.disabledIndexes=[],this.maxWidth="100%",this.altressource="visual",this.focusedIndex=0,this.playerIconTemplate=l`
948
955
  <o-icon-button
949
956
  icon="playerv"
950
957
  size="xsmall"
@@ -1080,7 +1087,7 @@
1080
1087
  height: 0;
1081
1088
  width: 0;
1082
1089
  }
1083
- `;M([a({type:Array})],A.prototype,"thumbnails",2);M([a({type:Number})],A.prototype,"activeIndex",2);M([a({type:Array})],A.prototype,"disabledIndexes",2);M([a({type:String})],A.prototype,"maxWidth",2);M([a({type:String})],A.prototype,"altressource",2);M([a({type:Object})],A.prototype,"swiperInstance",2);M([F()],A.prototype,"focusedIndex",2);A=M([x("thumbnail-navigation")],A);var to=Object.defineProperty,eo=Object.getOwnPropertyDescriptor,kt=(o,t,e,n)=>{for(var i=n>1?void 0:n?eo(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&to(t,e,i),i};let et=class extends b{constructor(){super(...arguments),this.type="",this.bgstyle="background-white"}render(){return l`
1090
+ `;M([a({type:Array})],A.prototype,"thumbnails",2);M([a({type:Number})],A.prototype,"activeIndex",2);M([a({type:Array})],A.prototype,"disabledIndexes",2);M([a({type:String})],A.prototype,"maxWidth",2);M([a({type:String})],A.prototype,"altressource",2);M([a({type:Object})],A.prototype,"swiperInstance",2);M([F()],A.prototype,"focusedIndex",2);A=M([x("thumbnail-navigation")],A);var eo=Object.defineProperty,oo=Object.getOwnPropertyDescriptor,kt=(o,t,e,n)=>{for(var i=n>1?void 0:n?oo(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&eo(t,e,i),i};let et=class extends b{constructor(){super(...arguments),this.type="",this.bgstyle="background-white"}render(){return l`
1084
1091
  <span class="tag ${this.bgstyle}"><slot></slot></span>
1085
1092
  `}};et.styles=m`
1086
1093
  .tag {
@@ -1137,7 +1144,7 @@
1137
1144
  background-color: var(--color-content-success);
1138
1145
  }
1139
1146
 
1140
- `;kt([a({type:String,reflect:!0})],et.prototype,"type",2);kt([a({type:String,reflect:!0})],et.prototype,"bgstyle",2);et=kt([x("o-tag")],et);var oo=Object.defineProperty,io=Object.getOwnPropertyDescriptor,At=(o,t,e,n)=>{for(var i=n>1?void 0:n?io(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&oo(t,e,i),i};let ot=class extends b{constructor(){super(...arguments),this.type="top",this.text=""}render(){return l`
1147
+ `;kt([a({type:String,reflect:!0})],et.prototype,"type",2);kt([a({type:String,reflect:!0})],et.prototype,"bgstyle",2);et=kt([x("o-tag")],et);var io=Object.defineProperty,no=Object.getOwnPropertyDescriptor,At=(o,t,e,n)=>{for(var i=n>1?void 0:n?no(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&io(t,e,i),i};let ot=class extends b{constructor(){super(...arguments),this.type="top",this.text=""}render(){return l`
1141
1148
  <div class="tooltip">
1142
1149
  <span class="tooltiptext">${this.text}</span>
1143
1150
  <slot></slot>
@@ -1234,7 +1241,7 @@
1234
1241
  border-color: transparent var(--color-alpha-dark-strongest) transparent transparent;
1235
1242
  }
1236
1243
 
1237
- `;At([a({type:String,reflect:!0})],ot.prototype,"type",2);At([a({type:String,reflect:!0})],ot.prototype,"text",2);ot=At([x("o-tooltip")],ot);var no=Object.defineProperty,ro=Object.getOwnPropertyDescriptor,O=(o,t,e,n)=>{for(var i=n>1?void 0:n?ro(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&no(t,e,i),i};let k=class extends b{constructor(){super(...arguments),this.options=[],this.value="",this.name="",this.disabled=!1,this.width="100%",this.open=!1,this.activeIndex=-1,this.menuWidth="",this._handleOutsideClick=o=>{this.contains(o.target)||(this.open=!1,this.activeIndex=-1)}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){document.removeEventListener("click",this._handleOutsideClick),super.disconnectedCallback()}toggle(){var o;if(!this.disabled){if(this.open=!this.open,this.activeIndex=this.open?this.options.findIndex(t=>t.value===this.value):-1,this.open&&this.width==="auto"){const t=(o=this.renderRoot)==null?void 0:o.querySelector("button");t&&(this.menuWidth=`${t.getBoundingClientRect().width}px`)}this.open&&this.updateComplete.then(()=>{this._focusActiveOption()})}}_focusActiveOption(){var t;const o=(t=this.renderRoot)==null?void 0:t.querySelector(`#option-${this.activeIndex}`);o==null||o.focus()}selectOption(o){this.value=o.value,this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value,url:o.url}})),this.open=!1,this.activeIndex=-1}handleKeydown(o){if(this.disabled){o.preventDefault();return}if(!this.open){(o.key==="ArrowDown"||o.key==="ArrowUp")&&(o.preventDefault(),this.open=!0,this.activeIndex=this.options.findIndex(t=>t.value===this.value),this.updateComplete.then(()=>this._focusActiveOption()));return}switch(o.key){case"ArrowDown":o.preventDefault(),this.activeIndex=(this.activeIndex+1)%this.options.length,this.updateComplete.then(()=>this._focusActiveOption());break;case"ArrowUp":o.preventDefault(),this.activeIndex=(this.activeIndex-1+this.options.length)%this.options.length,this.updateComplete.then(()=>this._focusActiveOption());break;case"Home":o.preventDefault(),this.activeIndex=0,this.updateComplete.then(()=>this._focusActiveOption());break;case"End":o.preventDefault(),this.activeIndex=this.options.length-1,this.updateComplete.then(()=>this._focusActiveOption());break;case"Enter":o.preventDefault(),this.activeIndex>=0&&this.selectOption(this.options[this.activeIndex]);break;case"Escape":o.preventDefault(),this.open=!1,this.activeIndex=-1;break}}updated(o){this.options.length>0&&(this.options.some(e=>e.value===this.value)||(this.value=this.options[0].value))}render(){const o=K.checkstroke.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"'),t=this.options.find(e=>e.value===this.value);return l`
1244
+ `;At([a({type:String,reflect:!0})],ot.prototype,"type",2);At([a({type:String,reflect:!0})],ot.prototype,"text",2);ot=At([x("o-tooltip")],ot);var ro=Object.defineProperty,so=Object.getOwnPropertyDescriptor,O=(o,t,e,n)=>{for(var i=n>1?void 0:n?so(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&ro(t,e,i),i};let k=class extends b{constructor(){super(...arguments),this.options=[],this.value="",this.name="",this.disabled=!1,this.width="100%",this.open=!1,this.activeIndex=-1,this.menuWidth="",this._handleOutsideClick=o=>{this.contains(o.target)||(this.open=!1,this.activeIndex=-1)}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){document.removeEventListener("click",this._handleOutsideClick),super.disconnectedCallback()}toggle(){var o;if(!this.disabled){if(this.open=!this.open,this.activeIndex=this.open?this.options.findIndex(t=>t.value===this.value):-1,this.open&&this.width==="auto"){const t=(o=this.renderRoot)==null?void 0:o.querySelector("button");t&&(this.menuWidth=`${t.getBoundingClientRect().width}px`)}this.open&&this.updateComplete.then(()=>{this._focusActiveOption()})}}_focusActiveOption(){var t;const o=(t=this.renderRoot)==null?void 0:t.querySelector(`#option-${this.activeIndex}`);o==null||o.focus()}selectOption(o){this.value=o.value,this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value,url:o.url}})),this.open=!1,this.activeIndex=-1}handleKeydown(o){if(this.disabled){o.preventDefault();return}if(!this.open){(o.key==="ArrowDown"||o.key==="ArrowUp")&&(o.preventDefault(),this.open=!0,this.activeIndex=this.options.findIndex(t=>t.value===this.value),this.updateComplete.then(()=>this._focusActiveOption()));return}switch(o.key){case"ArrowDown":o.preventDefault(),this.activeIndex=(this.activeIndex+1)%this.options.length,this.updateComplete.then(()=>this._focusActiveOption());break;case"ArrowUp":o.preventDefault(),this.activeIndex=(this.activeIndex-1+this.options.length)%this.options.length,this.updateComplete.then(()=>this._focusActiveOption());break;case"Home":o.preventDefault(),this.activeIndex=0,this.updateComplete.then(()=>this._focusActiveOption());break;case"End":o.preventDefault(),this.activeIndex=this.options.length-1,this.updateComplete.then(()=>this._focusActiveOption());break;case"Enter":o.preventDefault(),this.activeIndex>=0&&this.selectOption(this.options[this.activeIndex]);break;case"Escape":o.preventDefault(),this.open=!1,this.activeIndex=-1;break}}updated(o){this.options.length>0&&(this.options.some(e=>e.value===this.value)||(this.value=this.options[0].value))}render(){const o=K.checkstroke.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"'),t=this.options.find(e=>e.value===this.value);return l`
1238
1245
  <button
1239
1246
  role="combobox"
1240
1247
  aria-haspopup="listbox"
@@ -1421,7 +1428,7 @@
1421
1428
  input[type="hidden"] {
1422
1429
  display: none;
1423
1430
  }
1424
- `;O([a({type:Array,reflect:!0})],k.prototype,"options",2);O([a({type:String,reflect:!0})],k.prototype,"value",2);O([a({type:String,reflect:!0})],k.prototype,"name",2);O([a({type:Boolean,reflect:!0})],k.prototype,"disabled",2);O([a({type:String,reflect:!0})],k.prototype,"width",2);O([F()],k.prototype,"open",2);O([F()],k.prototype,"activeIndex",2);O([F()],k.prototype,"menuWidth",2);k=O([x("o-dropdown")],k);var so=Object.getOwnPropertyDescriptor,ao=(o,t,e,n)=>{for(var i=n>1?void 0:n?so(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=r(i)||i);return i};let mt=class extends b{render(){return l` <span class="dots"></span> `}};mt.styles=m`
1431
+ `;O([a({type:Array,reflect:!0})],k.prototype,"options",2);O([a({type:String,reflect:!0})],k.prototype,"value",2);O([a({type:String,reflect:!0})],k.prototype,"name",2);O([a({type:Boolean,reflect:!0})],k.prototype,"disabled",2);O([a({type:String,reflect:!0})],k.prototype,"width",2);O([F()],k.prototype,"open",2);O([F()],k.prototype,"activeIndex",2);O([F()],k.prototype,"menuWidth",2);k=O([x("o-dropdown")],k);var ao=Object.getOwnPropertyDescriptor,lo=(o,t,e,n)=>{for(var i=n>1?void 0:n?ao(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=r(i)||i);return i};let mt=class extends b{render(){return l` <span class="dots"></span> `}};mt.styles=m`
1425
1432
  :host {
1426
1433
  display: flex;
1427
1434
  align-items: center;
@@ -1472,7 +1479,7 @@
1472
1479
  background-color: var(--color-container-action-primary-pressed);
1473
1480
  }
1474
1481
  }
1475
- `;mt=ao([x("o-dots")],mt);var lo=Object.defineProperty,co=Object.getOwnPropertyDescriptor,E=(o,t,e,n)=>{for(var i=n>1?void 0:n?co(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&lo(t,e,i),i};let C=class extends b{constructor(){super(...arguments),this.options=[],this.value="",this.name="",this.additionaltext="+X variant(s)",this.disabled=!1,this.width="100%",this.open=!1,this.activeIndex=-1,this.menuWidth="",this._handleOutsideClick=o=>{this.contains(o.target)||(this.open=!1,this.activeIndex=-1)}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){document.removeEventListener("click",this._handleOutsideClick),super.disconnectedCallback()}toggle(){var o;if(!this.disabled){if(this.open=!this.open,this.activeIndex=this.open?this.options.findIndex(t=>t.value===this.value):-1,this.open&&this.width==="auto"){const t=(o=this.renderRoot)==null?void 0:o.querySelector("button");t&&(this.menuWidth=`${t.getBoundingClientRect().width}px`)}this.open&&this.updateComplete.then(()=>this._focusActiveOption())}}_focusActiveOption(){var t;const o=(t=this.renderRoot)==null?void 0:t.querySelector(`#option-${this.activeIndex}`);o==null||o.focus()}selectOption(o){this.value=o.value,this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value,url:o.url}})),this.open=!1,this.activeIndex=-1}handleKeydown(o){if(this.disabled){o.preventDefault();return}if(!this.open){(o.key==="ArrowDown"||o.key==="ArrowUp")&&(o.preventDefault(),this.open=!0,this.activeIndex=this.options.findIndex(t=>t.value===this.value),this.updateComplete.then(()=>this._focusActiveOption()));return}switch(o.key){case"ArrowDown":o.preventDefault(),this.activeIndex=(this.activeIndex+1)%this.options.length,this.updateComplete.then(()=>this._focusActiveOption());break;case"ArrowUp":o.preventDefault(),this.activeIndex=(this.activeIndex-1+this.options.length)%this.options.length,this.updateComplete.then(()=>this._focusActiveOption());break;case"Home":o.preventDefault(),this.activeIndex=0,this.updateComplete.then(()=>this._focusActiveOption());break;case"End":o.preventDefault(),this.activeIndex=this.options.length-1,this.updateComplete.then(()=>this._focusActiveOption());break;case"Enter":o.preventDefault(),this.activeIndex>=0&&this.selectOption(this.options[this.activeIndex]);break;case"Escape":o.preventDefault(),this.open=!1,this.activeIndex=-1;break}}updated(){this.options.length>0&&(this.options.some(t=>t.value===this.value)||(this.value=this.options[0].value))}render(){const o=K.checkstroke.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"'),t=this.options.find(e=>e.value===this.value);return l`
1482
+ `;mt=lo([x("o-dots")],mt);var co=Object.defineProperty,ho=Object.getOwnPropertyDescriptor,E=(o,t,e,n)=>{for(var i=n>1?void 0:n?ho(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&co(t,e,i),i};let C=class extends b{constructor(){super(...arguments),this.options=[],this.value="",this.name="",this.additionaltext="+X variant(s)",this.disabled=!1,this.width="100%",this.open=!1,this.activeIndex=-1,this.menuWidth="",this._handleOutsideClick=o=>{this.contains(o.target)||(this.open=!1,this.activeIndex=-1)}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._handleOutsideClick)}disconnectedCallback(){document.removeEventListener("click",this._handleOutsideClick),super.disconnectedCallback()}toggle(){var o;if(!this.disabled){if(this.open=!this.open,this.activeIndex=this.open?this.options.findIndex(t=>t.value===this.value):-1,this.open&&this.width==="auto"){const t=(o=this.renderRoot)==null?void 0:o.querySelector("button");t&&(this.menuWidth=`${t.getBoundingClientRect().width}px`)}this.open&&this.updateComplete.then(()=>this._focusActiveOption())}}_focusActiveOption(){var t;const o=(t=this.renderRoot)==null?void 0:t.querySelector(`#option-${this.activeIndex}`);o==null||o.focus()}selectOption(o){this.value=o.value,this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value,url:o.url}})),this.open=!1,this.activeIndex=-1}handleKeydown(o){if(this.disabled){o.preventDefault();return}if(!this.open){(o.key==="ArrowDown"||o.key==="ArrowUp")&&(o.preventDefault(),this.open=!0,this.activeIndex=this.options.findIndex(t=>t.value===this.value),this.updateComplete.then(()=>this._focusActiveOption()));return}switch(o.key){case"ArrowDown":o.preventDefault(),this.activeIndex=(this.activeIndex+1)%this.options.length,this.updateComplete.then(()=>this._focusActiveOption());break;case"ArrowUp":o.preventDefault(),this.activeIndex=(this.activeIndex-1+this.options.length)%this.options.length,this.updateComplete.then(()=>this._focusActiveOption());break;case"Home":o.preventDefault(),this.activeIndex=0,this.updateComplete.then(()=>this._focusActiveOption());break;case"End":o.preventDefault(),this.activeIndex=this.options.length-1,this.updateComplete.then(()=>this._focusActiveOption());break;case"Enter":o.preventDefault(),this.activeIndex>=0&&this.selectOption(this.options[this.activeIndex]);break;case"Escape":o.preventDefault(),this.open=!1,this.activeIndex=-1;break}}updated(){this.options.length>0&&(this.options.some(t=>t.value===this.value)||(this.value=this.options[0].value))}render(){const o=K.checkstroke.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"'),t=this.options.find(e=>e.value===this.value);return l`
1476
1483
  <button
1477
1484
  role="combobox"
1478
1485
  aria-haspopup="listbox"
@@ -1713,8 +1720,8 @@
1713
1720
  * @license
1714
1721
  * Copyright 2018 Google LLC
1715
1722
  * SPDX-License-Identifier: BSD-3-Clause
1716
- */const Wt="important",ho=" !"+Wt,po=Zt(class extends qt{constructor(o){var t;if(super(o),o.type!==Vt.ATTRIBUTE||o.name!=="style"||((t=o.strings)==null?void 0:t.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(o){return Object.keys(o).reduce((t,e)=>{const n=o[e];return n==null?t:t+`${e=e.includes("-")?e:e.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${n};`},"")}update(o,[t]){const{style:e}=o.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(t)),this.render(t);for(const n of this.ft)t[n]==null&&(this.ft.delete(n),n.includes("-")?e.removeProperty(n):e[n]=null);for(const n in t){const i=t[n];if(i!=null){this.ft.add(n);const s=typeof i=="string"&&i.endsWith(ho);n.includes("-")||s?e.setProperty(n,s?i.slice(0,-11):i,s?Wt:""):e[n]=i}}return D}});var uo=Object.defineProperty,vo=Object.getOwnPropertyDescriptor,St=(o,t,e,n)=>{for(var i=n>1?void 0:n?vo(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&uo(t,e,i),i};let it=class extends b{constructor(){super(...arguments),this.option={},this.imageSize=64}render(){const o=this.option.clickable,t={width:`${this.imageSize}px`,height:`${this.imageSize}px`},e=l`
1717
- ${this.option.imgurl?l`<img src="${this.option.imgurl}" alt="${$(this.option.title)}" aria-hidden="true" style=${po(t)} />`:""}
1723
+ */const Wt="important",po=" !"+Wt,uo=Zt(class extends qt{constructor(o){var t;if(super(o),o.type!==Vt.ATTRIBUTE||o.name!=="style"||((t=o.strings)==null?void 0:t.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(o){return Object.keys(o).reduce((t,e)=>{const n=o[e];return n==null?t:t+`${e=e.includes("-")?e:e.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${n};`},"")}update(o,[t]){const{style:e}=o.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(t)),this.render(t);for(const n of this.ft)t[n]==null&&(this.ft.delete(n),n.includes("-")?e.removeProperty(n):e[n]=null);for(const n in t){const i=t[n];if(i!=null){this.ft.add(n);const s=typeof i=="string"&&i.endsWith(po);n.includes("-")||s?e.setProperty(n,s?i.slice(0,-11):i,s?Wt:""):e[n]=i}}return D}});var vo=Object.defineProperty,go=Object.getOwnPropertyDescriptor,St=(o,t,e,n)=>{for(var i=n>1?void 0:n?go(t,e):t,s=o.length-1,r;s>=0;s--)(r=o[s])&&(i=(n?r(t,e,i):r(i))||i);return n&&i&&vo(t,e,i),i};let it=class extends b{constructor(){super(...arguments),this.option={},this.imageSize=64}render(){const o=this.option.clickable,t={width:`${this.imageSize}px`,height:`${this.imageSize}px`},e=l`
1724
+ ${this.option.imgurl?l`<img src="${this.option.imgurl}" alt="${$(this.option.title)}" aria-hidden="true" style=${uo(t)} />`:""}
1718
1725
  <div class="m-reassurance-content">
1719
1726
  <h3 class="a-reassurance-text">${$(this.option.title)}</h3>
1720
1727
  <p class="a-reassurance-description">${$(this.option.description)}</p>
@@ -1736,7 +1743,7 @@
1736
1743
  padding: var(--spacing-xl);
1737
1744
 
1738
1745
  &:has(img) {
1739
- padding: var(--spacing-2-xs) var(--spacing-s) var(--spacing-2-xs) var(--spacing-2-xs);
1746
+ padding: 3px var(--spacing-s) 3px var(--spacing-2-xs);
1740
1747
  }
1741
1748
 
1742
1749
  &.clickable {
@@ -1779,6 +1786,11 @@
1779
1786
  letter-spacing: var(--letter-spacing-400);
1780
1787
  text-transform: uppercase;
1781
1788
  margin: var(--spacing-4-xs);
1789
+ display: -webkit-box;
1790
+ -webkit-line-clamp: 1;
1791
+ line-clamp: 1;
1792
+ -webkit-box-orient: vertical;
1793
+ overflow: hidden;
1782
1794
  }
1783
1795
 
1784
1796
  .a-reassurance-description {
@@ -1793,11 +1805,6 @@
1793
1805
  line-clamp: 2;
1794
1806
  -webkit-box-orient: vertical;
1795
1807
  overflow: hidden;
1796
-
1797
- @media (min-width: 1025px) {
1798
- -webkit-line-clamp: 3;
1799
- line-clamp: 3;
1800
- }
1801
1808
  }
1802
1809
  }
1803
1810
  `;St([a({type:Object,reflect:!0})],it.prototype,"option",2);St([a({type:Number,reflect:!0})],it.prototype,"imageSize",2);it=St([x("o-reassurance")],it);
package/index.mjs CHANGED
@@ -734,6 +734,9 @@ const ye = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="h
734
734
  <rect x="1" width="2" height="8" fill="#3F2B2E"/>
735
735
  <rect x="5" width="2" height="8" fill="#3F2B2E"/>
736
736
  </svg>
737
+ `, je = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
738
+ <path d="M10.5037 5.99925C10.7795 5.99925 11.0037 6.22311 11.0037 6.49925V14.2922L13.1462 12.1448C13.3411 11.9498 13.6573 11.95 13.8523 12.1448H13.8533C14.0482 12.34 14.0481 12.6565 13.8533 12.8518L10.8572 15.8518C10.6618 16.0471 10.3455 16.0471 10.1501 15.8518L7.15406 12.8518C6.96522 12.6557 6.96774 12.3444 7.15992 12.1516C7.35242 11.9588 7.66416 11.9556 7.86011 12.1448L10.0046 14.2922V6.49925C10.0046 6.22319 10.228 5.99938 10.5037 5.99925ZM5.15699 0.145737C5.35218 -0.0485278 5.66791 -0.0486304 5.86304 0.145737L8.85913 3.14574C9.04829 3.34183 9.04562 3.65402 8.85327 3.84691C8.66066 4.03978 8.34902 4.04225 8.15308 3.85277L6.00952 1.70628V9.49925C6.0095 9.77533 5.78621 9.99918 5.5105 9.99925C5.23473 9.99925 5.0115 9.77538 5.01148 9.49925V1.70628L2.86695 3.85179C2.74288 3.98695 2.55447 4.04321 2.37671 3.99828C2.1991 3.95328 2.06051 3.81475 2.01538 3.63695C1.97026 3.45902 2.02608 3.27015 2.16089 3.14574L5.15699 0.145737Z" fill="#001022"/>
739
+ </svg>
737
740
  `, K = {
738
741
  wishlist: ye,
739
742
  playerv: me,
@@ -755,7 +758,8 @@ const ye = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="h
755
758
  triangledown: De,
756
759
  triangleup: He,
757
760
  checkstroke: Me,
758
- pause: Te
761
+ pause: Te,
762
+ mapDualArrow: je
759
763
  };
760
764
  /**
761
765
  * @license
@@ -808,13 +812,13 @@ class yt extends ft {
808
812
  }
809
813
  yt.directiveName = "unsafeSVG", yt.resultType = 2;
810
814
  const H = Zt(yt);
811
- var je = Object.defineProperty, Ue = Object.getOwnPropertyDescriptor, w = (o, t, e, n) => {
812
- for (var i = n > 1 ? void 0 : n ? Ue(t, e) : t, s = o.length - 1, r; s >= 0; s--)
815
+ var Ue = Object.defineProperty, Re = Object.getOwnPropertyDescriptor, w = (o, t, e, n) => {
816
+ for (var i = n > 1 ? void 0 : n ? Re(t, e) : t, s = o.length - 1, r; s >= 0; s--)
813
817
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
814
- return n && i && je(t, e, i), i;
818
+ return n && i && Ue(t, e, i), i;
815
819
  };
816
- const Re = be(b);
817
- let u = class extends Re {
820
+ const Fe = be(b);
821
+ let u = class extends Fe {
818
822
  constructor() {
819
823
  super(...arguments), this.type = "submit", this.value = "", this.variant = "primary", this.text = "", this.textsecond = "", this.fullwidth = !1, this.disabled = !1, this.startIconModel = "search", this.endIconModel = "chevronRight", this.startIcon = !1, this.endIcon = !1, this.panelTarget = "", this.href = "", this.target = "";
820
824
  }
@@ -1025,7 +1029,11 @@ u.styles = m`
1025
1029
  width: var(--button-endicon-svg-width, 8px);
1026
1030
  }
1027
1031
 
1028
- //Icon movment on hover
1032
+ :host([underlined]) [href] span:not([class*="icon-"]) {
1033
+ border-bottom: var(--border-M, 1px) solid var(--color-border-primary);
1034
+ }
1035
+
1036
+ //Icon movement on hover
1029
1037
  :host([variant="tertiary"][endIcon]) .icon-end {
1030
1038
  display: inline-flex;
1031
1039
  align-items: center;
@@ -1082,10 +1090,10 @@ w([
1082
1090
  u = w([
1083
1091
  x("o-button")
1084
1092
  ], u);
1085
- var Fe = Object.defineProperty, Ne = Object.getOwnPropertyDescriptor, ht = (o, t, e, n) => {
1086
- for (var i = n > 1 ? void 0 : n ? Ne(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1093
+ var Ne = Object.defineProperty, Ve = Object.getOwnPropertyDescriptor, ht = (o, t, e, n) => {
1094
+ for (var i = n > 1 ? void 0 : n ? Ve(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1087
1095
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
1088
- return n && i && Fe(t, e, i), i;
1096
+ return n && i && Ne(t, e, i), i;
1089
1097
  };
1090
1098
  let q = class extends b {
1091
1099
  constructor() {
@@ -1211,10 +1219,10 @@ q = ht([
1211
1219
  * SPDX-License-Identifier: BSD-3-Clause
1212
1220
  */
1213
1221
  const $ = (o) => o ?? d;
1214
- var Ve = Object.defineProperty, Ze = Object.getOwnPropertyDescriptor, S = (o, t, e, n) => {
1215
- for (var i = n > 1 ? void 0 : n ? Ze(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1222
+ var Ze = Object.defineProperty, qe = Object.getOwnPropertyDescriptor, S = (o, t, e, n) => {
1223
+ for (var i = n > 1 ? void 0 : n ? qe(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1216
1224
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
1217
- return n && i && Ve(t, e, i), i;
1225
+ return n && i && Ze(t, e, i), i;
1218
1226
  };
1219
1227
  let _ = class extends b {
1220
1228
  constructor() {
@@ -1480,10 +1488,10 @@ S([
1480
1488
  _ = S([
1481
1489
  x("o-icon-button")
1482
1490
  ], _);
1483
- var qe = Object.defineProperty, We = Object.getOwnPropertyDescriptor, N = (o, t, e, n) => {
1484
- for (var i = n > 1 ? void 0 : n ? We(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1491
+ var We = Object.defineProperty, Ke = Object.getOwnPropertyDescriptor, N = (o, t, e, n) => {
1492
+ for (var i = n > 1 ? void 0 : n ? Ke(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1485
1493
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
1486
- return n && i && qe(t, e, i), i;
1494
+ return n && i && We(t, e, i), i;
1487
1495
  };
1488
1496
  let I = class extends b {
1489
1497
  constructor() {
@@ -1632,10 +1640,10 @@ N([
1632
1640
  I = N([
1633
1641
  x("o-link")
1634
1642
  ], I);
1635
- var Ke = Object.defineProperty, Ge = Object.getOwnPropertyDescriptor, dt = (o, t, e, n) => {
1636
- for (var i = n > 1 ? void 0 : n ? Ge(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1643
+ var Ge = Object.defineProperty, Xe = Object.getOwnPropertyDescriptor, dt = (o, t, e, n) => {
1644
+ for (var i = n > 1 ? void 0 : n ? Xe(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1637
1645
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
1638
- return n && i && Ke(t, e, i), i;
1646
+ return n && i && Ge(t, e, i), i;
1639
1647
  };
1640
1648
  let W = class extends b {
1641
1649
  constructor() {
@@ -1710,10 +1718,10 @@ dt([
1710
1718
  W = dt([
1711
1719
  x("o-rating")
1712
1720
  ], W);
1713
- var Xe = Object.defineProperty, Je = Object.getOwnPropertyDescriptor, y = (o, t, e, n) => {
1714
- for (var i = n > 1 ? void 0 : n ? Je(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1721
+ var Je = Object.defineProperty, Ye = Object.getOwnPropertyDescriptor, y = (o, t, e, n) => {
1722
+ for (var i = n > 1 ? void 0 : n ? Ye(t, e) : t, s = o.length - 1, r; s >= 0; s--)
1715
1723
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
1716
- return n && i && Xe(t, e, i), i;
1724
+ return n && i && Je(t, e, i), i;
1717
1725
  };
1718
1726
  let g = class extends b {
1719
1727
  constructor() {
@@ -2003,10 +2011,10 @@ y([
2003
2011
  g = y([
2004
2012
  x("o-side-panel")
2005
2013
  ], g);
2006
- var Ye = Object.defineProperty, Qe = Object.getOwnPropertyDescriptor, M = (o, t, e, n) => {
2007
- for (var i = n > 1 ? void 0 : n ? Qe(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2014
+ var Qe = Object.defineProperty, to = Object.getOwnPropertyDescriptor, M = (o, t, e, n) => {
2015
+ for (var i = n > 1 ? void 0 : n ? to(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2008
2016
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
2009
- return n && i && Ye(t, e, i), i;
2017
+ return n && i && Qe(t, e, i), i;
2010
2018
  };
2011
2019
  let A = class extends b {
2012
2020
  constructor() {
@@ -2215,10 +2223,10 @@ M([
2215
2223
  A = M([
2216
2224
  x("thumbnail-navigation")
2217
2225
  ], A);
2218
- var to = Object.defineProperty, eo = Object.getOwnPropertyDescriptor, kt = (o, t, e, n) => {
2219
- for (var i = n > 1 ? void 0 : n ? eo(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2226
+ var eo = Object.defineProperty, oo = Object.getOwnPropertyDescriptor, kt = (o, t, e, n) => {
2227
+ for (var i = n > 1 ? void 0 : n ? oo(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2220
2228
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
2221
- return n && i && to(t, e, i), i;
2229
+ return n && i && eo(t, e, i), i;
2222
2230
  };
2223
2231
  let et = class extends b {
2224
2232
  constructor() {
@@ -2295,10 +2303,10 @@ kt([
2295
2303
  et = kt([
2296
2304
  x("o-tag")
2297
2305
  ], et);
2298
- var oo = Object.defineProperty, io = Object.getOwnPropertyDescriptor, At = (o, t, e, n) => {
2299
- for (var i = n > 1 ? void 0 : n ? io(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2306
+ var io = Object.defineProperty, no = Object.getOwnPropertyDescriptor, At = (o, t, e, n) => {
2307
+ for (var i = n > 1 ? void 0 : n ? no(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2300
2308
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
2301
- return n && i && oo(t, e, i), i;
2309
+ return n && i && io(t, e, i), i;
2302
2310
  };
2303
2311
  let ot = class extends b {
2304
2312
  constructor() {
@@ -2415,10 +2423,10 @@ At([
2415
2423
  ot = At([
2416
2424
  x("o-tooltip")
2417
2425
  ], ot);
2418
- var no = Object.defineProperty, ro = Object.getOwnPropertyDescriptor, O = (o, t, e, n) => {
2419
- for (var i = n > 1 ? void 0 : n ? ro(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2426
+ var ro = Object.defineProperty, so = Object.getOwnPropertyDescriptor, O = (o, t, e, n) => {
2427
+ for (var i = n > 1 ? void 0 : n ? so(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2420
2428
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
2421
- return n && i && no(t, e, i), i;
2429
+ return n && i && ro(t, e, i), i;
2422
2430
  };
2423
2431
  let k = class extends b {
2424
2432
  constructor() {
@@ -2710,8 +2718,8 @@ O([
2710
2718
  k = O([
2711
2719
  x("o-dropdown")
2712
2720
  ], k);
2713
- var so = Object.getOwnPropertyDescriptor, ao = (o, t, e, n) => {
2714
- for (var i = n > 1 ? void 0 : n ? so(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2721
+ var ao = Object.getOwnPropertyDescriptor, lo = (o, t, e, n) => {
2722
+ for (var i = n > 1 ? void 0 : n ? ao(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2715
2723
  (r = o[s]) && (i = r(i) || i);
2716
2724
  return i;
2717
2725
  };
@@ -2772,13 +2780,13 @@ mt.styles = m`
2772
2780
  }
2773
2781
  }
2774
2782
  `;
2775
- mt = ao([
2783
+ mt = lo([
2776
2784
  x("o-dots")
2777
2785
  ], mt);
2778
- var lo = Object.defineProperty, co = Object.getOwnPropertyDescriptor, E = (o, t, e, n) => {
2779
- for (var i = n > 1 ? void 0 : n ? co(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2786
+ var co = Object.defineProperty, ho = Object.getOwnPropertyDescriptor, E = (o, t, e, n) => {
2787
+ for (var i = n > 1 ? void 0 : n ? ho(t, e) : t, s = o.length - 1, r; s >= 0; s--)
2780
2788
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
2781
- return n && i && lo(t, e, i), i;
2789
+ return n && i && co(t, e, i), i;
2782
2790
  };
2783
2791
  let C = class extends b {
2784
2792
  constructor() {
@@ -3128,7 +3136,7 @@ C = E([
3128
3136
  * Copyright 2018 Google LLC
3129
3137
  * SPDX-License-Identifier: BSD-3-Clause
3130
3138
  */
3131
- const Wt = "important", ho = " !" + Wt, po = Zt(class extends qt {
3139
+ const Wt = "important", po = " !" + Wt, uo = Zt(class extends qt {
3132
3140
  constructor(o) {
3133
3141
  var t;
3134
3142
  if (super(o), o.type !== Vt.ATTRIBUTE || o.name !== "style" || ((t = o.strings) == null ? void 0 : t.length) > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
@@ -3147,17 +3155,17 @@ const Wt = "important", ho = " !" + Wt, po = Zt(class extends qt {
3147
3155
  const i = t[n];
3148
3156
  if (i != null) {
3149
3157
  this.ft.add(n);
3150
- const s = typeof i == "string" && i.endsWith(ho);
3158
+ const s = typeof i == "string" && i.endsWith(po);
3151
3159
  n.includes("-") || s ? e.setProperty(n, s ? i.slice(0, -11) : i, s ? Wt : "") : e[n] = i;
3152
3160
  }
3153
3161
  }
3154
3162
  return D;
3155
3163
  }
3156
3164
  });
3157
- var uo = Object.defineProperty, vo = Object.getOwnPropertyDescriptor, St = (o, t, e, n) => {
3158
- for (var i = n > 1 ? void 0 : n ? vo(t, e) : t, s = o.length - 1, r; s >= 0; s--)
3165
+ var vo = Object.defineProperty, go = Object.getOwnPropertyDescriptor, St = (o, t, e, n) => {
3166
+ for (var i = n > 1 ? void 0 : n ? go(t, e) : t, s = o.length - 1, r; s >= 0; s--)
3159
3167
  (r = o[s]) && (i = (n ? r(t, e, i) : r(i)) || i);
3160
- return n && i && uo(t, e, i), i;
3168
+ return n && i && vo(t, e, i), i;
3161
3169
  };
3162
3170
  let it = class extends b {
3163
3171
  constructor() {
@@ -3168,7 +3176,7 @@ let it = class extends b {
3168
3176
  width: `${this.imageSize}px`,
3169
3177
  height: `${this.imageSize}px`
3170
3178
  }, e = l`
3171
- ${this.option.imgurl ? l`<img src="${this.option.imgurl}" alt="${$(this.option.title)}" aria-hidden="true" style=${po(t)} />` : ""}
3179
+ ${this.option.imgurl ? l`<img src="${this.option.imgurl}" alt="${$(this.option.title)}" aria-hidden="true" style=${uo(t)} />` : ""}
3172
3180
  <div class="m-reassurance-content">
3173
3181
  <h3 class="a-reassurance-text">${$(this.option.title)}</h3>
3174
3182
  <p class="a-reassurance-description">${$(this.option.description)}</p>
@@ -3194,7 +3202,7 @@ it.styles = m`
3194
3202
  padding: var(--spacing-xl);
3195
3203
 
3196
3204
  &:has(img) {
3197
- padding: var(--spacing-2-xs) var(--spacing-s) var(--spacing-2-xs) var(--spacing-2-xs);
3205
+ padding: 3px var(--spacing-s) 3px var(--spacing-2-xs);
3198
3206
  }
3199
3207
 
3200
3208
  &.clickable {
@@ -3237,6 +3245,11 @@ it.styles = m`
3237
3245
  letter-spacing: var(--letter-spacing-400);
3238
3246
  text-transform: uppercase;
3239
3247
  margin: var(--spacing-4-xs);
3248
+ display: -webkit-box;
3249
+ -webkit-line-clamp: 1;
3250
+ line-clamp: 1;
3251
+ -webkit-box-orient: vertical;
3252
+ overflow: hidden;
3240
3253
  }
3241
3254
 
3242
3255
  .a-reassurance-description {
@@ -3251,11 +3264,6 @@ it.styles = m`
3251
3264
  line-clamp: 2;
3252
3265
  -webkit-box-orient: vertical;
3253
3266
  overflow: hidden;
3254
-
3255
- @media (min-width: 1025px) {
3256
- -webkit-line-clamp: 3;
3257
- line-clamp: 3;
3258
- }
3259
3267
  }
3260
3268
  }
3261
3269
  `;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@florid-kit/components",
3
- "version": "0.8.2",
3
+ "version": "0.8.4",
4
4
  "main": "index.js",
5
5
  "module": "index.mjs",
6
6
  "typings": "index.d.ts",