| 123456 |
- import React2, { useState, useEffect } from 'react';
- import { addons, types, useArgs, useGlobals, useArgTypes, useParameter, useStorybookState } from '@storybook/manager-api';
- import { AddonPanel, Spaced, Badge } from '@storybook/components';
- import { PureArgsTable } from '@storybook/blocks';
- var ADDON_ID="addon-controls",PARAM_KEY="controls";var ControlsPanel=()=>{let[isLoading,setIsLoading]=useState(!0),[args,updateArgs,resetArgs]=useArgs(),[globals]=useGlobals(),rows=useArgTypes(),{expanded,sort,presetColors}=useParameter(PARAM_KEY,{}),{path,previewInitialized}=useStorybookState();useEffect(()=>{previewInitialized&&setIsLoading(!1);},[previewInitialized]);let hasControls=Object.values(rows).some(arg=>arg?.control),withPresetColors=Object.entries(rows).reduce((acc,[key,arg])=>(arg?.control?.type!=="color"||arg?.control?.presetColors?acc[key]=arg:acc[key]={...arg,control:{...arg.control,presetColors}},acc),{});return React2.createElement(PureArgsTable,{key:path,compact:!expanded&&hasControls,rows:withPresetColors,args,globals,updateArgs,resetArgs,inAddonPanel:!0,sort,isLoading})};function Title(){let rows=useArgTypes(),controlsCount=Object.values(rows).filter(argType=>argType?.control&&!argType?.table?.disable).length;return React2.createElement("div",null,React2.createElement(Spaced,{col:1},React2.createElement("span",{style:{display:"inline-block",verticalAlign:"middle"}},"Controls"),controlsCount===0?"":React2.createElement(Badge,{status:"neutral"},controlsCount)))}addons.register(ADDON_ID,api=>{addons.add(ADDON_ID,{title:Title,type:types.PANEL,paramKey:PARAM_KEY,render:({active})=>!active||!api.getCurrentStoryData()?null:React2.createElement(AddonPanel,{active},React2.createElement(ControlsPanel,null))});});
|
