🔧

node_modules/@inertiajs/inertia-vue3/src/app.js

@@ -0,0 +1,105 @@
+import useForm from './useForm'
+import remember from './remember'
+import { computed, h, markRaw, ref } from 'vue'
+import { createHeadManager, Inertia } from '@inertiajs/inertia'
+
+const component = ref(null)
+const page = ref({})
+const key = ref(null)
+let headManager = null
+
+export default {
+  name: 'Inertia',
+  props: {
+    initialPage: {
+      type: Object,
+      required: true,
+    },
+    initialComponent: {
+      type: Object,
+      required: false,
+    },
+    resolveComponent: {
+      type: Function,
+      required: false,
+    },
+    titleCallback: {
+      type: Function,
+      required: false,
+      default: title => title,
+    },
+    onHeadUpdate: {
+      type: Function,
+      required: false,
+      default: () => () => {},
+    },
+  },
+  setup({ initialPage, initialComponent, resolveComponent, titleCallback, onHeadUpdate }) {
+    component.value = initialComponent ? markRaw(initialComponent) : null
+    page.value = initialPage
+    key.value = null
+
+    const isServer = typeof window === 'undefined'
+    headManager = createHeadManager(isServer, titleCallback, onHeadUpdate)
+
+    if (!isServer) {
+      Inertia.init({
+        initialPage,
+        resolveComponent,
+        swapComponent: async (args) => {
+          component.value = markRaw(args.component)
+          page.value = args.page
+          key.value = args.preserveState ? key.value : Date.now()
+        },
+      })
+    }
+
+    return () => {
+      if (component.value) {
+        component.value.inheritAttrs = !!component.value.inheritAttrs
+
+        const child = h(component.value, {
+          ...page.value.props,
+          key: key.value,
+        })
+
+        if (component.value.layout) {
+          if (typeof component.value.layout === 'function') {
+            return component.value.layout(h, child)
+          }
+
+          return (Array.isArray(component.value.layout) ? component.value.layout : [component.value.layout])
+            .concat(child)
+            .reverse()
+            .reduce((child, layout) => {
+              layout.inheritAttrs = !!layout.inheritAttrs
+              return h(layout, { ...page.value.props }, () => child)
+            })
+        }
+
+        return child
+      }
+    }
+  },
+}
+
+export const plugin = {
+  install(app) {
+    Inertia.form = useForm
+
+    Object.defineProperty(app.config.globalProperties, '$inertia', { get: () => Inertia })
+    Object.defineProperty(app.config.globalProperties, '$page', { get: () => page.value })
+    Object.defineProperty(app.config.globalProperties, '$headManager', { get: () => headManager })
+
+    app.mixin(remember)
+  },
+}
+
+export function usePage() {
+  return {
+    props: computed(() => page.value.props),
+    url: computed(() => page.value.url),
+    component: computed(() => page.value.component),
+    version: computed(() => page.value.version),
+  }
+}

node_modules/@inertiajs/inertia-vue3/src/createInertiaApp.js

@@ -0,0 +1,39 @@
+import { createSSRApp, h } from 'vue'
+import App, { plugin } from './app'
+
+export default async function createInertiaApp({ id = 'app', resolve, setup, title, page, render }) {
+  const isServer = typeof window === 'undefined'
+  const el = isServer ? null : document.getElementById(id)
+  const initialPage = page || JSON.parse(el.dataset.page)
+  const resolveComponent = name => Promise.resolve(resolve(name)).then(module => module.default || module)
+
+  let head = []
+
+  const vueApp = await resolveComponent(initialPage.component).then(initialComponent => {
+    return setup({
+      el,
+      app: App, // deprecated
+      App,
+      props: {
+        initialPage,
+        initialComponent,
+        resolveComponent,
+        titleCallback: title,
+        onHeadUpdate: isServer ? elements => (head = elements) : null,
+      },
+      plugin,
+    })
+  })
+
+  if (isServer) {
+    const body = await render(createSSRApp({
+      render: () => h('div', {
+        id,
+        'data-page': JSON.stringify(initialPage),
+        innerHTML: render(vueApp),
+      }),
+    }))
+
+    return { head, body }
+  }
+}

node_modules/@inertiajs/inertia-vue3/src/head.js

