@storybook/addon-docs - npm Package Compare versions

Comparing version 0.0.0-pr-30197-sha-861625a8 to 0.0.0-pr-30197-sha-8babc1dd

dist/index.d.ts

@@ -0,5 +1,25 @@
+import * as core_dist_types from 'storybook/internal/types';
 export * from '@storybook/blocks';
-import { Renderer, DocsRenderFunction } from 'storybook/internal/types';
+import { Renderer as Renderer$1, DocsRenderFunction, ModuleExports, ModuleExport } from 'storybook/internal/types';
 
-declare class DocsRenderer<TRenderer extends Renderer> {
+declare global {
+	interface SymbolConstructor {
+		readonly observable: symbol;
+	}
+}
+
+interface Renderer {
+    /** What is the type of the `component` annotation in this renderer? */
+    component: any;
+    /** What does the story function return in this renderer? */
+    storyResult: any;
+    /** What type of element does this renderer render to? */
+    canvasElement: any;
+    mount(): Promise<Canvas>;
+    T?: unknown;
+}
+interface Canvas {
+}
+
+declare class DocsRenderer<TRenderer extends Renderer$1> {
     render: DocsRenderFunction<TRenderer>;
@@ -10,2 +30,189 @@ unmount: (element: HTMLElement) => void;
 
-export { DocsRenderer };
+type StoryBlockParameters = {
+    /** Whether a story's play function runs when shown in docs page */
+    autoplay?: boolean;
+    /**
+     * Set a minimum height (note for an iframe this is the actual height) when rendering a story in
+     * an iframe or inline. This overrides `parameters.docs.story.iframeHeight` for iframes.
+     */
+    height?: string;
+    /** IFrame configuration */
+    iframeHeight?: string;
+    /**
+     * Whether the story is rendered inline (in the same browser frame as the other docs content) or
+     * in an iframe
+     */
+    inline?: boolean;
+    /** Specifies the CSF file to which the story is associated */
+    meta: ModuleExports;
+    /**
+     * Specifies which story is rendered by the Story block. If no `of` is defined and the MDX file is
+     * attached, the primary (first) story will be rendered.
+     */
+    of: ModuleExport;
+};
+type ControlsBlockParameters = {
+    /** Exclude specific properties from the Controls panel */
+    exclude?: string[] | RegExp;
+    /** Exclude only specific properties in the Controls panel */
+    include?: string[] | RegExp;
+    /** Controls sorting order */
+    sort?: 'none' | 'alpha' | 'requiredFirst';
+};
+type ArgTypesBlockParameters = {
+    /** Exclude specific arg types from the args table */
+    exclude?: string[] | RegExp;
+    /** Exclude only specific arg types from the args table */
+    include?: string[] | RegExp;
+    /**
+     * Specifies which story to get the arg types from. If a CSF file exports is provided, it will use
+     * the primary (first) story in the file.
+     */
+    of: ModuleExport | ModuleExports;
+    /**
+     * Controls arg types order
+     *
+     * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-argtypes#sort
+     */
+    sort?: 'none' | 'alpha' | 'requiredFirst';
+};
+type CanvasBlockParameters = {
+    /**
+     * Provides any additional custom actions to show in the bottom right corner. These are simple
+     * buttons that do anything you specify in the onClick function.
+     */
+    additionalActions?: {
+        className?: string;
+        disabled?: boolean;
+        onClick: () => void;
+        title: string | JSX.Element;
+    }[];
+    /** Provide HTML class(es) to the preview element, for custom styling. */
+    className?: string;
+    /**
+     * Specify how the canvas should layout the story.
+     *
+     * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-canvas#layout
+     */
+    layout?: 'centered' | 'fullscreen' | 'padded';
+    /** Specifies which story is rendered */
+    of: ModuleExport;
+    /** Show story source code */
+    sourceState?: 'hidden' | 'shown';
+    /**
+     * Story configuration
+     *
+     * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-canvas#story
+     */
+    story?: StoryBlockParameters;
+    /** Disable story source code */
+    withSource?: 'open' | 'closed' | 'none';
+    /** Whether to render a toolbar containing tools to interact with the story. */
+    withToolbar?: 'open' | 'closed' | 'none';
+};
+type DescriptionBlockParameters = {
+    /** Component description */
+    component?: string;
+    /** Story description */
+    story?: string;
+};
+type SourceBlockParameters = {
+    /** The source code to be rendered. Will be inferred if not passed */
+    code?: string;
+    /** Whether to render the code in dark mode */
+    dark?: boolean;
+    /** Determines if decorators are rendered in the source code snippet. */
+    excludeDecorators?: boolean;
+    /**
+     * The formatting used on source code. Both true and 'dedent' have the same effect of removing any
+     * extraneous indentation. Supports all valid prettier parser names.
+     *
+     * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-source#format
+     */
+    format?: boolean | 'dedent' | string;
+    /** Source code language */
+    language?: 'bash' | 'css' | 'graphql' | 'html' | 'json' | 'jsextra' | 'jsx' | 'md' | 'text' | 'tsx' | 'typescript' | 'yml';
+    /**
+     * Specifies which story is rendered by the Source block. If no of is defined and the MDX file is
+     * attached, the primary (first) story will be rendered.
+     */
+    of: ModuleExport;
+    /** Source code transformations */
+    transform?: (code: string, storyContext: any) => string;
+    /**
+     * Specifies how the source code is rendered.
+     *
+     * @default 'auto'
+     * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-source#type
+     */
+    type?: 'auto' | 'code' | 'dynamic';
+};
+interface DocsParameters {
+    /**
+     * Docs configuration
+     *
+     * @see https://storybook.js.org/docs/writing-docs
+     */
+    docs?: {
+        /**
+         * The subtitle displayed when shown in docs page
+         *
+         * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-argtypes
+         */
+        argTypes?: ArgTypesBlockParameters;
+        /**
+         * Canvas configuration when shown in docs page
+         *
+         * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-canvas
+         */
+        canvas?: CanvasBlockParameters;
+        /**
+         * Controls block configuration
+         *
+         * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-controls
+         */
+        controls?: ControlsBlockParameters;
+        /**
+         * Component/story description when shown in docs page
+         *
+         * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-description#writing-descriptions
+         */
+        description?: DescriptionBlockParameters;
+        /** Remove the addon panel and disable the addon's behavior */
+        disable?: boolean;
+        /**
+         * Replace the default documentation template used by Storybook with your own
+         *
+         * @see https://storybook.js.org/docs/writing-docs/autodocs#write-a-custom-template
+         */
+        page?: unknown;
+        /**
+         * Source code configuration when shown in docs page
+         *
+         * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-source
+         */
+        source?: SourceBlockParameters;
+        /**
+         * Story configuration
+         *
+         * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-story
+         */
+        story?: StoryBlockParameters;
+        /**
+         * The subtitle displayed when shown in docs page
+         *
+         * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-subtitle
+         */
+        subtitle?: string;
+        /**
+         * The title displayed when shown in docs page
+         *
+         * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-title
+         */
+        title?: string;
+    };
+}
+
+declare const _default: () => core_dist_types.ProjectAnnotations<Renderer>;
+
+export { DocsParameters, DocsRenderer, _default as default };

dist/index.js

@@ -1,1 +0,1 @@
-"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},__reExport=(target,mod,secondTarget)=>(__copyProps(target,mod,"default"),secondTarget&&__copyProps(secondTarget,mod,"default")),__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 src_exports={};__export(src_exports,{DocsRenderer:()=>DocsRenderer});module.exports=__toCommonJS(src_exports);__reExport(src_exports,require("@storybook/blocks"),module.exports);var import_react=__toESM(require("react")),import_blocks=require("@storybook/blocks"),import_react_dom_shim=require("@storybook/react-dom-shim"),defaultComponents={code:import_blocks.CodeOrSourceMdx,a:import_blocks.AnchorMdx,...import_blocks.HeadersMdx},ErrorBoundary=class extends import_react.Component{constructor(){super(...arguments);this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(err){let{showException}=this.props;showException(err)}render(){let{hasError}=this.state,{children}=this.props;return hasError?null:import_react.default.createElement(import_react.default.Fragment,null,children)}},DocsRenderer=class{constructor(){this.render=async(context,docsParameter,element)=>{let components={...defaultComponents,...docsParameter?.components},TDocs=import_blocks.Docs;return new Promise((resolve,reject)=>{import("@mdx-js/react").then(({MDXProvider})=>(0,import_react_dom_shim.renderElement)(import_react.default.createElement(ErrorBoundary,{showException:reject,key:Math.random()},import_react.default.createElement(MDXProvider,{components},import_react.default.createElement(TDocs,{context,docsParameter}))),element)).then(()=>resolve())})},this.unmount=element=>{(0,import_react_dom_shim.unmountElement)(element)}}};0&&(module.exports={DocsRenderer,...require("@storybook/blocks")});
+"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 __esm=(fn,res)=>function(){return fn&&(res=(0,fn[__getOwnPropNames(fn)[0]])(fn=0)),res};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},__reExport=(target,mod,secondTarget)=>(__copyProps(target,mod,"default"),secondTarget&&__copyProps(secondTarget,mod,"default")),__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 DocsRenderer_exports={};__export(DocsRenderer_exports,{DocsRenderer:()=>DocsRenderer,defaultComponents:()=>defaultComponents});var import_react,import_blocks,import_react_dom_shim,defaultComponents,ErrorBoundary,DocsRenderer,init_DocsRenderer=__esm({"src/DocsRenderer.tsx"(){"use strict";import_react=__toESM(require("react")),import_blocks=require("@storybook/blocks"),import_react_dom_shim=require("@storybook/react-dom-shim"),defaultComponents={code:import_blocks.CodeOrSourceMdx,a:import_blocks.AnchorMdx,...import_blocks.HeadersMdx},ErrorBoundary=class extends import_react.Component{constructor(){super(...arguments);this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(err){let{showException}=this.props;showException(err)}render(){let{hasError}=this.state,{children}=this.props;return hasError?null:import_react.default.createElement(import_react.default.Fragment,null,children)}},DocsRenderer=class{constructor(){this.render=async(context,docsParameter,element)=>{let components={...defaultComponents,...docsParameter?.components},TDocs=import_blocks.Docs;return new Promise((resolve,reject)=>{import("@mdx-js/react").then(({MDXProvider})=>(0,import_react_dom_shim.renderElement)(import_react.default.createElement(ErrorBoundary,{showException:reject,key:Math.random()},import_react.default.createElement(MDXProvider,{components},import_react.default.createElement(TDocs,{context,docsParameter}))),element)).then(()=>resolve())})},this.unmount=element=>{(0,import_react_dom_shim.unmountElement)(element)}}}}});var src_exports={};__export(src_exports,{DocsRenderer:()=>DocsRenderer,default:()=>src_default});module.exports=__toCommonJS(src_exports);var import_preview_api=require("storybook/internal/preview-api");var preview_exports={};__export(preview_exports,{parameters:()=>parameters});var excludeTags=Object.entries(globalThis.TAGS_OPTIONS??{}).reduce((acc,entry)=>{let[tag,option]=entry;return option.excludeFromDocsStories&&(acc[tag]=!0),acc},{}),parameters={docs:{renderer:async()=>{let{DocsRenderer:DocsRenderer2}=await Promise.resolve().then(()=>(init_DocsRenderer(),DocsRenderer_exports));return new DocsRenderer2},stories:{filter:story=>(story.tags||[]).filter(tag=>excludeTags[tag]).length===0&&!story.parameters.docs?.disable}}};__reExport(src_exports,require("@storybook/blocks"),module.exports);init_DocsRenderer();var src_default=()=>(0,import_preview_api.definePreview)(preview_exports);0&&(module.exports={DocsRenderer,...require("@storybook/blocks")});

dist/manager.js

@@ -1,1 +0,1 @@
-"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 __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));var import_react=__toESM(require("react")),import_components=require("storybook/internal/components"),import_docs_tools=require("storybook/internal/docs-tools"),import_manager_api=require("storybook/internal/manager-api"),import_blocks=require("@storybook/blocks");import_manager_api.addons.register(import_docs_tools.ADDON_ID,api=>{import_manager_api.addons.add(import_docs_tools.PANEL_ID,{title:"Code",type:import_manager_api.types.PANEL,paramKey:import_docs_tools.PARAM_KEY,disabled:parameters=>!!parameters&&typeof parameters[import_docs_tools.PARAM_KEY]=="object"&&parameters[import_docs_tools.PARAM_KEY].codePanel===!1,match:({viewMode})=>viewMode==="story",render:({active})=>{let[codeSnippet,setSourceCode]=(0,import_manager_api.useAddonState)(import_docs_tools.ADDON_ID,{source:"",format:"html"});return(0,import_manager_api.useChannel)({[import_docs_tools.SNIPPET_RENDERED]:({source,format})=>{setSourceCode({source,format})}}),import_react.default.createElement(import_components.AddonPanel,{active:!!active},import_react.default.createElement(import_blocks.Source,{code:codeSnippet.source,format:codeSnippet.format,dark:!0}))}})});
+"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 __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));var import_react=__toESM(require("react")),import_components=require("storybook/internal/components"),import_docs_tools=require("storybook/internal/docs-tools"),import_manager_api=require("storybook/internal/manager-api"),import_blocks=require("@storybook/blocks");import_manager_api.addons.register(import_docs_tools.ADDON_ID,api=>{import_manager_api.addons.add(import_docs_tools.PANEL_ID,{title:"Code",type:import_manager_api.types.PANEL,paramKey:import_docs_tools.PARAM_KEY,disabled:parameters=>!parameters?.docs?.codePanel,match:({viewMode})=>viewMode==="story",render:({active})=>{let[codeSnippet,setSourceCode]=(0,import_manager_api.useAddonState)(import_docs_tools.ADDON_ID,{source:"",format:"html"});return(0,import_manager_api.useChannel)({[import_docs_tools.SNIPPET_RENDERED]:({source,format})=>{setSourceCode({source,format})}}),import_react.default.createElement(import_components.AddonPanel,{active:!!active},import_react.default.createElement(import_blocks.Source,{code:codeSnippet.source,format:codeSnippet.format,dark:!0}))}})});

package.json

 {
   "name": "@storybook/addon-docs",
-  "version": "0.0.0-pr-30197-sha-861625a8",
+  "version": "0.0.0-pr-30197-sha-8babc1dd",
   "description": "Document component usage and properties in Markdown",
@@ -84,2 +84,21 @@ "keywords": [
   "types": "dist/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "*": [
+        "dist/index.d.ts"
+      ],
+      "angular": [
+        "angular/index.d.ts"
+      ],
+      "blocks": [
+        "dist/blocks.d.ts"
+      ],
+      "ember": [
+        "ember/index.d.ts"
+      ],
+      "preview": [
+        "dist/preview.d.ts"
+      ]
+    }
+  },
   "files": [
@@ -107,5 +126,5 @@ "dist/**/*",
     "@mdx-js/react": "^3.0.0",
-    "@storybook/blocks": "0.0.0-pr-30197-sha-861625a8",
-    "@storybook/csf-plugin": "0.0.0-pr-30197-sha-861625a8",
-    "@storybook/react-dom-shim": "0.0.0-pr-30197-sha-861625a8",
+    "@storybook/blocks": "0.0.0-pr-30197-sha-8babc1dd",
+    "@storybook/csf-plugin": "0.0.0-pr-30197-sha-8babc1dd",
+    "@storybook/react-dom-shim": "0.0.0-pr-30197-sha-8babc1dd",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
@@ -123,7 +142,7 @@ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "rehype-slug": "^6.0.0",
-    "typescript": "^5.3.2",
+    "typescript": "^5.7.3",
     "vite": "^4.0.4"
   },
   "peerDependencies": {
-    "storybook": "^0.0.0-pr-30197-sha-861625a8"
+    "storybook": "^0.0.0-pr-30197-sha-8babc1dd"
   },
@@ -130,0 +149,0 @@ "publishConfig": {

No alert changes

Improved metrics

Total package byte prevSize

2252292

increased by2.43%

Number of package files

41

increased by5.13%

Lines of code

13756

increased by11.12%

Dependency changes

• + Added@storybook/blocks@0.0.0-pr-30197-sha-8babc1dd(transitive)

• + Added@storybook/csf@0.1.14--canary.f3da709.0(transitive)

• + Added@storybook/csf-plugin@0.0.0-pr-30197-sha-8babc1dd(transitive)

• + Added@storybook/react-dom-shim@0.0.0-pr-30197-sha-8babc1dd(transitive)

• - Removed@storybook/blocks@0.0.0-pr-30197-sha-861625a8(transitive)

• - Removed@storybook/csf@0.1.12(transitive)

• - Removed@storybook/csf-plugin@0.0.0-pr-30197-sha-861625a8(transitive)

• - Removed@storybook/react-dom-shim@0.0.0-pr-30197-sha-861625a8(transitive)

• Updated@storybook/blocks@0.0.0-pr-30197-sha-8babc1dd

• Updated@storybook/csf-plugin@0.0.0-pr-30197-sha-8babc1dd

• Updated@storybook/react-dom-shim@0.0.0-pr-30197-sha-8babc1dd