@inertiajs/svelte 1.3.0-beta.1 → 1.3.0-beta.2

package/dist/components/App.svelte

@@ -2,14 +2,13 @@
 import store, {} from "../store";
 $: props = resolveProps($store);
 function resolveProps({ component, page, key = null }) {
-  if (!component?.default || !page) return null;
   const child = h(component.default, page.props, [], key);
   const layout = component.layout;
   return layout ? resolveLayout(layout, child, page.props, key) : child;
 }
 function resolveLayout(layout, child, pageProps, key) {
   if (Array.isArray(layout)) {
-    return layout.concat(child).reverse().reduce((child2, layout2) => h(layout2, pageProps, [child2], key));
+    return layout.slice().reverse().reduce((currentRender, layoutComponent) => h(layoutComponent, pageProps, [currentRender], key), child);
   }
   return h(layout, pageProps, child ? [child] : [], key);
 }

package/dist/components/Link.svelte

@@ -1,5 +1,4 @@
-<script>import { beforeUpdate } from "svelte";
-import { inertia } from "../index";
+<script>import { inertia } from "../index";
 export let href;
 export let as = "a";
 export let data = {};
@@ -11,17 +10,11 @@ export let only = [];
 export let except = [];
 export let headers = {};
 export let queryStringArrayFormat = "brackets";
-beforeUpdate(() => {
-  if (as === "a" && method.toLowerCase() !== "get") {
-    console.warn(
-      `Creating POST/PUT/PATCH/DELETE <a> links is discouraged as it causes "Open Link in New Tab/Window" accessibility issues.
-
-Please specify a more appropriate element using the "as" attribute. For example:
-
-<Link href="${href}" method="${method}" as="button">...</Link>`
-    );
-  }
-});
+$: asProp = method !== "get" ? "button" : as.toLowerCase();
+$: elProps = {
+  a: { href },
+  button: { type: "button" }
+}[asProp] || {};
 </script>
 
 <!-- svelte-ignore a11y-no-static-element-interactions -->
@@ -39,8 +32,8 @@ Please specify a more appropriate element using the "as" attribute. For example:
     headers,
     queryStringArrayFormat,
   }}
-  {...as === 'a' ? { href } : {}}
   {...$$restProps}
+  {...elProps}
   on:focus
   on:blur
   on:click

package/dist/components/Link.svelte.d.ts

@@ -1,11 +1,11 @@
 import { SvelteComponentTyped } from "svelte";