@@ -0,0 +1,81 @@
+export default {
+  props: {
+    title: {
+      type: String,
+      required: false,
+    },
+  },
+  data() {
+    return {
+      provider: this.$headManager.createProvider(),
+    }
+  },
+  beforeUnmount() {
+    this.provider.disconnect()
+  },
+  methods: {
+    isUnaryTag(node) {
+      return [
+        'area', 'base', 'br', 'col', 'embed', 'hr', 'img',
+        'input', 'keygen', 'link', 'meta', 'param', 'source',
+        'track', 'wbr',
+      ].indexOf(node.type) > -1
+    },
+    renderTagStart(node) {
+      node.props = node.props || {}
+      node.props.inertia = node.props['head-key'] !== undefined ? node.props['head-key'] : ''
+      const attrs = Object.keys(node.props).reduce((carry, name) => {
+        const value = node.props[name]
+        if (['key', 'head-key'].includes(name)) {
+          return carry
+        } else if (value === '') {
+          return carry + ` ${name}`
+        } else {
+          return carry + ` ${name}="${value}"`
+        }
+      }, '')
+      return `<${node.type}${attrs}>`
+    },
+    renderTagChildren(node) {
+      return typeof node.children === 'string'
+        ? node.children
+        : node.children.reduce((html, child) => html + this.renderTag(child), '')
+    },
+    renderTag(node) {
+      if (node.type.toString() === 'Symbol(Text)') {
+        return node.children
+      } else if (node.type.toString() === 'Symbol()') {
+        return ''
+      } else if (node.type.toString() === 'Symbol(Comment)') {
+        return ''
+      }
+      let html = this.renderTagStart(node)
+      if (node.children) {
+        html += this.renderTagChildren(node)
+      }
+      if (!this.isUnaryTag(node)) {
+        html += `</${node.type}>`
+      }
+      return html
+    },
+    addTitleElement(elements) {
+      if (this.title && !elements.find(tag => tag.startsWith('<title'))) {
+        elements.push(`<title inertia>${this.title}</title>`)
+      }
+      return elements
+    },
+    renderNodes(nodes) {
+      return this.addTitleElement(
+        nodes
+          .flatMap(node => node.type.toString() === 'Symbol(Fragment)' ? node.children : node)
+          .map(node => this.renderTag(node))
+          .filter(node => node)
+      )
+    },
+  },
+  render() {
+    this.provider.update(
+      this.renderNodes(this.$slots.default ? this.$slots.default() : [])
+    )
+  },
+}

node_modules/@inertiajs/inertia-vue3/src/index.js

@@ -0,0 +1,6 @@
+export { default as useForm } from './useForm'
+export { default as useRemember } from './useRemember'
+export { default as createInertiaApp } from './createInertiaApp'
+export { default as Head, default as InertiaHead } from './head'
+export { default as Link, default as InertiaLink, default as link } from './link'
+export { default as App, default as InertiaApp, default as app, plugin, usePage } from './app'

node_modules/@inertiajs/inertia-vue3/src/link.js

@@ -0,0 +1,86 @@
+import { h } from 'vue'
+import { Inertia, mergeDataIntoQueryString, shouldIntercept } from '@inertiajs/inertia'
+
+export default {
+  name: 'InertiaLink',
+  props: {
+    as: {
+      type: String,
+      default: 'a',
+    },
+    data: {
+      type: Object,
+      default: () => ({}),
+    },
+    href: {
+      type: String,
+    },
+    method: {
+      type: String,
+      default: 'get',
+    },
+    replace: {
+      type: Boolean,
+      default: false,
+    },
+    preserveScroll: {
+      type: Boolean,
+      default: false,
+    },
+    preserveState: {
+      type: Boolean,
+      default: null,
+    },
+    only: {
+      type: Array,
+      default: () => [],
+    },
+    headers: {
+      type: Object,
+      default: () => ({}),
+    },
+    queryStringArrayFormat: {
+      type: String,
+      default: 'brackets',
+    },
+  },
+  setup(props, { slots, attrs }) {
+    return props => {
+      const as = props.as.toLowerCase()
+      const method = props.method.toLowerCase()
+      const [href, data] = mergeDataIntoQueryString(method, props.href || '', props.data, props.queryStringArrayFormat)
+
+      if (as === 'a' && method !== 'get') {
+        console.warn(`Creating POST/PUT/PATCH/DELETE <a> links is discouraged as it causes "Open Link in New Tab/Window" accessibility issues.\n\nPlease specify a more appropriate element using the "as" attribute. For example:\n\n<Link href="${href}" method="${method}" as="button">...</Link>`)
+      }
+
+      return h(props.as, {
+        ...attrs,
+        ...as === 'a' ? { href } : {},
+        onClick: (event) => {
+          if (shouldIntercept(event)) {
+            event.preventDefault()
+
+            Inertia.visit(href, {
+              data: data,
+              method: method,
+              replace: props.replace,
+              preserveScroll: props.preserveScroll,
+              preserveState: props.preserveState ?? (method !== 'get'),
+              only: props.only,
+              headers: props.headers,
+              onCancelToken: attrs.onCancelToken || (() => ({})),
+              onBefore: attrs.onBefore || (() => ({})),
+              onStart: attrs.onStart || (() => ({})),
+              onProgress: attrs.onProgress || (() => ({})),
+              onFinish: attrs.onFinish || (() => ({})),
+              onCancel: attrs.onCancel || (() => ({})),
+              onSuccess: attrs.onSuccess || (() => ({})),
+              onError: attrs.onError || (() => ({})),
+            })
+          }
+        },
+      }, slots)
+    }
+  },
+}

