@storybook/preact 0.0.0-pr-24676-sha-214a6f84 → 0.0.0-pr-24447-sha-8889347a

package/dist/{entry-preview.d.ts → config.d.ts}

@@ -5,8 +5,6 @@ import 'preact';
 declare const render: ArgsStoryFn<PreactRenderer>;
 declare function renderToCanvas({ storyFn, title, name, showMain, showError, forceRemount }: RenderContext<PreactRenderer>, canvasElement: PreactRenderer['canvasElement']): void;
 
-declare const parameters: {
-    renderer: string;
-};
+declare const parameters: {};
 
 export { parameters, render, renderToCanvas };

package/dist/{entry-preview.js → config.js}

@@ -1,4 +1,4 @@
-"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__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 __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var entry_preview_exports={};__export(entry_preview_exports,{parameters:()=>parameters,render:()=>render2,renderToCanvas:()=>renderToCanvas});module.exports=__toCommonJS(entry_preview_exports);var preact=__toESM(require("preact")),import_ts_dedent=require("ts-dedent"),{h:h2}=preact,render2=(args,context)=>{let{id,component:Component}=context;if(!Component)throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);return h2(Component,{...args})},renderedStory;function preactRender(story,canvasElement){preact.Fragment?preact.render(story,canvasElement):renderedStory=preact.render(story,canvasElement,renderedStory)}var StoryHarness=({showError,name,title,storyFn,canvasElement})=>{let content=preact.h(storyFn,null);return content||(showError({title:`Expecting a Preact element from the story: "${name}" of "${title}".`,description:import_ts_dedent.dedent`
+"use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__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 __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var config_exports={};__export(config_exports,{parameters:()=>parameters2,render:()=>render2,renderToCanvas:()=>renderToCanvas});module.exports=__toCommonJS(config_exports);var parameters={docs:{story:{inline:!0}}};var preact=__toESM(require("preact")),import_ts_dedent=require("ts-dedent"),{h:h2}=preact,render2=(args,context)=>{let{id,component:Component}=context;if(!Component)throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);return h2(Component,{...args})},renderedStory;function preactRender(story,canvasElement){preact.Fragment?preact.render(story,canvasElement):renderedStory=preact.render(story,canvasElement,renderedStory)}var StoryHarness=({showError,name,title,storyFn,canvasElement})=>{let content=preact.h(storyFn,null);return content||(showError({title:`Expecting a Preact element from the story: "${name}" of "${title}".`,description:import_ts_dedent.dedent`
         Did you forget to return the Preact element from the story?
         Use "() => (<MyComp/>)" or "() => { return <MyComp/>; }" when defining the story.
-      `}),null)};function renderToCanvas({storyFn,title,name,showMain,showError,forceRemount},canvasElement){forceRemount&&preactRender(null,canvasElement),showMain(),preactRender(preact.h(StoryHarness,{name,title,showError,storyFn,canvasElement}),canvasElement)}var parameters={renderer:"preact"};0&&(module.exports={parameters,render,renderToCanvas});
+      `}),null)};function renderToCanvas({storyFn,title,name,showMain,showError,forceRemount},canvasElement){forceRemount&&preactRender(null,canvasElement),showMain(),preactRender(preact.h(StoryHarness,{name,title,showError,storyFn,canvasElement}),canvasElement)}var parameters2={renderer:"preact",...parameters};0&&(module.exports={parameters,render,renderToCanvas});

package/dist/config.mjs

@@ -0,0 +1,5 @@
+export { render, renderToCanvas } from './chunk-OHNM7E4P.mjs';
+
+var parameters={docs:{story:{inline:!0}}};var parameters2={renderer:"preact",...parameters};
+
+export { parameters2 as parameters };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/preact",
-  "version": "0.0.0-pr-24676-sha-214a6f84",
+  "version": "0.0.0-pr-24447-sha-8889347a",
   "description": "Storybook Preact renderer",
   "keywords": [
     "storybook"
@@ -26,9 +26,11 @@
       "require": "./dist/index.js",
       "import": "./dist/index.mjs"
     },
-    "./preset": "./preset.js",
-    "./dist/entry-preview.mjs": "./dist/entry-preview.mjs",
-    "./dist/entry-preview-docs.mjs": "./dist/entry-preview-docs.mjs",
+    "./preview": {
+      "types": "./dist/config.d.ts",
+      "require": "./dist/config.js",
+      "import": "./dist/config.mjs"
+    },
     "./package.json": "./package.json"
   },
   "main": "dist/index.js",
