@nuxt/scripts 0.11.1 → 0.11.3

package/dist/runtime/components/ScriptCarbonAds.vue

@@ -1,83 +1,83 @@
-<script setup lang="ts">
-import { withQuery } from 'ufo'
-import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
-import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
-import type { ElementScriptTrigger } from '#nuxt-scripts/types'
-
-const props = defineProps<{
-  serve: string
-  placement: string
-  format: string
-  /**
-   * Defines the trigger event to load the script.
-   */
-  trigger?: ElementScriptTrigger
-}>()
-
-const emit = defineEmits<{
-  error: [error: string | Event]
-  ready: [HTMLScriptElement]
-}>()
-
-const attrId = `_carbonads_js`
-const carbonadsEl = ref<HTMLElement | null>(import.meta.client ? document.getElementById(attrId) : null)
-// syncs to useScript status
-const status = ref('awaitingLoad')
-
-function loadCarbon() {
-  if (!carbonadsEl.value) {
-    return
-  }
-  status.value = 'loading'
-  const script = document.createElement('script')
-  script.setAttribute('src', withQuery('https://cdn.carbonads.com/carbon.js', {
-    serve: props.serve,
-    placement: props.placement,
-    format: props.format,
-  }))
-  script.setAttribute('id', attrId)
-  script.onerror = (err) => {
-    if (status.value !== 'error') {
-      status.value = 'error'
-      emit('error', err)
-    }
-  }
-  script.onload = () => {
-    if (status.value !== 'loaded') {
-      status.value = 'loaded'
-      emit('ready', script)
-    }
-  }
-  carbonadsEl.value.appendChild(script)
-}
-
-const trigger = useScriptTriggerElement({ trigger: props.trigger, el: carbonadsEl })
-onMounted(() => {
-  if (trigger === 'onNuxtReady') {
-    loadCarbon()
-  }
-  else {
-    trigger.then(loadCarbon)
-  }
-})
-
-const rootAttrs = computed(() => {
-  return {
-    ...(trigger instanceof Promise ? trigger.ssrAttrs || {} : {}),
-  }
-})
-
-onBeforeUnmount(() => {
-  if (carbonadsEl.value) {
-    carbonadsEl.value.remove()
-  }
-})
-</script>
-
-<template>
-  <div ref="carbonadsEl" v-bind="rootAttrs">
-    <slot v-if="status === 'awaitingLoad'" name="awaitingLoad" />
-    <slot v-else-if="status === 'loading'" name="loading" />
-    <slot v-else-if="status === 'error'" name="error" />
-  </div>
-</template>
+<script setup lang="ts">
+import { withQuery } from 'ufo'
+import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
+import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
+import type { ElementScriptTrigger } from '#nuxt-scripts/types'
+
+const props = defineProps<{
+  serve: string
+  placement: string
+  format: string
+  /**
+   * Defines the trigger event to load the script.
+   */
+  trigger?: ElementScriptTrigger
+}>()
+
+const emit = defineEmits<{
+  error: [error: string | Event]
+  ready: [HTMLScriptElement]
+}>()
+
+const attrId = `_carbonads_js`
+const carbonadsEl = ref<HTMLElement | null>(import.meta.client ? document.getElementById(attrId) : null)
+// syncs to useScript status
+const status = ref('awaitingLoad')
+
+function loadCarbon() {
+  if (!carbonadsEl.value) {
+    return
+  }
+  status.value = 'loading'
+  const script = document.createElement('script')
+  script.setAttribute('src', withQuery('https://cdn.carbonads.com/carbon.js', {
+    serve: props.serve,
+    placement: props.placement,
+    format: props.format,
+  }))
+  script.setAttribute('id', attrId)
+  script.onerror = (err) => {
+    if (status.value !== 'error') {
+      status.value = 'error'
+      emit('error', err)
+    }
+  }
+  script.onload = () => {
+    if (status.value !== 'loaded') {
+      status.value = 'loaded'
+      emit('ready', script)
+    }
+  }
+  carbonadsEl.value.appendChild(script)
+}
+
+const trigger = useScriptTriggerElement({ trigger: props.trigger, el: carbonadsEl })
+onMounted(() => {
+  if (trigger === 'onNuxtReady') {
+    loadCarbon()
+  }
+  else {
+    trigger.then(loadCarbon)
+  }
+})
+
+const rootAttrs = computed(() => {
+  return {
+    ...(trigger instanceof Promise ? trigger.ssrAttrs || {} : {}),
+  }
+})
+
+onBeforeUnmount(() => {
+  if (carbonadsEl.value) {
+    carbonadsEl.value.remove()
+  }
+})
+</script>
+
+<template>
+  <div ref="carbonadsEl" v-bind="rootAttrs">
+    <slot v-if="status === 'awaitingLoad'" name="awaitingLoad" />
+    <slot v-else-if="status === 'loading'" name="loading" />
+    <slot v-else-if="status === 'error'" name="error" />
+  </div>
+</template>

