@flonix/ig-embed 0.1.0 → 0.1.1

package/dist/flonix-ig.global.js

@@ -40,7 +40,7 @@
       <polygon points="12 2 2 7 12 12 22 7 12 2"/>
       <polyline points="2 17 12 22 22 17"/>
       <polyline points="2 12 12 17 22 12"/>
-    </svg>`};function I(e){return{"Content-Type":"application/json",Authorization:`Bearer ${e}`}}function k(e){let t=e.replace(/\/+$/,"");async function n(i,o){let a;try{a=await fetch(`${t}${i}`,o)}catch{throw new Error("Network error \u2014 please try again.")}let d=await a.json().catch(()=>null);if(!a.ok)throw new Error((d==null?void 0:d.error)||`Request failed (${a.status})`);return d}return{session:({apiKey:i,user:o})=>n("/api/embed/session",{method:"POST",headers:I(i),body:JSON.stringify({user:o})}),connectStart:({token:i,returnUrl:o})=>n("/api/embed/connect/start",{method:"POST",headers:I(i),body:JSON.stringify({returnUrl:o})}),posts:({token:i,cursor:o})=>n(`/api/embed/posts${o?`?cursor=${encodeURIComponent(o)}`:""}`,{method:"GET",headers:I(i)}),createAutomation:({token:i,data:o})=>n("/api/embed/automations",{method:"POST",headers:I(i),body:JSON.stringify(o)})}}function r(e,t={},...n){let i=document.createElement(e);if(t.class&&(i.className=t.class),t.text!=null&&(i.textContent=t.text),t.html!=null&&(i.innerHTML=t.html),t.style&&i.setAttribute("style",t.style),t.dataset)for(let[o,a]of Object.entries(t.dataset))i.dataset[o]=a;if(t.attrs)for(let[o,a]of Object.entries(t.attrs))a==null||a===!1||i.setAttribute(o,a===!0?"":String(a));if(t.on)for(let[o,a]of Object.entries(t.on))i.addEventListener(o,a);return m(i,n),i}function m(e,t){for(let n of t)n==null||n===!1||e.appendChild(n instanceof Node?n:document.createTextNode(String(n)))}function M(e){for(;e.firstChild;)e.removeChild(e.firstChild)}function f(e){var n;let t=document.createElement("div");return t.innerHTML=e.trim(),(n=t.firstElementChild)!=null?n:t}function v(e){var i;let t=["flxig-btn",`flxig-btn--${(i=e.variant)!=null?i:"primary"}`,e.block?"flxig-btn--block":"",e.large?"flxig-btn--lg":""].filter(Boolean).join(" "),n=r("button",{class:t,attrs:{type:"button",disabled:e.disabled},on:e.onClick?{click:e.onClick}:void 0});return e.icon&&n.appendChild(f(e.icon)),m(n,[r("span",{text:e.label})]),n}function b(e,t,n){return r("div",{class:"flxig-field"},r("span",{class:"flxig-label",text:e}),t,n?r("span",{class:"flxig-hint",text:n}):null)}function w(e){var t,n;return r("input",{class:"flxig-input",attrs:{type:"text",value:(t=e.value)!=null?t:"",placeholder:(n=e.placeholder)!=null?n:""}})}function G(e){var n,i,o;let t=r("textarea",{class:"flxig-textarea",attrs:{placeholder:(n=e.placeholder)!=null?n:"",rows:(i=e.rows)!=null?i:3}});return t.value=(o=e.value)!=null?o:"",t}function _(e){let t=r("input",{attrs:{type:"checkbox"}});return t.checked=e.checked,e.onChange&&t.addEventListener("change",()=>e.onChange(t.checked)),{element:r("span",{class:"flxig-switch"},t,r("span",{class:"flxig-switch__track"}),r("span",{class:"flxig-switch__thumb"})),input:t}}function $(e){var d;let t=[...e.values],n=r("span",{class:"flxig-chips"}),i=r("input",{attrs:{type:"text",placeholder:(d=e.placeholder)!=null?d:"Add keyword\u2026"}}),o=()=>{for(;n.firstChild&&n.firstChild!==i;)n.removeChild(n.firstChild);let l=t.map((c,u)=>r("span",{class:"flxig-chip"},r("span",{text:c}),r("button",{attrs:{type:"button","aria-label":`Remove ${c}`},html:s.close(12),on:{click:()=>{t.splice(u,1),o()}}})));n.prepend(...l)},a=()=>{let l=i.value.trim().replace(/,$/,"").trim();l&&!t.includes(l)&&(t.push(l),o()),i.value=""};return i.addEventListener("keydown",l=>{l.key==="Enter"||l.key===","?(l.preventDefault(),a()):l.key==="Backspace"&&!i.value&&t.length&&(t.pop(),o())}),i.addEventListener("blur",a),n.appendChild(i),o(),{element:n,getValues:()=>[...t]}}function ee(e){let t=r("div",{class:"flxig-links"}),n=v({label:"Add link",variant:"ghost",icon:s.plus(15),onClick:()=>{t.querySelectorAll(".flxig-link").length>=e.max||(o({label:"",url:""}),i())}});n.classList.add("flxig-links__add");function i(){n.disabled=t.querySelectorAll(".flxig-link").length>=e.max}function o(l){let c=w({value:l.label,placeholder:"Button label"});c.classList.add("flxig-link__label");let u=r("input",{class:"flxig-input flxig-link__url",attrs:{type:"url",value:l.url,placeholder:"https://\u2026",inputmode:"url"}}),x=r("div",{class:"flxig-link"},f(`<span class="flxig-link__ic">${s.link(15)}</span>`),r("div",{class:"flxig-link__inputs"},c,u),r("button",{class:"flxig-iconbtn",attrs:{type:"button","aria-label":"Remove link"},html:s.close(16),on:{click:()=>{x.remove(),i()}}}));t.appendChild(x)}return(e.values.length?e.values:[{label:"",url:""}]).slice(0,e.max).forEach(o),i(),{element:r("div",{class:"flxig-links__wrap"},t,n),getValues:()=>[...t.querySelectorAll(".flxig-link")].map(l=>({label:l.querySelector(".flxig-link__label").value.trim(),url:l.querySelector(".flxig-link__url").value.trim()})).filter(l=>l.label||l.url)}}function C(e){var t;return r("div",{class:"flxig-state"},e.icon?f(e.icon):null,r("p",{class:"flxig-h2",text:e.title}),e.detail?r("p",{class:"flxig-muted",text:e.detail}):null,(t=e.action)!=null?t:null)}function te(e){let t=v({label:e.connecting?"Redirecting\u2026":"Connect Instagram",variant:"primary",large:!0,block:!0,disabled:e.connecting,icon:e.connecting?s.spinner():s.instagram(),onClick:e.onConnect});return r("div",{class:"flxig-connect"},r("div",{class:"flxig-connect__copy"},r("h1",{class:"flxig-h1",text:"Connect your Instagram with Flonix"}),r("p",{class:"flxig-muted",text:"Link your Instagram account to set up comment and DM automations on your posts \u2014 directly from here."})),r("div",{class:"flxig-connect__cta"},t),f(`<div class="flxig-connect__foot">${q(e.partner)}</div>`))}var ne={IMAGE:{label:"Image",icon:s.instagram(12)},VIDEO:{label:"Video",icon:s.video()},REELS:{label:"Reel",icon:s.video()},CAROUSEL:{label:"Album",icon:s.layers()}};function ke(e,t){var o,a,d;let n=(o=ne[e.mediaType])!=null?o:ne.IMAGE,i=r("div",{class:"flxig-tile__media"});return e.media?m(i,[r("img",{attrs:{src:e.media,alt:(a=e.caption)!=null?a:"Instagram post",loading:"lazy"}})]):m(i,[f(`<div class="flxig-tile__ph">${s.instagram(28)}</div>`)]),m(i,[f(`<span class="flxig-tile__type">${n.icon}<span>${n.label}</span></span>`)]),r("div",{class:"flxig-tile"},i,r("div",{class:"flxig-tile__body"},r("p",{class:"flxig-tile__cap",text:((d=e.caption)==null?void 0:d.trim())||"No caption"}),v({label:"Automate",variant:"secondary",block:!0,icon:s.bolt(),onClick:()=>t(e)})))}function ie(e){var T;let t=(T=e.account)==null?void 0:T.username,n=r("div",{class:"flxig-grid"}),i=r("div",{class:"flxig-sentinel"}),o=r("div",{class:"flxig-loadmore"}),a=r("div",{class:"flxig-header"},r("div",{class:"flxig-header__id"},f(`<span class="flxig-avatar">${s.instagram(18)}</span>`),r("div",{},r("div",{class:"flxig-h2",text:t?`@${t}`:"Instagram"}),r("div",{class:"flxig-muted",text:"Pick a post to automate"}))),f(`<span class="flxig-badge">${s.check(13)}<span>Connected</span></span>`)),d=f(`<div class="flxig-attrib"><span>Automations by</span>${D(15)}</div>`),l=r("div",{},a,n,o,i,d),c=!0,u=!1,x=!1,p=typeof IntersectionObserver!="undefined"?new IntersectionObserver(h=>{h.some(g=>g.isIntersecting)&&c&&!u&&!x&&e.onLoadMore()},{rootMargin:"240px"}):null;p==null||p.observe(i);let y=()=>{M(o),u?m(o,[f(s.spinner(20))]):c&&!p&&m(o,[v({label:"Load more",variant:"ghost",onClick:e.onLoadMore})])};return{element:l,appendPosts(h){x=!1,m(n,h.map(g=>ke(g,e.onAutomate)))},setLoadingMore(h){u=h,y()},setHasMore(h){c=h,y(),h||p==null||p.disconnect()},showEmpty(){x=!0,c=!1,p==null||p.disconnect(),M(n),n.replaceWith(C({icon:s.instagram(30),title:"No posts yet",detail:"Publish a post on Instagram, then come back to automate it."}))},destroy(){p==null||p.disconnect()}}}function Me(e){return e!=null&&e.username?`https://instagram.com/${e.username}`:"https://instagram.com/"}function U(e,t,n){let i=t!=null&&t.username?`@${t.username}`:"us",o={postId:e.id,type:n,entryButtonLabel:"Send me the link",deliveryMessage:"Thanks for reaching out! \u{1F64C} Here's the link you asked for \u{1F447}",linkButtons:[{label:"Shop now",url:""}],followGate:{enabled:!0,followProfileUrl:Me(t),followButtonLabel:`Follow ${i}`,followConfirmButtonLabel:"I'm following \u2705",followUpMessage:"Awesome \u2014 thanks for following! \u{1F499} Here's your link \u{1F447}"}};return n==="COMMENT"?{...o,name:"Comment \u2192 DM automation",keywords:["link","price","info"],commentReply:"Just sent you a DM! \u{1F4E9}"}:{...o,name:"DM keyword automation",keywords:["link","info"],commentReply:null}}var Ee=[{type:"COMMENT",title:"Comment automation",detail:"Reply + DM when someone comments a keyword",icon:s.comment(20)},{type:"DM",title:"DM automation",detail:"Auto-reply when someone DMs a keyword",icon:s.dm(20)}];function oe(e){var h;let t="COMMENT",n=U(e.post,e.account,t),i=!1,o=r("div",{class:"flxig-dialog__body"}),a=r("div",{class:"flxig-overlay"}),d=()=>{document.removeEventListener("keydown",l),a.remove()},l=g=>{g.key==="Escape"&&!i&&d()};document.addEventListener("keydown",l),a.addEventListener("click",g=>{g.target===a&&!i&&d()});let c=r("div",{class:"flxig-seg"}),u=()=>{c.replaceChildren(...Ee.map(g=>r("div",{class:"flxig-seg__opt",dataset:{active:String(g.type===t)},attrs:{role:"button",tabindex:"0"},on:{click:()=>{g.type!==t&&(t=g.type,n=U(e.post,e.account,t),u(),p())}}},f(`<span class="flxig-seg__ic">${g.icon}</span>`),r("div",{},r("div",{class:"flxig-seg__t",text:g.title}),r("div",{class:"flxig-seg__d",text:g.detail})))))},x=()=>n,p=()=>{var Y;let g=$({values:n.keywords,placeholder:"Add keyword\u2026"}),A=w({value:(Y=n.commentReply)!=null?Y:""}),Q=G({value:n.deliveryMessage,rows:3}),F=w({value:n.entryButtonLabel}),H=ee({values:n.linkButtons,max:3}),O=G({value:n.followGate.followUpMessage,rows:2}),V=w({value:n.followGate.followButtonLabel}),j=w({value:n.followGate.followProfileUrl}),X=w({value:n.followGate.followConfirmButtonLabel}),Z=r("div",{class:"flxig-gate__fields",dataset:{off:String(!n.followGate.enabled)}},b("Follow profile URL",j),b("Follow button label",V),b("Confirm button label",X),b("Message after they follow",O)),W=_({checked:n.followGate.enabled,onChange:me=>{Z.dataset.off=String(!me)}}),ue=r("div",{class:"flxig-gate"},r("div",{class:"flxig-gate__top"},r("div",{},r("div",{class:"flxig-label",text:"Follow gate"}),r("div",{class:"flxig-hint",text:"Require users to follow before they get the link."})),W.element),Z),B=[b(t==="COMMENT"?"Trigger keywords (in comments)":"Trigger keywords (in DMs)",g.element,"Press Enter or comma to add. The automation fires on these words.")];t==="COMMENT"&&B.push(b("Public comment reply",A,"Posted under the comment.")),B.push(b("DM message",Q,"The direct message delivered to the user."),b("Link buttons",H.element,`Where they enter the link(s). Up to ${3} \u2014 each has a label and a URL.`),b("Opt-in button label",F,"Button users tap in the first DM."),ue),o.replaceChildren(...B),x=()=>({postId:e.post.id,type:t,name:n.name,keywords:g.getValues(),commentReply:t==="COMMENT"&&A.value.trim()||null,entryButtonLabel:F.value.trim(),deliveryMessage:Q.value.trim(),linkButtons:H.getValues(),followGate:{enabled:W.input.checked,followProfileUrl:j.value.trim(),followButtonLabel:V.value.trim(),followConfirmButtonLabel:X.value.trim(),followUpMessage:O.value.trim()}}),o.prepend(r("div",{class:"flxig-field"},r("span",{class:"flxig-label",text:"Automation type"}),c))},y=v({label:"Create automation",variant:"primary",icon:s.bolt(),onClick:async()=>{if(i)return;let g=x();if(!g.keywords.length){e.onToast("Add at least one keyword");return}if(!g.deliveryMessage){e.onToast("Add a DM message");return}i=!0,y.disabled=!0,y.replaceChildren(f(s.spinner()),r("span",{text:"Creating\u2026"}));try{await e.onSubmit(g),d()}catch(A){e.onToast(A instanceof Error?A.message:"Something went wrong"),i=!1,y.disabled=!1,y.replaceChildren(f(s.bolt()),r("span",{text:"Create automation"}))}}}),T=r("div",{class:"flxig-dialog",attrs:{role:"dialog","aria-modal":"true"}},r("div",{class:"flxig-dialog__head"},r("div",{},r("div",{class:"flxig-h2",text:"Automate this post"}),r("div",{class:"flxig-muted",text:(h=e.post.caption)!=null&&h.trim()?Te(e.post.caption.trim(),70):"Set up comment & DM replies"})),r("button",{class:"flxig-iconbtn",attrs:{type:"button","aria-label":"Close"},html:s.close(),on:{click:()=>!i&&d()}})),o,r("div",{class:"flxig-dialog__foot"},v({label:"Cancel",variant:"ghost",onClick:()=>!i&&d()}),y));return u(),p(),m(a,[T]),e.mount.appendChild(a),{close:d}}function Te(e,t){return e.length>t?`${e.slice(0,t-1)}\u2026`:e}var Ie='"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',Pe="12px",E={light:{background:"#ffffff",foreground:"#0a0a0b",card:"#ffffff",cardForeground:"#0a0a0b",popover:"#ffffff",popoverForeground:"#0a0a0b",primary:"#2563eb",primaryForeground:"#ffffff",secondary:"#f4f4f5",secondaryForeground:"#18181b",muted:"#f4f4f5",mutedForeground:"#71717a",accent:"#eef2ff",accentForeground:"#1e3a8a",destructive:"#ef4444",destructiveForeground:"#ffffff",border:"#e4e4e7",input:"#e4e4e7",ring:"#2563eb"},dark:{background:"#0a0a0b",foreground:"#fafafa",card:"#131316",cardForeground:"#fafafa",popover:"#131316",popoverForeground:"#fafafa",primary:"#3b82f6",primaryForeground:"#ffffff",secondary:"#27272a",secondaryForeground:"#fafafa",muted:"#1b1b1f",mutedForeground:"#a1a1aa",accent:"#1e293b",accentForeground:"#bfdbfe",destructive:"#f87171",destructiveForeground:"#0a0a0b",border:"#27272a",input:"#2a2a2e",ring:"#3b82f6"}};function ae(e={}){var t,n,i,o,a,d,l;return{mode:(t=e.mode)!=null?t:"auto",fontFamily:(n=e.fontFamily)!=null?n:Ie,radius:(i=e.radius)!=null?i:Pe,light:{...E.light,...(a=(o=e.tokens)==null?void 0:o.light)!=null?a:{}},dark:{...E.dark,...(l=(d=e.tokens)==null?void 0:d.dark)!=null?l:{}}}}var Le=e=>e.replace(/[A-Z]/g,t=>`-${t.toLowerCase()}`);function re(e){return Object.keys(e).map(t=>`  --flxig-${Le(t)}: ${e[t]};`).join(`
+    </svg>`};function I(e){return{"Content-Type":"application/json",Authorization:`Bearer ${e}`}}function k(e){let t=e.replace(/\/+$/,"");async function n(i,o){let a;try{a=await fetch(`${t}${i}`,o)}catch{throw new Error("Network error \u2014 please try again.")}let d=await a.json().catch(()=>null);if(!a.ok)throw new Error((d==null?void 0:d.error)||`Request failed (${a.status})`);return d}return{session:({apiKey:i,user:o})=>n("/api/embed/session",{method:"POST",headers:I(i),body:JSON.stringify({user:o})}),connectStart:({token:i,returnUrl:o})=>n("/api/embed/connect/start",{method:"POST",headers:I(i),body:JSON.stringify({returnUrl:o})}),posts:({token:i,cursor:o})=>n(`/api/embed/posts${o?`?cursor=${encodeURIComponent(o)}`:""}`,{method:"GET",headers:I(i)}),createAutomation:({token:i,data:o})=>n("/api/embed/automations",{method:"POST",headers:I(i),body:JSON.stringify(o)})}}function r(e,t={},...n){let i=document.createElement(e);if(t.class&&(i.className=t.class),t.text!=null&&(i.textContent=t.text),t.html!=null&&(i.innerHTML=t.html),t.style&&i.setAttribute("style",t.style),t.dataset)for(let[o,a]of Object.entries(t.dataset))i.dataset[o]=a;if(t.attrs)for(let[o,a]of Object.entries(t.attrs))a==null||a===!1||i.setAttribute(o,a===!0?"":String(a));if(t.on)for(let[o,a]of Object.entries(t.on))i.addEventListener(o,a);return m(i,n),i}function m(e,t){for(let n of t)n==null||n===!1||e.appendChild(n instanceof Node?n:document.createTextNode(String(n)))}function M(e){for(;e.firstChild;)e.removeChild(e.firstChild)}function f(e){var n;let t=document.createElement("div");return t.innerHTML=e.trim(),(n=t.firstElementChild)!=null?n:t}function v(e){var i;let t=["flxig-btn",`flxig-btn--${(i=e.variant)!=null?i:"primary"}`,e.block?"flxig-btn--block":"",e.large?"flxig-btn--lg":""].filter(Boolean).join(" "),n=r("button",{class:t,attrs:{type:"button",disabled:e.disabled},on:e.onClick?{click:e.onClick}:void 0});return e.icon&&n.appendChild(f(e.icon)),m(n,[r("span",{text:e.label})]),n}function b(e,t,n){return r("div",{class:"flxig-field"},r("span",{class:"flxig-label",text:e}),t,n?r("span",{class:"flxig-hint",text:n}):null)}function w(e){var t,n;return r("input",{class:"flxig-input",attrs:{type:"text",value:(t=e.value)!=null?t:"",placeholder:(n=e.placeholder)!=null?n:""}})}function G(e){var n,i,o;let t=r("textarea",{class:"flxig-textarea",attrs:{placeholder:(n=e.placeholder)!=null?n:"",rows:(i=e.rows)!=null?i:3}});return t.value=(o=e.value)!=null?o:"",t}function _(e){let t=r("input",{attrs:{type:"checkbox"}});return t.checked=e.checked,e.onChange&&t.addEventListener("change",()=>e.onChange(t.checked)),{element:r("span",{class:"flxig-switch"},t,r("span",{class:"flxig-switch__track"}),r("span",{class:"flxig-switch__thumb"})),input:t}}function $(e){var d;let t=[...e.values],n=r("span",{class:"flxig-chips"}),i=r("input",{attrs:{type:"text",placeholder:(d=e.placeholder)!=null?d:"Add keyword\u2026"}}),o=()=>{for(;n.firstChild&&n.firstChild!==i;)n.removeChild(n.firstChild);let l=t.map((c,u)=>r("span",{class:"flxig-chip"},r("span",{text:c}),r("button",{attrs:{type:"button","aria-label":`Remove ${c}`},html:s.close(12),on:{click:()=>{t.splice(u,1),o()}}})));n.prepend(...l)},a=()=>{let l=i.value.trim().replace(/,$/,"").trim();l&&!t.includes(l)&&(t.push(l),o()),i.value=""};return i.addEventListener("keydown",l=>{l.key==="Enter"||l.key===","?(l.preventDefault(),a()):l.key==="Backspace"&&!i.value&&t.length&&(t.pop(),o())}),i.addEventListener("blur",a),n.appendChild(i),o(),{element:n,getValues:()=>[...t]}}function ee(e){let t=r("div",{class:"flxig-links"}),n=v({label:"Add link",variant:"ghost",icon:s.plus(15),onClick:()=>{t.querySelectorAll(".flxig-link").length>=e.max||(o({label:"",url:""}),i())}});n.classList.add("flxig-links__add");function i(){n.disabled=t.querySelectorAll(".flxig-link").length>=e.max}function o(l){let c=w({value:l.label,placeholder:"Button label"});c.classList.add("flxig-link__label");let u=r("input",{class:"flxig-input flxig-link__url",attrs:{type:"url",value:l.url,placeholder:"https://\u2026",inputmode:"url"}}),x=r("div",{class:"flxig-link"},f(`<span class="flxig-link__ic">${s.link(15)}</span>`),r("div",{class:"flxig-link__inputs"},c,u),r("button",{class:"flxig-iconbtn",attrs:{type:"button","aria-label":"Remove link"},html:s.close(16),on:{click:()=>{x.remove(),i()}}}));t.appendChild(x)}return(e.values.length?e.values:[{label:"",url:""}]).slice(0,e.max).forEach(o),i(),{element:r("div",{class:"flxig-links__wrap"},t,n),getValues:()=>[...t.querySelectorAll(".flxig-link")].map(l=>({label:l.querySelector(".flxig-link__label").value.trim(),url:l.querySelector(".flxig-link__url").value.trim()})).filter(l=>l.label||l.url)}}function C(e){var t;return r("div",{class:"flxig-state"},e.icon?f(e.icon):null,r("p",{class:"flxig-h2",text:e.title}),e.detail?r("p",{class:"flxig-muted",text:e.detail}):null,(t=e.action)!=null?t:null)}function te(e){let t=v({label:e.connecting?"Redirecting\u2026":"Connect Instagram",variant:"primary",large:!0,block:!0,disabled:e.connecting,icon:e.connecting?s.spinner():s.instagram(),onClick:e.onConnect});return r("div",{class:"flxig-connect"},r("div",{class:"flxig-connect__copy"},r("h1",{class:"flxig-h1",text:"Connect your Instagram with Flonix"}),r("p",{class:"flxig-muted",text:"Link your Instagram account to set up comment and DM automations on your posts \u2014 directly from here."})),r("div",{class:"flxig-connect__cta"},t),f(`<div class="flxig-connect__foot">${q(e.partner)}</div>`))}var ne={IMAGE:{label:"Image",icon:s.instagram(12)},VIDEO:{label:"Video",icon:s.video()},REELS:{label:"Reel",icon:s.video()},CAROUSEL:{label:"Album",icon:s.layers()}};function ke(e,t){var o,a,d;let n=(o=ne[e.mediaType])!=null?o:ne.IMAGE,i=r("div",{class:"flxig-tile__media"});return e.media?m(i,[r("img",{attrs:{src:e.media,alt:(a=e.caption)!=null?a:"Instagram post",loading:"lazy"}})]):m(i,[f(`<div class="flxig-tile__ph">${s.instagram(28)}</div>`)]),m(i,[f(`<span class="flxig-tile__type">${n.icon}<span>${n.label}</span></span>`)]),r("div",{class:"flxig-tile"},i,r("div",{class:"flxig-tile__body"},r("p",{class:"flxig-tile__cap",text:((d=e.caption)==null?void 0:d.trim())||"No caption"}),v({label:"Automate",variant:"secondary",block:!0,icon:s.bolt(),onClick:()=>t(e)})))}function ie(e){var T;let t=(T=e.account)==null?void 0:T.username,n=r("div",{class:"flxig-grid"}),i=r("div",{class:"flxig-sentinel"}),o=r("div",{class:"flxig-loadmore"}),a=r("div",{class:"flxig-header"},r("div",{class:"flxig-header__id"},f(`<span class="flxig-avatar">${s.instagram(18)}</span>`),r("div",{},r("div",{class:"flxig-h2",text:t?`@${t}`:"Instagram"}),r("div",{class:"flxig-muted",text:"Pick a post to automate"}))),f(`<span class="flxig-badge">${s.check(13)}<span>Connected</span></span>`)),d=f(`<div class="flxig-attrib"><span>Automations by</span>${D(15)}</div>`),l=r("div",{},a,n,o,i,d),c=!0,u=!1,x=!1,p=typeof IntersectionObserver!="undefined"?new IntersectionObserver(h=>{h.some(g=>g.isIntersecting)&&c&&!u&&!x&&e.onLoadMore()},{rootMargin:"240px"}):null;p==null||p.observe(i);let y=()=>{M(o),u?m(o,[f(s.spinner(20))]):c&&!p&&m(o,[v({label:"Load more",variant:"ghost",onClick:e.onLoadMore})])};return{element:l,appendPosts(h){x=!1,m(n,h.map(g=>ke(g,e.onAutomate)))},setLoadingMore(h){u=h,y()},setHasMore(h){c=h,y(),h||p==null||p.disconnect()},showEmpty(){x=!0,c=!1,p==null||p.disconnect(),M(n),n.replaceWith(C({icon:s.instagram(30),title:"No posts yet",detail:"Publish a post on Instagram, then come back to automate it."}))},destroy(){p==null||p.disconnect()}}}function Me(e){return e!=null&&e.username?`https://instagram.com/${e.username}`:"https://instagram.com/"}function U(e,t,n){let i=t!=null&&t.username?`@${t.username}`:"us",o={postId:e.id,type:n,entryButtonLabel:"Send me the link",deliveryMessage:"Thanks for reaching out! \u{1F64C} Here's the link you asked for \u{1F447}",linkButtons:[{label:"Shop now",url:""}],followGate:{enabled:!0,followProfileUrl:Me(t),followButtonLabel:`Follow ${i}`,followConfirmButtonLabel:"I'm following \u2705",followUpMessage:"Awesome \u2014 thanks for following! \u{1F499} Here's your link \u{1F447}"}};return n==="COMMENT"?{...o,name:"Comment \u2192 DM automation",keywords:["link","price","info"],commentReply:"Just sent you a DM! \u{1F4E9}"}:{...o,name:"DM keyword automation",keywords:["link","info"],commentReply:null}}var Ee=[{type:"COMMENT",title:"Comment automation",detail:"Reply + DM when someone comments a keyword",icon:s.comment(20)},{type:"DM",title:"DM automation",detail:"Auto-reply when someone DMs a keyword",icon:s.dm(20)}];function oe(e){var h;let t="COMMENT",n=U(e.post,e.account,t),i=!1,o=r("div",{class:"flxig-dialog__body"}),a=r("div",{class:"flxig-overlay"}),d=()=>{document.removeEventListener("keydown",l),a.remove()},l=g=>{g.key==="Escape"&&!i&&d()};document.addEventListener("keydown",l),a.addEventListener("click",g=>{g.target===a&&!i&&d()});let c=r("div",{class:"flxig-seg"}),u=()=>{c.replaceChildren(...Ee.map(g=>r("div",{class:"flxig-seg__opt",dataset:{active:String(g.type===t)},attrs:{role:"button",tabindex:"0"},on:{click:()=>{g.type!==t&&(t=g.type,n=U(e.post,e.account,t),u(),p())}}},f(`<span class="flxig-seg__ic">${g.icon}</span>`),r("div",{},r("div",{class:"flxig-seg__t",text:g.title}),r("div",{class:"flxig-seg__d",text:g.detail})))))},x=()=>n,p=()=>{var Y;let g=$({values:n.keywords,placeholder:"Add keyword\u2026"}),A=w({value:(Y=n.commentReply)!=null?Y:""}),O=G({value:n.deliveryMessage,rows:3}),Q=w({value:n.entryButtonLabel}),F=ee({values:n.linkButtons,max:3}),H=G({value:n.followGate.followUpMessage,rows:2}),V=w({value:n.followGate.followButtonLabel}),j=w({value:n.followGate.followProfileUrl}),X=w({value:n.followGate.followConfirmButtonLabel}),Z=r("div",{class:"flxig-gate__fields",dataset:{off:String(!n.followGate.enabled)}},b("Follow profile URL",j),b("Follow button label",V),b("Confirm button label",X),b("Message after they follow",H)),W=_({checked:n.followGate.enabled,onChange:me=>{Z.dataset.off=String(!me)}}),ue=r("div",{class:"flxig-gate"},r("div",{class:"flxig-gate__top"},r("div",{},r("div",{class:"flxig-label",text:"Follow gate"}),r("div",{class:"flxig-hint",text:"Require users to follow before they get the link."})),W.element),Z),B=[b(t==="COMMENT"?"Trigger keywords (in comments)":"Trigger keywords (in DMs)",g.element,"Press Enter or comma to add. The automation fires on these words.")];t==="COMMENT"&&B.push(b("Public comment reply",A,"Posted under the comment.")),B.push(b("DM message",O,"The direct message delivered to the user."),b("Link buttons",F.element,`Where they enter the link(s). Up to ${3} \u2014 each has a label and a URL.`),b("Opt-in button label",Q,"Button users tap in the first DM."),ue),o.replaceChildren(...B),x=()=>({postId:e.post.id,type:t,name:n.name,keywords:g.getValues(),commentReply:t==="COMMENT"&&A.value.trim()||null,entryButtonLabel:Q.value.trim(),deliveryMessage:O.value.trim(),linkButtons:F.getValues(),followGate:{enabled:W.input.checked,followProfileUrl:j.value.trim(),followButtonLabel:V.value.trim(),followConfirmButtonLabel:X.value.trim(),followUpMessage:H.value.trim()}}),o.prepend(r("div",{class:"flxig-field"},r("span",{class:"flxig-label",text:"Automation type"}),c))},y=v({label:"Create automation",variant:"primary",icon:s.bolt(),onClick:async()=>{if(i)return;let g=x();if(!g.keywords.length){e.onToast("Add at least one keyword");return}if(!g.deliveryMessage){e.onToast("Add a DM message");return}i=!0,y.disabled=!0,y.replaceChildren(f(s.spinner()),r("span",{text:"Creating\u2026"}));try{await e.onSubmit(g),d()}catch(A){e.onToast(A instanceof Error?A.message:"Something went wrong"),i=!1,y.disabled=!1,y.replaceChildren(f(s.bolt()),r("span",{text:"Create automation"}))}}}),T=r("div",{class:"flxig-dialog",attrs:{role:"dialog","aria-modal":"true"}},r("div",{class:"flxig-dialog__head"},r("div",{},r("div",{class:"flxig-h2",text:"Automate this post"}),r("div",{class:"flxig-muted",text:(h=e.post.caption)!=null&&h.trim()?Te(e.post.caption.trim(),70):"Set up comment & DM replies"})),r("button",{class:"flxig-iconbtn",attrs:{type:"button","aria-label":"Close"},html:s.close(),on:{click:()=>!i&&d()}})),o,r("div",{class:"flxig-dialog__foot"},v({label:"Cancel",variant:"ghost",onClick:()=>!i&&d()}),y));return u(),p(),m(a,[T]),e.mount.appendChild(a),{close:d}}function Te(e,t){return e.length>t?`${e.slice(0,t-1)}\u2026`:e}var Ie='"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',Pe="12px",E={light:{background:"#ffffff",foreground:"#0a0a0b",card:"#ffffff",cardForeground:"#0a0a0b",popover:"#ffffff",popoverForeground:"#0a0a0b",primary:"#2563eb",primaryForeground:"#ffffff",secondary:"#f4f4f5",secondaryForeground:"#18181b",muted:"#f4f4f5",mutedForeground:"#71717a",accent:"#eef2ff",accentForeground:"#1e3a8a",destructive:"#ef4444",destructiveForeground:"#ffffff",border:"#e4e4e7",input:"#e4e4e7",ring:"#2563eb"},dark:{background:"#0a0a0b",foreground:"#fafafa",card:"#131316",cardForeground:"#fafafa",popover:"#131316",popoverForeground:"#fafafa",primary:"#3b82f6",primaryForeground:"#ffffff",secondary:"#27272a",secondaryForeground:"#fafafa",muted:"#1b1b1f",mutedForeground:"#a1a1aa",accent:"#1e293b",accentForeground:"#bfdbfe",destructive:"#f87171",destructiveForeground:"#0a0a0b",border:"#27272a",input:"#2a2a2e",ring:"#3b82f6"}};function ae(e={}){var t,n,i,o,a,d,l;return{mode:(t=e.mode)!=null?t:"auto",fontFamily:(n=e.fontFamily)!=null?n:Ie,radius:(i=e.radius)!=null?i:Pe,light:{...E.light,...(a=(o=e.tokens)==null?void 0:o.light)!=null?a:{}},dark:{...E.dark,...(l=(d=e.tokens)==null?void 0:d.dark)!=null?l:{}}}}var Le=e=>e.replace(/[A-Z]/g,t=>`-${t.toLowerCase()}`);function re(e){return Object.keys(e).map(t=>`  --flxig-${Le(t)}: ${e[t]};`).join(`
 `)}function le(e){return`:host {
 ${re(e.light)}
   --flxig-radius: ${e.radius};
@@ -64,6 +64,15 @@ ${re(e.dark)}
   container-type: inline-size;
 }
 
