UNPKG

vue3-disqus

Version:

Vue component to integrate Disqus comments in your application, with support for SPA

2 lines (1 loc) 3.84 kB
var Vue3Disqus=function(f,e){"use strict";const y="Disqus shortname is required",D=["api_key","author_s3","category_id","identifier","integration","language","remote_auth_s3","slug","title","url"],p=["name","button","icon","url","logout","profile_url","width","height"],E=["preData","preInit","afterRender","onInit","onReady","onIdentify","onPaginate","onNewComment","beforeComment","preReset"],h=Symbol("disqus"),O=t=>t.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase().replace("on-",""),S=t=>requestAnimationFrame(()=>requestAnimationFrame(t)),I=e.defineComponent({name:"DisqusComments",props:{url:String,shortname:String,class:String,identifier:{type:String,required:!0},pageConfig:{type:Object,validator:t=>Object.keys(t).every(o=>D.includes(o))},ssoConfig:{type:Object,validator:t=>Object.keys(t).every(o=>p.includes(o))},language:{type:String,default:"en"},lazy:{type:Boolean,default:!0},lazyConfig:{type:Object,default:()=>({root:null,rootMargin:"300px",threshold:.5})}},setup(t,{emit:o}){const s=e.inject(h,{}),a=e.getCurrentInstance(),c=e.ref(null),g=e.computed(()=>{const n=t.shortname||s.shortname;if(!n)throw new Error(y);return n});e.watch(()=>t.language,d),e.onMounted(()=>{if(t.lazy)return _();m()});function m(){if(s&&(s.reset=d),window.DISQUS)return d();window.disqus_config=function(){w(this)},l(),e.watch(()=>t.url,d)}function d(){window.DISQUS.reset({reload:!0,config:function(){w(this)}})}function _(){var n;if("IntersectionObserver"in window)return c.value=new IntersectionObserver(u,t.lazyConfig),c.value.observe((n=a==null?void 0:a.proxy)==null?void 0:n.$el);m()}function u(n){n.forEach(r=>{var i;r.isIntersecting&&((i=c.value)==null||i.disconnect(),m())})}function l(){const n=+new Date,r=document,i=r.createElement("script");i.setAttribute("id","embed-disqus-script"),i.setAttribute("data-timestamp",n.toString()),i.type="text/javascript",i.async=!0,i.src=`//${g.value}.disqus.com/embed.js`,(r.body||r.head).appendChild(i)}function w(n){v(n),B(n),t.ssoConfig&&Object.keys(t.ssoConfig).length&&Object.assign(n.sso,t.ssoConfig),n.language=t.language}function v(n){const r={url:t.url,identifier:t.identifier};Object.assign(n.page,r),t.pageConfig&&Object.keys(t.pageConfig).length&&Object.assign(n.page,t.pageConfig)}function B(n){E.forEach(r=>{n.callbacks[r]=[i=>{o(O(r),i)}]})}}}),U="",C=(t,o)=>{const s=t.__vccOpts||t;for(const[a,c]of o)s[a]=c;return s},$={id:"disqus_thread"};function j(t,o,s,a,c,g){return e.openBlock(),e.createElementBlock("div",$)}const q=C(I,[["render",j]]),k=e.defineComponent({name:"DisqusCount",props:{url:String,shortname:String,identifier:{type:String,required:!0},tag:{type:String,default:"span"}},setup(t){const o=e.inject(h,{}),s=e.computed(()=>t.tag==="a"?`${t.url}#disqus_thread`:"#"),a=e.computed(()=>t.tag==="span"?t.url:null),c=e.computed(()=>{const u=t.shortname||o.shortname;if(!u)throw new Error(y);return u}),g={href:s.value,"data-disqus-url":a.value,"data-disqus-identifier":t.identifier};e.onMounted(m);function m(){if("DISQUSWIDGETS"in window)return S(()=>d());_(),e.watch(()=>t.url,()=>S(()=>d()))}function d(){window.DISQUSWIDGETS.getCount({reset:!0})}function _(){if(document.getElementById("dsq-count-scr"))return;const u=document,l=u.createElement("script");l.async=!0,l.id="dsq-count-scr",l.src=`//${c.value}.disqus.com/count.js`,(u.head||u.body).appendChild(l)}return{disqusAttrs:g}}});function A(t,o,s,a,c,g){return e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.tag),e.mergeProps({class:"disqus-comment-count"},t.disqusAttrs),null,16)}const b=C(k,[["render",A]]);function R(t,o={}){t.component("DisqusComments",q),t.component("DisqusCount",b);const s={shortname:o.shortname,reset:null};t.provide(h,s)}return f.DisqusComments=q,f.DisqusCount=b,f.default=R,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}}),f}({},Vue);