package/dist/runtime/components/ScriptCrisp.vue

@@ -1,94 +1,94 @@
-<script setup lang="ts">
-import { ref, onMounted, onBeforeUnmount, watch, computed } from 'vue'
-import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
-import { useScriptCrisp } from '../registry/crisp'
-import type { ElementScriptTrigger } from '#nuxt-scripts/types'
-
-const props = withDefaults(defineProps<{
-  /**
-   * Defines the trigger event to load the script.
-   */
-  trigger?: ElementScriptTrigger
-  id: string
-  runtimeConfig?: {
-    locale: string
-  }
-  tokenId?: string
-  cookieDomain?: string
-  cookieExpiry?: number
-}>(), {
-  trigger: 'click',
-})
-
-const emits = defineEmits<{
-  // our emit
-  ready: [e: ReturnType<typeof useScriptCrisp>]
-  error: []
-}>()
-
-const rootEl = ref(null)
-const trigger = useScriptTriggerElement({ trigger: props.trigger, el: rootEl })
-
-const isReady = ref(false)
-const crisp = useScriptCrisp({
-  id: props.id,
-  runtimeConfig: props.runtimeConfig,
-  tokenId: props.tokenId,
-  cookieDomain: props.cookieDomain,
-  cookieExpiry: props.cookieExpiry,
-  scriptOptions: {
-    trigger,
-  },
-})
-const { onLoaded, status } = crisp
-if (props.trigger === 'click') {
-  onLoaded((instance) => {
-    instance.do('chat:open')
-  })
-}
-
-defineExpose({
-  crisp,
-})
-
-let observer: MutationObserver
-onMounted(() => {
-  watch(status, (status) => {
-    if (status === 'loaded') {
-      observer = new MutationObserver(() => {
-        if (document.getElementById('crisp-chatbox')) {
-          isReady.value = true
-          emits('ready', crisp)
-          observer.disconnect()
-        }
-      })
-      observer.observe(document.body, { childList: true, subtree: true })
-    }
-    else if (status === 'error') {
-      emits('error')
-    }
-  })
-})
-onBeforeUnmount(() => {
-  observer?.disconnect()
-})
-
-const rootAttrs = computed(() => {
-  return {
-    ...(trigger instanceof Promise ? trigger.ssrAttrs || {} : {}),
-  }
-})
-</script>
-
-<template>
-  <div
-    ref="rootEl"
-    :style="{ display: isReady ? 'none' : 'block' }"
-    v-bind="rootAttrs"
-  >
-    <slot :ready="isReady" />
-    <slot v-if="status === 'awaitingLoad'" name="awaitingLoad" />
-    <slot v-else-if="status === 'loading' || !isReady" name="loading" />
-    <slot v-else-if="status === 'error'" name="error" />
-  </div>
-</template>
+<script setup lang="ts">
+import { ref, onMounted, onBeforeUnmount, watch, computed } from 'vue'
+import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
+import { useScriptCrisp } from '../registry/crisp'
+import type { ElementScriptTrigger } from '#nuxt-scripts/types'
+
+const props = withDefaults(defineProps<{
+  /**
+   * Defines the trigger event to load the script.
+   */
+  trigger?: ElementScriptTrigger
+  id: string
+  runtimeConfig?: {
+    locale: string
+  }
+  tokenId?: string
+  cookieDomain?: string
+  cookieExpiry?: number
+}>(), {
+  trigger: 'click',
+})
+
+const emits = defineEmits<{
+  // our emit
+  ready: [e: ReturnType<typeof useScriptCrisp>]
+  error: []
+}>()
+
+const rootEl = ref(null)
+const trigger = useScriptTriggerElement({ trigger: props.trigger, el: rootEl })
+
+const isReady = ref(false)
+const crisp = useScriptCrisp({
+  id: props.id,
+  runtimeConfig: props.runtimeConfig,
+  tokenId: props.tokenId,
+  cookieDomain: props.cookieDomain,
+  cookieExpiry: props.cookieExpiry,
+  scriptOptions: {
+    trigger,
+  },
+})
+const { onLoaded, status } = crisp
+if (props.trigger === 'click') {
+  onLoaded((instance) => {
+    instance.do('chat:open')
+  })
+}
+
+defineExpose({
+  crisp,
+})
+
+let observer: MutationObserver
+onMounted(() => {
+  watch(status, (status) => {
+    if (status === 'loaded') {
+      observer = new MutationObserver(() => {
+        if (document.getElementById('crisp-chatbox')) {
+          isReady.value = true
+          emits('ready', crisp)
+          observer.disconnect()
+        }
+      })
+      observer.observe(document.body, { childList: true, subtree: true })
+    }
+    else if (status === 'error') {
+      emits('error')
+    }
+  })
+})
+onBeforeUnmount(() => {
+  observer?.disconnect()
+})
+
+const rootAttrs = computed(() => {
+  return {
+    ...(trigger instanceof Promise ? trigger.ssrAttrs || {} : {}),
+  }
+})
+</script>
+
+<template>
+  <div
+    ref="rootEl"
+    :style="{ display: isReady ? 'none' : 'block' }"
+    v-bind="rootAttrs"
+  >
+    <slot :ready="isReady" />
+    <slot v-if="status === 'awaitingLoad'" name="awaitingLoad" />
+    <slot v-else-if="status === 'loading' || !isReady" name="loading" />
+    <slot v-else-if="status === 'error'" name="error" />
+  </div>
+</template>