node_modules/@inertiajs/inertia-vue3/src/remember.js

@@ -0,0 +1,55 @@
+import cloneDeep from 'lodash.clonedeep'
+import { Inertia } from '@inertiajs/inertia'
+
+export default {
+  created() {
+    if (!this.$options.remember) {
+      return
+    }
+
+    if (Array.isArray(this.$options.remember)) {
+      this.$options.remember = { data: this.$options.remember }
+    }
+
+    if (typeof this.$options.remember === 'string') {
+      this.$options.remember = { data: [this.$options.remember] }
+    }
+
+    if (typeof this.$options.remember.data === 'string') {
+      this.$options.remember = { data: [this.$options.remember.data] }
+    }
+
+    const rememberKey = this.$options.remember.key instanceof Function
+      ? this.$options.remember.key.call(this)
+      : this.$options.remember.key
+
+    const restored = Inertia.restore(rememberKey)
+
+    const rememberable = this.$options.remember.data.filter(key => {
+      return !(this[key] !== null && typeof this[key] === 'object' && this[key].__rememberable === false)
+    })
+
+    const hasCallbacks = (key) => {
+      return this[key] !== null
+        && typeof this[key] === 'object'
+        && typeof this[key].__remember === 'function'
+        && typeof this[key].__restore === 'function'
+    }
+
+    rememberable.forEach(key => {
+      if (this[key] !== undefined && restored !== undefined && restored[key] !== undefined) {
+        hasCallbacks(key) ? this[key].__restore(restored[key]) : (this[key] = restored[key])
+      }
+
+      this.$watch(key, () => {
+        Inertia.remember(
+          rememberable.reduce((data, key) => ({
+            ...data,
+            [key]: cloneDeep(hasCallbacks(key) ? this[key].__remember(): this[key]),
+          }), {}),
+          rememberKey,
+        )
+      }, { immediate: true, deep: true })
+    })
+  },
+}

node_modules/@inertiajs/inertia-vue3/src/useForm.js

