Fixed deployment

Author: MiroMargineanu

.storybook/generate-iframe.ts

@@ -0,0 +1,28 @@
+const fileSystem = require('fs');
+const filePath = require('path');
+
+function generateIframe(): void {
+  const iframePath = filePath.join(__dirname, '../storybook-static/iframe.html');
+  const indexPath = filePath.join(__dirname, '../storybook-static/index.html');
+
+  if (fileSystem.existsSync(iframePath)) {
+    return;
+  }
+
+  if (!fileSystem.existsSync(indexPath)) {
+    process.exit(1);
+  }
+
+  const indexContent = fileSystem.readFileSync(indexPath, 'utf8');
+  const iframeContent = indexContent
+    .replace(/<title>.*?<\/title>/, '<title>Storybook Preview</title>')
+    .replace(/<!--\s*Storybook manager.*?-->/g, '')
+    .replace(
+      /<div id="storybook-manager-root">[\s\S]*?<\/div>/,
+      '<div id="storybook-root"></div><div id="docs-root"></div>',
+    );
+
+  fileSystem.writeFileSync(iframePath, iframeContent);
+}
+
+generateIframe();

.storybook/main.ts

@@ -4,14 +4,7 @@ const config = {
   framework: {
     name: '@stencil/storybook-plugin',
   },
-  managerHead: (head) => `
-    ${head}
-    <base href="./" />
-  `,
-  previewHead: (head) => `
-    ${head}
-    <base href="./" />
-  `,
+  staticDirs: ['../dist/web-components'],
 };
 
 export default config;

package.json

@@ -86,7 +86,7 @@
     "start": "yarn run build:dev --watch --serve",
     "storybook-build-tailwind": "npx ts-node .storybook/generate-safelist.ts && npx @tailwindcss/cli -i src/global/tailwind.css -o .storybook/tailwind.css --content '.storybook/tailwind-safelist.html' && rm -f .storybook/tailwind-safelist.html",
     "storybook-dev": "yarn run build && yarn run storybook-build-tailwind && storybook dev -p 6006 --no-open",
-    "storybook-build": "yarn run build && yarn run storybook-build-tailwind && storybook build"
+    "storybook-build": "yarn run build && yarn run storybook-build-tailwind && storybook build && npx ts-node .storybook/generate-iframe.ts"
   },
   "dependencies": {
     "@stencil/core": "^4.36.2",