@storybook/html 8.3.0-alpha.3 → 8.3.0-alpha.5

package/dist/entry-preview-docs.d.ts

@@ -1,6 +1,6 @@
-import { DecoratorFunction, ArgTypesEnhancer } from 'storybook/internal/types';
 import { SourceType } from 'storybook/internal/docs-tools';
-import { H as HtmlRenderer } from './types-5d0e6702.js';
+import { DecoratorFunction, ArgTypesEnhancer } from 'storybook/internal/types';
+import { H as HtmlRenderer } from './types-19e12ec7.js';
 
 declare const decorators: DecoratorFunction<HtmlRenderer>[];
 declare const parameters: {

package/dist/entry-preview.d.ts

@@ -1,4 +1,4 @@
-import { H as HtmlRenderer, P as Parameters } from './types-5d0e6702.js';
+import { H as HtmlRenderer, P as Parameters } from './types-19e12ec7.js';
 import { ArgsStoryFn, RenderContext } from 'storybook/internal/types';
 import 'storybook/internal/docs-tools';
 

package/dist/entry-preview.js

@@ -1,4 +1,4 @@
-"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 entry_preview_exports={};__export(entry_preview_exports,{parameters:()=>parameters,render:()=>render,renderToCanvas:()=>renderToCanvas});module.exports=__toCommonJS(entry_preview_exports);var import_global=require("@storybook/global"),import_ts_dedent=require("ts-dedent"),import_preview_api=require("storybook/internal/preview-api"),{Node}=import_global.global,render=(args,context)=>{let{id,component:Component}=context;if(typeof Component=="string"){let output=Component;return Object.keys(args).forEach(key=>{output=output.replace(`{{${key}}}`,args[key])}),output}if(Component instanceof HTMLElement){let output=Component.cloneNode(!0);return Object.keys(args).forEach(key=>{output.setAttribute(key,typeof args[key]=="string"?args[key]:JSON.stringify(args[key]))}),output}if(typeof Component=="function")return Component(args,context);throw console.warn(import_ts_dedent.dedent`
+"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 entry_preview_exports={};__export(entry_preview_exports,{parameters:()=>parameters,render:()=>render,renderToCanvas:()=>renderToCanvas});module.exports=__toCommonJS(entry_preview_exports);var import_preview_api=require("storybook/internal/preview-api"),import_global=require("@storybook/global"),import_ts_dedent=require("ts-dedent"),{Node}=import_global.global,render=(args,context)=>{let{id,component:Component}=context;if(typeof Component=="string"){let output=Component;return Object.keys(args).forEach(key=>{output=output.replace(`{{${key}}}`,args[key])}),output}if(Component instanceof HTMLElement){let output=Component.cloneNode(!0);return Object.keys(args).forEach(key=>{output.setAttribute(key,typeof args[key]=="string"?args[key]:JSON.stringify(args[key]))}),output}if(typeof Component=="function")return Component(args,context);throw console.warn(import_ts_dedent.dedent`
     Storybook's HTML renderer only supports rendering DOM elements and strings.
     Received: ${Component}
   `),new Error(`Unable to render story ${id}`)};function renderToCanvas({storyFn,kind,name,showMain,showError,forceRemount},canvasElement){let element=storyFn();if(showMain(),typeof element=="string")canvasElement.innerHTML=element,(0,import_preview_api.simulatePageLoad)(canvasElement);else if(element instanceof Node){if(canvasElement.firstChild===element&&forceRemount===!1)return;canvasElement.innerHTML="",canvasElement.appendChild(element),(0,import_preview_api.simulateDOMContentLoaded)()}else showError({title:`Expecting an HTML snippet or DOM node from the story: "${name}" of "${kind}".`,description:import_ts_dedent.dedent`

package/dist/entry-preview.mjs

@@ -1,6 +1,6 @@
+import { simulatePageLoad, simulateDOMContentLoaded } from 'storybook/internal/preview-api';
 import { global } from '@storybook/global';
 import { dedent } from 'ts-dedent';
-import { simulatePageLoad, simulateDOMContentLoaded } from 'storybook/internal/preview-api';
 
 var {Node}=global,render=(args,context)=>{let{id,component:Component}=context;if(typeof Component=="string"){let output=Component;return Object.keys(args).forEach(key=>{output=output.replace(`{{${key}}}`,args[key]);}),output}if(Component instanceof HTMLElement){let output=Component.cloneNode(!0);return Object.keys(args).forEach(key=>{output.setAttribute(key,typeof args[key]=="string"?args[key]:JSON.stringify(args[key]));}),output}if(typeof Component=="function")return Component(args,context);throw console.warn(dedent`
     Storybook's HTML renderer only supports rendering DOM elements and strings.

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { Args, ComponentAnnotations, AnnotatedStoryFn, StoryAnnotations, StrictArgs, DecoratorFunction, LoaderFunction, StoryContext as StoryContext$1, ProjectAnnotations } from 'storybook/internal/types';
 export { ArgTypes, Args, Parameters, StrictArgs } from 'storybook/internal/types';
-import { H as HtmlRenderer } from './types-5d0e6702.js';
+import { H as HtmlRenderer } from './types-19e12ec7.js';
 import 'storybook/internal/docs-tools';
 
 /**

package/dist/preset.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 preset_exports={};__export(preset_exports,{previewAnnotations:()=>previewAnnotations});module.exports=__toCommonJS(preset_exports);var import_path=require("path"),previewAnnotations=async(input=[],options)=>{let docsEnabled=Object.keys(await options.presets.apply("docs",{},options)).length>0;return[].concat(input).concat([(0,import_path.join)(__dirname,"entry-preview.mjs")]).concat(docsEnabled?[(0,import_path.join)(__dirname,"entry-preview-docs.mjs")]:[])};0&&(module.exports={previewAnnotations});
+"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 preset_exports={};__export(preset_exports,{previewAnnotations:()=>previewAnnotations});module.exports=__toCommonJS(preset_exports);var import_node_path=require("path"),previewAnnotations=async(input=[],options)=>{let docsEnabled=Object.keys(await options.presets.apply("docs",{},options)).length>0;return[].concat(input).concat([(0,import_node_path.join)(__dirname,"entry-preview.mjs")]).concat(docsEnabled?[(0,import_node_path.join)(__dirname,"entry-preview-docs.mjs")]:[])};0&&(module.exports={previewAnnotations});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/html",
-  "version": "8.3.0-alpha.3",
+  "version": "8.3.0-alpha.5",
   "description": "Storybook HTML renderer",
   "keywords": [
     "storybook"
@@ -22,9 +22,9 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "node": "./dist/index.js",
       "import": "./dist/index.mjs",
-      "require": "./dist/index.js"
+      "require": "./dist/index.js",
+      "node": "./dist/index.js"
     },
     "./preset": "./preset.js",
     "./dist/entry-preview.mjs": "./dist/entry-preview.mjs",
@@ -43,22 +43,22 @@
     "!src/**/*"
   ],
   "scripts": {
-    "check": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/check.ts",
-    "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/bundle.ts"
+    "check": "jiti ../../../scripts/prepare/check.ts",
+    "prep": "jiti ../../../scripts/prepare/bundle.ts"
   },
   "dependencies": {
-    "@storybook/components": "^8.3.0-alpha.3",
+    "@storybook/components": "^8.3.0-alpha.5",
     "@storybook/global": "^5.0.0",
-    "@storybook/manager-api": "^8.3.0-alpha.3",
-    "@storybook/preview-api": "^8.3.0-alpha.3",
-    "@storybook/theming": "^8.3.0-alpha.3",
+    "@storybook/manager-api": "^8.3.0-alpha.5",
+    "@storybook/preview-api": "^8.3.0-alpha.5",
+    "@storybook/theming": "^8.3.0-alpha.5",
     "ts-dedent": "^2.0.0"
   },
   "devDependencies": {
     "typescript": "^5.3.2"
   },
   "peerDependencies": {
-    "storybook": "^8.3.0-alpha.3"
+    "storybook": "^8.3.0-alpha.5"
   },
   "engines": {
     "node": ">=18.0.0"

package/template/cli/js/Button.stories.js

@@ -1,4 +1,5 @@
 import { fn } from '@storybook/test';
+
 import { createButton } from './Button';
 
 // More on how to set up stories at: https://storybook.js.org/docs/writing-stories

package/template/cli/js/Header.js

@@ -1,5 +1,5 @@
-import './header.css';
 import { createButton } from './Button';
+import './header.css';
 
 export const createHeader = ({ user, onLogout, onLogin, onCreateAccount }) => {
   const header = document.createElement('header');

package/template/cli/js/Header.stories.js

@@ -1,4 +1,5 @@
 import { fn } from '@storybook/test';
+
 import { createHeader } from './Header';
 
 export default {

package/template/cli/js/Page.js

@@ -1,5 +1,5 @@
-import './page.css';
 import { createHeader } from './Header';
+import './page.css';
 
 export const createPage = () => {
   const article = document.createElement('article');

package/template/cli/js/Page.stories.js

@@ -1,4 +1,5 @@
-import { within, userEvent, expect } from '@storybook/test';
+import { expect, userEvent, within } from '@storybook/test';
+
 import { createPage } from './Page';
 
 export default {

package/template/cli/ts-3-8/Button.stories.ts

@@ -1,5 +1,6 @@
-import type { StoryObj, Meta } from '@storybook/html';
+import type { Meta, StoryObj } from '@storybook/html';
 import { fn } from '@storybook/test';
+
 import type { ButtonProps } from './Button';
 import { createButton } from './Button';
 

package/template/cli/ts-3-8/Header.stories.ts

@@ -1,5 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/html';
 import { fn } from '@storybook/test';
+
 import type { HeaderProps } from './Header';
 import { createHeader } from './Header';
 

package/template/cli/ts-3-8/Header.ts

@@ -1,5 +1,5 @@
-import './header.css';
 import { createButton } from './Button';
+import './header.css';
 
 export interface HeaderProps {
   user?: { name: string };

package/template/cli/ts-3-8/Page.stories.ts

@@ -1,5 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/html';
-import { within, userEvent, expect } from '@storybook/test';
+import { expect, userEvent, within } from '@storybook/test';
+
 import { createPage } from './Page';
 
 const meta: Meta = {

package/template/cli/ts-3-8/Page.ts

@@ -1,5 +1,5 @@
-import './page.css';
 import { createHeader } from './Header';
+import './page.css';
 
 type User = {
   name: string;

package/template/cli/ts-4-9/Button.stories.ts

@@ -1,5 +1,6 @@
-import type { StoryObj, Meta } from '@storybook/html';
+import type { Meta, StoryObj } from '@storybook/html';
 import { fn } from '@storybook/test';
+
 import type { ButtonProps } from './Button';
 import { createButton } from './Button';
 

package/template/cli/ts-4-9/Header.stories.ts

@@ -1,5 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/html';
 import { fn } from '@storybook/test';
+
 import type { HeaderProps } from './Header';
 import { createHeader } from './Header';
 

package/template/cli/ts-4-9/Header.ts

@@ -1,5 +1,5 @@
-import './header.css';
 import { createButton } from './Button';
+import './header.css';
 
 export interface HeaderProps {
   user?: { name: string };

package/template/cli/ts-4-9/Page.stories.ts

@@ -1,5 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/html';
-import { within, userEvent, expect } from '@storybook/test';
+import { expect, userEvent, within } from '@storybook/test';
+
 import { createPage } from './Page';
 
 const meta = {

package/template/cli/ts-4-9/Page.ts

@@ -1,5 +1,5 @@
-import './page.css';
 import { createHeader } from './Header';
+import './page.css';
 
 type User = {
   name: string;

package/template/components/index.js

@@ -1,9 +1,9 @@
 import { global as globalThis } from '@storybook/global';
 
 import { Button } from './Button';
-import { Pre } from './Pre';
 import { Form } from './Form';
 import { Html } from './Html';
+import { Pre } from './Pre';
 
 globalThis.Components = { Button, Pre, Form, Html };
 globalThis.storybookRenderer = 'html';

package/dist/{types-5d0e6702.d.ts → types-19e12ec7.d.ts}

@@ -1,5 +1,5 @@
-import { WebRenderer, ArgsStoryFn } from 'storybook/internal/types';
 import { SourceType } from 'storybook/internal/docs-tools';
+import { WebRenderer, ArgsStoryFn } from 'storybook/internal/types';
 
 type StoryFnHtmlReturnType = string | Node;
 interface HtmlRenderer extends WebRenderer {