@florid-kit/components 0.4.5 → 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 +116 -64
- package/index.mjs +416 -367
- 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:s,metadata:o}=e;let
|
|
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,7 +44,7 @@
|
|
|
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 s=>{const{type:o,[ft]:
|
|
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">
|
|
@@ -53,10 +53,10 @@
|
|
|
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:se,chevronRight:oe,chevronLeft:
|
|
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 {
|
|
@@ -221,7 +221,8 @@
|
|
|
221
221
|
font-weight: var(--font-weight-400);
|
|
222
222
|
line-height: var(--line-height-200);
|
|
223
223
|
min-width: 64px;
|
|
224
|
-
padding: var(--button-padding);
|
|
224
|
+
padding: var(--button-padding);
|
|
225
|
+
text-decoration: none;
|
|
225
226
|
cursor: inherit;
|
|
226
227
|
box-sizing: border-box;
|
|
227
228
|
|
|
@@ -288,7 +289,7 @@
|
|
|
288
289
|
transform: translateX(4px);
|
|
289
290
|
}
|
|
290
291
|
//End icon movment on hover
|
|
291
|
-
`;
|
|
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`
|
|
292
293
|
<button type="button" aria-describedby="${this.ariaDescribedBy}" class="wishlist-button">
|
|
293
294
|
<span class="sr-only">${this.label}</span>
|
|
294
295
|
${W(n)}
|
|
@@ -352,12 +353,12 @@
|
|
|
352
353
|
width: 0.1rem !important;
|
|
353
354
|
white-space: nowrap !important;
|
|
354
355
|
}
|
|
355
|
-
`;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([
|
|
356
|
-
${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`
|
|
357
358
|
<span class="icon icon-button ${this.size} ${this.bgstyle} ${this.status} ${t}" ?disabled="${this.disabled}">
|
|
358
359
|
${W(e)}
|
|
359
360
|
</span>
|
|
360
|
-
`:
|
|
361
|
+
`:h`
|
|
361
362
|
<button
|
|
362
363
|
type="button"
|
|
363
364
|
aria-label="icon"
|
|
@@ -385,10 +386,12 @@
|
|
|
385
386
|
cursor: pointer;
|
|
386
387
|
position: relative;
|
|
387
388
|
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
389
|
+
&[icon="wishlist"] {
|
|
390
|
+
svg {
|
|
391
|
+
path {
|
|
392
|
+
stroke: var(--color-content-action-secondary);
|
|
393
|
+
stroke-width: var(--icon-stroke-width, 1);
|
|
394
|
+
}
|
|
392
395
|
}
|
|
393
396
|
}
|
|
394
397
|
}
|
|
@@ -397,19 +400,52 @@
|
|
|
397
400
|
fill: var(--color-content-action-secondary);
|
|
398
401
|
}
|
|
399
402
|
|
|
400
|
-
.icon-button.
|
|
403
|
+
.icon-button.smallxs {
|
|
401
404
|
width: 20px;
|
|
402
405
|
height: 20px;
|
|
406
|
+
|
|
407
|
+
&:not(.icon-wishlist) {
|
|
408
|
+
svg {
|
|
409
|
+
width: 8px;
|
|
410
|
+
height: 8px;
|
|
411
|
+
}
|
|
412
|
+
}
|
|
403
413
|
}
|
|
404
414
|
|
|
405
|
-
.icon-button.
|
|
415
|
+
.icon-button.small {
|
|
406
416
|
width: 32px;
|
|
407
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
|
+
}
|
|
408
437
|
}
|
|
409
438
|
|
|
410
439
|
.icon-button.large {
|
|
411
440
|
width: 40px;
|
|
412
441
|
height: 40px;
|
|
442
|
+
|
|
443
|
+
&:not(.icon-wishlist) {
|
|
444
|
+
svg {
|
|
445
|
+
width: 24px;
|
|
446
|
+
height: 24px;
|
|
447
|
+
}
|
|
448
|
+
}
|
|
413
449
|
}
|
|
414
450
|
|
|
415
451
|
.icon-button.none-light, .icon-button.none-contrast {
|
|
@@ -417,13 +453,20 @@
|
|
|
417
453
|
width: auto;
|
|
418
454
|
height: auto;
|
|
419
455
|
|
|
420
|
-
&.
|
|
456
|
+
&.smallxs {
|
|
421
457
|
svg {
|
|
422
458
|
width: 8px;
|
|
423
459
|
height: 8px;
|
|
424
460
|
}
|
|
425
461
|
}
|
|
426
462
|
|
|
463
|
+
&.small {
|
|
464
|
+
svg {
|
|
465
|
+
width: 16px;
|
|
466
|
+
height: 16px;
|
|
467
|
+
}
|
|
468
|
+
}
|
|
469
|
+
|
|
427
470
|
&.medium {
|
|
428
471
|
svg {
|
|
429
472
|
width: 16px;
|
|
@@ -524,9 +567,9 @@
|
|
|
524
567
|
}
|
|
525
568
|
|
|
526
569
|
}
|
|
527
|
-
`;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`
|
|
528
571
|
<a href="${this.href}" target="${this.target}">
|
|
529
|
-
${this.endIcon&&this.reverseEndIcon?
|
|
572
|
+
${this.endIcon&&this.reverseEndIcon?h`
|
|
530
573
|
<o-icon-button
|
|
531
574
|
icon="chevronLeft"
|
|
532
575
|
bgstyle="${this.inverse?"none-light":"none-contrast"}"
|
|
@@ -536,7 +579,7 @@
|
|
|
536
579
|
></o-icon-button>
|
|
537
580
|
`:null}
|
|
538
581
|
<span class="link-text"><slot></slot></span>
|
|
539
|
-
${this.endIcon&&!this.reverseEndIcon?
|
|
582
|
+
${this.endIcon&&!this.reverseEndIcon?h`
|
|
540
583
|
<o-icon-button
|
|
541
584
|
icon="chevronRight"
|
|
542
585
|
bgstyle="${this.inverse?"none-light":"none-contrast"}"
|
|
@@ -546,7 +589,7 @@
|
|
|
546
589
|
></o-icon-button>
|
|
547
590
|
`:null}
|
|
548
591
|
</a>
|
|
549
|
-
`}};
|
|
592
|
+
`}};x.styles=A`
|
|
550
593
|
:host([template="standard"]) a {
|
|
551
594
|
color: var(--color-content-action-secondary);
|
|
552
595
|
font-size: var(--font-size-200);
|
|
@@ -633,12 +676,12 @@
|
|
|
633
676
|
height: 1px;
|
|
634
677
|
}
|
|
635
678
|
/* End of underline effect */
|
|
636
|
-
`;
|
|
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`
|
|
637
680
|
<div class="rating">
|
|
638
681
|
<div class="stars">
|
|
639
|
-
${n.map(t=>
|
|
682
|
+
${n.map(t=>h`<span class="star">${W(tt[t]??"")}</span>`)}
|
|
640
683
|
</div>
|
|
641
|
-
${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}
|
|
642
685
|
</div>
|
|
643
686
|
`}};N.styles=A`
|
|
644
687
|
svg {
|
|
@@ -673,7 +716,7 @@
|
|
|
673
716
|
text-decoration: underline;
|
|
674
717
|
cursor: pointer;
|
|
675
718
|
}
|
|
676
|
-
`;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`
|
|
677
720
|
<div class="overlay" style="z-index: ${this.zIndex}" @click=${this.closePanel}></div>
|
|
678
721
|
<div
|
|
679
722
|
class="panel"
|
|
@@ -684,7 +727,7 @@
|
|
|
684
727
|
>
|
|
685
728
|
<o-icon-button icon="cross" size="medium" class="close-btn" @click=${this.closePanel} aria-label="${this.closeButtonLabel}"></o-icon-button>
|
|
686
729
|
|
|
687
|
-
${this.showHeader?
|
|
730
|
+
${this.showHeader?h`
|
|
688
731
|
<div class="header">
|
|
689
732
|
<span id="panel-title" class="panel-title">${this.headerTitle}</span>
|
|
690
733
|
</div>
|
|
@@ -694,9 +737,9 @@
|
|
|
694
737
|
<slot></slot>
|
|
695
738
|
</div>
|
|
696
739
|
|
|
697
|
-
${this.showFooter?
|
|
740
|
+
${this.showFooter?h`
|
|
698
741
|
<div class="footer">
|
|
699
|
-
${this.firstButtonVariant&&this.firstButtonLabel?
|
|
742
|
+
${this.firstButtonVariant&&this.firstButtonLabel?h`
|
|
700
743
|
<o-button
|
|
701
744
|
variant="${this.firstButtonVariant}"
|
|
702
745
|
@click=${this.handleFirstClick}
|
|
@@ -705,7 +748,7 @@
|
|
|
705
748
|
</o-button>
|
|
706
749
|
`:null}
|
|
707
750
|
|
|
708
|
-
${this.secondaryButtonVariant&&this.secondaryButtonLabel?
|
|
751
|
+
${this.secondaryButtonVariant&&this.secondaryButtonLabel?h`
|
|
709
752
|
<o-button
|
|
710
753
|
variant="${this.secondaryButtonVariant}"
|
|
711
754
|
@click=${this.handleSecondaryClick}
|
|
@@ -716,7 +759,7 @@
|
|
|
716
759
|
</div>
|
|
717
760
|
`:null}
|
|
718
761
|
</div>
|
|
719
|
-
`}};
|
|
762
|
+
`}};g.styles=A`
|
|
720
763
|
:host {
|
|
721
764
|
--z-overlay: 99;
|
|
722
765
|
--z-panel: 100;
|
|
@@ -813,9 +856,18 @@
|
|
|
813
856
|
max-width: none;
|
|
814
857
|
}
|
|
815
858
|
}
|
|
816
|
-
`;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`
|
|
817
869
|
<div class="scroll-container" style="max-width: ${this.maxWidth};">
|
|
818
|
-
${this.thumbnails.map((n,t)=>{const e=this.disabledIndexes.includes(t),s=this.activeIndex===t,o=n.type==="video";return
|
|
870
|
+
${this.thumbnails.map((n,t)=>{const e=this.disabledIndexes.includes(t),s=this.activeIndex===t,o=n.type==="video";return h`
|
|
819
871
|
<div class="thumb-wrapper">
|
|
820
872
|
<button
|
|
821
873
|
class="thumb"
|
|
@@ -828,11 +880,11 @@
|
|
|
828
880
|
>
|
|
829
881
|
<img src="${n.src}" />
|
|
830
882
|
</button>
|
|
831
|
-
${o?
|
|
883
|
+
${o?h`<div class="play-icon-wrapper">${this.playerIconTemplate}</div>`:null}
|
|
832
884
|
</div>
|
|
833
885
|
`})}
|
|
834
886
|
</div>
|
|
835
|
-
`}};
|
|
887
|
+
`}};_.styles=A`
|
|
836
888
|
:host {
|
|
837
889
|
display: flex;
|
|
838
890
|
gap: 5px;
|
|
@@ -935,4 +987,4 @@
|
|
|
935
987
|
height: 0;
|
|
936
988
|
width: 0;
|
|
937
989
|
}
|
|
938
|
-
`;
|
|
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")],_);
|