nostr-components 0.2.0

package/dist/components/nostr-live-chat.es.js

@@ -0,0 +1,523 @@
+var P=Object.defineProperty;var H=(h,f,t)=>f in h?P(h,f,{enumerable:!0,configurable:!0,writable:!0,value:t}):h[f]=t;var a=(h,f,t)=>H(h,typeof f!="symbol"?f+"":f,t);import{_ as L}from"../assets/preload-helper-D7HrI6pR.js";import{N as A,D,c as v,d as $,e as M,g as S}from"../assets/nostr-service-pr_crY62.js";import{g as R,a as C}from"../assets/theme-C1r1Zw8r.js";import{r as U}from"../assets/nip05-utils-BNBHUmkr.js";import"../assets/icons-Dr_d9MII.js";function K(h){try{return new Date(h*1e3).toLocaleString()}catch{return""}}function _(h){try{const f=Date.now(),t=h*1e3,r=f-t,e=Math.floor(r/1e3);if(e<60)return"just now";if(e<3600){const s=Math.floor(e/60);return`${s} ${s===1?"min":"mins"} ago`}if(e<86400){const s=Math.floor(e/3600);return`${s} ${s===1?"hour":"hours"} ago`}if(e<2592e3){const s=Math.floor(e/86400);return`${s} ${s===1?"day":"days"} ago`}if(e<31536e3){const s=Math.floor(e/2592e3);return`${s} ${s===1?"month":"months"} ago`}const o=Math.floor(e/31536e3);return`${o} ${o===1?"year":"years"} ago`}catch{return""}}function I(h){return h==="me"||h==="them"?h:"them"}function y(h){return h==null?"":String(h).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;")}function O({theme:h,recipientNpub:f,recipientName:t,recipientPicture:r,message:e,messages:o,isLoading:s,isFinding:l,isError:p,errorMessage:i,currentUserName:d,currentUserPicture:b,showWelcome:k,welcomeText:u,startChatText:n,maxMessageLength:g}){const m=typeof g=="number"?g:1e3,N=(e||"").length,E=Math.max(0,m-N),T=E<=10?"nostr-chat-char-counter warn":"nostr-chat-char-counter";return`
+    <div class="nostr-chat-container ${p?"nostr-chat-error":""}">
+      <div class="nostr-chat-header">
+        <div class="nostr-chat-header-left">
+          ${f&&t?`
+            <div class="nostr-chat-recipient">
+              <div class="nostr-chat-recipient-info">
+                <img 
+                  src="${y(r)||""}" 
+                  alt="${y(t)||""}" 
+                  class="nostr-chat-recipient-avatar"
+                  onerror="this.onerror=null; this.src='https://via.placeholder.com/40';"
+                >
+                <span class="nostr-chat-recipient-name">${y(t)||y(f)}</span>
+              </div>
+            </div>
+          `:`
+            <div class="nostr-chat-recipient-placeholder">
+              ${R(24,24)}
+              <span>Nostr Live Chat</span>
+            </div>
+          `}
+        </div>
+        <div class="nostr-chat-header-right">
+          ${d?`
+          <div class="nostr-chat-self">
+            <img 
+              src="${y(b)||""}"
+              alt="${y(d)||"You"}"
+              class="nostr-chat-self-avatar"
+              onerror="this.onerror=null; this.src='https://via.placeholder.com/32';"
+            >
+            <span class="nostr-chat-self-name">${y(d)}</span>
+          </div>
+        `:""}
+          <button class="nostr-chat-close-btn" title="Minimize">×</button>
+        </div>
+      </div>
+
+      <div class="nostr-chat-content">
+        ${f?k?`
+          <div class="nostr-chat-welcome">
+            <div class="nostr-chat-welcome-text">${y(u)||"Welcome!"}</div>
+            <button class="nostr-chat-start-btn">${y(n)||"Start chat"}</button>
+          </div>
+        `:`
+          <div class="nostr-chat-history">
+            ${o.map(w=>`
+              <div class="nostr-chat-message-row nostr-chat-message-${I(w.sender)} ${w.sender==="me"&&w.status==="sending"?"sending":""} ${w.sender==="me"&&w.status==="failed"?"failed":""}">
+                <div class="nostr-chat-message-bubble">${y(w.text)}</div>
+                <div class="nostr-chat-message-meta">
+                  <span class="nostr-chat-message-timestamp" title="${y(K(w.timestamp))}">${y(_(w.timestamp))}</span>
+                </div>
+              </div>
+            `).join("")}
+          </div>
+          <div class="nostr-chat-actions">
+            <textarea 
+              class="nostr-chat-textarea" 
+              placeholder="Type your message..."
+              maxlength="${m}"
+            >${y(e)}</textarea>
+            <div class="${T}" aria-live="polite">${E} chars left</div>
+            <button class="nostr-chat-send-btn" ${s?"disabled":""}>
+              ${s?C():"Send"}
+            </button>
+          </div>
+        `:`
+          <div class="nostr-chat-npub-input-container">
+            <input type="text" class="nostr-chat-npub-input" placeholder="Enter recipient's npub/nip05 address..." />
+            <button class="nostr-chat-find-btn" ${l?"disabled":""}>
+              ${l?`${C()} <span>Finding...</span>`:"<span>Find</span>"}
+            </button>
+          </div>
+        `}
+      </div>
+
+      ${p?`<small class="nostr-chat-error-message">${y(i)}</small>`:""}
+    </div>
+  `}function z(h){return`
+    <style>
+      :host {
+        --nstrc-chat-background-dark: #222222;
+        --nstrc-chat-background-light: #FFFFFF;
+        --nstrc-chat-text-color-dark: #FFFFFF;
+        --nstrc-chat-text-color-light: #000000;
+        --nstrc-chat-border-dark: 1px solid #444444;
+        --nstrc-chat-border-light: 1px solid #DDDDDD;
+        --nstrc-chat-input-background-dark: #333333;
+        --nstrc-chat-input-background-light: #F9F9F9;
+        --nstrc-chat-my-message-background-dark: #5A3E85;
+        --nstrc-chat-my-message-background-light: #E6DDF4;
+        /* Unified accent variables with light/dark variants */
+        --nstrc-chat-accent-color-dark: #5A3E85;
+        --nstrc-chat-accent-color-light: #7E4FD2;
+        --nstrc-chat-accent-text-color-dark: #FFFFFF;
+        --nstrc-chat-accent-text-color-light: #FFFFFF;
+        --nstrc-chat-their-message-background-dark: #3A3A3A;
+        --nstrc-chat-their-message-background-light: #F0F0F0;
+        --nstrc-chat-button-background-dark: #5A3E85;
+        --nstrc-chat-button-background-light: #7E4FD2;
+        --nstrc-chat-button-text-dark: #FFFFFF;
+        --nstrc-chat-button-text-light: #FFFFFF;
+        --nstrc-chat-error-color: #FF4D4F;
+        --nstrc-chat-border-radius: 12px;
+        
+        --nstrc-chat-background: var(--nstrc-chat-background-${h});
+        --nstrc-chat-text-color: var(--nstrc-chat-text-color-${h});
+        --nstrc-chat-border: var(--nstrc-chat-border-${h});
+        --nstrc-chat-input-background: var(--nstrc-chat-input-background-${h});
+        --nstrc-chat-my-message-background: var(--nstrc-chat-my-message-background-${h});
+        --nstrc-chat-their-message-background: var(--nstrc-chat-their-message-background-${h});
+        --nstrc-chat-button-background: var(--nstrc-chat-button-background-${h});
+        --nstrc-chat-button-text: var(--nstrc-chat-button-text-${h});
+        --nstrc-chat-accent-color: var(--nstrc-chat-accent-color-${h});
+        --nstrc-chat-accent-text-color: var(--nstrc-chat-accent-text-color-${h});
+      }
+
+      /* Floating modes shrink the host so it doesn't affect page layout */
+      :host([display-type="fab"]),
+      :host([display-type="bottom-bar"]),
+      :host([display-type="full"]) {
+        width: 0;
+        height: 0;
+      }
+
+      /* Floating panel wrapper */
+      .nostr-chat-float-panel {
+        position: fixed;
+        bottom: 20px;
+        right: 20px;
+        z-index: 2147483000;
+        box-shadow: 0 8px 24px rgba(0,0,0,0.18);
+        border-radius: var(--nstrc-chat-border-radius);
+        display: none;
+      }
+      .nostr-chat-float-panel.open { display: block; }
+
+      /* Close (minimize) button for floating panel */
+      .nostr-chat-close-btn {
+        width: 32px;
+        height: 32px;
+        border-radius: 50%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-weight: 700;
+        font-size: 16px;
+        cursor: pointer;
+        background: rgba(0,0,0,0.1);
+        color: var(--nstrc-chat-text-color);
+        border: none;
+        transition: background-color 0.2s ease;
+      }
+      .nostr-chat-close-btn:hover {
+        background: rgba(0,0,0,0.2);
+      }
+      
+      /* Hide close button in embed mode */
+      :host([display-type="embed"]) .nostr-chat-close-btn {
+        display: none;
+      }
+
+      /* Launcher: FAB */
+      .nostr-chat-launcher.fab {
+        position: fixed;
+        bottom: 20px;
+        right: 20px;
+        z-index: 2147483000;
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        font-family: Inter, sans-serif;
+      }
+      .nostr-chat-launcher .bubble {
+        background: var(--nstrc-chat-background);
+        color: var(--nstrc-chat-text-color);
+        border: var(--nstrc-chat-border);
+        border-radius: 14px;
+        padding: 10px 12px;
+        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
+      }
+      .nostr-chat-launcher .bubble .title { font-weight: 700; font-size: 14px; }
+      .nostr-chat-launcher .bubble .subtitle { font-size: 12px; opacity: 0.8; }
+      .nostr-chat-launcher .fab-btn {
+        width: 64px;
+        height: 64px;
+        border-radius: 50%;
+        background: var(--nstrc-chat-accent-color);
+        color: var(--nstrc-chat-accent-text-color);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border: none;
+        cursor: pointer;
+        box-shadow: 0 6px 20px rgba(0,0,0,0.18);
+        font-size: 24px; /* Larger emoji/icon */
+      }
+
+      /* Launcher: Bottom bar */
+      .nostr-chat-launcher.bottom-bar {
+        position: fixed;
+        left: 50%;
+        transform: translateX(-50%);
+        bottom: 20px;
+        z-index: 2147483000;
+      }
+      .nostr-chat-launcher .bar-btn {
+        padding: 12px 20px;
+        border-radius: 999px;
+        background: var(--nstrc-chat-accent-color);
+        color: var(--nstrc-chat-accent-text-color);
+        border: none;
+        cursor: pointer;
+        font-weight: 700;
+        box-shadow: 0 6px 20px rgba(0,0,0,0.18);
+      }
+
+      .nostr-chat-container {
+        display: flex;
+        flex-direction: column;
+        font-family: Inter, sans-serif;
+        width: 100%;
+        height: 100%;
+        max-width: 400px;
+        max-height: 600px;
+        box-sizing: border-box;
+        border-radius: var(--nstrc-chat-border-radius);
+        border: var(--nstrc-chat-border);
+        background-color: var(--nstrc-chat-background);
+        color: var(--nstrc-chat-text-color);
+        overflow: hidden;
+      }
+
+      .nostr-chat-header {
+        padding: 12px 16px;
+        border-bottom: var(--nstrc-chat-border);
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        flex-shrink: 0;
+      }
+      
+      .nostr-chat-header-right {
+        display: flex;
+        align-items: center;
+        gap: 12px;
+      }
+
+      .nostr-chat-recipient, .nostr-chat-recipient-placeholder {
+        display: flex;
+        align-items: center; /* Ensures vertical centering */
+        gap: 12px;
+      }
+
+      .nostr-chat-recipient-avatar {
+        width: 36px;
+        height: 36px;
+        border-radius: 50%;
+        object-fit: cover;
+      }
+
+      .nostr-chat-recipient-info {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+      }
+
+      .nostr-chat-recipient-name {
+        font-weight: 600;
+        font-size: 16px;
+        display: flex;
+        align-items: center;
+        height: 36px; /* Match avatar height */
+      }
+
+      .nostr-chat-self {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        opacity: 0.85;
+        font-size: 12px;
+      }
+      .nostr-chat-self-avatar {
+        width: 24px;
+        height: 24px;
+        border-radius: 50%;
+        object-fit: cover;
+      }
+
+      .nostr-chat-content {
+        padding: 16px;
+        display: flex;
+        flex-direction: column;
+        gap: 12px;
+        flex-grow: 1;
+        overflow-y: auto;
+      }
+      
+      /* Scrollbar styling for dark theme */
+      .nostr-chat-content::-webkit-scrollbar,
+      .nostr-chat-history::-webkit-scrollbar {
+        width: 8px;
+      }
+      .nostr-chat-content::-webkit-scrollbar-track,
+      .nostr-chat-history::-webkit-scrollbar-track {
+        background: transparent;
+      }
+      .nostr-chat-content::-webkit-scrollbar-thumb,
+      .nostr-chat-history::-webkit-scrollbar-thumb {
+        background: rgba(255, 255, 255, 0.2);
+        border-radius: 4px;
+      }
+      .nostr-chat-content::-webkit-scrollbar-thumb:hover,
+      .nostr-chat-history::-webkit-scrollbar-thumb:hover {
+        background: rgba(255, 255, 255, 0.3);
+      }
+      
+      .nostr-chat-history {
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+        flex-grow: 1;
+        overflow-y: auto;
+        padding-right: 10px; /* For scrollbar */
+        padding-bottom: 16px;
+      }
+
+      .nostr-chat-message-row {
+        display: flex;
+        width: 100%;
+        flex-direction: column;
+        align-items: flex-start;
+      }
+
+      .nostr-chat-message-me {
+        justify-content: flex-end;
+        align-items: flex-end;
+      }
+
+      .nostr-chat-message-them {
+        justify-content: flex-start;
+        align-items: flex-start;
+      }
+
+      .nostr-chat-message-bubble {
+        padding: 8px 12px;
+        border-radius: 18px;
+        max-width: 75%;
+        word-wrap: break-word;
+      }
+
+      .nostr-chat-message-me .nostr-chat-message-bubble {
+        background-color: var(--nstrc-chat-accent-color);
+        color: var(--nstrc-chat-accent-text-color);
+        border-radius: 15px 15px 0 15px;
+        opacity: 1;
+      }
+
+      .nostr-chat-message-me.sending .nostr-chat-message-bubble {
+        opacity: 0.5;
+      }
+
+      .nostr-chat-message-me.failed .nostr-chat-message-bubble {
+        opacity: 1;
+        border: 1px dashed var(--nstrc-chat-error-color);
+      }
+
+      .nostr-chat-message-them .nostr-chat-message-bubble {
+        background-color: var(--nstrc-chat-their-message-background);
+        border-bottom-left-radius: 4px;
+      }
+
+      /* Message timestamp under bubble, always visible but with opacity change on hover */
+      .nostr-chat-message-meta {
+        font-size: 10px;
+        margin-top: 4px;
+        opacity: 0.5;
+        color: var(--nstrc-chat-text-color);
+        max-width: 75%;
+        transition: opacity 0.2s ease;
+        height: 14px; /* Fixed height to prevent layout jumps */
+      }
+      .nostr-chat-message-row:hover .nostr-chat-message-meta {
+        opacity: 0.9;
+      }
+      .nostr-chat-message-me .nostr-chat-message-meta {
+        text-align: right;
+      }
+      .nostr-chat-message-them .nostr-chat-message-meta {
+        text-align: left;
+      }
+
+      /* Slightly highlight timestamp for the last message */
+      .nostr-chat-history > .nostr-chat-message-row:last-of-type .nostr-chat-message-meta {
+        opacity: 0.75;
+      }
+
+      .nostr-chat-npub-input-container {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+        padding: 20px 0;
+      }
+
+      .nostr-chat-npub-input {
+        flex: 1;
+        padding: 10px;
+        box-sizing: border-box;
+        border-radius: 4px;
+        border: var(--nstrc-chat-border);
+        background-color: var(--nstrc-chat-input-background);
+        color: var(--nstrc-chat-text-color);
+      }
+
+      .nostr-chat-actions {
+        display: flex;
+        gap: 8px;
+        flex-shrink: 0;
+        border-top: var(--nstrc-chat-border);
+        padding-top: 12px;
+      }
+
+      .nostr-chat-welcome {
+        display: flex;
+        flex-direction: column;
+        gap: 12px;
+        align-items: center;
+        justify-content: center;
+        text-align: center;
+        padding: 12px 8px;
+      }
+      .nostr-chat-welcome-text {
+        opacity: 0.9;
+      }
+      .nostr-chat-start-btn {
+        padding: 10px 16px;
+        border-radius: 20px;
+        border: none;
+        background-color: var(--nstrc-chat-button-background);
+        color: var(--nstrc-chat-button-text);
+        cursor: pointer;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        font-weight: 600;
+      }
+
+      .nostr-chat-textarea {
+        flex-grow: 1;
+        height: 40px;
+        box-sizing: border-box;
+        padding: 10px;
+        border-radius: 20px;
+        border: var(--nstrc-chat-border);
+        background-color: var(--nstrc-chat-input-background);
+        color: var(--nstrc-chat-text-color);
+        font-family: Inter, sans-serif;
+        resize: none;
+        overflow-y: auto;
+      }
+
+      /* Character counter */
+      .nostr-chat-char-counter {
+        align-self: center;
+        font-size: 12px;
+        opacity: 0.75;
+        color: var(--nstrc-chat-text-color);
+        white-space: nowrap;
+        min-width: max-content;
+      }
+      .nostr-chat-char-counter.warn {
+        color: #ff8c00; /* Brighter orange color for warning */
+        opacity: 1;
+        font-weight: 700;
+      }
+
+      .nostr-chat-find-btn, .nostr-chat-send-btn {
+        padding: 10px 16px;
+        border-radius: 20px;
+        border: none;
+        background-color: var(--nstrc-chat-button-background);
+        color: var(--nstrc-chat-button-text);
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-weight: 600;
+      }
+
+      .nostr-chat-error-message {
+        color: var(--nstrc-chat-error-color);
+        font-size: 14px;
+        padding: 0 16px 16px;
+        text-align: center;
+      }
+    </style>
+  `}const x=class x extends HTMLElement{constructor(){super();a(this,"rendered",!1);a(this,"nostrService",A.getInstance());a(this,"dmSubscription",null);a(this,"theme","light");a(this,"recipientNpub",null);a(this,"recipientNip05",null);a(this,"recipientName",null);a(this,"recipientPicture",null);a(this,"recipientPubkey",null);a(this,"message","");a(this,"messages",[]);a(this,"currentUserPubkey",null);a(this,"currentUserNpub",null);a(this,"currentUserName",null);a(this,"currentUserPicture",null);a(this,"displayType","embed");a(this,"isOpen",!1);a(this,"showWelcome",!1);a(this,"welcomeText",x.DEFAULT_WELCOME_TEXT);a(this,"startChatText",x.DEFAULT_START_CHAT_TEXT);a(this,"onlineText",x.DEFAULT_ONLINE_TEXT);a(this,"helpText",x.DEFAULT_HELP_TEXT);a(this,"MESSAGE_MAX_LENGTH",1e3);a(this,"isLoading",!1);a(this,"isFinding",!1);a(this,"isError",!1);a(this,"errorMessage","");a(this,"keySupplier",null);a(this,"boundHandleFind",null);a(this,"boundHandleSend",null);a(this,"boundHandleTextareaChange",null);a(this,"boundHandleLauncherClick",null);a(this,"boundHandleCloseClick",null);a(this,"boundHandleStartChat",null);a(this,"boundHandleNpubKeydown",null);a(this,"resubscribeTimer",null);a(this,"getRelays",()=>{const t=this.getAttribute("relays");return t?t.split(",").map(r=>r.trim()).filter(r=>r.length>0).filter((r,e,o)=>o.indexOf(r)===e):D});a(this,"getTheme",()=>{const t=this.getAttribute("theme"),r=(t||"").toLowerCase();r==="light"||r==="dark"?this.theme=r:(t&&console.warn(`Invalid theme '${t}'. Accepted values are 'light', 'dark'. Falling back to 'light'.`),this.theme="light")});a(this,"getRecipient",()=>{const t=this.getAttribute("pubkey");if(t)try{this.recipientPubkey=t,this.recipientNpub=v.npubEncode(t),this.lookupRecipient(this.recipientNpub);return}catch(o){const s=`Invalid recipient pubkey "${t}": ${o instanceof Error?o.message:String(o)}`;this.isError=!0,this.errorMessage=s,console.error("nostr-live-chat:",s,o),this.render();return}const r=this.getAttribute("nip05");if(r){this.recipientNip05=r,this.lookupRecipientByNip05();return}const e=this.getAttribute("npub");e&&(this.recipientNpub=e,this.lookupRecipient())});this.attachShadow({mode:"open"})}async getCurrentUserInfo(){var t,r,e,o,s,l,p,i,d,b;try{const k=this.nostrService.getNDK();let u=null;if(typeof window<"u"&&window.nostr){const n=window.nostr;console.log("Nostr extension found, checking for public key...");try{const g=!!(n.enable&&typeof n.enable=="function"&&n.getPublicKey&&typeof n.getPublicKey=="function");if(console.log("Is this nos2x extension?",g),g){console.log("Using nos2x specific flow");try{await n.enable(),console.log("nos2x extension enabled"),await new Promise(m=>setTimeout(m,100));const c=await n.getPublicKey();console.log("nos2x returned pubkey:",c),c&&typeof c=="string"&&c.length===64&&(u=c,console.log("Successfully got pubkey from nos2x:",u))}catch(c){console.error("Error with nos2x extension:",c)}}else{if(typeof n.enable=="function"){console.log("Attempting to enable generic extension...");try{await n.enable(),console.log("Extension enabled successfully")}catch(c){console.warn("Extension enable failed, continuing anyway:",c)}}if(typeof n.getPublicKey=="function"){console.log("Calling getPublicKey()...");try{u=await n.getPublicKey(),console.log("Got pubkey from extension:",u)}catch(c){console.error("Error getting public key:",c)}}else if(n.getPublicKey){console.log("Found getPublicKey property, resolving...");try{u=await Promise.resolve(n.getPublicKey),console.log("Got pubkey from extension (property):",u)}catch(c){console.error("Error resolving public key:",c)}}}}catch(g){console.error("Error in extension interaction:",g)}}if(!u){let n=null;if(this.keySupplier)try{n=await this.keySupplier()}catch{}if(n)try{const{NDKPrivateKeySigner:g}=await L(async()=>{const{NDKPrivateKeySigner:E}=await import("../assets/nostr-service-pr_crY62.js").then(T=>T.k);return{NDKPrivateKeySigner:E}},[]);let c=n;n.startsWith("nsec")&&(c=v.decode(n).data),u=(await new g(c).user()).pubkey}catch{}}if(u){this.currentUserPubkey=u,this.currentUserNpub=v.npubEncode(u),console.log("Got pubkey from extension and will use it:",u);try{const n=k.getUser({pubkey:u});console.log("Fetching profile for user:",u),await n.fetchProfile(),console.log("Fetched profile:",n.profile),this.currentUserName=((t=n.profile)==null?void 0:t.displayName)||((r=n.profile)==null?void 0:r.name)||((e=this.currentUserNpub)==null?void 0:e.substring(0,10))||null,this.currentUserPicture=((o=n.profile)==null?void 0:o.image)||null,this.currentUserName||console.warn("No username found in profile"),this.currentUserPicture||console.warn("No profile picture found"),console.log("Profile info set:",{name:this.currentUserName,picture:this.currentUserPicture,npub:this.currentUserNpub})}catch(n){console.error("Error fetching profile:",n),this.currentUserName=((s=this.currentUserNpub)==null?void 0:s.substring(0,10))||null}this.render()}else{console.log("Checking for direct nos2x logs in console...");try{if(await new Promise(n=>setTimeout(n,500)),typeof window<"u"&&window.nostr){console.log("Trying direct call to extension again...");try{const n=await window.nostr.getPublicKey();if(n&&typeof n=="string"){console.log("Got pubkey on second try:",n),this.currentUserPubkey=n,this.currentUserNpub=v.npubEncode(n);try{const g=k.getUser({pubkey:n});console.log("Fetching profile for user on second try:",n),await g.fetchProfile(),console.log("Fetched profile on second try:",g.profile),this.currentUserName=((l=g.profile)==null?void 0:l.displayName)||((p=g.profile)==null?void 0:p.name)||((i=this.currentUserNpub)==null?void 0:i.substring(0,10))||null,this.currentUserPicture=((d=g.profile)==null?void 0:d.image)||null,this.render();return}catch(g){console.error("Error fetching profile on second try:",g),this.currentUserName=((b=this.currentUserNpub)==null?void 0:b.substring(0,10))||null,this.render();return}}}catch(n){console.error("Error getting pubkey on direct second try:",n)}}}catch(n){console.error("Error in fallback pubkey detection:",n)}console.warn("No pubkey available from extension - trying fallback method")}}catch{}}getDisplayType(){const t=this.getAttribute("display-type"),r=["fab","bottom-bar","full","embed"],o=(t?String(t):"").toLowerCase(),s=r.includes(o)?o:"embed";this.displayType=s,this.displayType==="full"?this.isOpen=!0:this.displayType==="fab"||this.displayType==="bottom-bar"?(this.isOpen===void 0||this.isOpen===null)&&(this.isOpen=!1):this.isOpen=!1,this.getAttribute("display-type")!==s&&this.setAttribute("display-type",s)}connectedCallback(){if(!this.rendered){this.getTheme(),this.getDisplayType();const t=this.getAttribute("welcome-text");t&&(this.welcomeText=t);const r=this.getAttribute("start-chat-text");r&&(this.startChatText=r);const e=this.getAttribute("online-text");e&&(this.onlineText=e);const o=this.getAttribute("help-text");o&&(this.helpText=o),this.getRecipient(),this.nostrService.connectToNostr(this.getRelays()),this.getCurrentUserInfo(),this.render(),this.rendered=!0}}static get observedAttributes(){return["npub","pubkey","nip05","relays","theme","display-type","welcome-text","start-chat-text","online-text","help-text","history-days"]}unsubscribeFromDms(){if(this.dmSubscription){try{this.dmSubscription.stop()}catch{}this.dmSubscription=null}this.resubscribeTimer&&(clearTimeout(this.resubscribeTimer),this.resubscribeTimer=null)}clearRecipientAndChatState(){this.recipientPubkey=null,this.recipientNpub=null,this.recipientNip05=null,this.recipientName=null,this.recipientPicture=null,this.messages=[],this.message="",this.showWelcome=!1,this.isLoading=!1,this.isFinding=!1,this.isError=!1,this.errorMessage=""}attributeChangedCallback(t,r,e){if(this.rendered)if(t==="npub"){if(e===null){this.unsubscribeFromDms(),this.clearRecipientAndChatState(),this.render();return}e!==r&&(this.unsubscribeFromDms(),this.clearRecipientAndChatState(),this.recipientNpub=e,this.lookupRecipient());return}else if(t==="pubkey"){if(e===null){this.unsubscribeFromDms(),this.clearRecipientAndChatState(),this.render();return}if(e!==r){this.unsubscribeFromDms(),this.clearRecipientAndChatState();try{this.recipientPubkey=e,this.recipientNpub=v.npubEncode(e),this.lookupRecipient(this.recipientNpub)}catch{}}return}else if(t==="nip05"){if(e===null){this.unsubscribeFromDms(),this.clearRecipientAndChatState(),this.render();return}e!==r&&(this.unsubscribeFromDms(),this.clearRecipientAndChatState(),this.recipientNip05=e,this.lookupRecipientByNip05());return}else if(t==="relays"){if(e!==r){const o=this.getRelays();this.recipientPubkey&&!this.showWelcome?(this.resubscribeTimer&&clearTimeout(this.resubscribeTimer),this.resubscribeTimer=window.setTimeout(()=>{this.unsubscribeFromDms(),this.nostrService.connectToNostr(o),this.subscribeToDms()},300)):this.nostrService.connectToNostr(o)}}else t==="theme"?(this.getTheme(),this.render()):t==="display-type"?(this.getDisplayType(),this.render()):t==="welcome-text"?(this.welcomeText=e!==null?e:x.DEFAULT_WELCOME_TEXT,this.render()):t==="start-chat-text"?(this.startChatText=e!==null?e:x.DEFAULT_START_CHAT_TEXT,this.render()):t==="online-text"?(this.onlineText=e!==null?e:x.DEFAULT_ONLINE_TEXT,this.render()):t==="help-text"?(this.helpText=e!==null?e:x.DEFAULT_HELP_TEXT,this.render()):t==="history-days"&&e!==r&&this.recipientPubkey&&!this.showWelcome&&(this.resubscribeTimer&&clearTimeout(this.resubscribeTimer),this.resubscribeTimer=window.setTimeout(()=>{this.subscribeToDms()},250))}async lookupRecipient(t){var r,e,o;this.unsubscribeFromDms(),this.messages=[],this.showWelcome=!1,this.isFinding=!0,this.render();try{const s=t||this.recipientNpub;if(!s)return;const{type:l,data:p}=v.decode(s);if(l!=="npub")throw new Error("Invalid npub");this.recipientPubkey=p;const i=this.nostrService.getNDK().getUser({pubkey:this.recipientPubkey});await i.fetchProfile(),this.recipientName=((r=i.profile)==null?void 0:r.displayName)||((e=i.profile)==null?void 0:e.name)||s.substring(0,10),this.recipientPicture=((o=i.profile)==null?void 0:o.image)||null,this.showWelcome=!0,this.messages=[],this.isError=!1,this.errorMessage="",this.render()}catch(s){this.isError=!0,this.errorMessage=s.message}finally{this.isFinding=!1,this.render()}}async lookupRecipientByNip05(t){this.isFinding=!0,this.render();try{const r=t||this.recipientNip05;if(!r)return;const e=await U(r),o=v.npubEncode(e);this.recipientNpub=o,this.isError=!1,this.errorMessage="",await this.lookupRecipient(o)}catch(r){this.isError=!0,this.errorMessage=r.message}finally{this.isFinding=!1,this.render()}}handleFindClick(){const r=this.shadowRoot.querySelector(".nostr-chat-npub-input").value.trim();this.isError=!1,this.errorMessage="",this.render(),r&&(r.startsWith("npub")?(this.recipientNpub=r,this.lookupRecipient()):r.includes("@")?(this.recipientNip05=r,this.lookupRecipientByNip05()):(this.isError=!0,this.errorMessage="Invalid input. Please provide an npub or nip05 address.",this.render()))}async handleSendClick(){var r,e;if(!this.message.trim()||!this.recipientPubkey)return;if(this.message.length>this.MESSAGE_MAX_LENGTH){this.isError=!0,this.errorMessage=`Message is too long (max ${this.MESSAGE_MAX_LENGTH} characters).`,this.render();return}this.isLoading=!0,this.render();let t=null;try{const o=this.nostrService.getNDK();let s;if(typeof window<"u"&&window.nostr&&window.nostr.getPublicKey&&window.nostr.signEvent)try{s=new $}catch(d){console.error("Error creating NIP-07 signer:",d),this.isError=!0,this.errorMessage=`Error connecting to Nostr extension: ${d.message}`,this.isLoading=!1,this.render();return}if(!s)throw new Error("No signer available. Please install a NIP-07 extension or set a private key.");o.signer=s;const l=new M(o,{kind:S.EncryptedDirectMessage,tags:[["p",this.recipientPubkey]],created_at:Math.floor(Date.now()/1e3)});let p=!1;if(typeof((e=(r=window.nostr)==null?void 0:r.nip04)==null?void 0:e.encrypt)=="function")try{l.content=await window.nostr.nip04.encrypt(this.recipientPubkey,this.message.trim()),p=!0}catch(d){console.error("NIP-07 encryption failed, falling back to local encryption:",d)}if(!p)throw new Error("No private key available for encryption. Please use a NIP-07 extension.");t=`temp_${Date.now()}`,this.messages.push({id:t,text:this.message,sender:"me",timestamp:l.created_at,status:"sending"}),this.message="",this.render(),await l.publish();const i=this.messages.find(d=>d.id===t);i&&(this.messages.find(b=>b.id===l.id&&b.id!==t)?this.messages=this.messages.filter(b=>b.id!==t):(i.id=l.id,i.status="sent"),this.render())}catch(o){if(this.isError=!0,this.errorMessage=o.message,t){const s=this.messages.find(l=>l.id===t);s&&(s.status="failed"),this.render()}}finally{this.isLoading=!1,this.render()}}handleTextareaChange(t){var s;const r=t.target;this.message=r.value;const e=Math.max(0,this.MESSAGE_MAX_LENGTH-this.message.length),o=(s=this.shadowRoot)==null?void 0:s.querySelector(".nostr-chat-char-counter");o&&(o.textContent=`${e} chars left`,o.classList.toggle("warn",e<=10))}handleStartChat(){this.showWelcome=!1,this.subscribeToDms(),this.render()}async subscribeToDms(){if(this.dmSubscription&&this.dmSubscription.stop(),!this.recipientPubkey)return;let t=null;try{if(typeof window<"u"&&window.nostr&&window.nostr.getPublicKey)t={pubkey:await window.nostr.getPublicKey()};else{let i=null;if(this.keySupplier)try{i=await this.keySupplier()}catch{}if(i){const{NDKPrivateKeySigner:d}=await L(async()=>{const{NDKPrivateKeySigner:u}=await import("../assets/nostr-service-pr_crY62.js").then(n=>n.k);return{NDKPrivateKeySigner:u}},[]);let b=i;i.startsWith("nsec")&&(b=v.decode(i).data),t=await new d(b).user()}}}catch(i){console.error("Failed to determine current user for subscription",i)}if(!t){this.isError=!0,this.errorMessage="No signer available. Please install a NIP-07 extension or set a private key to start the chat.",this.render();return}this.messages=[];const r=this.getAttribute("history-days");let e;if(!r)e=void 0;else if(r.toLowerCase()==="all"||parseInt(r,10)<=0)e=void 0;else{const i=Math.max(1,parseInt(r,10)||30);e=Math.floor((Date.now()-i*24*60*60*1e3)/1e3)}const o={kinds:[S.EncryptedDirectMessage],"#p":[t.pubkey],authors:[this.recipientPubkey]},s={kinds:[S.EncryptedDirectMessage],"#p":[this.recipientPubkey],authors:[t.pubkey]},l=e!==void 0?{...o,since:e}:o,p=e!==void 0?{...s,since:e}:s;this.dmSubscription=this.nostrService.getNDK().subscribe([l,p],{closeOnEose:!1,groupable:!1}),this.dmSubscription.on("event",async i=>{var d;try{!this.currentUserPubkey&&t&&(this.currentUserPubkey=t.pubkey,this.currentUserNpub=v.npubEncode(t.pubkey));const b=i.pubkey===t.pubkey,k=b?(d=i.tags.find(c=>c[0]==="p"))==null?void 0:d[1]:i.pubkey;if(!k){try{console.debug("nostr-live-chat: skipping event with missing peer",i.id)}catch{}return}if(k!==this.recipientPubkey)return;if(b){const c=this.messages.find(m=>m.id===i.id);if(c){c.status==="sending"&&(c.status="sent",this.render());return}}let u="";if(!k){try{console.debug("nostr-live-chat: missing peer prior to decrypt, skipping",i.id)}catch{}return}if(!i.content||i.content.trim()===""){try{console.debug("nostr-live-chat: missing or empty content prior to decrypt, skipping",i.id)}catch{}return}if(window.nostr&&window.nostr.nip04&&typeof window.nostr.nip04.decrypt=="function")try{u=await window.nostr.nip04.decrypt(k,i.content)}catch(c){console.error("Failed to decrypt DM content:",c);return}else throw new Error("No private key available for decryption. Please use a NIP-07 extension.");if(b){const c=this.messages.find(m=>m.status==="sending"&&m.sender==="me"&&m.text===u&&Math.abs(m.timestamp-i.created_at)<2);if(c){c.id=i.id,c.status="sent",this.render();return}}const n={id:i.id,text:u,sender:b?"me":"them",timestamp:i.created_at,status:"sent"};this.messages.find(c=>c.id===n.id)||(this.messages.push(n),this.messages.sort((c,m)=>c.timestamp-m.timestamp),this.render())}catch(b){console.error("Failed to decrypt DM content:",b)}})}attachEventListeners(){const t=this.shadowRoot.querySelector(".nostr-chat-launcher");t&&(this.boundHandleLauncherClick&&t.removeEventListener("click",this.boundHandleLauncherClick),this.boundHandleLauncherClick=()=>{this.isOpen=!0,this.render()},t.addEventListener("click",this.boundHandleLauncherClick));const r=this.shadowRoot.querySelector(".nostr-chat-close-btn");r&&(this.boundHandleCloseClick&&r.removeEventListener("click",this.boundHandleCloseClick),this.boundHandleCloseClick=i=>{i==null||i.stopPropagation(),(this.displayType==="fab"||this.displayType==="bottom-bar")&&(this.isOpen=!1),this.render()},r.addEventListener("click",this.boundHandleCloseClick));const e=this.shadowRoot.querySelector(".nostr-chat-find-btn");e&&(this.boundHandleFind&&e.removeEventListener("click",this.boundHandleFind),this.boundHandleFind=this.handleFindClick.bind(this),e.addEventListener("click",this.boundHandleFind));const o=this.shadowRoot.querySelector(".nostr-chat-send-btn");o&&(this.boundHandleSend&&o.removeEventListener("click",this.boundHandleSend),this.boundHandleSend=this.handleSendClick.bind(this),o.addEventListener("click",this.boundHandleSend));const s=this.shadowRoot.querySelector(".nostr-chat-start-btn");s&&(this.boundHandleStartChat&&s.removeEventListener("click",this.boundHandleStartChat),this.boundHandleStartChat=this.handleStartChat.bind(this),s.addEventListener("click",this.boundHandleStartChat));const l=this.shadowRoot.querySelector(".nostr-chat-textarea");l&&(this.boundHandleTextareaChange&&l.removeEventListener("input",this.boundHandleTextareaChange),this.boundHandleTextareaChange=this.handleTextareaChange.bind(this),l.addEventListener("input",this.boundHandleTextareaChange));const p=this.shadowRoot.querySelector(".nostr-chat-npub-input");p&&(this.boundHandleNpubKeydown&&p.removeEventListener("keydown",this.boundHandleNpubKeydown),this.boundHandleNpubKeydown=i=>{i.key==="Enter"&&this.handleFindClick()},p.addEventListener("keydown",this.boundHandleNpubKeydown))}disconnectedCallback(){var i,d,b,k,u,n,g;this.dmSubscription&&this.dmSubscription.stop();const t=(i=this.shadowRoot)==null?void 0:i.querySelector(".nostr-chat-launcher");t&&this.boundHandleLauncherClick&&t.removeEventListener("click",this.boundHandleLauncherClick);const r=(d=this.shadowRoot)==null?void 0:d.querySelector(".nostr-chat-close-btn");r&&this.boundHandleCloseClick&&r.removeEventListener("click",this.boundHandleCloseClick);const e=(b=this.shadowRoot)==null?void 0:b.querySelector(".nostr-chat-find-btn");e&&this.boundHandleFind&&e.removeEventListener("click",this.boundHandleFind);const o=(k=this.shadowRoot)==null?void 0:k.querySelector(".nostr-chat-send-btn");o&&this.boundHandleSend&&o.removeEventListener("click",this.boundHandleSend);const s=(u=this.shadowRoot)==null?void 0:u.querySelector(".nostr-chat-start-btn");s&&this.boundHandleStartChat&&s.removeEventListener("click",this.boundHandleStartChat);const l=(n=this.shadowRoot)==null?void 0:n.querySelector(".nostr-chat-textarea");l&&this.boundHandleTextareaChange&&l.removeEventListener("input",this.boundHandleTextareaChange);const p=(g=this.shadowRoot)==null?void 0:g.querySelector(".nostr-chat-npub-input");p&&this.boundHandleNpubKeydown&&p.removeEventListener("keydown",this.boundHandleNpubKeydown),this.resubscribeTimer&&(clearTimeout(this.resubscribeTimer),this.resubscribeTimer=null)}setKeySupplier(t){this.keySupplier=t}escapeHtml(t){return t.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}render(){const t={theme:this.theme,recipientNpub:this.recipientNpub,recipientName:this.recipientName,recipientPicture:this.recipientPicture,message:this.message,messages:this.messages,isLoading:this.isLoading,isFinding:this.isFinding,isError:this.isError,errorMessage:this.errorMessage,currentUserName:this.currentUserName,currentUserPicture:this.currentUserPicture,showWelcome:this.showWelcome,welcomeText:this.welcomeText,startChatText:this.startChatText,onlineText:this.onlineText,helpText:this.helpText,maxMessageLength:this.MESSAGE_MAX_LENGTH},r=z(this.theme),{onlineText:e,helpText:o,...s}=t,l=O(s);let p=r;this.displayType==="embed"?p+=l:this.displayType==="full"?p+=`
+        <div class="nostr-chat-float-panel open">${l}</div>
+      `:this.displayType==="fab"?p+=`
+        ${this.isOpen?"":`
+          <div class="nostr-chat-launcher fab" role="button" aria-label="Open live chat">
+            <div class="bubble">
+              <div class="title">${this.escapeHtml(this.onlineText)}</div>
+              <div class="subtitle">${this.escapeHtml(this.helpText)}</div>
+            </div>
+            <button class="fab-btn" aria-label="Open chat">💬</button>
+          </div>
+        `}
+        <div class="nostr-chat-float-panel ${this.isOpen?"open":""}">
+          ${l}
+        </div>
+      `:this.displayType==="bottom-bar"&&(p+=`
+        ${this.isOpen?"":`
+          <div class="nostr-chat-launcher bottom-bar" role="button" aria-label="Open live chat">
+            <button class="bar-btn">Live chat</button>
+          </div>
+        `}
+        <div class="nostr-chat-float-panel ${this.isOpen?"open":""}">
+          ${l}
+        </div>
+      `),this.shadowRoot.innerHTML=p,this.attachEventListeners(),setTimeout(()=>{var d;const i=(d=this.shadowRoot)==null?void 0:d.querySelector(".nostr-chat-history");i&&(i.scrollTop=i.scrollHeight)},0)}};a(x,"DEFAULT_WELCOME_TEXT","Welcome! How can we help you today?"),a(x,"DEFAULT_START_CHAT_TEXT","Start chat"),a(x,"DEFAULT_ONLINE_TEXT","We're Online!"),a(x,"DEFAULT_HELP_TEXT","How may I help you today?");let F=x;customElements.define("nostr-live-chat",F);
+//# sourceMappingURL=nostr-live-chat.es.js.map