@storybook/sveltekit 7.6.0-beta.0 → 7.6.0-beta.2

package/README.md

@@ -130,16 +130,16 @@ export const MyStory = {
 
 You can add the name of the module you want to mock to `parameters.sveltekit_experimental` (in the example above we are mocking the `stores` module which correspond to `$app/stores`) and then pass the following kind of objects:
 
-| Module                                            | Path in parameters                                           | Kind of objects                                                                                    |
-| ------------------------------------------------- | ------------------------------------------------------------ | -------------------------------------------------------------------------------------------------- |
-| `import { page } from "$app/stores"`              | `parameters.sveltekit_experimental.stores.page`              | A Partial of the page store                                                                        |
-| `import { navigating } from "$app/stores"`        | `parameters.sveltekit_experimental.stores.navigating`        | A Partial of the navigating store                                                                  |
-| `import { updated } from "$app/stores"`           | `parameters.sveltekit_experimental.stores.updated`           | A boolean representing the value of updated (you can also access `check()` which will be a noop)   |
-| `import { goto } from "$app/navigation"`          | `parameters.sveltekit_experimental.navigation.goto`          | A callback that will be called whenever goto is called                                             |
-| `import { invalidate } from "$app/navigation"`    | `parameters.sveltekit_experimental.navigation.invalidate`    | A callback that will be called whenever invalidate is called                                       |
-| `import { invalidateAll } from "$app/navigation"` | `parameters.sveltekit_experimental.navigation.invalidateAll` | A callback that will be called whenever invalidateAll is called                                    |
-| `import { afterNavigate } from "$app/navigation"` | `parameters.sveltekit_experimental.navigation.afterNavigate` | An object that will be passed to the afterNavigate function (which will be invoked onMount) called |
-| `import { enhance } from "$app/forms"`            | `parameters.sveltekit_experimental.forms.enhance`            | A callback that will called when a form with `use:enhance` is submitted                            |
+| Module                                            | Path in parameters                                           | Kind of objects                                                                                                                           |
+| ------------------------------------------------- | ------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------- |
+| `import { page } from "$app/stores"`              | `parameters.sveltekit_experimental.stores.page`              | A Partial of the page store                                                                                                               |
+| `import { navigating } from "$app/stores"`        | `parameters.sveltekit_experimental.stores.navigating`        | A Partial of the navigating store                                                                                                         |
+| `import { updated } from "$app/stores"`           | `parameters.sveltekit_experimental.stores.updated`           | A boolean representing the value of updated (you can also access `check()` which will be a noop)                                          |
+| `import { goto } from "$app/navigation"`          | `parameters.sveltekit_experimental.navigation.goto`          | A callback that will be called whenever goto is called, in no function is provided an action will be logged to the Actions panel          |
+| `import { invalidate } from "$app/navigation"`    | `parameters.sveltekit_experimental.navigation.invalidate`    | A callback that will be called whenever invalidate is called, in no function is provided an action will be logged to the Actions panel    |
+| `import { invalidateAll } from "$app/navigation"` | `parameters.sveltekit_experimental.navigation.invalidateAll` | A callback that will be called whenever invalidateAll is called, in no function is provided an action will be logged to the Actions panel |
+| `import { afterNavigate } from "$app/navigation"` | `parameters.sveltekit_experimental.navigation.afterNavigate` | An object that will be passed to the afterNavigate function (which will be invoked onMount) called                                        |
+| `import { enhance } from "$app/forms"`            | `parameters.sveltekit_experimental.forms.enhance`            | A callback that will called when a form with `use:enhance` is submitted                                                                   |
 
 All the other functions are still exported as `noop` from the mocked modules so that your application will still work.
 

package/dist/preview.js

@@ -1 +1 @@
-"use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var preview_exports={};__export(preview_exports,{decorators:()=>decorators});module.exports=__toCommonJS(preview_exports);var import_addon_actions=require("@storybook/addon-actions"),import_svelte3=require("svelte");var import_svelte=require("svelte");function setAfterNavigateArgument(afterNavigateArgs){(0,import_svelte.setContext)("after-navigate-args",afterNavigateArgs)}var import_svelte2=require("svelte");function createMockedStore(contextName){return[{subscribe(runner){let page2=(0,import_svelte2.getContext)(contextName);return runner(page2),()=>{}}},value=>{(0,import_svelte2.setContext)(contextName,value)}]}var[page,setPage]=createMockedStore("page-ctx"),[navigating,setNavigating]=createMockedStore("navigating-ctx"),[updated,setUpdated]=createMockedStore("updated-ctx");updated.check=()=>{};var normalizeHrefConfig=hrefConfig=>typeof hrefConfig=="function"?{callback:hrefConfig,asRegex:!1}:hrefConfig,decorators=[(Story,ctx)=>{var _a,_b,_c,_d,_e;let svelteKitParameters=((_a=ctx.parameters)==null?void 0:_a.sveltekit_experimental)??{};return setPage((_b=svelteKitParameters==null?void 0:svelteKitParameters.stores)==null?void 0:_b.page),setNavigating((_c=svelteKitParameters==null?void 0:svelteKitParameters.stores)==null?void 0:_c.navigating),setUpdated((_d=svelteKitParameters==null?void 0:svelteKitParameters.stores)==null?void 0:_d.updated),setAfterNavigateArgument((_e=svelteKitParameters==null?void 0:svelteKitParameters.navigation)==null?void 0:_e.afterNavigate),(0,import_svelte3.onMount)(()=>{let globalClickListener=e=>{let element=e.composedPath().findLast(el=>el instanceof HTMLElement&&el.tagName==="A");if(element&&element instanceof HTMLAnchorElement){let to=element.getAttribute("href");if(!to)return;e.preventDefault();let defaultActionCallback=()=>(0,import_addon_actions.action)("navigate")(to,e);if(!svelteKitParameters.hrefs){defaultActionCallback();return}let callDefaultCallback=!0;Object.entries(svelteKitParameters.hrefs).forEach(([href,hrefConfig])=>{let{callback,asRegex}=normalizeHrefConfig(hrefConfig);(asRegex?new RegExp(href).test(to):to===href)&&(callDefaultCallback=!1,callback==null||callback(to,e))}),callDefaultCallback&&defaultActionCallback()}};function createListeners(baseModule,functions){let toRemove=[];return functions.forEach(func=>{var _a2;if((_a2=svelteKitParameters[baseModule])!=null&&_a2[func]&&svelteKitParameters[baseModule][func]instanceof Function){let listener=({detail=[]})=>{let args=Array.isArray(detail)?detail:[];svelteKitParameters[baseModule][func](...args)},eventType=`storybook:${func}`;toRemove.push({eventType,listener}),window.addEventListener(eventType,listener)}}),()=>{toRemove.forEach(({eventType,listener})=>{window.removeEventListener(eventType,listener)})}}let removeNavigationListeners=createListeners("navigation",["goto","invalidate","invalidateAll"]),removeFormsListeners=createListeners("forms",["enhance"]);return window.addEventListener("click",globalClickListener),()=>{window.removeEventListener("click",globalClickListener),removeNavigationListeners(),removeFormsListeners()}}),Story()}];0&&(module.exports={decorators});
+"use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var preview_exports={};__export(preview_exports,{decorators:()=>decorators});module.exports=__toCommonJS(preview_exports);var import_addon_actions=require("@storybook/addon-actions"),import_svelte3=require("svelte");var import_svelte=require("svelte");function setAfterNavigateArgument(afterNavigateArgs){(0,import_svelte.setContext)("after-navigate-args",afterNavigateArgs)}var import_svelte2=require("svelte");function createMockedStore(contextName){return[{subscribe(runner){let page2=(0,import_svelte2.getContext)(contextName);return runner(page2),()=>{}}},value=>{(0,import_svelte2.setContext)(contextName,value)}]}var[page,setPage]=createMockedStore("page-ctx"),[navigating,setNavigating]=createMockedStore("navigating-ctx"),[updated,setUpdated]=createMockedStore("updated-ctx");updated.check=()=>{};var normalizeHrefConfig=hrefConfig=>typeof hrefConfig=="function"?{callback:hrefConfig,asRegex:!1}:hrefConfig,decorators=[(Story,ctx)=>{var _a,_b,_c,_d,_e;let svelteKitParameters=((_a=ctx.parameters)==null?void 0:_a.sveltekit_experimental)??{};return setPage((_b=svelteKitParameters==null?void 0:svelteKitParameters.stores)==null?void 0:_b.page),setNavigating((_c=svelteKitParameters==null?void 0:svelteKitParameters.stores)==null?void 0:_c.navigating),setUpdated((_d=svelteKitParameters==null?void 0:svelteKitParameters.stores)==null?void 0:_d.updated),setAfterNavigateArgument((_e=svelteKitParameters==null?void 0:svelteKitParameters.navigation)==null?void 0:_e.afterNavigate),(0,import_svelte3.onMount)(()=>{let globalClickListener=e=>{let element=e.composedPath().findLast(el=>el instanceof HTMLElement&&el.tagName==="A");if(element&&element instanceof HTMLAnchorElement){let to=element.getAttribute("href");if(!to)return;e.preventDefault();let defaultActionCallback=()=>(0,import_addon_actions.action)("navigate")(to,e);if(!svelteKitParameters.hrefs){defaultActionCallback();return}let callDefaultCallback=!0;Object.entries(svelteKitParameters.hrefs).forEach(([href,hrefConfig])=>{let{callback,asRegex}=normalizeHrefConfig(hrefConfig);(asRegex?new RegExp(href).test(to):to===href)&&(callDefaultCallback=!1,callback==null||callback(to,e))}),callDefaultCallback&&defaultActionCallback()}};function createListeners(baseModule,functions,defaultToAction){let toRemove=[];return functions.forEach(func=>{var _a2;let hasFunction=((_a2=svelteKitParameters[baseModule])==null?void 0:_a2[func])&&svelteKitParameters[baseModule][func]instanceof Function;if(hasFunction||defaultToAction){let listener=({detail=[]})=>{let args=Array.isArray(detail)?detail:[];(hasFunction?svelteKitParameters[baseModule][func]:(0,import_addon_actions.action)(func))(...args)},eventType=`storybook:${func}`;toRemove.push({eventType,listener}),window.addEventListener(eventType,listener)}}),()=>{toRemove.forEach(({eventType,listener})=>{window.removeEventListener(eventType,listener)})}}let removeNavigationListeners=createListeners("navigation",["goto","invalidate","invalidateAll"],!0),removeFormsListeners=createListeners("forms",["enhance"]);return window.addEventListener("click",globalClickListener),()=>{window.removeEventListener("click",globalClickListener),removeNavigationListeners(),removeFormsListeners()}}),Story()}];0&&(module.exports={decorators});

package/dist/preview.mjs

@@ -1,6 +1,6 @@
 import { action } from '@storybook/addon-actions';
 import { onMount, setContext, getContext } from 'svelte';
 
-function setAfterNavigateArgument(afterNavigateArgs){setContext("after-navigate-args",afterNavigateArgs);}function createMockedStore(contextName){return [{subscribe(runner){let page2=getContext(contextName);return runner(page2),()=>{}}},value=>{setContext(contextName,value);}]}var[page,setPage]=createMockedStore("page-ctx"),[navigating,setNavigating]=createMockedStore("navigating-ctx"),[updated,setUpdated]=createMockedStore("updated-ctx");updated.check=()=>{};var normalizeHrefConfig=hrefConfig=>typeof hrefConfig=="function"?{callback:hrefConfig,asRegex:!1}:hrefConfig,decorators=[(Story,ctx)=>{let svelteKitParameters=ctx.parameters?.sveltekit_experimental??{};return setPage(svelteKitParameters?.stores?.page),setNavigating(svelteKitParameters?.stores?.navigating),setUpdated(svelteKitParameters?.stores?.updated),setAfterNavigateArgument(svelteKitParameters?.navigation?.afterNavigate),onMount(()=>{let globalClickListener=e=>{let element=e.composedPath().findLast(el=>el instanceof HTMLElement&&el.tagName==="A");if(element&&element instanceof HTMLAnchorElement){let to=element.getAttribute("href");if(!to)return;e.preventDefault();let defaultActionCallback=()=>action("navigate")(to,e);if(!svelteKitParameters.hrefs){defaultActionCallback();return}let callDefaultCallback=!0;Object.entries(svelteKitParameters.hrefs).forEach(([href,hrefConfig])=>{let{callback,asRegex}=normalizeHrefConfig(hrefConfig);(asRegex?new RegExp(href).test(to):to===href)&&(callDefaultCallback=!1,callback?.(to,e));}),callDefaultCallback&&defaultActionCallback();}};function createListeners(baseModule,functions){let toRemove=[];return functions.forEach(func=>{if(svelteKitParameters[baseModule]?.[func]&&svelteKitParameters[baseModule][func]instanceof Function){let listener=({detail=[]})=>{let args=Array.isArray(detail)?detail:[];svelteKitParameters[baseModule][func](...args);},eventType=`storybook:${func}`;toRemove.push({eventType,listener}),window.addEventListener(eventType,listener);}}),()=>{toRemove.forEach(({eventType,listener})=>{window.removeEventListener(eventType,listener);});}}let removeNavigationListeners=createListeners("navigation",["goto","invalidate","invalidateAll"]),removeFormsListeners=createListeners("forms",["enhance"]);return window.addEventListener("click",globalClickListener),()=>{window.removeEventListener("click",globalClickListener),removeNavigationListeners(),removeFormsListeners();}}),Story()}];
+function setAfterNavigateArgument(afterNavigateArgs){setContext("after-navigate-args",afterNavigateArgs);}function createMockedStore(contextName){return [{subscribe(runner){let page2=getContext(contextName);return runner(page2),()=>{}}},value=>{setContext(contextName,value);}]}var[page,setPage]=createMockedStore("page-ctx"),[navigating,setNavigating]=createMockedStore("navigating-ctx"),[updated,setUpdated]=createMockedStore("updated-ctx");updated.check=()=>{};var normalizeHrefConfig=hrefConfig=>typeof hrefConfig=="function"?{callback:hrefConfig,asRegex:!1}:hrefConfig,decorators=[(Story,ctx)=>{let svelteKitParameters=ctx.parameters?.sveltekit_experimental??{};return setPage(svelteKitParameters?.stores?.page),setNavigating(svelteKitParameters?.stores?.navigating),setUpdated(svelteKitParameters?.stores?.updated),setAfterNavigateArgument(svelteKitParameters?.navigation?.afterNavigate),onMount(()=>{let globalClickListener=e=>{let element=e.composedPath().findLast(el=>el instanceof HTMLElement&&el.tagName==="A");if(element&&element instanceof HTMLAnchorElement){let to=element.getAttribute("href");if(!to)return;e.preventDefault();let defaultActionCallback=()=>action("navigate")(to,e);if(!svelteKitParameters.hrefs){defaultActionCallback();return}let callDefaultCallback=!0;Object.entries(svelteKitParameters.hrefs).forEach(([href,hrefConfig])=>{let{callback,asRegex}=normalizeHrefConfig(hrefConfig);(asRegex?new RegExp(href).test(to):to===href)&&(callDefaultCallback=!1,callback?.(to,e));}),callDefaultCallback&&defaultActionCallback();}};function createListeners(baseModule,functions,defaultToAction){let toRemove=[];return functions.forEach(func=>{let hasFunction=svelteKitParameters[baseModule]?.[func]&&svelteKitParameters[baseModule][func]instanceof Function;if(hasFunction||defaultToAction){let listener=({detail=[]})=>{let args=Array.isArray(detail)?detail:[];(hasFunction?svelteKitParameters[baseModule][func]:action(func))(...args);},eventType=`storybook:${func}`;toRemove.push({eventType,listener}),window.addEventListener(eventType,listener);}}),()=>{toRemove.forEach(({eventType,listener})=>{window.removeEventListener(eventType,listener);});}}let removeNavigationListeners=createListeners("navigation",["goto","invalidate","invalidateAll"],!0),removeFormsListeners=createListeners("forms",["enhance"]);return window.addEventListener("click",globalClickListener),()=>{window.removeEventListener("click",globalClickListener),removeNavigationListeners(),removeFormsListeners();}}),Story()}];
 
 export { decorators };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/sveltekit",
-  "version": "7.6.0-beta.0",
+  "version": "7.6.0-beta.2",
   "description": "Storybook for SvelteKit",
   "keywords": [
     "storybook",
@@ -53,10 +53,10 @@
     "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/bundle.ts"
   },
   "dependencies": {
-    "@storybook/addon-actions": "7.6.0-beta.0",
-    "@storybook/builder-vite": "7.6.0-beta.0",
-    "@storybook/svelte": "7.6.0-beta.0",
-    "@storybook/svelte-vite": "7.6.0-beta.0"
+    "@storybook/addon-actions": "7.6.0-beta.2",
+    "@storybook/builder-vite": "7.6.0-beta.2",
+    "@storybook/svelte": "7.6.0-beta.2",
+    "@storybook/svelte-vite": "7.6.0-beta.2"
   },
   "devDependencies": {
     "@types/node": "^18.0.0",

package/template/stories_svelte-kit-skeleton-js/navigation.stories.js

@@ -14,7 +14,7 @@ export const Goto = {
     const canvas = within(canvasElement);
     const button = canvas.getByText('goto');
     button.click();
-    expect(goto).toHaveBeenCalledWith('/storybook');
+    expect(goto).toHaveBeenCalledWith('/storybook-goto');
   },
   parameters: {
     sveltekit_experimental: {
@@ -25,6 +25,8 @@ export const Goto = {
   },
 };
 
+export const DefaultActions = {};
+
 const invalidate = fn();
 
 export const Invalidate = {
@@ -32,7 +34,7 @@ export const Invalidate = {
     const canvas = within(canvasElement);
     const button = canvas.getByText('invalidate', { exact: true });
     button.click();
-    expect(invalidate).toHaveBeenCalledWith('/storybook');
+    expect(invalidate).toHaveBeenCalledWith('/storybook-invalidate');
   },
   parameters: {
     sveltekit_experimental: {

package/template/stories_svelte-kit-skeleton-ts/navigation.stories.js

@@ -14,7 +14,7 @@ export const Goto = {
     const canvas = within(canvasElement);
     const button = canvas.getByText('goto');
     button.click();
-    expect(goto).toHaveBeenCalledWith('/storybook');
+    expect(goto).toHaveBeenCalledWith('/storybook-goto');
   },
   parameters: {
     sveltekit_experimental: {
@@ -25,6 +25,8 @@ export const Goto = {
   },
 };
 
+export const DefaultActions = {};
+
 const invalidate = fn();
 
 export const Invalidate = {
@@ -32,7 +34,7 @@ export const Invalidate = {
     const canvas = within(canvasElement);
     const button = canvas.getByText('invalidate', { exact: true });
     button.click();
-    expect(invalidate).toHaveBeenCalledWith('/storybook');
+    expect(invalidate).toHaveBeenCalledWith('/storybook-invalidate');
   },
   parameters: {
     sveltekit_experimental: {