@storybook/ember 9.0.0-beta.1 → 9.0.0-beta.11

package/dist/client/preview/config.mjs

@@ -0,0 +1,3 @@
+import './globals';
+export { renderToCanvas } from './render';
+export const parameters = { renderer: 'ember' };

package/dist/client/preview/docs/config.mjs

@@ -0,0 +1,10 @@
+import { enhanceArgTypes } from 'storybook/internal/docs-tools';
+import { extractArgTypes, extractComponentDescription } from './jsondoc';
+export const parameters = {
+    docs: {
+        story: { iframeHeight: '80px' },
+        extractArgTypes,
+        extractComponentDescription,
+    },
+};
+export const argTypesEnhancers = [enhanceArgTypes];

package/dist/client/preview/docs/jsondoc.mjs

@@ -0,0 +1,42 @@
+import { global } from '@storybook/global';
+export const getJSONDoc = () => {
+    return global.__EMBER_GENERATED_DOC_JSON__;
+};
+export const extractArgTypes = (componentName) => {
+    const json = getJSONDoc();
+    if (!(json && json.included)) {
+        return null;
+    }
+    const componentDoc = json.included.find((doc) => doc.attributes.name === componentName);
+    if (!componentDoc) {
+        return null;
+    }
+    return componentDoc.attributes.arguments.reduce((acc, prop) => {
+        acc[prop.name] = {
+            name: prop.name,
+            defaultValue: prop.defaultValue,
+            description: prop.description,
+            table: {
+                defaultValue: { summary: prop.defaultValue },
+                type: {
+                    summary: prop.type,
+                    required: prop.tags.length
+                        ? prop.tags.some((tag) => tag.name === 'required')
+                        : false,
+                },
+            },
+        };
+        return acc;
+    }, {});
+};
+export const extractComponentDescription = (componentName) => {
+    const json = getJSONDoc();
+    if (!(json && json.included)) {
+        return null;
+    }
+    const componentDoc = json.included.find((doc) => doc.attributes.name === componentName);
+    if (!componentDoc) {
+        return null;
+    }
+    return componentDoc.attributes.description;
+};

package/dist/client/preview/globals.mjs

@@ -0,0 +1,3 @@
+import { global } from '@storybook/global';
+global.STORYBOOK_NAME = process.env.STORYBOOK_NAME;
+global.STORYBOOK_ENV = 'ember';

package/dist/client/preview/render.mjs

@@ -0,0 +1,65 @@
+import { global } from '@storybook/global';
+import { dedent } from 'ts-dedent';
+const { document } = global;
+const rootEl = document.getElementById('storybook-root');
+function loadEmberApp() {
+    const config = global.require(`${global.STORYBOOK_NAME}/config/environment`);
+    return global.require(`${global.STORYBOOK_NAME}/app`).default.create({
+        autoboot: false,
+        rootElement: rootEl,
+        ...config.APP,
+    });
+}
+const app = loadEmberApp();
+let lastPromise = app.boot();
+let hasRendered = false;
+let isRendering = false;
+function render(options, el) {
+    if (isRendering) {
+        return;
+    }
+    isRendering = true;
+    const { template, context = {}, element } = options;
+    if (hasRendered) {
+        lastPromise = lastPromise.then((instance) => instance.destroy());
+    }
+    lastPromise = lastPromise
+        .then(() => {
+        const appInstancePrivate = app.buildInstance();
+        return appInstancePrivate.boot().then(() => appInstancePrivate);
+    })
+        .then((instance) => {
+        instance.register('component:story-mode', Ember.Component.extend({
+            layout: template || options,
+            ...context,
+        }));
+        const component = instance.lookup('component:story-mode');
+        if (element) {
+            component.appendTo(element);
+            element.appendTo(el);
+        }
+        else {
+            component.appendTo(el);
+        }
+        hasRendered = true;
+        isRendering = false;
+        return instance;
+    });
+}
+export function renderToCanvas({ storyFn, kind, name, showMain, showError }, canvasElement) {
+    const element = storyFn();
+    if (!element) {
+        showError({
+            title: `Expecting a Ember element from the story: "${name}" of "${kind}".`,
+            description: dedent `
+        Did you forget to return the Ember element from the story?
+        Use "() => hbs('{{component}}')" or "() => { return {
+          template: hbs\`{{component}}\`
+        } }" when defining the story.
+      `,
+        });
+        return;
+    }
+    showMain();
+    render(element, canvasElement);
+}