@@ -47,10 +49,10 @@
     "prep": "../../../scripts/prepare/bundle.ts"
   },
   "dependencies": {
-    "@storybook/core-client": "0.0.0-pr-24676-sha-214a6f84",
+    "@storybook/core-client": "0.0.0-pr-24447-sha-8889347a",
     "@storybook/global": "^5.0.0",
-    "@storybook/preview-api": "0.0.0-pr-24676-sha-214a6f84",
-    "@storybook/types": "0.0.0-pr-24676-sha-214a6f84",
+    "@storybook/preview-api": "0.0.0-pr-24447-sha-8889347a",
+    "@storybook/types": "0.0.0-pr-24447-sha-8889347a",
     "ts-dedent": "^2.0.0"
   },
   "devDependencies": {
@@ -69,9 +71,7 @@
   "bundler": {
     "entries": [
       "./src/index.ts",
-      "./src/preset.ts",
-      "./src/entry-preview.ts",
-      "./src/entry-preview-docs.ts"
+      "./src/config.ts"
     ],
     "platform": "browser"
   },

package/preview.js

@@ -0,0 +1 @@
+export * from './dist/config';

package/template/cli/Button.jsx

@@ -1,21 +1,10 @@
+import PropTypes from 'prop-types';
 import './button.css';
 
 /**
  * Primary UI component for user interaction
- * @param {object} props
- * @param {string} [props.primary=false]
- * @param {string} [props.backgroundColor]
- * @param {('small' | 'medium' | 'large')} [props.size='medium']
- * @param {string} props.label
- * @param {function} props.onClick
  */
-export const Button = ({
-  primary = false,
-  backgroundColor = null,
-  size = 'medium',
-  label,
-  ...props
-}) => {
+export const Button = ({ primary, backgroundColor, size, label, ...props }) => {
   const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary';
   return (
     <button
@@ -28,3 +17,33 @@ export const Button = ({
     </button>
   );
 };
+
+Button.propTypes = {
+  /**
+   * Is this the principal call to action on the page?
+   */
+  primary: PropTypes.bool,
+  /**
+   * What background color to use
+   */
+  backgroundColor: PropTypes.string,
+  /**
+   * How large should the button be?
+   */
+  size: PropTypes.oneOf(['small', 'medium', 'large']),
+  /**
+   * Button contents
+   */
+  label: PropTypes.string.isRequired,
+  /**
+   * Optional click handler
+   */
+  onClick: PropTypes.func,
+};
+
+Button.defaultProps = {
+  backgroundColor: null,
+  primary: false,
+  size: 'medium',
+  onClick: undefined,
+};

package/template/cli/Header.jsx

@@ -1,16 +1,9 @@
+import PropTypes from 'prop-types';
+
 import { Button } from './Button';
 import './header.css';
 
-/**
- * Header component
- * @param {object} props
- * @param {object} [props.user]
- * @param {string} props.user.name
- * @param {function} props.onLogin
- * @param {function} props.onLogout
- * @param {function} props.onCreateAccount
- */
-export const Header = ({ user = null, onLogin, onLogout, onCreateAccount }) => (
+export const Header = ({ user, onLogin, onLogout, onCreateAccount }) => (
   <header>
     <div className="storybook-header">
       <div>
@@ -50,3 +43,16 @@ export const Header = ({ user = null, onLogin, onLogout, onCreateAccount }) => (
     </div>
   </header>
 );
+
+Header.propTypes = {
+  user: PropTypes.shape({
+    name: PropTypes.string.isRequired,
+  }),
+  onLogin: PropTypes.func.isRequired,
+  onLogout: PropTypes.func.isRequired,
+  onCreateAccount: PropTypes.func.isRequired,
+};
+
+Header.defaultProps = {
+  user: null,
+};

package/template/cli/Page.jsx

@@ -2,9 +2,6 @@ import { useState } from 'preact/hooks';
 import { Header } from './Header';
 import './page.css';
 
-/**
- * Simple page component
- */
 export const Page = () => {
   const [user, setUser] = useState();
 

package/template/cli/Page.stories.jsx

@@ -1,4 +1,4 @@
-import { within, userEvent } from '@storybook/test';
+import { within, userEvent } from '@storybook/testing-library';
 
 import { Page } from './Page';
 

package/template/stories/React.js

@@ -1,11 +1,8 @@
 // eslint-disable-next-line import/no-extraneous-dependencies
 import React from 'react';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import PropTypes from 'prop-types';
 
-/**
- * ReactFunctionalComponent component
- * @param {object} props
- * @param {string} props.label
- */
 export const ReactFunctionalComponent = ({ label }) => {
   const [clicks, setValue] = React.useState(0);
   return (
@@ -22,11 +19,10 @@ export const ReactFunctionalComponent = ({ label }) => {
   );
 };
 
-/**
- * ReactClassComponent component
- * @param {object} props
- * @param {string} props.label
- */
+ReactFunctionalComponent.propTypes = {
+  label: PropTypes.string.isRequired,
+};
+
 export class ReactClassComponent extends React.Component {
   state = {
     clicks: 0,
@@ -49,3 +45,7 @@ export class ReactClassComponent extends React.Component {
     );
   }
 }
+
+ReactClassComponent.propTypes = {
+  label: PropTypes.string.isRequired,
+};

package/template/stories/react-compat.stories.js

@@ -1,3 +1,4 @@
+/* eslint-disable react/react-in-jsx-scope */
 import { ReactFunctionalComponent, ReactClassComponent } from './React';
 
 export default {

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

@@ -1,9 +0,0 @@
-declare const parameters: {
-    docs: {
-        story: {
-            inline: boolean;
-        };
-    };
-};
-
-export { parameters };

package/dist/entry-preview-docs.js

@@ -1 +0,0 @@
-"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_docs_exports={};__export(entry_preview_docs_exports,{parameters:()=>parameters});module.exports=__toCommonJS(entry_preview_docs_exports);var parameters={docs:{story:{inline:!0}}};0&&(module.exports={parameters});

package/dist/entry-preview-docs.mjs

@@ -1,3 +0,0 @@
-var parameters={docs:{story:{inline:!0}}};
-
-export { parameters };

package/dist/entry-preview.mjs

@@ -1,5 +0,0 @@
-export { render, renderToCanvas } from './chunk-OHNM7E4P.mjs';
-
-var parameters={renderer:"preact"};
-
-export { parameters };

package/dist/preset.d.ts

@@ -1,5 +0,0 @@
-import { StorybookConfig } from '@storybook/types';
-
-declare const previewAnnotations: StorybookConfig['previewAnnotations'];
-
-export { previewAnnotations };

package/dist/preset.js

@@ -1 +0,0 @@
-"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});

package/preset.js

@@ -1 +0,0 @@
-module.exports = require('./dist/preset');