@grasco/profile-picture 0.1.8 → 0.2.0
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/dist/angular.cjs +82 -82
- package/dist/angular.cjs.map +1 -1
- package/dist/angular.js +82 -82
- package/dist/angular.js.map +1 -1
- package/dist/index.cjs +51 -51
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +51 -51
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +36 -36
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +36 -36
- package/dist/react.js.map +1 -1
- package/dist/standalone.standalone.js +84 -84
- package/dist/standalone.standalone.js.map +1 -1
- package/dist/svelte.cjs +82 -82
- package/dist/svelte.cjs.map +1 -1
- package/dist/svelte.js +82 -82
- package/dist/svelte.js.map +1 -1
- package/dist/vue.cjs +82 -82
- package/dist/vue.cjs.map +1 -1
- package/dist/vue.js +82 -82
- package/dist/vue.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
'use strict';var Le=require('react'),lit=require('lit'),decorators_js=require('lit/decorators.js'),styleMap_js=require('lit/directives/style-map.js');var _documentCurrentScript=typeof document!=='undefined'?document.currentScript:null;function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var Le__default=/*#__PURE__*/_interopDefault(Le);var Oe=Object.defineProperty;var
|
|
1
|
+
'use strict';var Le=require('react'),lit=require('lit'),decorators_js=require('lit/decorators.js'),styleMap_js=require('lit/directives/style-map.js');var _documentCurrentScript=typeof document!=='undefined'?document.currentScript:null;function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var Le__default=/*#__PURE__*/_interopDefault(Le);var Oe=Object.defineProperty;var s=(r,o,e,t)=>{for(var n=void 0,i=r.length-1,p;i>=0;i--)(p=r[i])&&(n=(p(o,e,n))||n);return n&&Oe(o,e,n),n};var te="grasco-profile-picture-styles",G=false,ge=false;function fe(){if(G||typeof document>"u")return;if(document.getElementById(te)){G=true;return}if(document.querySelector('link[href*="profile-picture"][href$="styles.css"]')){G=true;return}ge||(ge=true,Fe());}function Fe(){(typeof requestIdleCallback<"u"?requestIdleCallback:o=>setTimeout(o,1))(()=>Ne());}function Ne(){if(G||typeof document>"u")return;if(document.getElementById(te)){G=true;return}let r=He();if(!r)return;let o=document.createElement("link");o.id=te,o.rel="stylesheet",o.href=r,document.head.appendChild(o),G=true;}function He(){if(typeof window<"u"&&window.__GRASCO_PROFILE_PICTURE_CSS__)return window.__GRASCO_PROFILE_PICTURE_CSS__;try{let o=(typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('index.cjs', document.baseURI).href));if(o)return `${o.substring(0,o.lastIndexOf("/")+1)}dist/styles.css`}catch{}let r=document.currentScript;if(r?.src){let o=new URL(r.src);return `${o.href.substring(0,o.href.lastIndexOf("/")+1)}dist/styles.css`}return null}var F={"2xs":20,xs:24,sm:32,md:40,lg:48,xl:64,"2xl":80,"3xl":120},me={online:"#30D158",away:"#FFD60A",busy:"#FF453A",offline:"#8E8E93",dnd:"#FF453A"},he={none:"none",sm:"0 1px 2px 0 rgba(0, 0, 0, 0.05)",md:"0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)",lg:"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)",glow:"0 0 20px 0 rgba(99, 102, 241, 0.3)"},$={size:"md",variant:"circle",loading:"lazy",placeholder:"shimmer",borderWidth:2,borderColor:"#ffffff",placeholderColor:"#f3f4f6",shadow:"sm"};var N={circle:"9999px",rounded:"12px",squircle:"30%",square:"0px"},I={max:4,direction:"ltr",overlap:.3,size:"md",tooltipDelay:300,dropdownMaxHeight:280,animated:true};function R(...r){return r.filter(Boolean).join(" ")}function re(r){return /^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(r)}function Y(r){let e=r.trim().replace(/[^\w\s]/g,"").split(/\s+/).filter(Boolean);return e.length===0?"?":e.length===1?e[0].slice(0,1).toUpperCase():(e[0][0]+(e.at(-1)?.[0]??"")).toUpperCase()}function oe(r){return Math.round(r*.38)}function be(r,o){let e;if(o){let n=Math.round(r*.31);e=Math.min(24,Math.max(14,n));}else {let n=Math.round(r*.22);e=Math.min(14,Math.max(8,n));}let t=Math.max(9,Math.round(e*.55));return {size:e,fontSize:t}}function xe(r,o){let e=Math.min(16,Math.max(8,Math.round(r*.2)));return Math.min(18,e+(o-1)*2)}function ve(r,o){return typeof r=="string"?r:o&&r>o?`${o}+`:r.toString()}function we(r){return r.length===0?"transparent":r.length===1?r[0]:`conic-gradient(${r.map((e,t)=>{let n=t/r.length*360,i=(t+1)/r.length*360;return `${e} ${n}deg ${i}deg`}).join(", ")})`}function je(r){let o=0;for(let e=0;e<r.length;e++){let t=r.charCodeAt(e);o=(o<<5)-o+t,o&=o;}return Math.abs(o)}function ye(r,o,e){let n=Math.max(0,Math.min(100,r))/100*360;return `conic-gradient(from 270deg, ${o} 0deg ${n}deg, ${e} ${n}deg 360deg)`}function K(r){let o=["linear-gradient(135deg, #667eea 0%, #764ba2 100%)","linear-gradient(135deg, #f093fb 0%, #f5576c 100%)","linear-gradient(135deg, #4facfe 0%, #00f2fe 100%)","linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)","linear-gradient(135deg, #fa709a 0%, #fee140 100%)","linear-gradient(135deg, #a8edea 0%, #fed6e3 100%)","linear-gradient(135deg, #d299c2 0%, #fef9d7 100%)","linear-gradient(135deg, #89f7fe 0%, #66a6ff 100%)","linear-gradient(135deg, #cd9cf2 0%, #f6f3ff 100%)","linear-gradient(135deg, #fddb92 0%, #d1fdff 100%)"],e=je(r)%o.length;return o[e]}function Ce(r){return typeof r=="number"?r:F[r]??F[I.size]}function ne(r,o,e){let t=e?o-1:o;if(r<=t)return {visible:r,hidden:0,showCounter:false};let n=t-1,i=r-n;return {visible:n,hidden:i,showCounter:true}}function X(r,o,e,t,n){let i=n??o*(1-e);return r*i}function Se(r,o,e){return e==="ltr"?o-r:r+1}function ke(r,o,e,t){if(r===0)return 0;if(r===1)return o;let n=t??o*(1-e);return o+n*(r-1)}function $e(r){return r>99?"+99":`+${r}`}function ie(r){return r<=80?"80":r<=120?"120":r<=240?"240":r<=480?"480":"960"}function ae(r){if(!(r&&re(r)))return "light";let o=r.replace("#","");o.length===3&&(o=o.split("").map(p=>p+p).join(""));let e=Number.parseInt(o.slice(0,2),16),t=Number.parseInt(o.slice(2,4),16),n=Number.parseInt(o.slice(4,6),16);return (.299*e+.587*t+.114*n)/255>.5?"light":"dark"}function se(r,o,e,t,n){let i=r.endsWith("/")?r.slice(0,-1):r,p=`${o}_${e}_${t}.webp`;return `${i}/api/profile-picture/cdn/${p}?hostname=${n}`}function Ie(r){return {circle:"np:rounded-full",rounded:"np:rounded-xl",squircle:"np:rounded-[30%]",square:"np:rounded-none"}[r]}function Ee(r,o){return {className:{1:"np:border",2:"np:border-2",3:"np:border-[3px]",4:"np:border-4",5:"np:border-[5px]",6:"np:border-[6px]",8:"np:border-8"}[r],style:{borderColor:o,borderStyle:"solid"}}}function Pe(r,o){return o?{className:"",style:{background:o}}:r?r.includes("gradient")?{className:"",style:{background:r}}:{className:"",style:{backgroundColor:r}}:{className:"",style:{backgroundColor:"#e7e7e7"}}}function ze(r){return {boxShadow:he[r]}}var Ve={shimmer:`
|
|
2
2
|
@keyframes pp-shimmer {
|
|
3
3
|
0% { transform: translateX(-100%); }
|
|
4
4
|
100% { transform: translateX(100%); }
|
|
@@ -36,8 +36,8 @@
|
|
|
36
36
|
0% { transform: scale(0.8); opacity: 0; }
|
|
37
37
|
50% { transform: scale(1.05); }
|
|
38
38
|
100% { transform: scale(1); opacity: 1; }
|
|
39
|
-
}`},
|
|
40
|
-
`),
|
|
39
|
+
}`},We=Object.values(Ve).join(`
|
|
40
|
+
`),qe=`
|
|
41
41
|
/* Profile Picture Component Styles */
|
|
42
42
|
.pp-container {
|
|
43
43
|
--pp-transition-duration: 200ms;
|
|
@@ -240,8 +240,8 @@
|
|
|
240
240
|
transition: none !important;
|
|
241
241
|
}
|
|
242
242
|
}
|
|
243
|
-
`,Te=`${
|
|
244
|
-
${
|
|
243
|
+
`,Te=`${We}
|
|
244
|
+
${qe}`,De=`
|
|
245
245
|
@keyframes np-shimmer {
|
|
246
246
|
0% { background-position: -200% 0; }
|
|
247
247
|
100% { background-position: 200% 0; }
|
|
@@ -251,7 +251,7 @@ ${We}`,De=`
|
|
|
251
251
|
background-size: 200% 100%;
|
|
252
252
|
animation: np-shimmer 1.5s infinite;
|
|
253
253
|
}
|
|
254
|
-
`;function Re(r,
|
|
254
|
+
`;function Re(r,o=.3){if(re(r)){let e=Number.parseInt(r.slice(1,3),16),t=Number.parseInt(r.slice(3,5),16),n=Number.parseInt(r.slice(5,7),16);return `0 0 20px 0 rgba(${e}, ${t}, ${n}, ${o})`}return `0 0 20px 0 ${r}`}var Je=`
|
|
255
255
|
@keyframes ppg-tooltip-in {
|
|
256
256
|
from {
|
|
257
257
|
opacity: 0;
|
|
@@ -302,7 +302,7 @@ ${We}`,De=`
|
|
|
302
302
|
opacity: 1;
|
|
303
303
|
}
|
|
304
304
|
}
|
|
305
|
-
`,
|
|
305
|
+
`,Ye=`
|
|
306
306
|
/* Profile Picture Group Container */
|
|
307
307
|
.ppg-container {
|
|
308
308
|
--ppg-transition: 200ms cubic-bezier(0.4, 0, 0.2, 1);
|
|
@@ -747,24 +747,24 @@ ${We}`,De=`
|
|
|
747
747
|
box-shadow: 0 0 0 1.5px rgba(44, 44, 46, 0.95), 0 0 6px rgba(48, 209, 88, 0.5);
|
|
748
748
|
}
|
|
749
749
|
}
|
|
750
|
-
`,Ae=`${
|
|
751
|
-
${
|
|
750
|
+
`,Ae=`${Je}
|
|
751
|
+
${Ye}`;var a=class a extends lit.LitElement{constructor(){super(...arguments);this.src="";this.alt="";this.size=$.size;this.variant=$.variant;this.shadow=$.shadow;this.border=false;this.borderWidth=$.borderWidth;this.borderColor=$.borderColor;this.rotation=0;this.loading=$.loading;this.placeholder=$.placeholder;this.placeholderColor=$.placeholderColor;this.isLoaded=false;this.hasError=false;this.cdnLoadFailed=false;this.previousSrc="";this.RETRY_DELAY_MS=3e4;}static{this.stylesInjected=false;}static{this.cdnBaseUrl="";}static{this.instances=new Set;}static setCdnBaseUrl(e){a.cdnBaseUrl=e,a.instances.forEach(t=>{t.extCustomerId&&!t.cdnImageUrl&&(t.cdnLoadFailed=false,t.retryTimeoutId&&(clearTimeout(t.retryTimeoutId),t.retryTimeoutId=void 0),t.previousExtCustomerId||(t.previousExtCustomerId=t.extCustomerId),t.loadCdnImage());});}static getCdnBaseUrl(){return a.cdnBaseUrl}createRenderRoot(){return a.injectStylesOnce(),this}static injectStylesOnce(){if(a.stylesInjected||typeof document>"u")return;(typeof requestIdleCallback<"u"?requestIdleCallback:t=>setTimeout(t,1))(()=>{if(a.stylesInjected)return;let t=document.createElement("style");t.textContent=Te,document.head.appendChild(t),a.stylesInjected=true;});}get pixelSize(){let e=this.size;return typeof e=="number"?e:F[e]??F[$.size]}connectedCallback(){super.connectedCallback(),a.instances.add(this);}disconnectedCallback(){super.disconnectedCallback(),a.instances.delete(this),this.retryTimeoutId&&(clearTimeout(this.retryTimeoutId),this.retryTimeoutId=void 0);}firstUpdated(){this.extCustomerId&&a.cdnBaseUrl&&(this.previousExtCustomerId=this.extCustomerId,this.loadCdnImage());}updated(e){super.updated(e),this.extCustomerId&&a.cdnBaseUrl&&!this.cdnImageUrl&&(this.cdnLoadFailed||!this.previousExtCustomerId)&&(this.previousExtCustomerId||(this.previousExtCustomerId=this.extCustomerId),this.cdnLoadFailed=false,this.loadCdnImage());}willUpdate(e){e.has("src")&&this.src!==this.previousSrc&&(this.isLoaded=false,this.hasError=false,this.previousSrc=this.src),(e.has("extCustomerId")||e.has("size")||e.has("bgColor"))&&this.extCustomerId!==this.previousExtCustomerId&&(this.previousExtCustomerId=this.extCustomerId,this.cdnImageUrl=void 0,this.cdnLoadFailed=false,this.isLoaded=false,this.hasError=false,this.retryTimeoutId&&(clearTimeout(this.retryTimeoutId),this.retryTimeoutId=void 0),this.loadCdnImage());}handleLoad(){this.isLoaded=true,this.dispatchEvent(new CustomEvent("load",{bubbles:true,composed:true}));}handleError(){if(this.cdnImageUrl&&!this.cdnLoadFailed){this.cdnLoadFailed=true,this.cdnImageUrl=void 0,this.dispatchEvent(new CustomEvent("cdn-error",{bubbles:true,composed:true,detail:{error:"Image load failed"}})),this.retryTimeoutId&&clearTimeout(this.retryTimeoutId),this.retryTimeoutId=setTimeout(()=>{this.retryTimeoutId=void 0,this.extCustomerId&&a.cdnBaseUrl&&(this.cdnLoadFailed=false,this.hasError=false,this.isLoaded=false,this.loadCdnImage());},this.RETRY_DELAY_MS);return}this.hasError=true,this.isLoaded=true,this.dispatchEvent(new CustomEvent("error",{bubbles:true,composed:true}));}loadCdnImage(){if(!(this.extCustomerId&&a.cdnBaseUrl)){this.cdnLoadFailed=true;return}let e=ie(this.pixelSize),t=ae(this.bgColor),n=typeof window<"u"?window.location.hostname:"localhost";this.cdnImageUrl=se(a.cdnBaseUrl,this.extCustomerId,e,t,n);}getContainerStyles(){let e=Pe(this.bgColor,this.bgGradient),t=this.border?Ee(this.borderWidth,this.borderColor):null,n=ze(this.shadow),i={};if(this.glow){let d=this.glow.color??this.borderColor??"#6366f1";i={"--pp-glow-color":d,boxShadow:Re(d,this.glow.intensity??.3)};}let p=this.interactive?.hoverable||this.interactive?.pressable;return {classes:R("pp-container",Ie(this.variant),e.className,t?.className,p&&"pp-interactive",this.glow?.animate&&"pp-glow"),styles:{width:`${this.pixelSize}px`,height:`${this.pixelSize}px`,borderRadius:N[this.variant],...e.style,...t?.style,...n,...i,cursor:this.interactive?.cursor??(p?"pointer":"default"),transform:this.rotation?`rotate(${this.rotation}deg)`:void 0}}}renderPlaceholder(){if(this.isLoaded||this.placeholder==="none")return lit.nothing;let e={shimmer:"pp-shimmer",pulse:"pp-pulse",skeleton:"pp-skeleton",blur:"",none:""}[this.placeholder];return lit.html`
|
|
752
752
|
${this.placeholder==="shimmer"?lit.html`<style>${De}</style>`:lit.nothing}
|
|
753
753
|
<div
|
|
754
|
-
class=${
|
|
754
|
+
class=${R("np:absolute np:inset-0",e)}
|
|
755
755
|
style=${styleMap_js.styleMap({backgroundColor:this.placeholderColor,borderRadius:"inherit"})}>
|
|
756
756
|
</div>
|
|
757
757
|
`}renderFallback(){if(this.fallback)return lit.html`
|
|
758
758
|
<span
|
|
759
759
|
class="pp-fallback"
|
|
760
|
-
style=${styleMap_js.styleMap({fontSize:`${
|
|
760
|
+
style=${styleMap_js.styleMap({fontSize:`${oe(this.pixelSize)}px`})}>
|
|
761
761
|
${this.fallback}
|
|
762
762
|
</span>
|
|
763
|
-
`;if(this.alt){let t=
|
|
763
|
+
`;if(this.alt){let t=K(this.alt);return lit.html`
|
|
764
764
|
<div
|
|
765
765
|
class="pp-fallback np:absolute np:inset-0"
|
|
766
|
-
style=${styleMap_js.styleMap({background:this.bgColor??t,fontSize:`${
|
|
767
|
-
${
|
|
766
|
+
style=${styleMap_js.styleMap({background:this.bgColor??t,fontSize:`${oe(this.pixelSize)}px`})}>
|
|
767
|
+
${Y(this.alt)}
|
|
768
768
|
</div>
|
|
769
769
|
`}let e=this.pixelSize*.5;return lit.html`
|
|
770
770
|
<svg
|
|
@@ -782,25 +782,25 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
782
782
|
decoding="async"
|
|
783
783
|
@load=${this.handleLoad}
|
|
784
784
|
@error=${this.handleError}
|
|
785
|
-
class=${
|
|
785
|
+
class=${R("pp-image",this.isLoaded?"pp-image-loaded":"pp-image-loading")}
|
|
786
786
|
draggable="false" />
|
|
787
|
-
`}renderRing(){if(!this.ring?.show)return lit.nothing;let e=this.ring.width??3,t=this.ring.gap??3,
|
|
787
|
+
`}renderRing(){if(!this.ring?.show)return lit.nothing;let e=this.ring.width??3,t=this.ring.gap??3,n=e+t,i,p=this.ring.progress!==void 0;if(p){let d=this.ring.progress??0,g=this.ring.color??"#30D158",f=this.ring.emptyColor??"#8E8E93";i=ye(d,g,f);}else this.ring.gradient&&this.ring.gradient.length>0?i=we(this.ring.gradient):i=this.ring.color??"linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888)";return lit.html`
|
|
788
788
|
<div
|
|
789
|
-
class=${
|
|
790
|
-
style=${styleMap_js.styleMap({inset:`-${
|
|
789
|
+
class=${R("pp-ring",this.ring.animate&&!p&&"pp-ring-animated",p&&"pp-ring-progress")}
|
|
790
|
+
style=${styleMap_js.styleMap({inset:`-${n}px`,padding:`${e}px`,background:i,borderRadius:N[this.variant]})}>
|
|
791
791
|
</div>
|
|
792
|
-
`}getCornerOffset(){let e=this.border?this.borderWidth:0,t=this.pixelSize*.08,i={circle:1,square:.5,rounded:.8,squircle:1.2}[this.variant];return Math.round(t*i-e*.5)}renderPresence(){if(!this.presence)return lit.nothing;let e=this.presence.thickness??2,t=
|
|
792
|
+
`}getCornerOffset(){let e=this.border?this.borderWidth:0,t=this.pixelSize*.08,i={circle:1,square:.5,rounded:.8,squircle:1.2}[this.variant];return Math.round(t*i-e*.5)}renderPresence(){if(!this.presence)return lit.nothing;let e=this.presence.thickness??2,t=xe(this.pixelSize,e),n=me[this.presence.status],i=this.getCornerOffset();return lit.html`
|
|
793
793
|
<div
|
|
794
|
-
class=${
|
|
795
|
-
style=${styleMap_js.styleMap({width:`${t}px`,height:`${t}px`,backgroundColor:
|
|
794
|
+
class=${R("pp-presence",this.presence.animate&&"pp-presence-animated")}
|
|
795
|
+
style=${styleMap_js.styleMap({width:`${t}px`,height:`${t}px`,backgroundColor:n,bottom:`${i}px`,right:`${i}px`,color:n})}
|
|
796
796
|
title=${this.presence.status}>
|
|
797
797
|
</div>
|
|
798
|
-
`}renderBadge(){if(!this.badge)return lit.nothing;let e=this.badge.position??"bottom-right",t=this.badge.content!==void 0,
|
|
798
|
+
`}renderBadge(){if(!this.badge)return lit.nothing;let e=this.badge.position??"bottom-right",t=this.badge.content!==void 0,n=this.badge.icon!==void 0,i=t||n,{size:p,fontSize:d}=be(this.pixelSize,i),g=this.badge.bgColor??"#22c55e",f=this.badge.color??"#ffffff",m=this.badge.borderRadius??"9999px",h=t&&this.badge.content!==void 0?ve(this.badge.content,this.badge.max):null,v=n?this.badge.icon:null,z=d*.9,c=`${-this.getCornerOffset()}px`,L={"top-left":{top:c,left:c},"top-center":{top:c,left:"50%",transform:"translateX(-50%)"},"top-right":{top:c,right:c},"bottom-left":{bottom:c,left:c},"bottom-center":{bottom:c,left:"50%",transform:"translateX(-50%)"},"bottom-right":{bottom:c,right:c}};return lit.html`
|
|
799
799
|
<div
|
|
800
|
-
class=${
|
|
801
|
-
style=${styleMap_js.styleMap({width:i?"auto":`${p}px`,minWidth:`${p}px`,height:`${p}px`,padding:i?"0 6px":"0",fontSize:`${d}px`,backgroundColor:g,color:
|
|
802
|
-
${v?lit.html`<span class="pp-badge-icon" style=${styleMap_js.styleMap({fontSize:`${
|
|
803
|
-
${
|
|
800
|
+
class=${R("pp-badge",this.badge.pulse&&"pp-badge-pulse",this.badge.glow&&"pp-badge-glow",n&&"pp-badge-with-icon")}
|
|
801
|
+
style=${styleMap_js.styleMap({width:i?"auto":`${p}px`,minWidth:`${p}px`,height:`${p}px`,padding:i?"0 6px":"0",fontSize:`${d}px`,backgroundColor:g,color:f,borderRadius:m,"--pp-badge-glow-color":g,gap:n&&t?"4px":"0",...L[e]})}>
|
|
802
|
+
${v?lit.html`<span class="pp-badge-icon" style=${styleMap_js.styleMap({fontSize:`${z}px`})}>${v}</span>`:lit.nothing}
|
|
803
|
+
${h??lit.nothing}
|
|
804
804
|
</div>
|
|
805
805
|
`}render(){let e=this.getContainerStyles(),t=this.interactive?.focusable||this.interactive?.pressable?0:void 0;return lit.html`
|
|
806
806
|
<div
|
|
@@ -817,7 +817,7 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
817
817
|
<!-- Inner container for image clipping -->
|
|
818
818
|
<div
|
|
819
819
|
class="pp-inner"
|
|
820
|
-
style=${styleMap_js.styleMap({borderRadius:
|
|
820
|
+
style=${styleMap_js.styleMap({borderRadius:N[this.variant]})}>
|
|
821
821
|
<!-- Placeholder -->
|
|
822
822
|
${this.renderPlaceholder()}
|
|
823
823
|
|
|
@@ -831,7 +831,7 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
831
831
|
<!-- Presence Indicator -->
|
|
832
832
|
${this.renderPresence()}
|
|
833
833
|
</div>
|
|
834
|
-
`}};
|
|
834
|
+
`}};s([decorators_js.property({type:String})],a.prototype,"src"),s([decorators_js.property({type:String})],a.prototype,"alt"),s([decorators_js.property({type:String,attribute:"ext-customer-id"})],a.prototype,"extCustomerId"),s([decorators_js.property({type:String})],a.prototype,"size"),s([decorators_js.property({type:String})],a.prototype,"variant"),s([decorators_js.property({type:String})],a.prototype,"shadow"),s([decorators_js.property({type:Boolean})],a.prototype,"border"),s([decorators_js.property({type:Number,attribute:"border-width"})],a.prototype,"borderWidth"),s([decorators_js.property({type:String,attribute:"border-color"})],a.prototype,"borderColor"),s([decorators_js.property({type:Number})],a.prototype,"rotation"),s([decorators_js.property({type:String,attribute:"bg-color"})],a.prototype,"bgColor"),s([decorators_js.property({type:String,attribute:"bg-gradient"})],a.prototype,"bgGradient"),s([decorators_js.property({type:Object,attribute:"ring",converter:{fromAttribute:e=>{if(e)try{return JSON.parse(e)}catch{return}},toAttribute:e=>e?JSON.stringify(e):null}})],a.prototype,"ring"),s([decorators_js.property({type:Object,attribute:"presence",converter:{fromAttribute:e=>{if(e)try{return JSON.parse(e)}catch{return}},toAttribute:e=>e?JSON.stringify(e):null}})],a.prototype,"presence"),s([decorators_js.property({type:Object,attribute:"glow",converter:{fromAttribute:e=>{if(e)try{return JSON.parse(e)}catch{return}},toAttribute:e=>e?JSON.stringify(e):null}})],a.prototype,"glow"),s([decorators_js.property({type:Object,attribute:"badge",converter:{fromAttribute:e=>{if(e)try{return JSON.parse(e)}catch{return}},toAttribute:e=>e?JSON.stringify(e):null}})],a.prototype,"badge"),s([decorators_js.property({type:String})],a.prototype,"loading"),s([decorators_js.property({type:String})],a.prototype,"placeholder"),s([decorators_js.property({type:String,attribute:"placeholder-color"})],a.prototype,"placeholderColor"),s([decorators_js.property({type:String})],a.prototype,"fallback"),s([decorators_js.property({type:Object,attribute:"interactive",converter:{fromAttribute:e=>{if(e)try{return JSON.parse(e)}catch{return}},toAttribute:e=>e?JSON.stringify(e):null}})],a.prototype,"interactive"),s([decorators_js.state()],a.prototype,"isLoaded"),s([decorators_js.state()],a.prototype,"hasError"),s([decorators_js.state()],a.prototype,"cdnImageUrl"),s([decorators_js.state()],a.prototype,"cdnLoadFailed");var H=a;customElements.get("profile-picture")||customElements.define("profile-picture",H);var le=false;function Ze(){if(le||typeof document>"u")return;(typeof requestIdleCallback<"u"?requestIdleCallback:o=>setTimeout(o,1))(()=>{if(le)return;let o=document.createElement("style");o.textContent=Ae,document.head.appendChild(o),le=true;});}var b=class extends lit.LitElement{constructor(){super(...arguments);this.max=I.max;this.direction=I.direction;this.overlap=I.overlap;this.size=I.size;this.showAddButton=false;this.addButtonLabel="Add user";this.animated=I.animated;this.rotationAmount=0;this.users=[];this.dropdownOpen=false;this.tooltipData=null;this.tooltipTimeout=null;this.slotObserver=null;this.portalContainer=null;this.counterRef=null;this.handleBackdropClick=()=>{this.dropdownOpen=false,this.destroyPortal();};}createRenderRoot(){return Ze(),this}get pixelSize(){return Ce(this.size)}get tooltipEnabled(){return this.tooltip?.enabled!==false}get tooltipPosition(){return this.tooltip?.position??"top"}get tooltipDelay(){return this.tooltip?.delay??I.tooltipDelay}get dropdownMaxHeight(){return this.dropdown?.maxHeight??I.dropdownMaxHeight}get showPresence(){return this.dropdown?.showPresence!==false}get dropdownPosition(){return this.dropdown?.position??"bottom"}connectedCallback(){super.connectedCallback(),this.updateUsers(),this.setupSlotObserver();}disconnectedCallback(){super.disconnectedCallback(),this.slotObserver?.disconnect(),this.clearTooltipTimeout(),this.destroyPortal();}setupSlotObserver(){this.slotObserver=new MutationObserver(()=>{this.updateUsers();}),this.slotObserver.observe(this,{childList:true,subtree:true,attributes:true,attributeFilter:["src","alt","ext-customer-id","data-user-id","data-status","variant","shadow","border","border-width","border-color","bg-color","bg-gradient"]});}updateUsers(){let e=Array.from(this.children).filter(t=>t.tagName.toLowerCase()==="profile-picture"&&t.getAttribute("slot")!=="internal");this.users=e.map((t,n)=>{let i=(g,f)=>{let m=f??g,h=t[g];return h!=null&&h!==""?String(h):t.getAttribute(m)??void 0},p=i("borderWidth","border-width"),d=p?Number.parseInt(String(p),10):void 0;return {id:i("dataUserId","data-user-id"),name:i("alt")??`User ${n+1}`,src:i("src"),extCustomerId:i("extCustomerId","ext-customer-id"),status:i("dataStatus","data-status"),element:t,index:n,variant:i("variant"),shadow:i("shadow"),border:!!(t.border??t.hasAttribute("border")),borderWidth:d,borderColor:i("borderColor","border-color"),bgColor:i("bgColor","bg-color"),bgGradient:i("bgGradient","bg-gradient")}});for(let t of this.users)t.element&&(t.element.style.display="none");}createPortal(){this.portalContainer||(this.portalContainer=document.createElement("div"),this.portalContainer.className="ppg-portal",this.portalContainer.style.cssText="position: fixed; z-index: 99999; pointer-events: none;",document.body.appendChild(this.portalContainer),document.body.style.overflow="hidden");}destroyPortal(){this.portalContainer&&(lit.render(lit.nothing,this.portalContainer),this.portalContainer.remove(),this.portalContainer=null,document.body.style.overflow="");}updatePortalContent(e){if(!(this.portalContainer&&this.counterRef))return;let t=this.counterRef.getBoundingClientRect(),n=10,i=280,p=Math.min(this.dropdownMaxHeight+60,e.length*56+60),d=window.innerWidth,g=window.innerHeight;if(d<480){let y=lit.html`
|
|
835
835
|
<div
|
|
836
836
|
class="ppg-backdrop ppg-backdrop-visible"
|
|
837
837
|
style="pointer-events: auto; background: rgba(0,0,0,0.5);"
|
|
@@ -852,10 +852,10 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
852
852
|
class="ppg-dropdown-list"
|
|
853
853
|
style=${styleMap_js.styleMap({maxHeight:"calc(70vh - 60px)"})}
|
|
854
854
|
>
|
|
855
|
-
${e.map(
|
|
855
|
+
${e.map(T=>this.renderDropdownItem(T))}
|
|
856
856
|
</div>
|
|
857
857
|
</div>
|
|
858
|
-
`;lit.render(y,this.portalContainer);return}let
|
|
858
|
+
`;lit.render(y,this.portalContainer);return}let m=g-t.bottom-n,h=t.top-n,v=d-t.left,z=t.right,x=this.dropdownPosition;x==="bottom"&&m<p&&h>m?x="top":x==="top"&&h<p&&m>h&&(x="bottom");let c;v>=i?c=t.left:z>=i?c=t.right-i:c=(d-i)/2,c=Math.max(8,Math.min(c,d-i-8));let L=x==="bottom"?t.bottom+n:void 0,U=x==="top"?g-t.top+n:void 0,j=lit.html`
|
|
859
859
|
<div
|
|
860
860
|
class="ppg-backdrop"
|
|
861
861
|
style="pointer-events: auto;"
|
|
@@ -864,7 +864,7 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
864
864
|
></div>
|
|
865
865
|
<div
|
|
866
866
|
class="ppg-dropdown ppg-dropdown-portal"
|
|
867
|
-
style=${styleMap_js.styleMap({position:"fixed",pointerEvents:"auto",top:
|
|
867
|
+
style=${styleMap_js.styleMap({position:"fixed",pointerEvents:"auto",top:L!==void 0?`${L}px`:"auto",bottom:U!==void 0?`${U}px`:"auto",left:`${c}px`,width:`${i}px`})}
|
|
868
868
|
data-position=${x}
|
|
869
869
|
role="menu"
|
|
870
870
|
aria-label="Hidden users"
|
|
@@ -879,7 +879,7 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
879
879
|
${e.map(y=>this.renderDropdownItem(y))}
|
|
880
880
|
</div>
|
|
881
881
|
</div>
|
|
882
|
-
`;lit.render(j,this.portalContainer);}handleAvatarClick(e){this.dispatchEvent(new CustomEvent("avatar-click",{detail:{user:e},bubbles:true,composed:true}));}handleAvatarHover(e,t){if(!this.tooltipEnabled)return;this.clearTooltipTimeout();let
|
|
882
|
+
`;lit.render(j,this.portalContainer);}handleAvatarClick(e){this.dispatchEvent(new CustomEvent("avatar-click",{detail:{user:e},bubbles:true,composed:true}));}handleAvatarHover(e,t){if(!this.tooltipEnabled)return;this.clearTooltipTimeout();let n=t.currentTarget;this.tooltipTimeout=window.setTimeout(()=>{this.tooltipData={user:e,rect:n.getBoundingClientRect()};},this.tooltipDelay),this.dispatchEvent(new CustomEvent("avatar-hover",{detail:{user:e},bubbles:true,composed:true}));}handleAvatarLeave(){this.clearTooltipTimeout(),this.tooltipData=null;}clearTooltipTimeout(){this.tooltipTimeout&&(window.clearTimeout(this.tooltipTimeout),this.tooltipTimeout=null);}handleCounterClick(e){this.dropdownOpen=!this.dropdownOpen,this.dropdownOpen?(this.createPortal(),this.updatePortalContent(e)):this.destroyPortal(),this.dispatchEvent(new CustomEvent("counter-click",{detail:{hiddenUsers:e,open:this.dropdownOpen},bubbles:true,composed:true}));}handleDropdownItemClick(e){this.dropdownOpen=false,this.destroyPortal(),this.dispatchEvent(new CustomEvent("dropdown-item-click",{detail:{user:e},bubbles:true,composed:true}));}handleAddClick(){this.dispatchEvent(new CustomEvent("add-click",{bubbles:true,composed:true}));}handleKeyDown(e,t){(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),t());}renderAvatar(e,t,n){let i=X(t,this.pixelSize,this.overlap,this.direction,this.spacing),p=Se(t,n,this.direction),d=e.variant??"circle",g=e.shadow??"none",f=this.rotationAmount?t%2===0?-this.rotationAmount:this.rotationAmount:0;return lit.html`
|
|
883
883
|
<div
|
|
884
884
|
class="ppg-avatar-wrapper"
|
|
885
885
|
style=${styleMap_js.styleMap({left:`${i}px`,zIndex:String(p),width:`${this.pixelSize}px`,height:`${this.pixelSize}px`})}
|
|
@@ -887,19 +887,19 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
887
887
|
role="button"
|
|
888
888
|
aria-label=${e.name}
|
|
889
889
|
@click=${()=>this.handleAvatarClick(e)}
|
|
890
|
-
@mouseenter=${
|
|
890
|
+
@mouseenter=${m=>this.handleAvatarHover(e,m)}
|
|
891
891
|
@mouseleave=${this.handleAvatarLeave}
|
|
892
|
-
@keydown=${
|
|
892
|
+
@keydown=${m=>this.handleKeyDown(m,()=>this.handleAvatarClick(e))}
|
|
893
893
|
>
|
|
894
|
-
${this.renderProfilePicture(e,d,g,
|
|
894
|
+
${this.renderProfilePicture(e,d,g,f)}
|
|
895
895
|
</div>
|
|
896
|
-
`}renderProfilePicture(e,t,
|
|
896
|
+
`}renderProfilePicture(e,t,n,i){return lit.html`
|
|
897
897
|
<profile-picture
|
|
898
898
|
.src=${e.src||void 0}
|
|
899
899
|
.alt=${e.name}
|
|
900
900
|
.size=${this.pixelSize}
|
|
901
901
|
.variant=${t}
|
|
902
|
-
.shadow=${
|
|
902
|
+
.shadow=${n}
|
|
903
903
|
.rotation=${i}
|
|
904
904
|
.extCustomerId=${e.extCustomerId}
|
|
905
905
|
?border=${e.border}
|
|
@@ -910,16 +910,16 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
910
910
|
data-user-id=${e.id??""}
|
|
911
911
|
data-status=${e.status??""}
|
|
912
912
|
></profile-picture>
|
|
913
|
-
`}renderCounter(e,t,
|
|
913
|
+
`}renderCounter(e,t,n){return lit.html`
|
|
914
914
|
<button
|
|
915
915
|
class="ppg-counter"
|
|
916
916
|
style=${styleMap_js.styleMap({left:`${t}px`,width:`${this.pixelSize}px`,height:`${this.pixelSize}px`,zIndex:"1"})}
|
|
917
917
|
aria-label=${`${e} more users`}
|
|
918
918
|
aria-expanded=${this.dropdownOpen}
|
|
919
919
|
aria-haspopup="true"
|
|
920
|
-
@click=${()=>this.handleCounterClick(
|
|
920
|
+
@click=${()=>this.handleCounterClick(n)}
|
|
921
921
|
>
|
|
922
|
-
${
|
|
922
|
+
${$e(e)}
|
|
923
923
|
</button>
|
|
924
924
|
`}renderAddButton(e){let t=Math.round(this.pixelSize*.4);return lit.html`
|
|
925
925
|
<button
|
|
@@ -943,16 +943,16 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
943
943
|
<line x1="5" y1="12" x2="19" y2="12"></line>
|
|
944
944
|
</svg>
|
|
945
945
|
</button>
|
|
946
|
-
`}renderTooltip(){if(!this.tooltipData)return lit.nothing;let{user:e,rect:t}=this.tooltipData,
|
|
946
|
+
`}renderTooltip(){if(!this.tooltipData)return lit.nothing;let{user:e,rect:t}=this.tooltipData,n=8,i=this.getBoundingClientRect(),p=t.left-i.left+t.width/2,d=t.top-i.top,g=t.bottom-i.top,f=this.tooltipPosition==="top";return lit.html`
|
|
947
947
|
<div
|
|
948
948
|
class="ppg-tooltip"
|
|
949
|
-
style=${styleMap_js.styleMap({top:
|
|
949
|
+
style=${styleMap_js.styleMap({top:f?"auto":`${g+n}px`,bottom:f?`${i.height-d+n}px`:"auto",left:`${p}px`})}
|
|
950
950
|
data-position=${this.tooltipPosition}
|
|
951
951
|
role="tooltip"
|
|
952
952
|
>
|
|
953
953
|
${e.name}
|
|
954
954
|
</div>
|
|
955
|
-
`}renderDropdownItem(e){let t=
|
|
955
|
+
`}renderDropdownItem(e){let t=K(e.name),n=e.src||e.extCustomerId;return lit.html`
|
|
956
956
|
<div
|
|
957
957
|
class="ppg-dropdown-item"
|
|
958
958
|
role="menuitem"
|
|
@@ -960,7 +960,7 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
960
960
|
@click=${()=>this.handleDropdownItemClick(e)}
|
|
961
961
|
@keydown=${i=>this.handleKeyDown(i,()=>this.handleDropdownItemClick(e))}
|
|
962
962
|
>
|
|
963
|
-
${
|
|
963
|
+
${n?lit.html`<profile-picture
|
|
964
964
|
class="ppg-dropdown-avatar"
|
|
965
965
|
.src=${e.src||void 0}
|
|
966
966
|
.alt=${e.name}
|
|
@@ -972,7 +972,7 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
972
972
|
class="ppg-dropdown-avatar-fallback"
|
|
973
973
|
style=${styleMap_js.styleMap({background:t})}
|
|
974
974
|
>
|
|
975
|
-
${
|
|
975
|
+
${Y(e.name)}
|
|
976
976
|
</div>`}
|
|
977
977
|
<div class="ppg-dropdown-info">
|
|
978
978
|
<div class="ppg-dropdown-name">${e.name}</div>
|
|
@@ -987,9 +987,9 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
987
987
|
`:lit.nothing}
|
|
988
988
|
</div>
|
|
989
989
|
</div>
|
|
990
|
-
`}formatStatus(e){return {online:"Online",away:"Away",busy:"Busy",offline:"Offline",dnd:"Do not disturb"}[e]??e}updated(e){super.updated(e);let t=this.querySelector(".ppg-counter");if(t&&(this.counterRef=t),this.dropdownOpen&&this.portalContainer){let{visible:
|
|
990
|
+
`}formatStatus(e){return {online:"Online",away:"Away",busy:"Busy",offline:"Offline",dnd:"Do not disturb"}[e]??e}updated(e){super.updated(e);let t=this.querySelector(".ppg-counter");if(t&&(this.counterRef=t),this.dropdownOpen&&this.portalContainer){let{visible:n}=ne(this.users.length,this.max,this.showAddButton),i=this.users.slice(n);this.updatePortalContent(i);}}render(){let{visible:e,hidden:t,showCounter:n}=ne(this.users.length,this.max,this.showAddButton),i=this.direction==="ltr"?this.users.slice(0,e):this.users.slice(0,e).reverse(),p=this.users.slice(e),d=e;n&&d++,this.showAddButton&&d++;let g=ke(d,this.pixelSize,this.overlap,this.spacing),f=n?X(e,this.pixelSize,this.overlap,this.direction,this.spacing):0,m=X(e+(n?1:0),this.pixelSize,this.overlap,this.direction,this.spacing);return lit.html`
|
|
991
991
|
<div
|
|
992
|
-
class=${
|
|
992
|
+
class=${R("ppg-container",this.animated&&"ppg-animated")}
|
|
993
993
|
style=${styleMap_js.styleMap({width:`${g}px`,height:`${this.pixelSize}px`})}
|
|
994
994
|
role="group"
|
|
995
995
|
aria-label="User avatars"
|
|
@@ -998,16 +998,16 @@ ${Je}`;var a=class extends lit.LitElement{constructor(){super(...arguments);this
|
|
|
998
998
|
<slot style="display: none;"></slot>
|
|
999
999
|
|
|
1000
1000
|
<!-- Visible avatars -->
|
|
1001
|
-
${i.map((
|
|
1001
|
+
${i.map((h,v)=>this.renderAvatar(h,v,e))}
|
|
1002
1002
|
|
|
1003
1003
|
<!-- Counter -->
|
|
1004
|
-
${
|
|
1004
|
+
${n?this.renderCounter(t,f,p):lit.nothing}
|
|
1005
1005
|
|
|
1006
1006
|
<!-- Add button -->
|
|
1007
|
-
${this.showAddButton?this.renderAddButton(
|
|
1007
|
+
${this.showAddButton?this.renderAddButton(m):lit.nothing}
|
|
1008
1008
|
|
|
1009
1009
|
<!-- Tooltip -->
|
|
1010
1010
|
${this.renderTooltip()}
|
|
1011
1011
|
</div>
|
|
1012
|
-
`}};s([decorators_js.property({type:Number})],
|
|
1012
|
+
`}};s([decorators_js.property({type:Number})],b.prototype,"max"),s([decorators_js.property({type:String})],b.prototype,"direction"),s([decorators_js.property({type:Number})],b.prototype,"overlap"),s([decorators_js.property({type:String})],b.prototype,"size"),s([decorators_js.property({type:Number})],b.prototype,"spacing"),s([decorators_js.property({type:Object})],b.prototype,"tooltip"),s([decorators_js.property({type:Object})],b.prototype,"dropdown"),s([decorators_js.property({type:Boolean,attribute:"show-add-button"})],b.prototype,"showAddButton"),s([decorators_js.property({type:String,attribute:"add-button-label"})],b.prototype,"addButtonLabel"),s([decorators_js.property({type:Boolean})],b.prototype,"animated"),s([decorators_js.property({type:Number,attribute:"rotation-amount"})],b.prototype,"rotationAmount"),s([decorators_js.state()],b.prototype,"users"),s([decorators_js.state()],b.prototype,"dropdownOpen"),s([decorators_js.state()],b.prototype,"tooltipData");customElements.get("profile-picture-group")||customElements.define("profile-picture-group",b);var ce=Le__default.default.forwardRef(({max:r,direction:o,overlap:e,size:t,spacing:n,tooltip:i,dropdown:p,showAddButton:d,addButtonLabel:g,animated:f,rotationAmount:m,onAvatarClick:h,onAvatarHover:v,onCounterClick:z,onDropdownItemClick:x,onAddClick:c,className:L,style:U,children:j},y)=>{let T=Le.useRef(null),B=Le.useCallback(l=>{h?.(l.detail.user);},[h]),M=Le.useCallback(l=>{v?.(l.detail.user);},[v]),O=Le.useCallback(l=>{let k=l;z?.(k.detail.hiddenUsers,k.detail.open);},[z]),V=Le.useCallback(l=>{x?.(l.detail.user);},[x]),W=Le.useCallback(()=>{c?.();},[c]);return Le.useEffect(()=>{let l=T.current;if(l)return l.addEventListener("avatar-click",B),l.addEventListener("avatar-hover",M),l.addEventListener("counter-click",O),l.addEventListener("dropdown-item-click",V),l.addEventListener("add-click",W),()=>{l.removeEventListener("avatar-click",B),l.removeEventListener("avatar-hover",M),l.removeEventListener("counter-click",O),l.removeEventListener("dropdown-item-click",V),l.removeEventListener("add-click",W);}},[B,M,O,V,W]),Le.useEffect(()=>{typeof y=="function"?y(T.current):y&&(y.current=T.current);},[y]),Le__default.default.createElement("profile-picture-group",{ref:T,max:r,direction:o,overlap:e,size:t,spacing:n,tooltip:i?JSON.stringify(i):void 0,dropdown:p?JSON.stringify(p):void 0,"show-add-button":d||void 0,"add-button-label":g,animated:f,"rotation-amount":m,class:L,style:U},j)});ce.displayName="ProfilePictureGroup";function tt(r){H.setCdnBaseUrl(r);}function rt(){return H.getCdnBaseUrl()}function Me({src:r,alt:o,extCustomerId:e,size:t,variant:n,shadow:i,border:p,borderWidth:d,borderColor:g,rotation:f,bgColor:m,bgGradient:h,glow:v,ring:z,presence:x,badge:c,loading:L,placeholder:U,placeholderColor:j,fallback:y,interactive:T,onLoad:B,onError:M,onCdnError:O,className:V,style:W,ref:l}){let k=Le.useRef(null),Q=Le.useCallback(()=>{B?.();},[B]),_=Le.useCallback(()=>{M?.();},[M]),ee=Le.useCallback(D=>{O?.(D.detail);},[O]);return Le.useEffect(()=>{let D=k.current;if(D)return D.addEventListener("load",Q),D.addEventListener("error",_),D.addEventListener("cdn-error",ee),()=>{D.removeEventListener("load",Q),D.removeEventListener("error",_),D.removeEventListener("cdn-error",ee);}},[Q,_,ee]),Le.useEffect(()=>{typeof l=="function"?l(k.current):l&&(l.current=k.current);},[l]),Le__default.default.createElement("profile-picture",{ref:k,src:r||void 0,alt:o,"ext-customer-id":e,size:t,variant:n,shadow:i,border:p||void 0,"border-width":d,"border-color":g,rotation:f,"bg-color":m,"bg-gradient":h,glow:v?JSON.stringify(v):void 0,ring:z?JSON.stringify(z):void 0,presence:x?JSON.stringify(x):void 0,badge:c?JSON.stringify(c):void 0,loading:L,placeholder:U,"placeholder-color":j,fallback:y,interactive:T?JSON.stringify(T):void 0,class:V,style:W})}Me.displayName="ProfilePicture";fe();exports.ProfilePicture=Me;exports.ProfilePictureGroup=ce;exports.constructCdnUrl=se;exports.detectThemeFromColor=ae;exports.getCdnBaseUrl=rt;exports.getCdnSizeLabel=ie;exports.setCdnBaseUrl=tt;//# sourceMappingURL=index.cjs.map
|
|
1013
1013
|
//# sourceMappingURL=index.cjs.map
|