@florid-kit/components 0.4.0 → 0.4.1
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/side-panel.d.ts +2 -0
- package/index.js +22 -18
- package/index.mjs +48 -38
- package/package.json +1 -1
|
@@ -13,6 +13,7 @@ export declare class OccitaneSidePanel extends LitElement {
|
|
|
13
13
|
secondaryButtonVariant: string;
|
|
14
14
|
onSecondaryButtonClick?: () => void;
|
|
15
15
|
disablePortal: boolean;
|
|
16
|
+
zIndex: number;
|
|
16
17
|
private previousFocusedElement;
|
|
17
18
|
static styles: import('lit').CSSResult;
|
|
18
19
|
connectedCallback(): void;
|
|
@@ -24,6 +25,7 @@ export declare class OccitaneSidePanel extends LitElement {
|
|
|
24
25
|
closePanel(): void;
|
|
25
26
|
private handleFirstClick;
|
|
26
27
|
private handleSecondaryClick;
|
|
28
|
+
protected updated(): void;
|
|
27
29
|
protected render(): import('lit').TemplateResult<1>;
|
|
28
30
|
}
|
|
29
31
|
declare global {
|
package/index.js
CHANGED
|
@@ -6,17 +6,17 @@
|
|
|
6
6
|
* @license
|
|
7
7
|
* Copyright 2017 Google LLC
|
|
8
8
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
9
|
-
*/const{is:Ot,defineProperty:Mt,getOwnPropertyDescriptor:Ht,getOwnPropertyNames:
|
|
9
|
+
*/const{is:Ot,defineProperty:Mt,getOwnPropertyDescriptor:Ht,getOwnPropertyNames:zt,getOwnPropertySymbols:Tt,getPrototypeOf:Dt}=Object,C=globalThis,gt=C.trustedTypes,Ut=gt?gt.emptyScript:"",nt=C.reactiveElementPolyfillSupport,R=(s,t)=>s,J={toAttribute(s,t){switch(t){case Boolean:s=s?Ut:null;break;case Object:case Array:s=s==null?s:JSON.stringify(s)}return s},fromAttribute(s,t){let e=s;switch(t){case Boolean:e=s!==null;break;case Number:e=s===null?null:Number(s);break;case Object:case Array:try{e=JSON.parse(s)}catch{e=null}}return e}},pt=(s,t)=>!Ot(s,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 n=Symbol(),o=this.getPropertyDescriptor(t,n,e);o!==void 0&&Mt(this.prototype,t,o)}}static getPropertyDescriptor(t,e,n){const{get:o,set:i}=Ht(this.prototype,t)??{get(){return this[e]},set(r){this[e]=r}};return{get:o,set(r){const c=o==null?void 0:o.call(this);i==null||i.call(this,r),this.requestUpdate(t,c,n)},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,n=[...zt(e),...Tt(e)];for(const o of n)this.createProperty(o,e[o])}const t=this[Symbol.metadata];if(t!==null){const e=litPropertyMetadata.get(t);if(e!==void 0)for(const[n,o]of e)this.elementProperties.set(n,o)}this._$Eh=new Map;for(const[e,n]of this.elementProperties){const o=this._$Eu(e,n);o!==void 0&&this._$Eh.set(o,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const n=new Set(t.flat(1/0).reverse());for(const o of n)e.unshift(bt(o))}else t!==void 0&&e.push(bt(t));return e}static _$Eu(t,e){const n=e.attribute;return n===!1?void 0:typeof n=="string"?n: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 n of e.keys())this.hasOwnProperty(n)&&(t.set(n,this[n]),delete this[n]);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 n;return(n=e.hostConnected)==null?void 0:n.call(e)})}enableUpdating(t){}disconnectedCallback(){var t;(t=this._$EO)==null||t.forEach(e=>{var n;return(n=e.hostDisconnected)==null?void 0:n.call(e)})}attributeChangedCallback(t,e,n){this._$AK(t,n)}_$ET(t,e){var i;const n=this.constructor.elementProperties.get(t),o=this.constructor._$Eu(t,n);if(o!==void 0&&n.reflect===!0){const r=(((i=n.converter)==null?void 0:i.toAttribute)!==void 0?n.converter:J).toAttribute(e,n.type);this._$Em=t,r==null?this.removeAttribute(o):this.setAttribute(o,r),this._$Em=null}}_$AK(t,e){var i,r;const n=this.constructor,o=n._$Eh.get(t);if(o!==void 0&&this._$Em!==o){const c=n.getPropertyOptions(o),l=typeof c.converter=="function"?{fromAttribute:c.converter}:((i=c.converter)==null?void 0:i.fromAttribute)!==void 0?c.converter:J;this._$Em=o,this[o]=l.fromAttribute(e,c.type)??((r=this._$Ej)==null?void 0:r.get(o))??null,this._$Em=null}}requestUpdate(t,e,n){var o;if(t!==void 0){const i=this.constructor,r=this[t];if(n??(n=i.getPropertyOptions(t)),!((n.hasChanged??pt)(r,e)||n.useDefault&&n.reflect&&r===((o=this._$Ej)==null?void 0:o.get(t))&&!this.hasAttribute(i._$Eu(t,n))))return;this.C(t,e,n)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(t,e,{useDefault:n,reflect:o,wrapped:i},r){n&&!(this._$Ej??(this._$Ej=new Map)).has(t)&&(this._$Ej.set(t,r??e??this[t]),i!==!0||r!==void 0)||(this._$AL.has(t)||(this.hasUpdated||n||(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 n;if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._$Ep){for(const[i,r]of this._$Ep)this[i]=r;this._$Ep=void 0}const o=this.constructor.elementProperties;if(o.size>0)for(const[i,r]of o){const{wrapped:c}=r,l=this[i];c!==!0||this._$AL.has(i)||l===void 0||this.C(i,void 0,r,l)}}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),(n=this._$EO)==null||n.forEach(o=>{var i;return(i=o.hostUpdate)==null?void 0:i.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(n=>{var o;return(o=n.hostUpdated)==null?void 0:o.call(n)}),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,nt==null||nt({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
13
|
*/const V=globalThis,Q=V.trustedTypes,mt=Q?Q.createPolicy("lit-html",{createHTML:s=>s}):void 0,Ct="$lit$",E=`lit$${Math.random().toFixed(9).slice(2)}$`,Lt="?"+E,Nt=`<${Lt}>`,O=document,F=()=>O.createComment(""),q=s=>s===null||typeof s!="object"&&typeof s!="function",ut=Array.isArray,jt=s=>ut(s)||typeof(s==null?void 0:s[Symbol.iterator])=="function",ot=`[
|
|
14
14
|
\f\r]`,j=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,$t=/-->/g,wt=/>/g,k=RegExp(`>|${ot}(?:([^\\s"'>=/]+)(${ot}*=${ot}*(?:[^
|
|
15
|
-
\f\r"'\`<>=]|("|')|))|$)`,"g"),xt=/'/g,_t=/"/g,Pt=/^(?:script|style|textarea|title)$/i,Rt=s=>(t,...e)=>({_$litType$:s,strings:t,values:e}),d=Rt(1),M=Symbol.for("lit-noChange"),h=Symbol.for("lit-nothing"),At=new WeakMap,I=O.createTreeWalker(O,129);function kt(s,t){if(!ut(s)||!s.hasOwnProperty("raw"))throw Error("invalid template strings array");return mt!==void 0?mt.createHTML(t):t}const Vt=(s,t)=>{const e=s.length-1,n=[];let o,i=t===2?"<svg>":t===3?"<math>":"",r=j;for(let c=0;c<e;c++){const l=s[c];let f,v,p=-1,x=0;for(;x<l.length&&(r.lastIndex=x,v=r.exec(l),v!==null);)x=r.lastIndex,r===j?v[1]==="!--"?r=$t:v[1]!==void 0?r=wt:v[2]!==void 0?(Pt.test(v[2])&&(o=RegExp("</"+v[2],"g")),r=k):v[3]!==void 0&&(r=k):r===k?v[0]===">"?(r=o??j,p=-1):v[1]===void 0?p=-2:(p=r.lastIndex-v[2].length,f=v[1],r=v[3]===void 0?k:v[3]==='"'?_t:xt):r===_t||r===xt?r=k:r===$t||r===wt?r=j:(r=k,o=void 0);const S=r===k&&s[c+1].startsWith("/>")?" ":"";i+=r===j?l+Nt:p>=0?(n.push(f),l.slice(0,p)+Ct+l.slice(p)+E+S):l+E+(p===-2?c:S)}return[kt(s,i+(s[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),n]};class Z{constructor({strings:t,_$litType$:e},n){let o;this.parts=[];let i=0,r=0;const c=t.length-1,l=this.parts,[f,v]=Vt(t,e);if(this.el=Z.createElement(f,n),I.currentNode=this.el.content,e===2||e===3){const p=this.el.content.firstChild;p.replaceWith(...p.childNodes)}for(;(o=I.nextNode())!==null&&l.length<c;){if(o.nodeType===1){if(o.hasAttributes())for(const p of o.getAttributeNames())if(p.endsWith(Ct)){const x=v[r++],S=o.getAttribute(p).split(E),K=/([.?@])?(.*)/.exec(x);l.push({type:1,index:i,name:K[2],strings:S,ctor:K[1]==="."?qt:K[1]==="?"?Zt:K[1]==="@"?Wt:Y}),o.removeAttribute(p)}else p.startsWith(E)&&(l.push({type:6,index:i}),o.removeAttribute(p));if(Pt.test(o.tagName)){const p=o.textContent.split(E),x=p.length-1;if(x>0){o.textContent=Q?Q.emptyScript:"";for(let S=0;S<x;S++)o.append(p[S],F()),I.nextNode(),l.push({type:2,index:++i});o.append(p[x],F())}}}else if(o.nodeType===8)if(o.data===Lt)l.push({type:2,index:i});else{let p=-1;for(;(p=o.data.indexOf(E,p+1))!==-1;)l.push({type:7,index:i}),p+=E.length-1}i++}}static createElement(t,e){const n=O.createElement("template");return n.innerHTML=t,n}}function
|
|
15
|
+
\f\r"'\`<>=]|("|')|))|$)`,"g"),xt=/'/g,_t=/"/g,Pt=/^(?:script|style|textarea|title)$/i,Rt=s=>(t,...e)=>({_$litType$:s,strings:t,values:e}),d=Rt(1),M=Symbol.for("lit-noChange"),h=Symbol.for("lit-nothing"),At=new WeakMap,I=O.createTreeWalker(O,129);function kt(s,t){if(!ut(s)||!s.hasOwnProperty("raw"))throw Error("invalid template strings array");return mt!==void 0?mt.createHTML(t):t}const Vt=(s,t)=>{const e=s.length-1,n=[];let o,i=t===2?"<svg>":t===3?"<math>":"",r=j;for(let c=0;c<e;c++){const l=s[c];let f,v,p=-1,x=0;for(;x<l.length&&(r.lastIndex=x,v=r.exec(l),v!==null);)x=r.lastIndex,r===j?v[1]==="!--"?r=$t:v[1]!==void 0?r=wt:v[2]!==void 0?(Pt.test(v[2])&&(o=RegExp("</"+v[2],"g")),r=k):v[3]!==void 0&&(r=k):r===k?v[0]===">"?(r=o??j,p=-1):v[1]===void 0?p=-2:(p=r.lastIndex-v[2].length,f=v[1],r=v[3]===void 0?k:v[3]==='"'?_t:xt):r===_t||r===xt?r=k:r===$t||r===wt?r=j:(r=k,o=void 0);const S=r===k&&s[c+1].startsWith("/>")?" ":"";i+=r===j?l+Nt:p>=0?(n.push(f),l.slice(0,p)+Ct+l.slice(p)+E+S):l+E+(p===-2?c:S)}return[kt(s,i+(s[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),n]};class Z{constructor({strings:t,_$litType$:e},n){let o;this.parts=[];let i=0,r=0;const c=t.length-1,l=this.parts,[f,v]=Vt(t,e);if(this.el=Z.createElement(f,n),I.currentNode=this.el.content,e===2||e===3){const p=this.el.content.firstChild;p.replaceWith(...p.childNodes)}for(;(o=I.nextNode())!==null&&l.length<c;){if(o.nodeType===1){if(o.hasAttributes())for(const p of o.getAttributeNames())if(p.endsWith(Ct)){const x=v[r++],S=o.getAttribute(p).split(E),K=/([.?@])?(.*)/.exec(x);l.push({type:1,index:i,name:K[2],strings:S,ctor:K[1]==="."?qt:K[1]==="?"?Zt:K[1]==="@"?Wt:Y}),o.removeAttribute(p)}else p.startsWith(E)&&(l.push({type:6,index:i}),o.removeAttribute(p));if(Pt.test(o.tagName)){const p=o.textContent.split(E),x=p.length-1;if(x>0){o.textContent=Q?Q.emptyScript:"";for(let S=0;S<x;S++)o.append(p[S],F()),I.nextNode(),l.push({type:2,index:++i});o.append(p[x],F())}}}else if(o.nodeType===8)if(o.data===Lt)l.push({type:2,index:i});else{let p=-1;for(;(p=o.data.indexOf(E,p+1))!==-1;)l.push({type:7,index:i}),p+=E.length-1}i++}}static createElement(t,e){const n=O.createElement("template");return n.innerHTML=t,n}}function D(s,t,e=s,n){var r,c;if(t===M)return t;let o=n!==void 0?(r=e._$Co)==null?void 0:r[n]:e._$Cl;const i=q(t)?void 0:t._$litDirective$;return(o==null?void 0:o.constructor)!==i&&((c=o==null?void 0:o._$AO)==null||c.call(o,!1),i===void 0?o=void 0:(o=new i(s),o._$AT(s,e,n)),n!==void 0?(e._$Co??(e._$Co=[]))[n]=o:e._$Cl=o),o!==void 0&&(t=D(s,o._$AS(s,t.values),o,n)),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:n}=this._$AD,o=((t==null?void 0:t.creationScope)??O).importNode(e,!0);I.currentNode=o;let i=I.nextNode(),r=0,c=0,l=n[0];for(;l!==void 0;){if(r===l.index){let f;l.type===2?f=new G(i,i.nextSibling,this,t):l.type===1?f=new l.ctor(i,l.name,l.strings,this,t):l.type===6&&(f=new Gt(i,this,t)),this._$AV.push(f),l=n[++c]}r!==(l==null?void 0:l.index)&&(i=I.nextNode(),r++)}return I.currentNode=O,o}p(t){let e=0;for(const n of this._$AV)n!==void 0&&(n.strings!==void 0?(n._$AI(t,n,e),e+=n.strings.length-2):n._$AI(t[e])),e++}}class G{get _$AU(){var t;return((t=this._$AM)==null?void 0:t._$AU)??this._$Cv}constructor(t,e,n,o){this.type=2,this._$AH=h,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=n,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===h||t==null||t===""?(this._$AH!==h&&this._$AR(),this._$AH=h):t!==this._$AH&&t!==M&&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!==h&&q(this._$AH)?this._$AA.nextSibling.data=t:this.T(O.createTextNode(t)),this._$AH=t}$(t){var i;const{values:e,_$litType$:n}=t,o=typeof n=="number"?this._$AC(t):(n.el===void 0&&(n.el=Z.createElement(kt(n.h,n.h[0]),this.options)),n);if(((i=this._$AH)==null?void 0:i._$AD)===o)this._$AH.p(e);else{const r=new Ft(o,this),c=r.u(this.options);r.p(e),this.T(c),this._$AH=r}}_$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 n,o=0;for(const i of t)o===e.length?e.push(n=new G(this.O(F()),this.O(F()),this,this.options)):n=e[o],n._$AI(i),o++;o<e.length&&(this._$AR(n&&n._$AB.nextSibling,o),e.length=o)}_$AR(t=this._$AA.nextSibling,e){var n;for((n=this._$AP)==null?void 0:n.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,n,o,i){this.type=1,this._$AH=h,this._$AN=void 0,this.element=t,this.name=e,this._$AM=o,this.options=i,n.length>2||n[0]!==""||n[1]!==""?(this._$AH=Array(n.length-1).fill(new String),this.strings=n):this._$AH=h}_$AI(t,e=this,n,o){const i=this.strings;let r=!1;if(i===void 0)t=D(this,t,e,0),r=!q(t)||t!==this._$AH&&t!==M,r&&(this._$AH=t);else{const c=t;let l,f;for(t=i[0],l=0;l<i.length-1;l++)f=D(this,c[n+l],e,l),f===M&&(f=this._$AH[l]),r||(r=!q(f)||f!==this._$AH[l]),f===h?t=h:t!==h&&(t+=(f??"")+i[l+1]),this._$AH[l]=f}r&&!o&&this.j(t)}j(t){t===h?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===h?void 0:t}}class Zt extends Y{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==h)}}class Wt extends Y{constructor(t,e,n,o,i){super(t,e,n,o,i),this.type=5}_$AI(t,e=this){if((t=D(this,t,e,0)??h)===M)return;const n=this._$AH,o=t===h&&n!==h||t.capture!==n.capture||t.once!==n.once||t.passive!==n.passive,i=t!==h&&(n===h||o);o&&this.element.removeEventListener(this.name,this,n),i&&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,n){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=n}get _$AU(){return this._$AM._$AU}_$AI(t){D(this,t)}}const rt=V.litHtmlPolyfillSupport;rt==null||rt(Z,G),(V.litHtmlVersions??(V.litHtmlVersions=[])).push("3.3.0");const Kt=(s,t,e)=>{const n=(e==null?void 0:e.renderBefore)??t;let o=n._$litPart$;if(o===void 0){const i=(e==null?void 0:e.renderBefore)??null;n._$litPart$=o=new G(t.insertBefore(F(),i),i,void 0,e??{})}return o._$AI(s),o};/**
|
|
16
16
|
* @license
|
|
17
17
|
* Copyright 2017 Google LLC
|
|
18
18
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
19
|
-
*/const B=globalThis;let m=class extends
|
|
19
|
+
*/const B=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 M}};var St;m._$litElement$=!0,m.finalized=!0,(St=B.litElementHydrateSupport)==null||St.call(B,{LitElement:m});const it=B.litElementPolyfillSupport;it==null||it({LitElement:m});(B.litElementVersions??(B.litElementVersions=[])).push("4.2.0");/**
|
|
20
20
|
* @license
|
|
21
21
|
* Copyright 2017 Google LLC
|
|
22
22
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
@@ -152,8 +152,8 @@
|
|
|
152
152
|
--button-border: transparent;
|
|
153
153
|
--button-border-width: var(--border-m);
|
|
154
154
|
--button-padding: var(--spacing-l, 12px) var(--spacing-3-xl, 24px);
|
|
155
|
-
--button-starticon-svg-width: 0px; /* No SVG for primary button */
|
|
156
|
-
--button-endicon-svg-width: 0px; /* No SVG for primary button */
|
|
155
|
+
--button-starticon-svg-width: 0px; /* No starticon SVG for primary button */
|
|
156
|
+
--button-endicon-svg-width: 0px; /* No endicon SVG for primary button */
|
|
157
157
|
}
|
|
158
158
|
|
|
159
159
|
:host([variant="secondary"]) {
|
|
@@ -166,7 +166,7 @@
|
|
|
166
166
|
--button-border-width: var(--border-m);
|
|
167
167
|
--button-padding: var(--spacing-l, 12px) var(--spacing-3-xl, 24px);
|
|
168
168
|
--button-starticon-svg-width: 16px;
|
|
169
|
-
--button-endicon-svg-width: 0px; /* No SVG for
|
|
169
|
+
--button-endicon-svg-width: 0px; /* No endicon SVG for secondary button */
|
|
170
170
|
}
|
|
171
171
|
|
|
172
172
|
:host([variant="ghost"]) {
|
|
@@ -178,7 +178,7 @@
|
|
|
178
178
|
--button-border-width: 0;
|
|
179
179
|
--button-padding: var(--spacing-m, 10px) var(--spacing-xl, 16px);
|
|
180
180
|
--button-starticon-svg-width: 16px;
|
|
181
|
-
--button-endicon-svg-width: 12px;
|
|
181
|
+
--button-endicon-svg-width: 12px;
|
|
182
182
|
}
|
|
183
183
|
|
|
184
184
|
:host([variant="tertiary"]) {
|
|
@@ -189,8 +189,8 @@
|
|
|
189
189
|
--button-text-hover: var(--color-content-action-tertiary);
|
|
190
190
|
--button-border-width: 0;
|
|
191
191
|
--button-padding: var(--spacing-m, 10px) var(--spacing-l, 12px);
|
|
192
|
-
--button-starticon-svg-width: 0px;
|
|
193
|
-
--button-endicon-svg-width: 8px;
|
|
192
|
+
--button-starticon-svg-width: 0px; /* No starticon SVG for tertiary button */
|
|
193
|
+
--button-endicon-svg-width: 8px;
|
|
194
194
|
}
|
|
195
195
|
|
|
196
196
|
:host([disabled]),
|
|
@@ -290,12 +290,12 @@
|
|
|
290
290
|
transform: translateX(4px);
|
|
291
291
|
}
|
|
292
292
|
//End icon movment on hover
|
|
293
|
-
`;g([a()],u.prototype,"type",2);g([a({reflect:!0})],u.prototype,"value",2);g([a({type:String,reflect:!0})],u.prototype,"variant",2);g([a({type:String})],u.prototype,"text",2);g([a({type:String})],u.prototype,"textsecond",2);g([a({type:Boolean,reflect:!0})],u.prototype,"fullwidth",2);g([a({type:Boolean,reflect:!0})],u.prototype,"disabled",2);g([a({type:String,reflect:!0})],u.prototype,"startIconModel",2);g([a({type:String,reflect:!0})],u.prototype,"endIconModel",2);g([a({type:Boolean,reflect:!0,attribute:"starticon"})],u.prototype,"startIcon",2);g([a({type:Boolean,reflect:!0,attribute:"endicon"})],u.prototype,"endIcon",2);g([a({type:String,attribute:"paneltarget",reflect:!0})],u.prototype,"panelTarget",2);g([a({type:String})],u.prototype,"href",2);g([a({type:String})],u.prototype,"target",2);u=g([H("o-button")],u);var we=Object.defineProperty,xe=Object.getOwnPropertyDescriptor,et=(s,t,e,n)=>{for(var o=n>1?void 0:n?xe(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&o&&we(t,e,o),o};let
|
|
293
|
+
`;g([a()],u.prototype,"type",2);g([a({reflect:!0})],u.prototype,"value",2);g([a({type:String,reflect:!0})],u.prototype,"variant",2);g([a({type:String})],u.prototype,"text",2);g([a({type:String})],u.prototype,"textsecond",2);g([a({type:Boolean,reflect:!0})],u.prototype,"fullwidth",2);g([a({type:Boolean,reflect:!0})],u.prototype,"disabled",2);g([a({type:String,reflect:!0})],u.prototype,"startIconModel",2);g([a({type:String,reflect:!0})],u.prototype,"endIconModel",2);g([a({type:Boolean,reflect:!0,attribute:"starticon"})],u.prototype,"startIcon",2);g([a({type:Boolean,reflect:!0,attribute:"endicon"})],u.prototype,"endIcon",2);g([a({type:String,attribute:"paneltarget",reflect:!0})],u.prototype,"panelTarget",2);g([a({type:String})],u.prototype,"href",2);g([a({type:String})],u.prototype,"target",2);u=g([H("o-button")],u);var we=Object.defineProperty,xe=Object.getOwnPropertyDescriptor,et=(s,t,e,n)=>{for(var o=n>1?void 0:n?xe(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&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(s){(s.key==="Enter"||s.key===" ")&&(s.preventDefault(),this.toggleStatus())}render(){const s=tt.wishlist.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return d`
|
|
294
294
|
<button type="button" aria-describedby="${this.ariaDescribedBy}" class="wishlist-button">
|
|
295
295
|
<span class="sr-only">${this.label}</span>
|
|
296
296
|
${W(s)}
|
|
297
297
|
</button>
|
|
298
|
-
`}setStatus(s){this.status=s,this.setAttribute("aria-pressed",String(this.status==="filled")),this.requestUpdate()}setAriaDescribedBy(s){this.ariaDescribedBy=s,this.requestUpdate()}setLabel(s){this.label=s,this.requestUpdate()}};
|
|
298
|
+
`}setStatus(s){this.status=s,this.setAttribute("aria-pressed",String(this.status==="filled")),this.requestUpdate()}setAriaDescribedBy(s){this.ariaDescribedBy=s,this.requestUpdate()}setLabel(s){this.label=s,this.requestUpdate()}};U.styles=A`
|
|
299
299
|
:host {
|
|
300
300
|
display: inline-flex;
|
|
301
301
|
justify-content: center;
|
|
@@ -354,7 +354,7 @@
|
|
|
354
354
|
width: 0.1rem !important;
|
|
355
355
|
white-space: nowrap !important;
|
|
356
356
|
}
|
|
357
|
-
`;et([a({type:String,reflect:!0})],
|
|
357
|
+
`;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([H("o-wishlist-button")],U);var _e=Object.defineProperty,Ae=Object.getOwnPropertyDescriptor,L=(s,t,e,n)=>{for(var o=n>1?void 0:n?Ae(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&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(s){super.updated(s),this.style.setProperty("--icon-stroke-width",this.strokewidth)}render(){const s=tt[this.icon]??"",t=`icon-${this.icon}`,e=s.replace("<svg",'<svg aria-hidden="true" focusable="false" part="svg"');return d`
|
|
358
358
|
${this.type==="span"?d`
|
|
359
359
|
<span class="icon icon-button ${this.size} ${this.bgstyle} ${this.status} ${t}" ?disabled="${this.disabled}">
|
|
360
360
|
${W(e)}
|
|
@@ -526,7 +526,7 @@
|
|
|
526
526
|
}
|
|
527
527
|
|
|
528
528
|
}
|
|
529
|
-
`;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([H("o-icon-button")],$);var Se=Object.defineProperty,Ee=Object.getOwnPropertyDescriptor,
|
|
529
|
+
`;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([H("o-icon-button")],$);var Se=Object.defineProperty,Ee=Object.getOwnPropertyDescriptor,z=(s,t,e,n)=>{for(var o=n>1?void 0:n?Ee(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&o&&Se(t,e,o),o};let _=class extends m{constructor(){super(...arguments),this.href="",this.target="",this.template="standard",this.inverse=!1,this.endIcon=!1,this.reverseEndIcon=!1}render(){return d`
|
|
530
530
|
<a href="${this.href}" target="${this.target}">
|
|
531
531
|
${this.endIcon&&this.reverseEndIcon?d`
|
|
532
532
|
<o-icon-button
|
|
@@ -635,7 +635,7 @@
|
|
|
635
635
|
height: 1px;
|
|
636
636
|
}
|
|
637
637
|
/* End of underline effect */
|
|
638
|
-
`;
|
|
638
|
+
`;z([a({type:String})],_.prototype,"href",2);z([a({type:String})],_.prototype,"target",2);z([a({type:String,reflect:!0})],_.prototype,"template",2);z([a({type:Boolean,reflect:!0})],_.prototype,"inverse",2);z([a({type:Boolean,reflect:!0})],_.prototype,"endIcon",2);z([a({type:Boolean,reflect:!0})],_.prototype,"reverseEndIcon",2);_=z([H("o-link")],_);var Ce=Object.defineProperty,Le=Object.getOwnPropertyDescriptor,st=(s,t,e,n)=>{for(var o=n>1?void 0:n?Le(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&o&&Ce(t,e,o),o};let N=class extends m{constructor(){super(...arguments),this.rating=0}getStarKeys(){const s=[];for(let t=0;t<5;t++){const e=this.rating-t;let n;e>=1?n=100:e<=0?n=0:n=Math.round(e*100/25)*25,s.push(`star-${n}`)}return s}render(){const s=this.getStarKeys();return d`
|
|
639
639
|
<div class="rating">
|
|
640
640
|
<div class="stars">
|
|
641
641
|
${s.map(t=>d`<span class="star">${W(tt[t]??"")}</span>`)}
|
|
@@ -675,13 +675,14 @@
|
|
|
675
675
|
text-decoration: underline;
|
|
676
676
|
cursor: pointer;
|
|
677
677
|
}
|
|
678
|
-
`;st([a({type:Number})],N.prototype,"rating",2);st([a({type:String})],N.prototype,"reviewCount",2);st([a({type:String})],N.prototype,"href",2);N=st([H("o-rating")],N);var Pe=Object.defineProperty,ke=Object.getOwnPropertyDescriptor,y=(s,t,e,n)=>{for(var o=n>1?void 0:n?ke(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&o&&Pe(t,e,o),o};let b=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.previousFocusedElement=null,this.handleKeyDown=s=>{this.open&&(s.key==="Escape"?this.closePanel():s.key==="Tab"&&this.trapFocus(s))}}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(s){const t=this.getFocusableElements();if(t.length===0)return;const e=t[0],n=t[t.length-1];s.shiftKey&&document.activeElement===e?(s.preventDefault(),n.focus()):!s.shiftKey&&document.activeElement===n&&(s.preventDefault(),e.focus())}getFocusableElements(){const s=this.renderRoot.querySelector(".panel");return s?Array.from(s.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 s=this.getFocusableElements()[0];s==null||s.focus()})}closePanel(){var s;this.open=!1,document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),(s=this.previousFocusedElement)==null||s.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()}render(){return d`
|
|
679
|
-
<div class="overlay" @click=${this.closePanel}></div>
|
|
678
|
+
`;st([a({type:Number})],N.prototype,"rating",2);st([a({type:String})],N.prototype,"reviewCount",2);st([a({type:String})],N.prototype,"href",2);N=st([H("o-rating")],N);var Pe=Object.defineProperty,ke=Object.getOwnPropertyDescriptor,y=(s,t,e,n)=>{for(var o=n>1?void 0:n?ke(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&o&&Pe(t,e,o),o};let b=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=s=>{this.open&&(s.key==="Escape"?this.closePanel():s.key==="Tab"&&this.trapFocus(s))}}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(s){const t=this.getFocusableElements();if(t.length===0)return;const e=t[0],n=t[t.length-1];s.shiftKey&&document.activeElement===e?(s.preventDefault(),n.focus()):!s.shiftKey&&document.activeElement===n&&(s.preventDefault(),e.focus())}getFocusableElements(){const s=this.renderRoot.querySelector(".panel");return s?Array.from(s.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 s=this.getFocusableElements()[0];s==null||s.focus()})}closePanel(){var s;this.open=!1,document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),(s=this.previousFocusedElement)==null||s.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 d`
|
|
679
|
+
<div class="overlay" style="z-index: ${this.zIndex}" @click=${this.closePanel}></div>
|
|
680
680
|
<div
|
|
681
681
|
class="panel"
|
|
682
682
|
role="dialog"
|
|
683
683
|
aria-modal="true"
|
|
684
684
|
aria-labelledby="panel-title"
|
|
685
|
+
style="z-index: ${this.zIndex+1}"
|
|
685
686
|
>
|
|
686
687
|
<o-icon-button icon="cross" size="medium" class="close-btn" @click=${this.closePanel} aria-label="${this.closeButtonLabel}"></o-icon-button>
|
|
687
688
|
|
|
@@ -719,12 +720,13 @@
|
|
|
719
720
|
</div>
|
|
720
721
|
`}};b.styles=A`
|
|
721
722
|
:host {
|
|
723
|
+
--z-overlay: 99;
|
|
724
|
+
--z-panel: 100;
|
|
722
725
|
position: fixed;
|
|
723
726
|
top: 0;
|
|
724
727
|
right: 0;
|
|
725
728
|
height: 100%;
|
|
726
729
|
width: 100%;
|
|
727
|
-
z-index: 2147483647;
|
|
728
730
|
pointer-events: none;
|
|
729
731
|
}
|
|
730
732
|
|
|
@@ -736,6 +738,7 @@
|
|
|
736
738
|
opacity: 0;
|
|
737
739
|
transition: opacity 0.3s ease;
|
|
738
740
|
pointer-events: none;
|
|
741
|
+
z-index: var(--z-overlay);
|
|
739
742
|
}
|
|
740
743
|
|
|
741
744
|
:host([open]) .overlay {
|
|
@@ -758,6 +761,7 @@
|
|
|
758
761
|
display: flex;
|
|
759
762
|
flex-direction: column;
|
|
760
763
|
pointer-events: auto;
|
|
764
|
+
z-index: var(--z-panel);
|
|
761
765
|
}
|
|
762
766
|
|
|
763
767
|
:host([open]) .panel {
|
|
@@ -810,7 +814,7 @@
|
|
|
810
814
|
max-width: none;
|
|
811
815
|
}
|
|
812
816
|
}
|
|
813
|
-
`;y([a({type:Boolean,reflect:!0})],b.prototype,"open",2);y([a({type:Boolean,reflect:!0})],b.prototype,"showHeader",2);y([a({type:Boolean,reflect:!0})],b.prototype,"showFooter",2);y([a({type:String,reflect:!0})],b.prototype,"headerTitle",2);y([a({type:String,reflect:!0})],b.prototype,"closeButtonLabel",2);y([a({type:String,reflect:!0})],b.prototype,"firstButtonLabel",2);y([a({type:String,reflect:!0})],b.prototype,"firstButtonVariant",2);y([a({type:Function})],b.prototype,"onFirstButtonClick",2);y([a({type:String,reflect:!0})],b.prototype,"secondaryButtonLabel",2);y([a({type:String,reflect:!0})],b.prototype,"secondaryButtonVariant",2);y([a({type:Function})],b.prototype,"onSecondaryButtonClick",2);y([a({type:Boolean,reflect:!0})],b.prototype,"disablePortal",2);b=y([H("o-side-panel")],b);var Ie=Object.defineProperty,Be=Object.getOwnPropertyDescriptor,P=(s,t,e,n)=>{for(var o=n>1?void 0:n?Be(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&o&&Ie(t,e,o),o};let w=class extends m{constructor(){super(...arguments),this.thumbnails=[],this.activeIndex=0,this.disabledIndexes=[],this.maxWidth="100%",this.focusedIndex=0}handleKeyDown(s){s.key==="ArrowRight"?(s.preventDefault(),this.focusNext()):s.key==="ArrowLeft"?(s.preventDefault(),this.focusPrevious()):(s.key==="Enter"||s.key===" ")&&(s.preventDefault(),this.selectThumbnail(this.focusedIndex))}focusNext(){let s=this.focusedIndex+1;for(;this.disabledIndexes.includes(s)&&s<this.thumbnails.length;)s++;s<this.thumbnails.length&&(this.focusedIndex=s,this.focusThumbnail(s))}focusPrevious(){let s=this.focusedIndex-1;for(;this.disabledIndexes.includes(s)&&s>=0;)s--;s>=0&&(this.focusedIndex=s,this.focusThumbnail(s))}focusThumbnail(s){const t=this.renderRoot.querySelector(`[data-index="${s}"]`);t==null||t.focus()}selectThumbnail(s){this.disabledIndexes.includes(s)||(this.activeIndex=s,this.swiperInstance&&typeof this.swiperInstance.slideTo=="function"&&this.swiperInstance.slideTo(s),this.dispatchEvent(new CustomEvent("thumbnail-select",{detail:{index:s}})))}render(){return d`
|
|
817
|
+
`;y([a({type:Boolean,reflect:!0})],b.prototype,"open",2);y([a({type:Boolean,reflect:!0})],b.prototype,"showHeader",2);y([a({type:Boolean,reflect:!0})],b.prototype,"showFooter",2);y([a({type:String,reflect:!0})],b.prototype,"headerTitle",2);y([a({type:String,reflect:!0})],b.prototype,"closeButtonLabel",2);y([a({type:String,reflect:!0})],b.prototype,"firstButtonLabel",2);y([a({type:String,reflect:!0})],b.prototype,"firstButtonVariant",2);y([a({type:Function})],b.prototype,"onFirstButtonClick",2);y([a({type:String,reflect:!0})],b.prototype,"secondaryButtonLabel",2);y([a({type:String,reflect:!0})],b.prototype,"secondaryButtonVariant",2);y([a({type:Function})],b.prototype,"onSecondaryButtonClick",2);y([a({type:Boolean,reflect:!0})],b.prototype,"disablePortal",2);y([a({type:Number,reflect:!0})],b.prototype,"zIndex",2);b=y([H("o-side-panel")],b);var Ie=Object.defineProperty,Be=Object.getOwnPropertyDescriptor,P=(s,t,e,n)=>{for(var o=n>1?void 0:n?Be(t,e):t,i=s.length-1,r;i>=0;i--)(r=s[i])&&(o=(n?r(t,e,o):r(o))||o);return n&&o&&Ie(t,e,o),o};let w=class extends m{constructor(){super(...arguments),this.thumbnails=[],this.activeIndex=0,this.disabledIndexes=[],this.maxWidth="100%",this.focusedIndex=0}handleKeyDown(s){s.key==="ArrowRight"?(s.preventDefault(),this.focusNext()):s.key==="ArrowLeft"?(s.preventDefault(),this.focusPrevious()):(s.key==="Enter"||s.key===" ")&&(s.preventDefault(),this.selectThumbnail(this.focusedIndex))}focusNext(){let s=this.focusedIndex+1;for(;this.disabledIndexes.includes(s)&&s<this.thumbnails.length;)s++;s<this.thumbnails.length&&(this.focusedIndex=s,this.focusThumbnail(s))}focusPrevious(){let s=this.focusedIndex-1;for(;this.disabledIndexes.includes(s)&&s>=0;)s--;s>=0&&(this.focusedIndex=s,this.focusThumbnail(s))}focusThumbnail(s){const t=this.renderRoot.querySelector(`[data-index="${s}"]`);t==null||t.focus()}selectThumbnail(s){this.disabledIndexes.includes(s)||(this.activeIndex=s,this.swiperInstance&&typeof this.swiperInstance.slideTo=="function"&&this.swiperInstance.slideTo(s),this.dispatchEvent(new CustomEvent("thumbnail-select",{detail:{index:s}})))}render(){return d`
|
|
814
818
|
<div class="scroll-container" style="max-width: ${this.maxWidth};">
|
|
815
819
|
${this.thumbnails.map((s,t)=>{const e=this.disabledIndexes.includes(t),n=this.activeIndex===t,o=s.type==="video";return d`
|
|
816
820
|
<div class="thumb-wrapper">
|
package/index.mjs
CHANGED
|
@@ -45,10 +45,10 @@ const It = (s) => new Et(typeof s == "string" ? s : s + "", void 0, dt), A = (s,
|
|
|
45
45
|
* Copyright 2017 Google LLC
|
|
46
46
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
47
47
|
*/
|
|
48
|
-
const { is: Ot, defineProperty: Mt, getOwnPropertyDescriptor: Ht, getOwnPropertyNames:
|
|
48
|
+
const { is: Ot, defineProperty: Mt, getOwnPropertyDescriptor: Ht, getOwnPropertyNames: zt, getOwnPropertySymbols: Tt, getPrototypeOf: Dt } = Object, C = globalThis, gt = C.trustedTypes, Ut = gt ? gt.emptyScript : "", nt = C.reactiveElementPolyfillSupport, R = (s, t) => s, J = { toAttribute(s, t) {
|
|
49
49
|
switch (t) {
|
|
50
50
|
case Boolean:
|
|
51
|
-
s = s ?
|
|
51
|
+
s = s ? Ut : null;
|
|
52
52
|
break;
|
|
53
53
|
case Object:
|
|
54
54
|
case Array:
|
|
@@ -75,7 +75,7 @@ const { is: Ot, defineProperty: Mt, getOwnPropertyDescriptor: Ht, getOwnProperty
|
|
|
75
75
|
return e;
|
|
76
76
|
} }, pt = (s, t) => !Ot(s, t), yt = { attribute: !0, type: String, converter: J, reflect: !1, useDefault: !1, hasChanged: pt };
|
|
77
77
|
Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), C.litPropertyMetadata ?? (C.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
|
|
78
|
-
let
|
|
78
|
+
let T = class extends HTMLElement {
|
|
79
79
|
static addInitializer(t) {
|
|
80
80
|
this._$Ei(), (this.l ?? (this.l = [])).push(t);
|
|
81
81
|
}
|
|
@@ -104,13 +104,13 @@ let D = class extends HTMLElement {
|
|
|
104
104
|
}
|
|
105
105
|
static _$Ei() {
|
|
106
106
|
if (this.hasOwnProperty(R("elementProperties"))) return;
|
|
107
|
-
const t =
|
|
107
|
+
const t = Dt(this);
|
|
108
108
|
t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
|
|
109
109
|
}
|
|
110
110
|
static finalize() {
|
|
111
111
|
if (this.hasOwnProperty(R("finalized"))) return;
|
|
112
112
|
if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(R("properties"))) {
|
|
113
|
-
const e = this.properties, n = [...
|
|
113
|
+
const e = this.properties, n = [...zt(e), ...Tt(e)];
|
|
114
114
|
for (const o of n) this.createProperty(o, e[o]);
|
|
115
115
|
}
|
|
116
116
|
const t = this[Symbol.metadata];
|
|
@@ -276,7 +276,7 @@ let D = class extends HTMLElement {
|
|
|
276
276
|
firstUpdated(t) {
|
|
277
277
|
}
|
|
278
278
|
};
|
|
279
|
-
|
|
279
|
+
T.elementStyles = [], T.shadowRootOptions = { mode: "open" }, T[R("elementProperties")] = /* @__PURE__ */ new Map(), T[R("finalized")] = /* @__PURE__ */ new Map(), nt == null || nt({ ReactiveElement: T }), (C.reactiveElementVersions ?? (C.reactiveElementVersions = [])).push("2.1.0");
|
|
280
280
|
/**
|
|
281
281
|
* @license
|
|
282
282
|
* Copyright 2017 Google LLC
|
|
@@ -338,12 +338,12 @@ class Z {
|
|
|
338
338
|
return n.innerHTML = t, n;
|
|
339
339
|
}
|
|
340
340
|
}
|
|
341
|
-
function
|
|
341
|
+
function D(s, t, e = s, n) {
|
|
342
342
|
var r, c;
|
|
343
343
|
if (t === M) return t;
|
|
344
344
|
let o = n !== void 0 ? (r = e._$Co) == null ? void 0 : r[n] : e._$Cl;
|
|
345
345
|
const i = q(t) ? void 0 : t._$litDirective$;
|
|
346
|
-
return (o == null ? void 0 : o.constructor) !== i && ((c = o == null ? void 0 : o._$AO) == null || c.call(o, !1), i === void 0 ? o = void 0 : (o = new i(s), o._$AT(s, e, n)), n !== void 0 ? (e._$Co ?? (e._$Co = []))[n] = o : e._$Cl = o), o !== void 0 && (t =
|
|
346
|
+
return (o == null ? void 0 : o.constructor) !== i && ((c = o == null ? void 0 : o._$AO) == null || c.call(o, !1), i === void 0 ? o = void 0 : (o = new i(s), o._$AT(s, e, n)), n !== void 0 ? (e._$Co ?? (e._$Co = []))[n] = o : e._$Cl = o), o !== void 0 && (t = D(s, o._$AS(s, t.values), o, n)), t;
|
|
347
347
|
}
|
|
348
348
|
class Ft {
|
|
349
349
|
constructor(t, e) {
|
|
@@ -393,7 +393,7 @@ class G {
|
|
|
393
393
|
return this._$AB;
|
|
394
394
|
}
|
|
395
395
|
_$AI(t, e = this) {
|
|
396
|
-
t =
|
|
396
|
+
t = D(this, t, e), q(t) ? t === h || t == null || t === "" ? (this._$AH !== h && this._$AR(), this._$AH = h) : t !== this._$AH && t !== M && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : jt(t) ? this.k(t) : this._(t);
|
|
397
397
|
}
|
|
398
398
|
O(t) {
|
|
399
399
|
return this._$AA.parentNode.insertBefore(t, this._$AB);
|
|
@@ -449,11 +449,11 @@ class Y {
|
|
|
449
449
|
_$AI(t, e = this, n, o) {
|
|
450
450
|
const i = this.strings;
|
|
451
451
|
let r = !1;
|
|
452
|
-
if (i === void 0) t =
|
|
452
|
+
if (i === void 0) t = D(this, t, e, 0), r = !q(t) || t !== this._$AH && t !== M, r && (this._$AH = t);
|
|
453
453
|
else {
|
|
454
454
|
const c = t;
|
|
455
455
|
let l, f;
|
|
456
|
-
for (t = i[0], l = 0; l < i.length - 1; l++) f =
|
|
456
|
+
for (t = i[0], l = 0; l < i.length - 1; l++) f = D(this, c[n + l], e, l), f === M && (f = this._$AH[l]), r || (r = !q(f) || f !== this._$AH[l]), f === h ? t = h : t !== h && (t += (f ?? "") + i[l + 1]), this._$AH[l] = f;
|
|
457
457
|
}
|
|
458
458
|
r && !o && this.j(t);
|
|
459
459
|
}
|
|
@@ -482,7 +482,7 @@ class Wt extends Y {
|
|
|
482
482
|
super(t, e, n, o, i), this.type = 5;
|
|
483
483
|
}
|
|
484
484
|
_$AI(t, e = this) {
|
|
485
|
-
if ((t =
|
|
485
|
+
if ((t = D(this, t, e, 0) ?? h) === M) return;
|
|
486
486
|
const n = this._$AH, o = t === h && n !== h || t.capture !== n.capture || t.once !== n.once || t.passive !== n.passive, i = t !== h && (n === h || o);
|
|
487
487
|
o && this.element.removeEventListener(this.name, this, n), i && this.element.addEventListener(this.name, this, t), this._$AH = t;
|
|
488
488
|
}
|
|
@@ -499,7 +499,7 @@ class Gt {
|
|
|
499
499
|
return this._$AM._$AU;
|
|
500
500
|
}
|
|
501
501
|
_$AI(t) {
|
|
502
|
-
|
|
502
|
+
D(this, t);
|
|
503
503
|
}
|
|
504
504
|
}
|
|
505
505
|
const rt = V.litHtmlPolyfillSupport;
|
|
@@ -519,7 +519,7 @@ const Kt = (s, t, e) => {
|
|
|
519
519
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
520
520
|
*/
|
|
521
521
|
const B = globalThis;
|
|
522
|
-
let m = class extends
|
|
522
|
+
let m = class extends T {
|
|
523
523
|
constructor() {
|
|
524
524
|
super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
|
|
525
525
|
}
|
|
@@ -866,8 +866,8 @@ u.styles = A`
|
|
|
866
866
|
--button-border: transparent;
|
|
867
867
|
--button-border-width: var(--border-m);
|
|
868
868
|
--button-padding: var(--spacing-l, 12px) var(--spacing-3-xl, 24px);
|
|
869
|
-
--button-starticon-svg-width: 0px; /* No SVG for primary button */
|
|
870
|
-
--button-endicon-svg-width: 0px; /* No SVG for primary button */
|
|
869
|
+
--button-starticon-svg-width: 0px; /* No starticon SVG for primary button */
|
|
870
|
+
--button-endicon-svg-width: 0px; /* No endicon SVG for primary button */
|
|
871
871
|
}
|
|
872
872
|
|
|
873
873
|
:host([variant="secondary"]) {
|
|
@@ -880,7 +880,7 @@ u.styles = A`
|
|
|
880
880
|
--button-border-width: var(--border-m);
|
|
881
881
|
--button-padding: var(--spacing-l, 12px) var(--spacing-3-xl, 24px);
|
|
882
882
|
--button-starticon-svg-width: 16px;
|
|
883
|
-
--button-endicon-svg-width: 0px; /* No SVG for
|
|
883
|
+
--button-endicon-svg-width: 0px; /* No endicon SVG for secondary button */
|
|
884
884
|
}
|
|
885
885
|
|
|
886
886
|
:host([variant="ghost"]) {
|
|
@@ -892,7 +892,7 @@ u.styles = A`
|
|
|
892
892
|
--button-border-width: 0;
|
|
893
893
|
--button-padding: var(--spacing-m, 10px) var(--spacing-xl, 16px);
|
|
894
894
|
--button-starticon-svg-width: 16px;
|
|
895
|
-
--button-endicon-svg-width: 12px;
|
|
895
|
+
--button-endicon-svg-width: 12px;
|
|
896
896
|
}
|
|
897
897
|
|
|
898
898
|
:host([variant="tertiary"]) {
|
|
@@ -903,8 +903,8 @@ u.styles = A`
|
|
|
903
903
|
--button-text-hover: var(--color-content-action-tertiary);
|
|
904
904
|
--button-border-width: 0;
|
|
905
905
|
--button-padding: var(--spacing-m, 10px) var(--spacing-l, 12px);
|
|
906
|
-
--button-starticon-svg-width: 0px;
|
|
907
|
-
--button-endicon-svg-width: 8px;
|
|
906
|
+
--button-starticon-svg-width: 0px; /* No starticon SVG for tertiary button */
|
|
907
|
+
--button-endicon-svg-width: 8px;
|
|
908
908
|
}
|
|
909
909
|
|
|
910
910
|
:host([disabled]),
|
|
@@ -1055,7 +1055,7 @@ var we = Object.defineProperty, xe = Object.getOwnPropertyDescriptor, et = (s, t
|
|
|
1055
1055
|
(r = s[i]) && (o = (n ? r(t, e, o) : r(o)) || o);
|
|
1056
1056
|
return n && o && we(t, e, o), o;
|
|
1057
1057
|
};
|
|
1058
|
-
let
|
|
1058
|
+
let U = class extends m {
|
|
1059
1059
|
constructor() {
|
|
1060
1060
|
super(...arguments), this.status = "empty", this.ariaDescribedBy = "a-product-name", this.label = "Add to wishlist", this.toggleStatus = () => {
|
|
1061
1061
|
this.status = this.status === "empty" ? "filled" : "empty", this.setAttribute("aria-pressed", String(this.status === "filled")), this.dispatchEvent(new CustomEvent("wishlist-toggle", {
|
|
@@ -1096,7 +1096,7 @@ let z = class extends m {
|
|
|
1096
1096
|
this.label = s, this.requestUpdate();
|
|
1097
1097
|
}
|
|
1098
1098
|
};
|
|
1099
|
-
|
|
1099
|
+
U.styles = A`
|
|
1100
1100
|
:host {
|
|
1101
1101
|
display: inline-flex;
|
|
1102
1102
|
justify-content: center;
|
|
@@ -1158,16 +1158,16 @@ z.styles = A`
|
|
|
1158
1158
|
`;
|
|
1159
1159
|
et([
|
|
1160
1160
|
a({ type: String, reflect: !0 })
|
|
1161
|
-
],
|
|
1161
|
+
], U.prototype, "status", 2);
|
|
1162
1162
|
et([
|
|
1163
1163
|
a({ type: String, reflect: !0 })
|
|
1164
|
-
],
|
|
1164
|
+
], U.prototype, "ariaDescribedBy", 2);
|
|
1165
1165
|
et([
|
|
1166
1166
|
a({ type: String, reflect: !0 })
|
|
1167
|
-
],
|
|
1168
|
-
|
|
1167
|
+
], U.prototype, "label", 2);
|
|
1168
|
+
U = et([
|
|
1169
1169
|
H("o-wishlist-button")
|
|
1170
|
-
],
|
|
1170
|
+
], U);
|
|
1171
1171
|
var _e = Object.defineProperty, Ae = Object.getOwnPropertyDescriptor, L = (s, t, e, n) => {
|
|
1172
1172
|
for (var o = n > 1 ? void 0 : n ? Ae(t, e) : t, i = s.length - 1, r; i >= 0; i--)
|
|
1173
1173
|
(r = s[i]) && (o = (n ? r(t, e, o) : r(o)) || o);
|
|
@@ -1385,7 +1385,7 @@ L([
|
|
|
1385
1385
|
$ = L([
|
|
1386
1386
|
H("o-icon-button")
|
|
1387
1387
|
], $);
|
|
1388
|
-
var Se = Object.defineProperty, Ee = Object.getOwnPropertyDescriptor,
|
|
1388
|
+
var Se = Object.defineProperty, Ee = Object.getOwnPropertyDescriptor, z = (s, t, e, n) => {
|
|
1389
1389
|
for (var o = n > 1 ? void 0 : n ? Ee(t, e) : t, i = s.length - 1, r; i >= 0; i--)
|
|
1390
1390
|
(r = s[i]) && (o = (n ? r(t, e, o) : r(o)) || o);
|
|
1391
1391
|
return n && o && Se(t, e, o), o;
|
|
@@ -1508,25 +1508,25 @@ _.styles = A`
|
|
|
1508
1508
|
}
|
|
1509
1509
|
/* End of underline effect */
|
|
1510
1510
|
`;
|
|
1511
|
-
|
|
1511
|
+
z([
|
|
1512
1512
|
a({ type: String })
|
|
1513
1513
|
], _.prototype, "href", 2);
|
|
1514
|
-
|
|
1514
|
+
z([
|
|
1515
1515
|
a({ type: String })
|
|
1516
1516
|
], _.prototype, "target", 2);
|
|
1517
|
-
|
|
1517
|
+
z([
|
|
1518
1518
|
a({ type: String, reflect: !0 })
|
|
1519
1519
|
], _.prototype, "template", 2);
|
|
1520
|
-
|
|
1520
|
+
z([
|
|
1521
1521
|
a({ type: Boolean, reflect: !0 })
|
|
1522
1522
|
], _.prototype, "inverse", 2);
|
|
1523
|
-
|
|
1523
|
+
z([
|
|
1524
1524
|
a({ type: Boolean, reflect: !0 })
|
|
1525
1525
|
], _.prototype, "endIcon", 2);
|
|
1526
|
-
|
|
1526
|
+
z([
|
|
1527
1527
|
a({ type: Boolean, reflect: !0 })
|
|
1528
1528
|
], _.prototype, "reverseEndIcon", 2);
|
|
1529
|
-
_ =
|
|
1529
|
+
_ = z([
|
|
1530
1530
|
H("o-link")
|
|
1531
1531
|
], _);
|
|
1532
1532
|
var Ce = Object.defineProperty, Le = Object.getOwnPropertyDescriptor, st = (s, t, e, n) => {
|
|
@@ -1614,7 +1614,7 @@ var Pe = Object.defineProperty, ke = Object.getOwnPropertyDescriptor, y = (s, t,
|
|
|
1614
1614
|
};
|
|
1615
1615
|
let b = class extends m {
|
|
1616
1616
|
constructor() {
|
|
1617
|
-
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.previousFocusedElement = null, this.handleKeyDown = (s) => {
|
|
1617
|
+
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 = (s) => {
|
|
1618
1618
|
this.open && (s.key === "Escape" ? this.closePanel() : s.key === "Tab" && this.trapFocus(s));
|
|
1619
1619
|
};
|
|
1620
1620
|
}
|
|
@@ -1656,14 +1656,18 @@ let b = class extends m {
|
|
|
1656
1656
|
handleSecondaryClick() {
|
|
1657
1657
|
typeof this.onSecondaryButtonClick == "function" && this.onSecondaryButtonClick(), this.closePanel();
|
|
1658
1658
|
}
|
|
1659
|
+
updated() {
|
|
1660
|
+
this.style.setProperty("--z-overlay", `${this.zIndex}`), this.style.setProperty("--z-panel", `${this.zIndex + 1}`);
|
|
1661
|
+
}
|
|
1659
1662
|
render() {
|
|
1660
1663
|
return d`
|
|
1661
|
-
<div class="overlay" @click=${this.closePanel}></div>
|
|
1664
|
+
<div class="overlay" style="z-index: ${this.zIndex}" @click=${this.closePanel}></div>
|
|
1662
1665
|
<div
|
|
1663
1666
|
class="panel"
|
|
1664
1667
|
role="dialog"
|
|
1665
1668
|
aria-modal="true"
|
|
1666
1669
|
aria-labelledby="panel-title"
|
|
1670
|
+
style="z-index: ${this.zIndex + 1}"
|
|
1667
1671
|
>
|
|
1668
1672
|
<o-icon-button icon="cross" size="medium" class="close-btn" @click=${this.closePanel} aria-label="${this.closeButtonLabel}"></o-icon-button>
|
|
1669
1673
|
|
|
@@ -1704,12 +1708,13 @@ let b = class extends m {
|
|
|
1704
1708
|
};
|
|
1705
1709
|
b.styles = A`
|
|
1706
1710
|
:host {
|
|
1711
|
+
--z-overlay: 99;
|
|
1712
|
+
--z-panel: 100;
|
|
1707
1713
|
position: fixed;
|
|
1708
1714
|
top: 0;
|
|
1709
1715
|
right: 0;
|
|
1710
1716
|
height: 100%;
|
|
1711
1717
|
width: 100%;
|
|
1712
|
-
z-index: 2147483647;
|
|
1713
1718
|
pointer-events: none;
|
|
1714
1719
|
}
|
|
1715
1720
|
|
|
@@ -1721,6 +1726,7 @@ b.styles = A`
|
|
|
1721
1726
|
opacity: 0;
|
|
1722
1727
|
transition: opacity 0.3s ease;
|
|
1723
1728
|
pointer-events: none;
|
|
1729
|
+
z-index: var(--z-overlay);
|
|
1724
1730
|
}
|
|
1725
1731
|
|
|
1726
1732
|
:host([open]) .overlay {
|
|
@@ -1743,6 +1749,7 @@ b.styles = A`
|
|
|
1743
1749
|
display: flex;
|
|
1744
1750
|
flex-direction: column;
|
|
1745
1751
|
pointer-events: auto;
|
|
1752
|
+
z-index: var(--z-panel);
|
|
1746
1753
|
}
|
|
1747
1754
|
|
|
1748
1755
|
:host([open]) .panel {
|
|
@@ -1832,6 +1839,9 @@ y([
|
|
|
1832
1839
|
y([
|
|
1833
1840
|
a({ type: Boolean, reflect: !0 })
|
|
1834
1841
|
], b.prototype, "disablePortal", 2);
|
|
1842
|
+
y([
|
|
1843
|
+
a({ type: Number, reflect: !0 })
|
|
1844
|
+
], b.prototype, "zIndex", 2);
|
|
1835
1845
|
b = y([
|
|
1836
1846
|
H("o-side-panel")
|
|
1837
1847
|
], b);
|