@@ -0,0 +1,207 @@
+import isEqual from 'lodash.isequal'
+import { reactive, watch } from 'vue'
+import cloneDeep from 'lodash.clonedeep'
+import { Inertia } from '@inertiajs/inertia'
+
+export default function useForm(...args) {
+  const rememberKey = typeof args[0] === 'string' ? args[0] : null
+  const data = (typeof args[0] === 'string' ? args[1] : args[0]) || {}
+  const restored = rememberKey ? Inertia.restore(rememberKey) : null
+  let defaults = cloneDeep(data)
+  let cancelToken = null
+  let recentlySuccessfulTimeoutId = null
+  let transform = data => data
+
+  let form = reactive({
+    ...restored ? restored.data : data,
+    isDirty: false,
+    errors: restored ? restored.errors : {},
+    hasErrors: false,
+    processing: false,
+    progress: null,
+    wasSuccessful: false,
+    recentlySuccessful: false,
+    data() {
+      return Object
+        .keys(data)
+        .reduce((carry, key) => {
+          carry[key] = this[key]
+          return carry
+        }, {})
+    },
+    transform(callback) {
+      transform = callback
+
+      return this
+    },
+    defaults(key, value) {
+      if (typeof key === 'undefined') {
+        defaults = this.data()
+      } else {
+        defaults = Object.assign(
+          {},
+          cloneDeep(defaults),
+          value ? ({ [key]: value }) : key,
+        )
+      }
+
+      return this
+    },
+    reset(...fields) {
+      let clonedDefaults = cloneDeep(defaults)
+      if (fields.length === 0) {
+        Object.assign(this, clonedDefaults)
+      } else {
+        Object.assign(
+          this,
+          Object
+            .keys(clonedDefaults)
+            .filter(key => fields.includes(key))
+            .reduce((carry, key) => {
+              carry[key] = clonedDefaults[key]
+              return carry
+            }, {}),
+        )
+      }
+
+      return this
+    },
+    setError(key, value) {
+      Object.assign(this.errors, (value ? { [key]: value } : key))
+
+      this.hasErrors = Object.keys(this.errors).length > 0
+
+      return this
+    },
+    clearErrors(...fields) {
+      this.errors = Object
+        .keys(this.errors)
+        .reduce((carry, field) => ({
+          ...carry,
+          ...(fields.length > 0 && !fields.includes(field) ? { [field] : this.errors[field] } : {}),
+        }), {})
+
+      this.hasErrors = Object.keys(this.errors).length > 0
+
+      return this
+    },
+    submit(method, url, options = {}) {
+      const data = transform(this.data())
+      const _options = {
+        ...options,
+        onCancelToken: (token) => {
+          cancelToken = token
+
+          if (options.onCancelToken) {
+            return options.onCancelToken(token)
+          }
+        },
+        onBefore: visit => {
+          this.wasSuccessful = false
+          this.recentlySuccessful = false
+          clearTimeout(recentlySuccessfulTimeoutId)
+
+          if (options.onBefore) {
+            return options.onBefore(visit)
+          }
+        },
+        onStart: visit => {
+          this.processing = true
+
+          if (options.onStart) {
+            return options.onStart(visit)
+          }
+        },
+        onProgress: event => {
+          this.progress = event
+
+          if (options.onProgress) {
+            return options.onProgress(event)
+          }
+        },
+        onSuccess: async page => {
+          this.processing = false
+          this.progress = null
+          this.clearErrors()
+          this.wasSuccessful = true
+          this.recentlySuccessful = true
+          recentlySuccessfulTimeoutId = setTimeout(() => this.recentlySuccessful = false, 2000)
+
+          const onSuccess = options.onSuccess ? await options.onSuccess(page) : null
+          defaults = cloneDeep(this.data())
+          this.isDirty = false
+          return onSuccess
+        },
+        onError: errors => {
+          this.processing = false
+          this.progress = null
+          this.clearErrors().setError(errors)
+
+          if (options.onError) {
+            return options.onError(errors)
+          }
+        },
+        onCancel: () => {
+          this.processing = false
+          this.progress = null
+
+          if (options.onCancel) {
+            return options.onCancel()
+          }
+        },
+        onFinish: () => {
+          this.processing = false
+          this.progress = null
+          cancelToken = null
+
+          if (options.onFinish) {
+            return options.onFinish()
+          }
+        },
+      }
+
+      if (method === 'delete') {
+        Inertia.delete(url, { ..._options, data  })
+      } else {
+        Inertia[method](url, data, _options)
+      }
+    },
+    get(url, options) {
+      this.submit('get', url, options)
+    },
+    post(url, options) {
+      this.submit('post', url, options)
+    },
+    put(url, options) {
+      this.submit('put', url, options)
+    },
+    patch(url, options) {
+      this.submit('patch', url, options)
+    },
+    delete(url, options) {
+      this.submit('delete', url, options)
+    },
+    cancel() {
+      if (cancelToken) {
+        cancelToken.cancel()
+      }
+    },
+    __rememberable: rememberKey === null,
+    __remember() {
+      return { data: this.data(), errors: this.errors }
+    },
+    __restore(restored) {
+      Object.assign(this, restored.data)
+      this.setError(restored.errors)
+    },
+  })
+
+  watch(form, newValue => {
+    form.isDirty = !isEqual(form.data(), defaults)
+    if (rememberKey) {
+      Inertia.remember(cloneDeep(newValue.__remember()), rememberKey)
+    }
+  }, { immediate: true, deep: true })
+
+  return form
+}

node_modules/@inertiajs/inertia-vue3/src/useRemember.js

@@ -0,0 +1,20 @@
+import cloneDeep from 'lodash.clonedeep'
+import { Inertia } from '@inertiajs/inertia'
+import { isReactive, reactive, ref, watch } from 'vue'
+
+export default function useRemember(data, key) {
+  if (typeof data === 'object' && data !== null && data.__rememberable === false) {
+    return data
+  }
+
+  const restored = Inertia.restore(key)
+  const type = isReactive(data) ? reactive : ref
+  const hasCallbacks = typeof data.__remember === 'function' && typeof data.__restore === 'function'
+  const remembered = restored === undefined ? data : type(hasCallbacks ? data.__restore(restored) : restored)
+
+  watch(remembered, (newValue) => {
+    Inertia.remember(cloneDeep(hasCallbacks ? data.__remember() : newValue), key)
+  }, { immediate: true, deep: true })
+
+  return remembered
+}