-import type { Method, PreserveStateOption, RequestPayload } from '@inertiajs/core';
+import type { FormDataConvertible, Method, PreserveStateOption } from '@inertiajs/core';
 declare const __propDef: {
     props: {
         [x: string]: any;
         href: string;
         as?: keyof HTMLElementTagNameMap | undefined;
-        data?: RequestPayload | undefined;
+        data?: Record<string, FormDataConvertible> | undefined;
         method?: Method | undefined;
         replace?: boolean | undefined;
         preserveScroll?: PreserveStateOption | undefined;

package/dist/createInertiaApp.d.ts

@@ -5,7 +5,7 @@ import type { ComponentResolver } from './types';
 interface CreateInertiaAppProps {
     id?: string;
     resolve: ComponentResolver;
-    setup: (props: {
+    setup?: (props: {
         el: Element;
         App: ComponentType<App>;
         props: {

package/dist/createInertiaApp.js

@@ -1,6 +1,6 @@
 import { router, setupProgress } from '@inertiajs/core';
 import escape from 'html-escape';
-import { VERSION } from 'svelte/compiler';
+import { version as SVELTE_VERSION } from 'svelte/package.json';
 import App from './components/App.svelte';
 import store from './store';
 export default async function createInertiaApp({ id = 'app', resolve, setup, progress = {}, page, }) {
@@ -16,7 +16,7 @@ export default async function createInertiaApp({ id = 'app', resolve, setup, pro
         });
     });
     if (isServer) {
-        const isSvelte5 = VERSION.startsWith('5');
+        const isSvelte5 = SVELTE_VERSION.startsWith('5');
         const { html, head, css } = await (async () => {
             if (isSvelte5) {
                 const { render } = await dynamicImport('svelte/server');

package/dist/index.d.ts

@@ -4,4 +4,5 @@ export { default as createInertiaApp } from './createInertiaApp';
 export { default as inertia } from './link';
 export { default as page } from './page';
 export { default as remember } from './remember';
+export { type ResolvedComponent } from './types';
 export { default as useForm, type InertiaForm, type InertiaFormProps } from './useForm';

package/dist/index.js

@@ -4,4 +4,5 @@ export { default as createInertiaApp } from './createInertiaApp';
 export { default as inertia } from './link';
 export { default as page } from './page';
 export { default as remember } from './remember';
+export {} from './types';
 export { default as useForm } from './useForm';

package/dist/link.d.ts

@@ -1,10 +1,20 @@
-import { type VisitOptions } from '@inertiajs/core';
-import type { Action } from 'svelte/action';
+import { type FormDataConvertible, type GlobalEventsMap, type VisitOptions } from '@inertiajs/core';
+import type { CancelTokenSource } from 'axios';
+import type { ActionReturn } from 'svelte/action';
 interface ActionElement extends HTMLElement {
     href?: string;
 }
-type ActionParameters = VisitOptions & {
+type ActionParameters = Omit<VisitOptions, 'data'> & {
     href?: string;
+    data?: Record<string, FormDataConvertible>;
 };
-declare const link: Action<ActionElement, ActionParameters>;
+type SelectedEventKeys = 'start' | 'progress' | 'finish' | 'before' | 'cancel' | 'success' | 'error';
+type SelectedGlobalEventsMap = Pick<GlobalEventsMap, SelectedEventKeys>;
+type ActionAttributes = {
+    [K in keyof SelectedGlobalEventsMap as `on:${K}` | `on${K}`]?: (event: CustomEvent<SelectedGlobalEventsMap[K]['details']>) => void;
+} & {
+    'on:cancel-token'?: (event: CustomEvent<CancelTokenSource>) => void;
+    oncanceltoken?: (event: CustomEvent<CancelTokenSource>) => void;
+};
+declare function link(node: ActionElement, options?: ActionParameters): ActionReturn<ActionParameters, ActionAttributes>;
 export default link;

package/dist/link.js

@@ -1,5 +1,5 @@
-import { mergeDataIntoQueryString, router, shouldIntercept } from '@inertiajs/core';
-const link = (node, options = {}) => {
+import { mergeDataIntoQueryString, router, shouldIntercept, } from '@inertiajs/core';
+function link(node, options = {}) {
     const [href, data] = hrefAndData(options);
     node.href = href;
     options.data = data;
@@ -16,8 +16,8 @@ const link = (node, options = {}) => {
         if (shouldIntercept(event)) {
             event.preventDefault();
             router.visit(node.href, {
-                onCancelToken: () => fireEvent('cancel-token'),
-                onBefore: (visit) => fireEvent('before', { detail: { visit } }),
+                onCancelToken: (token) => fireEvent('cancel-token', { detail: { token } }),
+                onBefore: (visit) => fireEvent('before', { cancelable: true, detail: { visit } }),
                 onStart: (visit) => fireEvent('start', { detail: { visit } }),
                 onProgress: (progress) => fireEvent('progress', { detail: { progress } }),
                 onFinish: (visit) => fireEvent('finish', { detail: { visit } }),
@@ -39,5 +39,5 @@ const link = (node, options = {}) => {
             node.removeEventListener('click', visit);
         },
     };
-};
+}
 export default link;

package/dist/page.d.ts

@@ -1,2 +1,2 @@
-declare const page: import("svelte/store").Readable<import("@inertiajs/core").Page<import("@inertiajs/core").PageProps> | null>;
+declare const page: import("svelte/store").Readable<import("@inertiajs/core").Page<import("@inertiajs/core").PageProps>>;
 export default page;

package/dist/store.d.ts

@@ -1,8 +1,8 @@
 import type { Page } from '@inertiajs/core';
 import type { ResolvedComponent } from './types';
 export interface InertiaStore {
-    component: ResolvedComponent | null;
-    page: Page | null;
+    component: ResolvedComponent;
+    page: Page;
     key: number | null;
 }
 declare const store: import("svelte/store").Writable<InertiaStore>;

package/dist/types.d.ts

@@ -1,6 +1,7 @@
 import type { ComponentType } from 'svelte';
 export type ComponentResolver = (name: string) => ResolvedComponent | Promise<ResolvedComponent>;
+export type LayoutType = ComponentType | ComponentType[];
 export type ResolvedComponent = {
-    default?: ComponentType;
-    layout?: ComponentType;
+    default: ComponentType;
+    layout?: LayoutType;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inertiajs/svelte",
-  "version": "1.3.0-beta.1",
+  "version": "1.3.0-beta.2",
   "license": "MIT",
   "description": "The Svelte adapter for Inertia.js",
   "contributors": [
@@ -43,7 +43,7 @@
     "svelte": "^3.20.0 || ^4.0.0 || ^5.0.0 || ^5.0.0-next.244"
   },
   "dependencies": {
-    "@inertiajs/core": "1.3.0-beta.1",
+    "@inertiajs/core": "1.3.0-beta.2",
     "html-escape": "^2.0.0",
     "lodash": "^4.5.0"
   },