package/dist/runtime/components/ScriptGoogleAdsense.vue

@@ -1,93 +1,93 @@
-<script setup lang="ts">
-import { computed, onMounted, ref, watch } from 'vue'
-import { callOnce } from 'nuxt/app'
-import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
-import { useScriptGoogleAdsense } from '../registry/google-adsense'
-import { scriptRuntimeConfig } from '../utils'
-import type { ElementScriptTrigger } from '#nuxt-scripts/types'
-
-const props = withDefaults(defineProps<{
-  dataAdClient: string
-  dataAdSlot: string
-  dataAdFormat?: 'auto' | 'rectangle' | 'vertical' | 'horizontal' | 'fluid' | 'autorelaxed'
-  dataAdLayout?: 'in-article' | 'in-feed' | 'fixed'
-  dataFullWidthResponsive?: boolean
-  /**
-   * Defines the trigger event to load the script.
-   */
-  trigger?: ElementScriptTrigger
-}>(), {
-  dataFullWidthResponsive: true,
-  dataAdFormat: undefined, // Preserve previous behavior
-})
-
-const emits = defineEmits<{
-  // our emit
-  ready: [e: ReturnType<typeof useScriptGoogleAdsense>]
-  error: []
-}>()
-
-const rootEl = ref(null)
-const trigger = useScriptTriggerElement({ trigger: props.trigger, el: rootEl })
-
-const scriptConfig = scriptRuntimeConfig('googleAdsense')
-const addClient = computed(() => {
-  return props.dataAdClient || scriptConfig?.client
-})
-
-const instance = useScriptGoogleAdsense({
-  client: addClient.value,
-  scriptOptions: {
-    trigger,
-  },
-})
-
-const { status } = instance
-
-function pushAdSlot() {
-  (window.adsbygoogle = window.adsbygoogle || []).push({})
-}
-
-onMounted(() => {
-  if (import.meta.dev) {
-    callOnce(() => pushAdSlot())
-  }
-  else {
-    pushAdSlot()
-  }
-
-  watch(status, (val) => {
-    if (val === 'loaded') {
-      emits('ready', instance)
-    }
-    else if (val === 'error') {
-      emits('error')
-    }
-  })
-})
-
-const rootAttrs = computed(() => {
-  return {
-    ...(trigger instanceof Promise ? trigger.ssrAttrs || {} : {}),
-  }
-})
-</script>
-
-<template>
-  <div>
-    <ins
-      ref="rootEl"
-      class="adsbygoogle"
-      style="display: block;"
-      :data-ad-client="addClient"
-      :data-ad-slot="dataAdSlot"
-      :data-ad-format="dataAdFormat"
-      :data-ad-layout="dataAdLayout"
-      :data-full-width-responsive="dataFullWidthResponsive"
-      v-bind="rootAttrs"
-    />
-    <slot v-if="status === 'awaitingLoad'" name="awaitingLoad" />
-    <slot v-else-if="status === 'loading'" name="loading" />
-    <slot v-else-if="status === 'error'" name="error" />
-  </div>
-</template>
+<script setup lang="ts">
+import { computed, onMounted, ref, watch } from 'vue'
+import { callOnce } from 'nuxt/app'
+import { useScriptTriggerElement } from '../composables/useScriptTriggerElement'
+import { useScriptGoogleAdsense } from '../registry/google-adsense'
+import { scriptRuntimeConfig } from '../utils'
+import type { ElementScriptTrigger } from '#nuxt-scripts/types'
+
+const props = withDefaults(defineProps<{
+  dataAdClient: string
+  dataAdSlot: string
+  dataAdFormat?: 'auto' | 'rectangle' | 'vertical' | 'horizontal' | 'fluid' | 'autorelaxed'
+  dataAdLayout?: 'in-article' | 'in-feed' | 'fixed'
+  dataFullWidthResponsive?: boolean
+  /**
+   * Defines the trigger event to load the script.
+   */
+  trigger?: ElementScriptTrigger
+}>(), {
+  dataFullWidthResponsive: true,
+  dataAdFormat: undefined, // Preserve previous behavior
+})
+
+const emits = defineEmits<{
+  // our emit
+  ready: [e: ReturnType<typeof useScriptGoogleAdsense>]
+  error: []
+}>()
+
+const rootEl = ref(null)
+const trigger = useScriptTriggerElement({ trigger: props.trigger, el: rootEl })
+
+const scriptConfig = scriptRuntimeConfig('googleAdsense')
+const addClient = computed(() => {
+  return props.dataAdClient || scriptConfig?.client
+})
+
+const instance = useScriptGoogleAdsense({
+  client: addClient.value,
+  scriptOptions: {
+    trigger,
+  },
+})
+
+const { status } = instance
+
+function pushAdSlot() {
+  (window.adsbygoogle = window.adsbygoogle || []).push({})
+}
+
+onMounted(() => {
+  if (import.meta.dev) {
+    callOnce(() => pushAdSlot())
+  }
+  else {
+    pushAdSlot()
+  }
+
+  watch(status, (val) => {
+    if (val === 'loaded') {
+      emits('ready', instance)
+    }
+    else if (val === 'error') {
+      emits('error')
+    }
+  })
+})
+
+const rootAttrs = computed(() => {
+  return {
+    ...(trigger instanceof Promise ? trigger.ssrAttrs || {} : {}),
+  }
+})
+</script>
+
+<template>
+  <div>
+    <ins
+      ref="rootEl"
+      class="adsbygoogle"
+      style="display: block;"
+      :data-ad-client="addClient"
+      :data-ad-slot="dataAdSlot"
+      :data-ad-format="dataAdFormat"
+      :data-ad-layout="dataAdLayout"
+      :data-full-width-responsive="dataFullWidthResponsive"
+      v-bind="rootAttrs"
+    />
+    <slot v-if="status === 'awaitingLoad'" name="awaitingLoad" />
+    <slot v-else-if="status === 'loading'" name="loading" />
+    <slot v-else-if="status === 'error'" name="error" />
+  </div>
+</template>