@vueless/storybook 0.0.48 → 0.0.49

package/.storybook/decorators/vue3SourceDecorator.js

@@ -25,7 +25,7 @@ export const vue3SourceDecorator = makeDecorator({
 
         async function setSourceCode() {
           try {
-            const src = context.originalStoryFn(context.args).template;
+            const src = context.originalStoryFn(context.args, context.argTypes).template;
             const code = templateSourceCode(src, context.args, context.argTypes);
             const channel = addons.getChannel();
 
@@ -113,12 +113,16 @@ function propToSource(key, val) {
     case "string":
       return `${key}="${val}"`;
     case "object":
-      return `:${key}="${JSON.stringify(val)}"`;
+      return `:${key}="${getObjectValue(val)}"`;
     default:
       return `:${key}="${val}"`;
   }
 }
 
+function getObjectValue(value) {
+  return JSON.stringify(value).replaceAll('"', "'");
+}
+
 function kebabCase(str) {
   return str
     .split("")

package/.storybook/preview.js

@@ -1,11 +1,12 @@
 import { setup } from "@storybook/vue3";
+import { getRandomId } from "vueless/utils/utilUI.js";
+import { DARK_MODE_SELECTOR, LIGHT_MODE_SELECTOR } from "vueless/constants.js";
 
 import themeLight from "./themes/themeLight.js";
 import themeDark from "./themes/themeDark.js";
 import themeLightDocs from "./themes/themeLightDocs.js";
 import { storyDarkModeDecorator } from "./decorators/storyDarkModeDecorator.js";
 import { vue3SourceDecorator } from "./decorators/vue3SourceDecorator.js";
-import { DARK_MODE_SELECTOR, LIGHT_MODE_SELECTOR } from "vueless/constants.js";
 
 /* Tailwind styles */
 import "./index.css";
@@ -15,11 +16,11 @@ import { createVueless } from "vueless";
 import { createRouter, createWebHistory } from "vue-router";
 
 /* Setup storybook */
-setup((app, storyContext) => {
+setup((app) => {
   const vueless = createVueless();
   const router = createRouter({ history: createWebHistory(), routes: [] });
 
-  app.config.idPrefix = storyContext.id;
+  app.config.idPrefix = getRandomId();
 
   if (!app._context.config.globalProperties.$route) {
     app.use(router);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vueless/storybook",
-  "version": "0.0.48",
+  "version": "0.0.49",
   "description": "Simplifies Storybook configuration for Vueless UI library.",
   "homepage": "https://vueless.com",
   "author": "Johnny Grid",