@florid-kit/components 0.4.6 → 0.4.7
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.
- package/components/icon-button.d.ts +1 -1
- package/components/thumbnail-navigation.d.ts +3 -3
- package/index.js +117 -66
- package/index.mjs +414 -366
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
|
|
3
3
|
type bgstyle = "background-light" | "background-contrast" | "ghost-light" | "ghost-contrast" | "none-light" | "none-contrast";
|
|
4
|
-
type size = "small" | "medium" | "large";
|
|
4
|
+
type size = "smallxs" | "small" | "medium" | "large";
|
|
5
5
|
type status = "empty" | "filled";
|
|
6
6
|
type type = "button" | "span";
|
|
7
7
|
export declare class OccitaneIconButton extends LitElement {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { LitElement
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
2
|
|
|
3
3
|
type ThumbnailItem = {
|
|
4
4
|
src: string;
|
|
@@ -8,19 +8,19 @@ export declare class ThumbnailNavigation extends LitElement {
|
|
|
8
8
|
thumbnails: ThumbnailItem[];
|
|
9
9
|
activeIndex: number;
|
|
10
10
|
disabledIndexes: number[];
|
|
11
|
-
playIcon?: TemplateResult;
|
|
12
11
|
maxWidth: string;
|
|
13
12
|
swiperInstance?: {
|
|
14
13
|
slideTo: (index: number) => void;
|
|
15
14
|
};
|
|
16
15
|
private focusedIndex;
|
|
16
|
+
private readonly playerIconTemplate;
|
|
17
17
|
static styles: import('lit').CSSResult;
|
|
18
18
|
private handleKeyDown;
|
|
19
19
|
private focusNext;
|
|
20
20
|
private focusPrevious;
|
|
21
21
|
private focusThumbnail;
|
|
22
22
|
private selectThumbnail;
|
|
23
|
-
protected render(): TemplateResult<1>;
|
|
23
|
+
protected render(): import('lit').TemplateResult<1>;
|
|
24
24
|
}
|
|
25
25
|
declare global {
|
|
26
26
|
interface HTMLElementTagNameMap {
|
package/index.js
CHANGED
|
@@ -2,29 +2,29 @@
|
|
|
2
2
|
* @license
|
|
3
3
|
* Copyright 2019 Google LLC
|
|
4
4
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
|
-
*/const X=globalThis,ht=X.ShadowRoot&&(X.ShadyCSS===void 0||X.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,dt=Symbol(),vt=new WeakMap;let
|
|
5
|
+
*/const X=globalThis,ht=X.ShadowRoot&&(X.ShadyCSS===void 0||X.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,dt=Symbol(),vt=new WeakMap;let St=class{constructor(t,e,s){if(this._$cssResult$=!0,s!==dt)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(ht&&t===void 0){const s=e!==void 0&&e.length===1;s&&(t=vt.get(e)),t===void 0&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),s&&vt.set(e,t))}return t}toString(){return this.cssText}};const It=n=>new St(typeof n=="string"?n:n+"",void 0,dt),A=(n,...t)=>{const e=n.length===1?n[0]:t.reduce((s,o,r)=>s+(i=>{if(i._$cssResult$===!0)return i.cssText;if(typeof i=="number")return i;throw Error("Value passed to 'css' function must be a 'css' function result: "+i+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(o)+n[r+1],n[0]);return new St(e,n,dt)},Bt=(n,t)=>{if(ht)n.adoptedStyleSheets=t.map(e=>e instanceof CSSStyleSheet?e:e.styleSheet);else for(const e of t){const s=document.createElement("style"),o=X.litNonce;o!==void 0&&s.setAttribute("nonce",o),s.textContent=e.cssText,n.appendChild(s)}},gt=ht?n=>n:n=>n instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return It(e)})(n):n;/**
|
|
6
6
|
* @license
|
|
7
7
|
* Copyright 2017 Google LLC
|
|
8
8
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
9
|
-
*/const{is:Ot,defineProperty:zt,getOwnPropertyDescriptor:Mt,getOwnPropertyNames:Ht,getOwnPropertySymbols:Tt,getPrototypeOf:Dt}=Object,C=globalThis,
|
|
9
|
+
*/const{is:Ot,defineProperty:zt,getOwnPropertyDescriptor:Mt,getOwnPropertyNames:Ht,getOwnPropertySymbols:Tt,getPrototypeOf:Dt}=Object,C=globalThis,bt=C.trustedTypes,Ut=bt?bt.emptyScript:"",st=C.reactiveElementPolyfillSupport,R=(n,t)=>n,J={toAttribute(n,t){switch(t){case Boolean:n=n?Ut:null;break;case Object:case Array:n=n==null?n:JSON.stringify(n)}return n},fromAttribute(n,t){let e=n;switch(t){case Boolean:e=n!==null;break;case Number:e=n===null?null:Number(n);break;case Object:case Array:try{e=JSON.parse(n)}catch{e=null}}return e}},pt=(n,t)=>!Ot(n,t),yt={attribute:!0,type:String,converter:J,reflect:!1,useDefault:!1,hasChanged:pt};Symbol.metadata??(Symbol.metadata=Symbol("metadata")),C.litPropertyMetadata??(C.litPropertyMetadata=new WeakMap);let T=class extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??(this.l=[])).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=yt){if(e.state&&(e.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const s=Symbol(),o=this.getPropertyDescriptor(t,s,e);o!==void 0&&zt(this.prototype,t,o)}}static getPropertyDescriptor(t,e,s){const{get:o,set:r}=Mt(this.prototype,t)??{get(){return this[e]},set(i){this[e]=i}};return{get:o,set(i){const c=o==null?void 0:o.call(this);r==null||r.call(this,i),this.requestUpdate(t,c,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??yt}static _$Ei(){if(this.hasOwnProperty(R("elementProperties")))return;const t=Dt(this);t.finalize(),t.l!==void 0&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(R("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(R("properties"))){const e=this.properties,s=[...Ht(e),...Tt(e)];for(const o of s)this.createProperty(o,e[o])}const t=this[Symbol.metadata];if(t!==null){const e=litPropertyMetadata.get(t);if(e!==void 0)for(const[s,o]of e)this.elementProperties.set(s,o)}this._$Eh=new Map;for(const[e,s]of this.elementProperties){const o=this._$Eu(e,s);o!==void 0&&this._$Eh.set(o,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const o of s)e.unshift(gt(o))}else t!==void 0&&e.push(gt(t));return e}static _$Eu(t,e){const s=e.attribute;return s===!1?void 0:typeof s=="string"?s:typeof t=="string"?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){var t;this._$ES=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$E_(),this.requestUpdate(),(t=this.constructor.l)==null||t.forEach(e=>e(this))}addController(t){var e;(this._$EO??(this._$EO=new Set)).add(t),this.renderRoot!==void 0&&this.isConnected&&((e=t.hostConnected)==null||e.call(t))}removeController(t){var e;(e=this._$EO)==null||e.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return Bt(t,this.constructor.elementStyles),t}connectedCallback(){var t;this.renderRoot??(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(t=this._$EO)==null||t.forEach(e=>{var s;return(s=e.hostConnected)==null?void 0:s.call(e)})}enableUpdating(t){}disconnectedCallback(){var t;(t=this._$EO)==null||t.forEach(e=>{var s;return(s=e.hostDisconnected)==null?void 0:s.call(e)})}attributeChangedCallback(t,e,s){this._$AK(t,s)}_$ET(t,e){var r;const s=this.constructor.elementProperties.get(t),o=this.constructor._$Eu(t,s);if(o!==void 0&&s.reflect===!0){const i=(((r=s.converter)==null?void 0:r.toAttribute)!==void 0?s.converter:J).toAttribute(e,s.type);this._$Em=t,i==null?this.removeAttribute(o):this.setAttribute(o,i),this._$Em=null}}_$AK(t,e){var r,i;const s=this.constructor,o=s._$Eh.get(t);if(o!==void 0&&this._$Em!==o){const c=s.getPropertyOptions(o),l=typeof c.converter=="function"?{fromAttribute:c.converter}:((r=c.converter)==null?void 0:r.fromAttribute)!==void 0?c.converter:J;this._$Em=o,this[o]=l.fromAttribute(e,c.type)??((i=this._$Ej)==null?void 0:i.get(o))??null,this._$Em=null}}requestUpdate(t,e,s){var o;if(t!==void 0){const r=this.constructor,i=this[t];if(s??(s=r.getPropertyOptions(t)),!((s.hasChanged??pt)(i,e)||s.useDefault&&s.reflect&&i===((o=this._$Ej)==null?void 0:o.get(t))&&!this.hasAttribute(r._$Eu(t,s))))return;this.C(t,e,s)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(t,e,{useDefault:s,reflect:o,wrapped:r},i){s&&!(this._$Ej??(this._$Ej=new Map)).has(t)&&(this._$Ej.set(t,i??e??this[t]),r!==!0||i!==void 0)||(this._$AL.has(t)||(this.hasUpdated||s||(e=void 0),this._$AL.set(t,e)),o===!0&&this._$Em!==t&&(this._$Eq??(this._$Eq=new Set)).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}const t=this.scheduleUpdate();return t!=null&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var s;if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._$Ep){for(const[r,i]of this._$Ep)this[r]=i;this._$Ep=void 0}const o=this.constructor.elementProperties;if(o.size>0)for(const[r,i]of o){const{wrapped:c}=i,l=this[r];c!==!0||this._$AL.has(r)||l===void 0||this.C(r,void 0,i,l)}}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),(s=this._$EO)==null||s.forEach(o=>{var r;return(r=o.hostUpdate)==null?void 0:r.call(o)}),this.update(e)):this._$EM()}catch(o){throw t=!1,this._$EM(),o}t&&this._$AE(e)}willUpdate(t){}_$AE(t){var e;(e=this._$EO)==null||e.forEach(s=>{var o;return(o=s.hostUpdated)==null?void 0:o.call(s)}),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&(this._$Eq=this._$Eq.forEach(e=>this._$ET(e,this[e]))),this._$EM()}updated(t){}firstUpdated(t){}};T.elementStyles=[],T.shadowRootOptions={mode:"open"},T[R("elementProperties")]=new Map,T[R("finalized")]=new Map,st==null||st({ReactiveElement:T}),(C.reactiveElementVersions??(C.reactiveElementVersions=[])).push("2.1.0");/**
|
|
10
10
|
* @license
|
|
11
11
|
* Copyright 2017 Google LLC
|
|
12
12
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
13
|
-
*/const V=globalThis,Q=V.trustedTypes,mt=Q?Q.createPolicy("lit-html",{createHTML:n=>n}):void 0,Ct="$lit$",
|
|
14
|
-
\f\r]`,j=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,$t=/-->/g,wt=/>/g,
|
|
15
|
-
\f\r"'\`<>=]|("|')|))|$)`,"g"),xt=/'/g,_t=/"/g,Pt=/^(?:script|style|textarea|title)$/i,Rt=n=>(t,...e)=>({_$litType$:n,strings:t,values:e}),
|
|
13
|
+
*/const V=globalThis,Q=V.trustedTypes,mt=Q?Q.createPolicy("lit-html",{createHTML:n=>n}):void 0,Ct="$lit$",S=`lit$${Math.random().toFixed(9).slice(2)}$`,Lt="?"+S,Nt=`<${Lt}>`,B=document,F=()=>B.createComment(""),q=n=>n===null||typeof n!="object"&&typeof n!="function",ut=Array.isArray,jt=n=>ut(n)||typeof(n==null?void 0:n[Symbol.iterator])=="function",ot=`[
|
|
14
|
+
\f\r]`,j=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,$t=/-->/g,wt=/>/g,P=RegExp(`>|${ot}(?:([^\\s"'>=/]+)(${ot}*=${ot}*(?:[^
|
|
15
|
+
\f\r"'\`<>=]|("|')|))|$)`,"g"),xt=/'/g,_t=/"/g,Pt=/^(?:script|style|textarea|title)$/i,Rt=n=>(t,...e)=>({_$litType$:n,strings:t,values:e}),h=Rt(1),O=Symbol.for("lit-noChange"),d=Symbol.for("lit-nothing"),At=new WeakMap,k=B.createTreeWalker(B,129);function kt(n,t){if(!ut(n)||!n.hasOwnProperty("raw"))throw Error("invalid template strings array");return mt!==void 0?mt.createHTML(t):t}const Vt=(n,t)=>{const e=n.length-1,s=[];let o,r=t===2?"<svg>":t===3?"<math>":"",i=j;for(let c=0;c<e;c++){const l=n[c];let f,v,p=-1,w=0;for(;w<l.length&&(i.lastIndex=w,v=i.exec(l),v!==null);)w=i.lastIndex,i===j?v[1]==="!--"?i=$t:v[1]!==void 0?i=wt:v[2]!==void 0?(Pt.test(v[2])&&(o=RegExp("</"+v[2],"g")),i=P):v[3]!==void 0&&(i=P):i===P?v[0]===">"?(i=o??j,p=-1):v[1]===void 0?p=-2:(p=i.lastIndex-v[2].length,f=v[1],i=v[3]===void 0?P:v[3]==='"'?_t:xt):i===_t||i===xt?i=P:i===$t||i===wt?i=j:(i=P,o=void 0);const E=i===P&&n[c+1].startsWith("/>")?" ":"";r+=i===j?l+Nt:p>=0?(s.push(f),l.slice(0,p)+Ct+l.slice(p)+S+E):l+S+(p===-2?c:E)}return[kt(n,r+(n[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),s]};class Z{constructor({strings:t,_$litType$:e},s){let o;this.parts=[];let r=0,i=0;const c=t.length-1,l=this.parts,[f,v]=Vt(t,e);if(this.el=Z.createElement(f,s),k.currentNode=this.el.content,e===2||e===3){const p=this.el.content.firstChild;p.replaceWith(...p.childNodes)}for(;(o=k.nextNode())!==null&&l.length<c;){if(o.nodeType===1){if(o.hasAttributes())for(const p of o.getAttributeNames())if(p.endsWith(Ct)){const w=v[i++],E=o.getAttribute(p).split(S),K=/([.?@])?(.*)/.exec(w);l.push({type:1,index:r,name:K[2],strings:E,ctor:K[1]==="."?qt:K[1]==="?"?Zt:K[1]==="@"?Wt:Y}),o.removeAttribute(p)}else p.startsWith(S)&&(l.push({type:6,index:r}),o.removeAttribute(p));if(Pt.test(o.tagName)){const p=o.textContent.split(S),w=p.length-1;if(w>0){o.textContent=Q?Q.emptyScript:"";for(let E=0;E<w;E++)o.append(p[E],F()),k.nextNode(),l.push({type:2,index:++r});o.append(p[w],F())}}}else if(o.nodeType===8)if(o.data===Lt)l.push({type:2,index:r});else{let p=-1;for(;(p=o.data.indexOf(S,p+1))!==-1;)l.push({type:7,index:r}),p+=S.length-1}r++}}static createElement(t,e){const s=B.createElement("template");return s.innerHTML=t,s}}function D(n,t,e=n,s){var i,c;if(t===O)return t;let o=s!==void 0?(i=e._$Co)==null?void 0:i[s]:e._$Cl;const r=q(t)?void 0:t._$litDirective$;return(o==null?void 0:o.constructor)!==r&&((c=o==null?void 0:o._$AO)==null||c.call(o,!1),r===void 0?o=void 0:(o=new r(n),o._$AT(n,e,s)),s!==void 0?(e._$Co??(e._$Co=[]))[s]=o:e._$Cl=o),o!==void 0&&(t=D(n,o._$AS(n,t.values),o,s)),t}class Ft{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:s}=this._$AD,o=((t==null?void 0:t.creationScope)??B).importNode(e,!0);k.currentNode=o;let r=k.nextNode(),i=0,c=0,l=s[0];for(;l!==void 0;){if(i===l.index){let f;l.type===2?f=new G(r,r.nextSibling,this,t):l.type===1?f=new l.ctor(r,l.name,l.strings,this,t):l.type===6&&(f=new Gt(r,this,t)),this._$AV.push(f),l=s[++c]}i!==(l==null?void 0:l.index)&&(r=k.nextNode(),i++)}return k.currentNode=B,o}p(t){let e=0;for(const s of this._$AV)s!==void 0&&(s.strings!==void 0?(s._$AI(t,s,e),e+=s.strings.length-2):s._$AI(t[e])),e++}}class G{get _$AU(){var t;return((t=this._$AM)==null?void 0:t._$AU)??this._$Cv}constructor(t,e,s,o){this.type=2,this._$AH=d,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=s,this.options=o,this._$Cv=(o==null?void 0:o.isConnected)??!0}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return e!==void 0&&(t==null?void 0:t.nodeType)===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=D(this,t,e),q(t)?t===d||t==null||t===""?(this._$AH!==d&&this._$AR(),this._$AH=d):t!==this._$AH&&t!==O&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):jt(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==d&&q(this._$AH)?this._$AA.nextSibling.data=t:this.T(B.createTextNode(t)),this._$AH=t}$(t){var r;const{values:e,_$litType$:s}=t,o=typeof s=="number"?this._$AC(t):(s.el===void 0&&(s.el=Z.createElement(kt(s.h,s.h[0]),this.options)),s);if(((r=this._$AH)==null?void 0:r._$AD)===o)this._$AH.p(e);else{const i=new Ft(o,this),c=i.u(this.options);i.p(e),this.T(c),this._$AH=i}}_$AC(t){let e=At.get(t.strings);return e===void 0&&At.set(t.strings,e=new Z(t)),e}k(t){ut(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let s,o=0;for(const r of t)o===e.length?e.push(s=new G(this.O(F()),this.O(F()),this,this.options)):s=e[o],s._$AI(r),o++;o<e.length&&(this._$AR(s&&s._$AB.nextSibling,o),e.length=o)}_$AR(t=this._$AA.nextSibling,e){var s;for((s=this._$AP)==null?void 0:s.call(this,!1,!0,e);t&&t!==this._$AB;){const o=t.nextSibling;t.remove(),t=o}}setConnected(t){var e;this._$AM===void 0&&(this._$Cv=t,(e=this._$AP)==null||e.call(this,t))}}class Y{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,s,o,r){this.type=1,this._$AH=d,this._$AN=void 0,this.element=t,this.name=e,this._$AM=o,this.options=r,s.length>2||s[0]!==""||s[1]!==""?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=d}_$AI(t,e=this,s,o){const r=this.strings;let i=!1;if(r===void 0)t=D(this,t,e,0),i=!q(t)||t!==this._$AH&&t!==O,i&&(this._$AH=t);else{const c=t;let l,f;for(t=r[0],l=0;l<r.length-1;l++)f=D(this,c[s+l],e,l),f===O&&(f=this._$AH[l]),i||(i=!q(f)||f!==this._$AH[l]),f===d?t=d:t!==d&&(t+=(f??"")+r[l+1]),this._$AH[l]=f}i&&!o&&this.j(t)}j(t){t===d?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class qt extends Y{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===d?void 0:t}}class Zt extends Y{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==d)}}class Wt extends Y{constructor(t,e,s,o,r){super(t,e,s,o,r),this.type=5}_$AI(t,e=this){if((t=D(this,t,e,0)??d)===O)return;const s=this._$AH,o=t===d&&s!==d||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,r=t!==d&&(s===d||o);o&&this.element.removeEventListener(this.name,this,s),r&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e;typeof this._$AH=="function"?this._$AH.call(((e=this.options)==null?void 0:e.host)??this.element,t):this._$AH.handleEvent(t)}}class Gt{constructor(t,e,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){D(this,t)}}const it=V.litHtmlPolyfillSupport;it==null||it(Z,G),(V.litHtmlVersions??(V.litHtmlVersions=[])).push("3.3.0");const Kt=(n,t,e)=>{const s=(e==null?void 0:e.renderBefore)??t;let o=s._$litPart$;if(o===void 0){const r=(e==null?void 0:e.renderBefore)??null;s._$litPart$=o=new G(t.insertBefore(F(),r),r,void 0,e??{})}return o._$AI(n),o};/**
|
|
16
16
|
* @license
|
|
17
17
|
* Copyright 2017 Google LLC
|
|
18
18
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
19
|
-
*/const
|
|
19
|
+
*/const I=globalThis;let m=class extends T{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var e;const t=super.createRenderRoot();return(e=this.renderOptions).renderBefore??(e.renderBefore=t.firstChild),t}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=Kt(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),(t=this._$Do)==null||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this._$Do)==null||t.setConnected(!1)}render(){return O}};var Et;m._$litElement$=!0,m.finalized=!0,(Et=I.litElementHydrateSupport)==null||Et.call(I,{LitElement:m});const rt=I.litElementPolyfillSupport;rt==null||rt({LitElement:m});(I.litElementVersions??(I.litElementVersions=[])).push("4.2.0");/**
|
|
20
20
|
* @license
|
|
21
21
|
* Copyright 2017 Google LLC
|
|
22
22
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
23
|
-
*/const
|
|
23
|
+
*/const z=n=>(t,e)=>{e!==void 0?e.addInitializer(()=>{customElements.define(n,t)}):customElements.define(n,t)};/**
|
|
24
24
|
* @license
|
|
25
25
|
* Copyright 2017 Google LLC
|
|
26
26
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
27
|
-
*/const Xt={attribute:!0,type:String,converter:J,reflect:!1,hasChanged:pt},Jt=(n=Xt,t,e)=>{const{kind:
|
|
27
|
+
*/const Xt={attribute:!0,type:String,converter:J,reflect:!1,hasChanged:pt},Jt=(n=Xt,t,e)=>{const{kind:s,metadata:o}=e;let r=globalThis.litPropertyMetadata.get(o);if(r===void 0&&globalThis.litPropertyMetadata.set(o,r=new Map),s==="setter"&&((n=Object.create(n)).wrapped=!0),r.set(e.name,n),s==="accessor"){const{name:i}=e;return{set(c){const l=t.get.call(this);t.set.call(this,c),this.requestUpdate(i,l,n)},init(c){return c!==void 0&&this.C(i,void 0,n,c),c}}}if(s==="setter"){const{name:i}=e;return function(c){const l=this[i];t.call(this,c),this.requestUpdate(i,l,n)}}throw Error("Unsupported decorator location: "+s)};function a(n){return(t,e)=>typeof e=="object"?Jt(n,t,e):((s,o,r)=>{const i=o.hasOwnProperty(r);return o.constructor.createProperty(r,s),i?Object.getOwnPropertyDescriptor(o,r):void 0})(n,t,e)}/**
|
|
28
28
|
* @license
|
|
29
29
|
* Copyright 2017 Google LLC
|
|
30
30
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
@@ -44,19 +44,19 @@
|
|
|
44
44
|
* @license
|
|
45
45
|
* Copyright 2023 Google LLC
|
|
46
46
|
* SPDX-License-Identifier: Apache-2.0
|
|
47
|
-
*/function ee(n){n.addInitializer(t=>{const e=t;e.addEventListener("click",async
|
|
47
|
+
*/function ee(n){n.addInitializer(t=>{const e=t;e.addEventListener("click",async s=>{const{type:o,[ft]:r}=e,{form:i}=r;if(!(!i||o==="button")&&(await new Promise(c=>{setTimeout(c)}),!s.defaultPrevented)){if(o==="reset"){i.reset();return}i.addEventListener("submit",c=>{Object.defineProperty(c,"submitter",{configurable:!0,enumerable:!0,get:()=>e})},{capture:!0,once:!0}),r.setFormValue(e.value),i.requestSubmit()}})})}const ne=`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
48
48
|
<path d="M8 3.6275C7.06799 0.971489 3.25399 -0.0226278 1.67414 2.30983C0.0877404 4.65197 1.67414 6.99412 2.62598 8.33249C3.0147 8.87905 8 14 8 14C8 14 12.9853 8.87905 13.374 8.33249C14.3259 6.99412 15.9123 4.65197 14.3259 2.30983C12.746 -0.0226277 8.97167 0.971489 8 3.6275Z" stroke="#3F2B2E" stroke-linecap="round"/>
|
|
49
49
|
</svg>
|
|
50
|
-
`,
|
|
50
|
+
`,se=`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
51
51
|
<path d="M16 8L4 0V16L16 8Z" fill="#3F2B2E"/>
|
|
52
52
|
</svg>
|
|
53
|
-
`,
|
|
53
|
+
`,oe=`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
54
54
|
<path d="M12.2266 8.16162C11.0953 9.26599 8.72489 11.8788 5.11546 16L4.63062 15.7172C5.78886 13.4007 7.17607 10.8283 8.79223 8C7.17607 5.17172 5.78886 2.59933 4.63062 0.282827L5.11546 0C8.72489 4.12121 11.0953 6.73401 12.2266 7.83838V8.16162Z" fill="#3F2B2E"/>
|
|
55
55
|
</svg>
|
|
56
|
-
`,
|
|
56
|
+
`,ie=`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
57
57
|
<path d="M5 7.83838C6.02128 6.73401 8.16109 4.12121 11.4195 0L11.8571 0.282829C10.8116 2.59933 9.55927 5.17172 8.1003 8C9.55927 10.8283 10.8115 13.4007 11.8571 15.7172L11.4195 16C8.16109 11.8788 6.02128 9.266 5 8.16162L5 7.83838Z" fill="#3F2B2E"/>
|
|
58
58
|
</svg>
|
|
59
|
-
`,
|
|
59
|
+
`,re=`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
60
60
|
<path d="M12.2834 14.4585L7.98873 11.3928L3.69404 14.4585L5.33977 9.4972L1 6.39639H6.36554L8 1.4585L9.63446 6.39639H15L10.6602 9.4972L12.306 14.4585H12.2834ZM7.98873 10.328L10.6602 12.2353L9.64573 9.15787L12.2721 7.28568H9.02576L8 4.17317L6.97424 7.28568H3.72786L6.35427 9.15787L5.33977 12.2353L8.01127 10.328H7.98873Z" fill="#3F2B2E"/>
|
|
61
61
|
</svg>
|
|
62
62
|
`,ae=`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
@@ -83,54 +83,54 @@
|
|
|
83
83
|
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
|
84
84
|
viewBox="0 0 40 40" style="enable-background:new 0 0 40 40;" xml:space="preserve">
|
|
85
85
|
<style type="text/css">
|
|
86
|
-
.st0{fill:#
|
|
86
|
+
.st0{fill:#3F2B2E;}
|
|
87
87
|
</style>
|
|
88
|
-
<path class="st0" d="
|
|
89
|
-
|
|
88
|
+
<path class="st0" d="M40,20c0,0.7-0.6,1.2-1.2,1.2H21.2v17.5c0,0.7-0.6,1.2-1.2,1.2s-1.2-0.6-1.2-1.2V21.2H1.2C0.6,21.2,0,20.7,0,20
|
|
89
|
+
s0.6-1.2,1.2-1.2h17.5V1.2C18.8,0.6,19.3,0,20,0s1.2,0.6,1.2,1.2v17.5h17.5C39.4,18.8,40,19.3,40,20z"/>
|
|
90
90
|
</svg>
|
|
91
91
|
`,fe=`<?xml version="1.0" encoding="utf-8"?>
|
|
92
92
|
<!-- Generator: $$$/GeneralStr/196=Adobe Illustrator 27.6.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
|
93
93
|
<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
|
94
94
|
viewBox="0 0 40 40" style="enable-background:new 0 0 40 40;" xml:space="preserve">
|
|
95
95
|
<style type="text/css">
|
|
96
|
-
.st0{fill:#
|
|
96
|
+
.st0{fill:#3F2B2E;}
|
|
97
97
|
</style>
|
|
98
|
-
<path class="st0" d="
|
|
98
|
+
<path class="st0" d="M38.8,20.5H1.2c-0.7,0-1.2-0.6-1.2-1.2S0.6,18,1.2,18h37.5c0.7,0,1.2,0.6,1.2,1.2S39.4,20.5,38.8,20.5z"/>
|
|
99
99
|
</svg>
|
|
100
|
-
`,tt={wishlist:ne,playerv:
|
|
100
|
+
`,tt={wishlist:ne,playerv:se,chevronRight:oe,chevronLeft:ie,icoPlus:ue,icoMinus:fe,"star-0":re,"star-25":ae,"star-50":le,"star-75":ce,"star-100":he,cross:de,search:pe};/**
|
|
101
101
|
* @license
|
|
102
102
|
* Copyright 2017 Google LLC
|
|
103
103
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
104
|
-
*/const ve={CHILD:2},
|
|
104
|
+
*/const ve={CHILD:2},ge=n=>(...t)=>({_$litDirective$:n,values:t});class be{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,s){this._$Ct=t,this._$AM=e,this._$Ci=s}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}/**
|
|
105
105
|
* @license
|
|
106
106
|
* Copyright 2017 Google LLC
|
|
107
107
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
108
|
-
*/class lt extends
|
|
108
|
+
*/class lt extends be{constructor(t){if(super(t),this.it=d,t.type!==ve.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===d||t==null)return this._t=void 0,this.it=t;if(t===O)return t;if(typeof t!="string")throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this._t;this.it=t;const e=[t];return e.raw=e,this._t={_$litType$:this.constructor.resultType,strings:e,values:[]}}}lt.directiveName="unsafeHTML",lt.resultType=1;/**
|
|
109
109
|
* @license
|
|
110
110
|
* Copyright 2017 Google LLC
|
|
111
111
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
112
|
-
*/class ct extends lt{}ct.directiveName="unsafeSVG",ct.resultType=2;const W=
|
|
112
|
+
*/class ct extends lt{}ct.directiveName="unsafeSVG",ct.resultType=2;const W=ge(ct);var ye=Object.defineProperty,me=Object.getOwnPropertyDescriptor,b=(n,t,e,s)=>{for(var o=s>1?void 0:s?me(t,e):t,r=n.length-1,i;r>=0;r--)(i=n[r])&&(o=(s?i(t,e,o):i(o))||o);return s&&o&&ye(t,e,o),o};const $e=te(m);let u=class extends $e{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(n){this.setAttribute("name",n)}get form(){return this[ft].form}handleClick(){if(this.panelTarget){const n=document.getElementById(this.panelTarget);n!=null&&n.openPanel&&typeof n.openPanel=="function"?n.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(n){const t=n==="start"?this.startIconModel:this.endIconModel;if(!t)return d;const e=tt[t].replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return h`<span class="${n==="start"?"icon-start":"icon-end"}">${W(e)}</span>`}renderButton(){const n=this.text||this.textsecond;return h`
|
|
113
113
|
<button type=${this.type} class="button" ?disabled=${this.disabled} @click=${this.handleClick}>
|
|
114
|
-
${this.startIcon?this.renderIcon("start"):
|
|
115
|
-
${n?
|
|
116
|
-
${this.text?
|
|
117
|
-
${this.textsecond?
|
|
118
|
-
`:
|
|
119
|
-
${this.endIcon?this.renderIcon("end"):
|
|
114
|
+
${this.startIcon?this.renderIcon("start"):d}
|
|
115
|
+
${n?h`
|
|
116
|
+
${this.text?h`<span class="text">${this.text}</span>`:d}
|
|
117
|
+
${this.textsecond?h`<span class="text">${this.textsecond}</span>`:d}
|
|
118
|
+
`:h`<slot></slot>`}
|
|
119
|
+
${this.endIcon?this.renderIcon("end"):d}
|
|
120
120
|
</button>
|
|
121
|
-
`}renderLink(){const n=this.text||this.textsecond;return
|
|
121
|
+
`}renderLink(){const n=this.text||this.textsecond;return h`
|
|
122
122
|
<a
|
|
123
123
|
href=${this.href}
|
|
124
|
-
target=${this.target||
|
|
124
|
+
target=${this.target||d}
|
|
125
125
|
class="button"
|
|
126
126
|
?disabled=${this.disabled}
|
|
127
127
|
>
|
|
128
|
-
${this.startIcon?this.renderIcon("start"):
|
|
129
|
-
${n?
|
|
130
|
-
${this.text?
|
|
131
|
-
${this.textsecond?
|
|
132
|
-
`:
|
|
133
|
-
${this.endIcon?this.renderIcon("end"):
|
|
128
|
+
${this.startIcon?this.renderIcon("start"):d}
|
|
129
|
+
${n?h`
|
|
130
|
+
${this.text?h`<span>${this.text}</span>`:d}
|
|
131
|
+
${this.textsecond?h`<span>${this.textsecond}</span>`:d}
|
|
132
|
+
`:h`<slot></slot>`}
|
|
133
|
+
${this.endIcon?this.renderIcon("end"):d}
|
|
134
134
|
</a>
|
|
135
135
|
`}};ee(u);u.formAssociated=!0;u.styles=A`
|
|
136
136
|
:host {
|
|
@@ -289,7 +289,7 @@
|
|
|
289
289
|
transform: translateX(4px);
|
|
290
290
|
}
|
|
291
291
|
//End icon movment on hover
|
|
292
|
-
`;
|
|
292
|
+
`;b([a()],u.prototype,"type",2);b([a({reflect:!0})],u.prototype,"value",2);b([a({type:String,reflect:!0})],u.prototype,"variant",2);b([a({type:String})],u.prototype,"text",2);b([a({type:String})],u.prototype,"textsecond",2);b([a({type:Boolean,reflect:!0})],u.prototype,"fullwidth",2);b([a({type:Boolean,reflect:!0})],u.prototype,"disabled",2);b([a({type:String,reflect:!0})],u.prototype,"startIconModel",2);b([a({type:String,reflect:!0})],u.prototype,"endIconModel",2);b([a({type:Boolean,reflect:!0,attribute:"starticon"})],u.prototype,"startIcon",2);b([a({type:Boolean,reflect:!0,attribute:"endicon"})],u.prototype,"endIcon",2);b([a({type:String,attribute:"paneltarget",reflect:!0})],u.prototype,"panelTarget",2);b([a({type:String})],u.prototype,"href",2);b([a({type:String})],u.prototype,"target",2);u=b([z("o-button")],u);var we=Object.defineProperty,xe=Object.getOwnPropertyDescriptor,et=(n,t,e,s)=>{for(var o=s>1?void 0:s?xe(t,e):t,r=n.length-1,i;r>=0;r--)(i=n[r])&&(o=(s?i(t,e,o):i(o))||o);return s&&o&&we(t,e,o),o};let U=class extends m{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(n){(n.key==="Enter"||n.key===" ")&&(n.preventDefault(),this.toggleStatus())}render(){const n=tt.wishlist.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return h`
|
|
293
293
|
<button type="button" aria-describedby="${this.ariaDescribedBy}" class="wishlist-button">
|
|
294
294
|
<span class="sr-only">${this.label}</span>
|
|
295
295
|
${W(n)}
|
|
@@ -353,12 +353,12 @@
|
|
|
353
353
|
width: 0.1rem !important;
|
|
354
354
|
white-space: nowrap !important;
|
|
355
355
|
}
|
|
356
|
-
`;et([a({type:String,reflect:!0})],U.prototype,"status",2);et([a({type:String,reflect:!0})],U.prototype,"ariaDescribedBy",2);et([a({type:String,reflect:!0})],U.prototype,"label",2);U=et([
|
|
357
|
-
${this.type==="span"?
|
|
356
|
+
`;et([a({type:String,reflect:!0})],U.prototype,"status",2);et([a({type:String,reflect:!0})],U.prototype,"ariaDescribedBy",2);et([a({type:String,reflect:!0})],U.prototype,"label",2);U=et([z("o-wishlist-button")],U);var _e=Object.defineProperty,Ae=Object.getOwnPropertyDescriptor,L=(n,t,e,s)=>{for(var o=s>1?void 0:s?Ae(t,e):t,r=n.length-1,i;r>=0;r--)(i=n[r])&&(o=(s?i(t,e,o):i(o))||o);return s&&o&&_e(t,e,o),o};let $=class extends m{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}updated(n){super.updated(n),this.style.setProperty("--icon-stroke-width",this.strokewidth)}render(){const n=tt[this.icon]??"",t=`icon-${this.icon}`,e=n.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return h`
|
|
357
|
+
${this.type==="span"?h`
|
|
358
358
|
<span class="icon icon-button ${this.size} ${this.bgstyle} ${this.status} ${t}" ?disabled="${this.disabled}">
|
|
359
359
|
${W(e)}
|
|
360
360
|
</span>
|
|
361
|
-
`:
|
|
361
|
+
`:h`
|
|
362
362
|
<button
|
|
363
363
|
type="button"
|
|
364
364
|
aria-label="icon"
|
|
@@ -386,10 +386,12 @@
|
|
|
386
386
|
cursor: pointer;
|
|
387
387
|
position: relative;
|
|
388
388
|
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
389
|
+
&[icon="wishlist"] {
|
|
390
|
+
svg {
|
|
391
|
+
path {
|
|
392
|
+
stroke: var(--color-content-action-secondary);
|
|
393
|
+
stroke-width: var(--icon-stroke-width, 1);
|
|
394
|
+
}
|
|
393
395
|
}
|
|
394
396
|
}
|
|
395
397
|
}
|
|
@@ -398,19 +400,52 @@
|
|
|
398
400
|
fill: var(--color-content-action-secondary);
|
|
399
401
|
}
|
|
400
402
|
|
|
401
|
-
.icon-button.
|
|
403
|
+
.icon-button.smallxs {
|
|
402
404
|
width: 20px;
|
|
403
405
|
height: 20px;
|
|
406
|
+
|
|
407
|
+
&:not(.icon-wishlist) {
|
|
408
|
+
svg {
|
|
409
|
+
width: 8px;
|
|
410
|
+
height: 8px;
|
|
411
|
+
}
|
|
412
|
+
}
|
|
404
413
|
}
|
|
405
414
|
|
|
406
|
-
.icon-button.
|
|
415
|
+
.icon-button.small {
|
|
407
416
|
width: 32px;
|
|
408
417
|
height: 32px;
|
|
418
|
+
|
|
419
|
+
&:not(.icon-wishlist) {
|
|
420
|
+
svg {
|
|
421
|
+
width: 16px;
|
|
422
|
+
height: 16px;
|
|
423
|
+
}
|
|
424
|
+
}
|
|
425
|
+
}
|
|
426
|
+
|
|
427
|
+
.icon-button.medium {
|
|
428
|
+
width: 40px;
|
|
429
|
+
height: 40px;
|
|
430
|
+
|
|
431
|
+
&:not(.icon-wishlist) {
|
|
432
|
+
svg {
|
|
433
|
+
width: 16px;
|
|
434
|
+
height: 16px;
|
|
435
|
+
}
|
|
436
|
+
}
|
|
409
437
|
}
|
|
410
438
|
|
|
411
439
|
.icon-button.large {
|
|
412
440
|
width: 40px;
|
|
413
441
|
height: 40px;
|
|
442
|
+
|
|
443
|
+
&:not(.icon-wishlist) {
|
|
444
|
+
svg {
|
|
445
|
+
width: 24px;
|
|
446
|
+
height: 24px;
|
|
447
|
+
}
|
|
448
|
+
}
|
|
414
449
|
}
|
|
415
450
|
|
|
416
451
|
.icon-button.none-light, .icon-button.none-contrast {
|
|
@@ -418,13 +453,20 @@
|
|
|
418
453
|
width: auto;
|
|
419
454
|
height: auto;
|
|
420
455
|
|
|
421
|
-
&.
|
|
456
|
+
&.smallxs {
|
|
422
457
|
svg {
|
|
423
458
|
width: 8px;
|
|
424
459
|
height: 8px;
|
|
425
460
|
}
|
|
426
461
|
}
|
|
427
462
|
|
|
463
|
+
&.small {
|
|
464
|
+
svg {
|
|
465
|
+
width: 16px;
|
|
466
|
+
height: 16px;
|
|
467
|
+
}
|
|
468
|
+
}
|
|
469
|
+
|
|
428
470
|
&.medium {
|
|
429
471
|
svg {
|
|
430
472
|
width: 16px;
|
|
@@ -525,9 +567,9 @@
|
|
|
525
567
|
}
|
|
526
568
|
|
|
527
569
|
}
|
|
528
|
-
`;L([a({type:String,reflect:!0})],$.prototype,"bgstyle",2);L([a({type:String,reflect:!0})],$.prototype,"size",2);L([a({type:String,reflect:!0})],$.prototype,"status",2);L([a({type:String,reflect:!0})],$.prototype,"type",2);L([a({type:String})],$.prototype,"strokewidth",2);L([a({type:String})],$.prototype,"icon",2);L([a({type:Boolean,reflect:!0})],$.prototype,"disabled",2);$=L([
|
|
570
|
+
`;L([a({type:String,reflect:!0})],$.prototype,"bgstyle",2);L([a({type:String,reflect:!0})],$.prototype,"size",2);L([a({type:String,reflect:!0})],$.prototype,"status",2);L([a({type:String,reflect:!0})],$.prototype,"type",2);L([a({type:String})],$.prototype,"strokewidth",2);L([a({type:String})],$.prototype,"icon",2);L([a({type:Boolean,reflect:!0})],$.prototype,"disabled",2);$=L([z("o-icon-button")],$);var Ee=Object.defineProperty,Se=Object.getOwnPropertyDescriptor,M=(n,t,e,s)=>{for(var o=s>1?void 0:s?Se(t,e):t,r=n.length-1,i;r>=0;r--)(i=n[r])&&(o=(s?i(t,e,o):i(o))||o);return s&&o&&Ee(t,e,o),o};let x=class extends m{constructor(){super(...arguments),this.href="",this.target="",this.template="standard",this.inverse=!1,this.endIcon=!1,this.reverseEndIcon=!1}render(){return h`
|
|
529
571
|
<a href="${this.href}" target="${this.target}">
|
|
530
|
-
${this.endIcon&&this.reverseEndIcon?
|
|
572
|
+
${this.endIcon&&this.reverseEndIcon?h`
|
|
531
573
|
<o-icon-button
|
|
532
574
|
icon="chevronLeft"
|
|
533
575
|
bgstyle="${this.inverse?"none-light":"none-contrast"}"
|
|
@@ -537,7 +579,7 @@
|
|
|
537
579
|
></o-icon-button>
|
|
538
580
|
`:null}
|
|
539
581
|
<span class="link-text"><slot></slot></span>
|
|
540
|
-
${this.endIcon&&!this.reverseEndIcon?
|
|
582
|
+
${this.endIcon&&!this.reverseEndIcon?h`
|
|
541
583
|
<o-icon-button
|
|
542
584
|
icon="chevronRight"
|
|
543
585
|
bgstyle="${this.inverse?"none-light":"none-contrast"}"
|
|
@@ -547,7 +589,7 @@
|
|
|
547
589
|
></o-icon-button>
|
|
548
590
|
`:null}
|
|
549
591
|
</a>
|
|
550
|
-
`}};
|
|
592
|
+
`}};x.styles=A`
|
|
551
593
|
:host([template="standard"]) a {
|
|
552
594
|
color: var(--color-content-action-secondary);
|
|
553
595
|
font-size: var(--font-size-200);
|
|
@@ -634,12 +676,12 @@
|
|
|
634
676
|
height: 1px;
|
|
635
677
|
}
|
|
636
678
|
/* End of underline effect */
|
|
637
|
-
`;
|
|
679
|
+
`;M([a({type:String})],x.prototype,"href",2);M([a({type:String})],x.prototype,"target",2);M([a({type:String,reflect:!0})],x.prototype,"template",2);M([a({type:Boolean,reflect:!0})],x.prototype,"inverse",2);M([a({type:Boolean,reflect:!0})],x.prototype,"endIcon",2);M([a({type:Boolean,reflect:!0})],x.prototype,"reverseEndIcon",2);x=M([z("o-link")],x);var Ce=Object.defineProperty,Le=Object.getOwnPropertyDescriptor,nt=(n,t,e,s)=>{for(var o=s>1?void 0:s?Le(t,e):t,r=n.length-1,i;r>=0;r--)(i=n[r])&&(o=(s?i(t,e,o):i(o))||o);return s&&o&&Ce(t,e,o),o};let N=class extends m{constructor(){super(...arguments),this.rating=0}getStarKeys(){const n=[];for(let t=0;t<5;t++){const e=this.rating-t;let s;e>=1?s=100:e<=0?s=0:s=Math.round(e*100/25)*25,n.push(`star-${s}`)}return n}render(){const n=this.getStarKeys();return h`
|
|
638
680
|
<div class="rating">
|
|
639
681
|
<div class="stars">
|
|
640
|
-
${n.map(t=>
|
|
682
|
+
${n.map(t=>h`<span class="star">${W(tt[t]??"")}</span>`)}
|
|
641
683
|
</div>
|
|
642
|
-
${this.reviewCount!=null&&this.href!=null?
|
|
684
|
+
${this.reviewCount!=null&&this.href!=null?h`<o-link template="review" href="${this.href}">${this.reviewCount}</o-link>`:null}
|
|
643
685
|
</div>
|
|
644
686
|
`}};N.styles=A`
|
|
645
687
|
svg {
|
|
@@ -674,7 +716,7 @@
|
|
|
674
716
|
text-decoration: underline;
|
|
675
717
|
cursor: pointer;
|
|
676
718
|
}
|
|
677
|
-
`;nt([a({type:Number})],N.prototype,"rating",2);nt([a({type:String})],N.prototype,"reviewCount",2);nt([a({type:String})],N.prototype,"href",2);N=nt([
|
|
719
|
+
`;nt([a({type:Number})],N.prototype,"rating",2);nt([a({type:String})],N.prototype,"reviewCount",2);nt([a({type:String})],N.prototype,"href",2);N=nt([z("o-rating")],N);var Pe=Object.defineProperty,ke=Object.getOwnPropertyDescriptor,y=(n,t,e,s)=>{for(var o=s>1?void 0:s?ke(t,e):t,r=n.length-1,i;r>=0;r--)(i=n[r])&&(o=(s?i(t,e,o):i(o))||o);return s&&o&&Pe(t,e,o),o};let g=class extends m{constructor(){super(...arguments),this.open=!1,this.showHeader=!0,this.showFooter=!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.previousFocusedElement=null,this.handleKeyDown=n=>{this.open&&(n.key==="Escape"?this.closePanel():n.key==="Tab"&&this.trapFocus(n))}}connectedCallback(){super.connectedCallback(),!this.disablePortal&&this.parentElement!==document.body&&document.body.appendChild(this),window.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),window.removeEventListener("keydown",this.handleKeyDown),super.disconnectedCallback()}trapFocus(n){const t=this.getFocusableElements();if(t.length===0)return;const e=t[0],s=t[t.length-1];n.shiftKey&&document.activeElement===e?(n.preventDefault(),s.focus()):!n.shiftKey&&document.activeElement===s&&(n.preventDefault(),e.focus())}getFocusableElements(){const n=this.renderRoot.querySelector(".panel");return n?Array.from(n.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 n=this.getFocusableElements()[0];n==null||n.focus()})}closePanel(){var n;this.open=!1,document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),(n=this.previousFocusedElement)==null||n.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 h`
|
|
678
720
|
<div class="overlay" style="z-index: ${this.zIndex}" @click=${this.closePanel}></div>
|
|
679
721
|
<div
|
|
680
722
|
class="panel"
|
|
@@ -685,7 +727,7 @@
|
|
|
685
727
|
>
|
|
686
728
|
<o-icon-button icon="cross" size="medium" class="close-btn" @click=${this.closePanel} aria-label="${this.closeButtonLabel}"></o-icon-button>
|
|
687
729
|
|
|
688
|
-
${this.showHeader?
|
|
730
|
+
${this.showHeader?h`
|
|
689
731
|
<div class="header">
|
|
690
732
|
<span id="panel-title" class="panel-title">${this.headerTitle}</span>
|
|
691
733
|
</div>
|
|
@@ -695,9 +737,9 @@
|
|
|
695
737
|
<slot></slot>
|
|
696
738
|
</div>
|
|
697
739
|
|
|
698
|
-
${this.showFooter?
|
|
740
|
+
${this.showFooter?h`
|
|
699
741
|
<div class="footer">
|
|
700
|
-
${this.firstButtonVariant&&this.firstButtonLabel?
|
|
742
|
+
${this.firstButtonVariant&&this.firstButtonLabel?h`
|
|
701
743
|
<o-button
|
|
702
744
|
variant="${this.firstButtonVariant}"
|
|
703
745
|
@click=${this.handleFirstClick}
|
|
@@ -706,7 +748,7 @@
|
|
|
706
748
|
</o-button>
|
|
707
749
|
`:null}
|
|
708
750
|
|
|
709
|
-
${this.secondaryButtonVariant&&this.secondaryButtonLabel?
|
|
751
|
+
${this.secondaryButtonVariant&&this.secondaryButtonLabel?h`
|
|
710
752
|
<o-button
|
|
711
753
|
variant="${this.secondaryButtonVariant}"
|
|
712
754
|
@click=${this.handleSecondaryClick}
|
|
@@ -717,7 +759,7 @@
|
|
|
717
759
|
</div>
|
|
718
760
|
`:null}
|
|
719
761
|
</div>
|
|
720
|
-
`}};
|
|
762
|
+
`}};g.styles=A`
|
|
721
763
|
:host {
|
|
722
764
|
--z-overlay: 99;
|
|
723
765
|
--z-panel: 100;
|
|
@@ -814,26 +856,35 @@
|
|
|
814
856
|
max-width: none;
|
|
815
857
|
}
|
|
816
858
|
}
|
|
817
|
-
`;y([a({type:Boolean,reflect:!0})],
|
|
859
|
+
`;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: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);g=y([z("o-side-panel")],g);var Ie=Object.defineProperty,Be=Object.getOwnPropertyDescriptor,H=(n,t,e,s)=>{for(var o=s>1?void 0:s?Be(t,e):t,r=n.length-1,i;r>=0;r--)(i=n[r])&&(o=(s?i(t,e,o):i(o))||o);return s&&o&&Ie(t,e,o),o};let _=class extends m{constructor(){super(...arguments),this.thumbnails=[],this.activeIndex=0,this.disabledIndexes=[],this.maxWidth="100%",this.focusedIndex=0,this.playerIconTemplate=h`
|
|
860
|
+
<o-icon-button
|
|
861
|
+
icon="playerv"
|
|
862
|
+
size="medium"
|
|
863
|
+
bgstyle="background-light"
|
|
864
|
+
type="span"
|
|
865
|
+
status="filled"
|
|
866
|
+
strokewidth="1.5"
|
|
867
|
+
></o-icon-button>
|
|
868
|
+
`}handleKeyDown(n){n.key==="ArrowRight"?(n.preventDefault(),this.focusNext()):n.key==="ArrowLeft"?(n.preventDefault(),this.focusPrevious()):(n.key==="Enter"||n.key===" ")&&(n.preventDefault(),this.selectThumbnail(this.focusedIndex))}focusNext(){let n=this.focusedIndex+1;for(;this.disabledIndexes.includes(n)&&n<this.thumbnails.length;)n++;n<this.thumbnails.length&&(this.focusedIndex=n,this.focusThumbnail(n))}focusPrevious(){let n=this.focusedIndex-1;for(;this.disabledIndexes.includes(n)&&n>=0;)n--;n>=0&&(this.focusedIndex=n,this.focusThumbnail(n))}focusThumbnail(n){const t=this.renderRoot.querySelector(`[data-index="${n}"]`);t==null||t.focus()}selectThumbnail(n){this.disabledIndexes.includes(n)||(this.activeIndex=n,this.swiperInstance&&typeof this.swiperInstance.slideTo=="function"&&this.swiperInstance.slideTo(n),this.dispatchEvent(new CustomEvent("thumbnail-select",{detail:{index:n}})))}render(){return h`
|
|
818
869
|
<div class="scroll-container" style="max-width: ${this.maxWidth};">
|
|
819
|
-
${this.thumbnails.map((n,t)=>{const e=this.disabledIndexes.includes(t),
|
|
870
|
+
${this.thumbnails.map((n,t)=>{const e=this.disabledIndexes.includes(t),s=this.activeIndex===t,o=n.type==="video";return h`
|
|
820
871
|
<div class="thumb-wrapper">
|
|
821
872
|
<button
|
|
822
873
|
class="thumb"
|
|
823
874
|
data-index="${t}"
|
|
824
875
|
?disabled=${e}
|
|
825
|
-
aria-selected=${
|
|
876
|
+
aria-selected=${s}
|
|
826
877
|
tabindex="${this.focusedIndex===t?0:-1}"
|
|
827
878
|
@click=${()=>this.selectThumbnail(t)}
|
|
828
879
|
@keydown=${this.handleKeyDown}
|
|
829
880
|
>
|
|
830
881
|
<img src="${n.src}" />
|
|
831
882
|
</button>
|
|
832
|
-
${
|
|
883
|
+
${o?h`<div class="play-icon-wrapper">${this.playerIconTemplate}</div>`:null}
|
|
833
884
|
</div>
|
|
834
885
|
`})}
|
|
835
886
|
</div>
|
|
836
|
-
`}};
|
|
887
|
+
`}};_.styles=A`
|
|
837
888
|
:host {
|
|
838
889
|
display: flex;
|
|
839
890
|
gap: 5px;
|
|
@@ -936,4 +987,4 @@
|
|
|
936
987
|
height: 0;
|
|
937
988
|
width: 0;
|
|
938
989
|
}
|
|
939
|
-
`;
|
|
990
|
+
`;H([a({type:Array})],_.prototype,"thumbnails",2);H([a({type:Number})],_.prototype,"activeIndex",2);H([a({type:Array})],_.prototype,"disabledIndexes",2);H([a({type:String})],_.prototype,"maxWidth",2);H([a({type:Object})],_.prototype,"swiperInstance",2);H([Qt()],_.prototype,"focusedIndex",2);_=H([z("thumbnail-navigation")],_);
|