+/* Borderless / full-bleed: blends into the host page and fills its container.
+   Only the OUTER chrome is removed \u2014 internal borders (tiles, inputs) stay. */
+.flxig-root.flxig-plain {
+  border: none;
+  border-radius: 0;
+  padding: 0;
+  background: transparent;
+}
+
 /* ---- typography ---- */
 .flxig-h1 { font-size: 1.35rem; font-weight: 700; letter-spacing: -0.015em; margin: 0; }
 .flxig-h2 { font-size: 1.05rem; font-weight: 650; letter-spacing: -0.01em; margin: 0; }
@@ -207,5 +216,5 @@ ${re(e.dark)}
 @keyframes flxig-pop { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: scale(1); } }
 @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; } }
 `;var ce="flxig_connected",Be="https://flonix.pro",P=class{constructor(t,n){this.mediaQuery=null;this.token=null;this.account=null;this.postsView=null;this.cursor=null;this.connecting=!1;this.destroyed=!1;this.onSchemeChange=t=>this.applyMode(t.matches);var o,a;this.config=n,this.transport=(a=n.transport)!=null?a:k((o=n.baseUrl)!=null?o:Be),this.host=document.createElement("div"),this.host.setAttribute("data-flonix-ig",""),t.appendChild(this.host),this.shadow=this.host.attachShadow({mode:"open"});let i=ae(n.theme);this.shadow.appendChild(r("style",{text:`${le(i)}