package/dist/client/preview/types.mjs

@@ -0,0 +1 @@
+export {};

package/dist/node/index.mjs

@@ -0,0 +1,3 @@
+export function defineMain(config) {
+    return config;
+}

package/dist/server/framework-preset-babel-ember.mjs

@@ -0,0 +1,44 @@
+import { precompile } from 'ember-source/dist/ember-template-compiler.js';
+import { findDistFile } from '../util';
+let emberOptions;
+function precompileWithPlugins(string, options) {
+    const precompileOptions = options;
+    if (emberOptions && emberOptions.polyfills) {
+        precompileOptions.plugins = { ast: emberOptions.polyfills };
+    }
+    return precompile(string, precompileOptions);
+}
+export const babel = (config, options) => {
+    if (options && options.presetsList) {
+        options.presetsList.forEach((e, index) => {
+            if (e.preset && e.preset.emberOptions) {
+                emberOptions = e.preset.emberOptions;
+                if (options.presetsList) {
+                    delete options.presetsList[index].preset.emberOptions;
+                }
+            }
+        });
+    }
+    const babelConfigPlugins = config?.plugins || [];
+    const extraPlugins = [
+        [
+            require.resolve('babel-plugin-htmlbars-inline-precompile'),
+            {
+                precompile: precompileWithPlugins,
+                modules: {
+                    'ember-cli-htmlbars': 'hbs',
+                    'ember-cli-htmlbars-inline-precompile': 'default',
+                    'htmlbars-inline-precompile': 'default',
+                },
+            },
+        ],
+        [require.resolve('babel-plugin-ember-modules-api-polyfill')],
+    ];
+    return {
+        ...config,
+        plugins: [...babelConfigPlugins, ...extraPlugins],
+    };
+};
+export const previewAnnotations = (entry = []) => {
+    return [...entry, findDistFile(__dirname, 'client/preview/config')];
+};

package/dist/server/framework-preset-ember-docs.mjs

@@ -0,0 +1,8 @@
+import { hasDocsOrControls } from 'storybook/internal/docs-tools';
+import { findDistFile } from '../util';
+export const previewAnnotations = (entry = [], options) => {
+    if (!hasDocsOrControls(options)) {
+        return entry;
+    }
+    return [...entry, findDistFile(__dirname, 'client/preview/docs/config')];
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/ember",
-  "version": "9.0.0-beta.1",
+  "version": "9.0.0-beta.11",
   "description": "Storybook for Ember: Develop Ember Component in isolation with Hot Reloading.",
   "homepage": "https://github.com/storybookjs/storybook/tree/next/code/frameworks/ember",
   "bugs": {
@@ -49,16 +49,14 @@
     "prep": "jiti ../../../scripts/prepare/tsc.ts"
   },
   "dependencies": {
-    "@storybook/builder-webpack5": "9.0.0-beta.1",
+    "@storybook/builder-webpack5": "9.0.0-beta.11",
     "@storybook/global": "^5.0.0",
     "babel-loader": "9.1.3",
-    "find-up": "^5.0.0",
-    "ts-dedent": "^2.0.0"
+    "find-up": "^5.0.0"
   },
   "devDependencies": {
-    "@types/babel__preset-env": "^7.10.0",
     "ember-source": "~3.28.1",
-    "typescript": "^5.7.3"
+    "typescript": "^5.8.3"
   },
   "peerDependencies": {
     "@babel/core": "*",
@@ -67,7 +65,7 @@
     "ember-source": "~3.28.1 || ^4.0.0",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
-    "storybook": "^9.0.0-beta.1"
+    "storybook": "^9.0.0-beta.11"
   },
   "engines": {
     "node": ">=20.0.0"