-${de}`})),this.root=r("div",{class:"flxig-root"}),this.content=r("div",{class:"flxig-content"}),this.root.appendChild(this.content),this.shadow.appendChild(this.root),this.applyMode(se(i.mode)),i.mode==="auto"&&typeof window.matchMedia=="function"&&(this.mediaQuery=window.matchMedia("(prefers-color-scheme: dark)"),this.mediaQuery.addEventListener("change",this.onSchemeChange)),this.init()}applyMode(t){this.host.classList.toggle("flxig-dark",t)}refresh(){this.cursor=null,this.init()}unmount(){var t,n;this.destroyed=!0,(t=this.postsView)==null||t.destroy(),(n=this.mediaQuery)==null||n.removeEventListener("change",this.onSchemeChange),this.host.remove()}fail(t){var i,o;let n=t instanceof Error?t:new Error(String(t));return(o=(i=this.config).onError)==null||o.call(i,n),n}async init(){var t,n,i;this.renderLoading();try{let o=await this.transport.session({apiKey:this.config.apiKey,user:this.config.user});if(this.destroyed)return;this.token=o.token,this.account=o.account,o.connected?(this.clearReturnFlag(),(i=(n=this.config).onConnected)==null||i.call(n,(t=o.account)!=null?t:{instagramId:null,username:null}),await this.renderPosts()):this.renderConnect()}catch(o){this.renderError(this.fail(o).message)}}async startConnect(){if(!(!this.token||this.connecting)){this.connecting=!0,this.renderConnect();try{let{authorizeUrl:t}=await this.transport.connectStart({token:this.token,returnUrl:this.resolveReturnUrl()});window.location.href=t}catch(t){this.connecting=!1,this.renderConnect(),this.toast(this.fail(t).message)}}}async renderPosts(){let t=ie({account:this.account,onAutomate:n=>this.openDialog(n),onLoadMore:()=>{this.loadMore()}});this.postsView=t,this.swap(t.element),await this.loadMore(!0)}async loadMore(t=!1){let n=this.postsView;if(!(!n||!this.token)){n.setLoadingMore(!0);try{let{posts:i,nextCursor:o}=await this.transport.posts({token:this.token,cursor:this.cursor});if(this.destroyed)return;if(t&&i.length===0){n.showEmpty();return}n.appendPosts(i),this.cursor=o,n.setHasMore(!!o)}catch(i){this.toast(this.fail(i).message)}finally{n.setLoadingMore(!1)}}}openDialog(t){this.token&&oe({mount:this.shadow,post:t,account:this.account,onToast:n=>this.toast(n),onSubmit:n=>this.createAutomation(n)})}async createAutomation(t){var i,o;if(!this.token)throw new Error("Not connected");let n=await this.transport.createAutomation({token:this.token,data:t});(o=(i=this.config).onAutomationCreated)==null||o.call(i,n),this.toast("Automation created \u2713")}swap(t){M(this.content),this.content.appendChild(t)}renderConnect(){this.swap(te({connecting:this.connecting,partner:this.config.partner,onConnect:()=>{this.startConnect()}}))}renderLoading(){this.swap(C({icon:s.spinner(26),title:"Loading\u2026"}))}renderError(t){this.swap(C({icon:s.close(26),title:"Couldn't load",detail:t}))}toast(t){let n=f(`<div class="flxig-toast">${s.bolt(14)}<span></span></div>`);n.querySelector("span").textContent=t,this.shadow.appendChild(n),setTimeout(()=>n.remove(),2600)}resolveReturnUrl(){return this.config.returnUrl?this.config.returnUrl:typeof window=="undefined"?"":window.location.href}clearReturnFlag(){var n;if(typeof window=="undefined"||!((n=window.history)!=null&&n.replaceState))return;let t=new URL(window.location.href);t.searchParams.has(ce)&&(t.searchParams.delete(ce),window.history.replaceState({},"",t.toString()))}};var L=e=>new Promise(t=>setTimeout(t,e)),ge=["IMAGE","CAROUSEL","REELS","VIDEO","IMAGE"],pe=["New drop is live \u{1F525} comment LINK for the shop","Behind the scenes of today's shoot","Our bestseller is back in stock \u2728","How to style this 3 ways \u{1F447}","Limited edition \u2014 only 50 made","Weekend sale starts now \u{1F6CD}\uFE0F",null,"Tag a friend who needs this \u{1F499}"];function Se(e,t){return Array.from({length:t},(n,i)=>{var a,d;let o=e*t+i;return{id:`mock_${o}`,caption:(a=pe[o%pe.length])!=null?a:null,media:`https://picsum.photos/seed/flonix${o}/600/600`,mediaType:(d=ge[o%ge.length])!=null?d:"IMAGE",permalink:null,timestamp:new Date(Date.now()-o*864e5).toISOString()}})}function K(e={}){var a,d,l;let t=(a=e.totalPages)!=null?a:3,n=(d=e.perPage)!=null?d:8,i=`flxig.mock.connected.${(l=e.namespace)!=null?l:"default"}`,o=()=>{try{return localStorage.getItem(i)==="1"}catch{return!1}};return{async session(){await L(400);let c=o();return{connected:c,token:"mock-session-token",account:c?{instagramId:"17890000000",username:"your_brand"}:null}},async connectStart({returnUrl:c}){await L(500);try{localStorage.setItem(i,"1")}catch{}let u=new URL(c,window.location.href);return u.searchParams.set("flxig_connected","1"),{authorizeUrl:u.toString()}},async posts({cursor:c}){await L(500);let u=c?Number(c):0,x=Se(u,n),p=u+1;return{posts:x,nextCursor:p<t?String(p):null}},async createAutomation(){return await L(700),{id:`mock_automation_${Date.now()}`}}}}var z="0.1.0";function R(e,t){var i,o,a;let n=typeof e=="string"?document.querySelector(e):e;if(!n)throw new Error(`FlonixIG.mount: target not found: ${String(e)}`);if(!(t!=null&&t.apiKey))throw new Error("FlonixIG.mount: config.apiKey is required");if(!((i=t==null?void 0:t.user)!=null&&i.id))throw new Error("FlonixIG.mount: config.user.id is required");if(!((o=t==null?void 0:t.partner)!=null&&o.logo)||!((a=t==null?void 0:t.partner)!=null&&a.name))throw new Error("FlonixIG.mount: config.partner.name and config.partner.logo are required");return new P(n,t)}var fe={mount:R,version:z};return we(Ne);})();
+${de}`})),this.root=r("div",{class:n.appearance==="plain"?"flxig-root flxig-plain":"flxig-root"}),this.content=r("div",{class:"flxig-content"}),this.root.appendChild(this.content),this.shadow.appendChild(this.root),this.applyMode(se(i.mode)),i.mode==="auto"&&typeof window.matchMedia=="function"&&(this.mediaQuery=window.matchMedia("(prefers-color-scheme: dark)"),this.mediaQuery.addEventListener("change",this.onSchemeChange)),this.init()}applyMode(t){this.host.classList.toggle("flxig-dark",t)}refresh(){this.cursor=null,this.init()}unmount(){var t,n;this.destroyed=!0,(t=this.postsView)==null||t.destroy(),(n=this.mediaQuery)==null||n.removeEventListener("change",this.onSchemeChange),this.host.remove()}fail(t){var i,o;let n=t instanceof Error?t:new Error(String(t));return(o=(i=this.config).onError)==null||o.call(i,n),n}async init(){var t,n,i;this.renderLoading();try{let o=await this.transport.session({apiKey:this.config.apiKey,user:this.config.user});if(this.destroyed)return;this.token=o.token,this.account=o.account,o.connected?(this.clearReturnFlag(),(i=(n=this.config).onConnected)==null||i.call(n,(t=o.account)!=null?t:{instagramId:null,username:null}),await this.renderPosts()):this.renderConnect()}catch(o){this.renderError(this.fail(o).message)}}async startConnect(){if(!(!this.token||this.connecting)){this.connecting=!0,this.renderConnect();try{let{authorizeUrl:t}=await this.transport.connectStart({token:this.token,returnUrl:this.resolveReturnUrl()});window.location.href=t}catch(t){this.connecting=!1,this.renderConnect(),this.toast(this.fail(t).message)}}}async renderPosts(){let t=ie({account:this.account,onAutomate:n=>this.openDialog(n),onLoadMore:()=>{this.loadMore()}});this.postsView=t,this.swap(t.element),await this.loadMore(!0)}async loadMore(t=!1){let n=this.postsView;if(!(!n||!this.token)){n.setLoadingMore(!0);try{let{posts:i,nextCursor:o}=await this.transport.posts({token:this.token,cursor:this.cursor});if(this.destroyed)return;if(t&&i.length===0){n.showEmpty();return}n.appendPosts(i),this.cursor=o,n.setHasMore(!!o)}catch(i){this.toast(this.fail(i).message)}finally{n.setLoadingMore(!1)}}}openDialog(t){this.token&&oe({mount:this.shadow,post:t,account:this.account,onToast:n=>this.toast(n),onSubmit:n=>this.createAutomation(n)})}async createAutomation(t){var i,o;if(!this.token)throw new Error("Not connected");let n=await this.transport.createAutomation({token:this.token,data:t});(o=(i=this.config).onAutomationCreated)==null||o.call(i,n),this.toast("Automation created \u2713")}swap(t){M(this.content),this.content.appendChild(t)}renderConnect(){this.swap(te({connecting:this.connecting,partner:this.config.partner,onConnect:()=>{this.startConnect()}}))}renderLoading(){this.swap(C({icon:s.spinner(26),title:"Loading\u2026"}))}renderError(t){this.swap(C({icon:s.close(26),title:"Couldn't load",detail:t}))}toast(t){let n=f(`<div class="flxig-toast">${s.bolt(14)}<span></span></div>`);n.querySelector("span").textContent=t,this.shadow.appendChild(n),setTimeout(()=>n.remove(),2600)}resolveReturnUrl(){return this.config.returnUrl?this.config.returnUrl:typeof window=="undefined"?"":window.location.href}clearReturnFlag(){var n;if(typeof window=="undefined"||!((n=window.history)!=null&&n.replaceState))return;let t=new URL(window.location.href);t.searchParams.has(ce)&&(t.searchParams.delete(ce),window.history.replaceState({},"",t.toString()))}};var L=e=>new Promise(t=>setTimeout(t,e)),ge=["IMAGE","CAROUSEL","REELS","VIDEO","IMAGE"],pe=["New drop is live \u{1F525} comment LINK for the shop","Behind the scenes of today's shoot","Our bestseller is back in stock \u2728","How to style this 3 ways \u{1F447}","Limited edition \u2014 only 50 made","Weekend sale starts now \u{1F6CD}\uFE0F",null,"Tag a friend who needs this \u{1F499}"];function Se(e,t){return Array.from({length:t},(n,i)=>{var a,d;let o=e*t+i;return{id:`mock_${o}`,caption:(a=pe[o%pe.length])!=null?a:null,media:`https://picsum.photos/seed/flonix${o}/600/600`,mediaType:(d=ge[o%ge.length])!=null?d:"IMAGE",permalink:null,timestamp:new Date(Date.now()-o*864e5).toISOString()}})}function K(e={}){var a,d,l;let t=(a=e.totalPages)!=null?a:3,n=(d=e.perPage)!=null?d:8,i=`flxig.mock.connected.${(l=e.namespace)!=null?l:"default"}`,o=()=>{try{return localStorage.getItem(i)==="1"}catch{return!1}};return{async session(){await L(400);let c=o();return{connected:c,token:"mock-session-token",account:c?{instagramId:"17890000000",username:"your_brand"}:null}},async connectStart({returnUrl:c}){await L(500);try{localStorage.setItem(i,"1")}catch{}let u=new URL(c,window.location.href);return u.searchParams.set("flxig_connected","1"),{authorizeUrl:u.toString()}},async posts({cursor:c}){await L(500);let u=c?Number(c):0,x=Se(u,n),p=u+1;return{posts:x,nextCursor:p<t?String(p):null}},async createAutomation(){return await L(700),{id:`mock_automation_${Date.now()}`}}}}var z="0.1.1";function R(e,t){var i,o,a;let n=typeof e=="string"?document.querySelector(e):e;if(!n)throw new Error(`FlonixIG.mount: target not found: ${String(e)}`);if(!(t!=null&&t.apiKey))throw new Error("FlonixIG.mount: config.apiKey is required");if(!((i=t==null?void 0:t.user)!=null&&i.id))throw new Error("FlonixIG.mount: config.user.id is required");if(!((o=t==null?void 0:t.partner)!=null&&o.logo)||!((a=t==null?void 0:t.partner)!=null&&a.name))throw new Error("FlonixIG.mount: config.partner.name and config.partner.logo are required");return new P(n,t)}var fe={mount:R,version:z};return we(Ne);})();
 //# sourceMappingURL=flonix-ig.global.js.map