mirror of
https://github.com/grafana/grafana.git
synced 2025-01-13 01:22:05 -06:00
135 lines
471 KiB
Diff
135 lines
471 KiB
Diff
|
diff --git a/dist/index.d.ts b/dist/index.d.ts
|
||
|
|
index baa055bbb796e750fe1badfdfbc4fedbbcbf9f04..5f389f7e1d200dd6a951d8ccfa4cd71befcbceba 100644
|
||
|
|
--- a/dist/index.d.ts
|
||
|
|
+++ b/dist/index.d.ts
|
||
|
|
@@ -53,6 +53,12 @@ interface PreviewProps {
|
||
|
|
children?: ReactNode;
|
||
|
|
}
|
||
|
|
type Layout = 'padded' | 'fullscreen' | 'centered';
|
||
|
|
+/**
|
||
|
|
+ * A preview component for showing one or more component `Story`
|
||
|
|
+ * items. The preview also shows the source for the component
|
||
|
|
+ * as a drop-down.
|
||
|
|
+ */
|
||
|
|
+declare const Preview: FC<PreviewProps>;
|
||
|
|
|
||
|
|
interface ArgType {
|
||
|
|
name?: string;
|
||
|
|
@@ -643,4 +649,4 @@ type ColorProps = ColorControlProps;
|
||
|
|
declare const LazyColorControl: React.LazyExoticComponent<React.FC<ColorControlProps>>;
|
||
|
|
declare const ColorControl: (props: ComponentProps<typeof LazyColorControl>) => React.JSX.Element;
|
||
|
|
|
||
|
|
-export { AddContext, Anchor, AnchorMdx, AnchorProps, ArgTypes, BooleanConfig, BooleanControl, BooleanProps, BooleanValue, Canvas, CodeOrSourceMdx, ColorConfig, ColorControl, ColorItem, ColorPalette, ColorProps, ColorValue, Component, Control, ControlProps, ControlType, Controls, DateConfig, DateControl, DateProps, DateValue, DescriptionContainer as Description, DescriptionType, Docs, DocsContainer, DocsContainerProps, DocsContext, DocsPage, DocsProps, DocsStory, DocsStoryProps, ExternalDocs, ExternalDocsContainer, ExternalDocsProps, FilesControl, FilesControlProps, HeaderMdx, HeadersMdx, Heading, HeadingProps, IconGallery, IconItem, Markdown, Meta, NormalizedOptionsConfig, NumberConfig, NumberControl, NumberValue, ObjectConfig, ObjectControl, ObjectProps, ObjectValue, Of, Options, OptionsArray, OptionsConfig, OptionsControl, OptionsControlType, OptionsMultiSelection, OptionsObject, OptionsProps, OptionsSelection, OptionsSingleSelection, PRIMARY_STORY, PresetColor, Primary, ArgsTable as PureArgsTable, RangeConfig, RangeControl, SortType, Source, SourceContainer, SourceContext, SourceContextProps, SourceItem, SourceProps, Stories, Story, StoryProps, StorySources, Subheading, Subtitle, TextConfig, TextControl, TextProps, TextValue, Title, Typeset, UNKNOWN_ARGS_HASH, Unstyled, Wrapper, anchorBlockIdFromId, argsHash, assertIsFn, extractTitle, format, formatDate, formatTime, getStoryId, getStoryProps, parse, parseDate, parseTime, useOf, useSourceProps };
|
||
|
|
+export { AddContext, Anchor, AnchorMdx, AnchorProps, ArgTypes, BooleanConfig, BooleanControl, BooleanProps, BooleanValue, Canvas, CodeOrSourceMdx, ColorConfig, ColorControl, ColorItem, ColorPalette, ColorProps, ColorValue, Component, Control, ControlProps, ControlType, Controls, DateConfig, DateControl, DateProps, DateValue, DescriptionContainer as Description, DescriptionType, Docs, DocsContainer, DocsContainerProps, DocsContext, DocsPage, DocsProps, DocsStory, DocsStoryProps, ExternalDocs, ExternalDocsContainer, ExternalDocsProps, FilesControl, FilesControlProps, HeaderMdx, HeadersMdx, Heading, HeadingProps, IconGallery, IconItem, Markdown, Meta, NormalizedOptionsConfig, NumberConfig, NumberControl, NumberValue, ObjectConfig, ObjectControl, ObjectProps, ObjectValue, Of, Options, OptionsArray, OptionsConfig, OptionsControl, OptionsControlType, OptionsMultiSelection, OptionsObject, OptionsProps, OptionsSelection, OptionsSingleSelection, PRIMARY_STORY, PresetColor, Preview, Primary, ArgsTable as PureArgsTable, RangeConfig, RangeControl, SortType, Source, SourceContainer, SourceContext, SourceContextProps, SourceItem, SourceProps, Stories, Story, StoryProps, StorySources, Subheading, Subtitle, TextConfig, TextControl, TextProps, TextValue, Title, Typeset, UNKNOWN_ARGS_HASH, Unstyled, Wrapper, anchorBlockIdFromId, argsHash, assertIsFn, extractTitle, format, formatDate, formatTime, getStoryId, getStoryProps, parse, parseDate, parseTime, useOf, useSourceProps };
|
||
|
|
diff --git a/dist/index.js b/dist/index.js
|
||
|
|
index a20435ad1d5645c0f3846365938bc71a98068ae7..4974b0639bcb8579da5fe47916223d23f099c9a2 100644
|
||
|
|
--- a/dist/index.js
|
||
|
|
+++ b/dist/index.js
|
||
|
|
@@ -1,24 +1,24 @@
|
||
|
|
-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};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 getControlId,getControlSetterButtonId,init_helpers=__esm({"src/controls/helpers.ts"(){getControlId=value2=>`control-${value2.replace(/\s+/g,"-")}`,getControlSetterButtonId=value2=>`set-${value2.replace(/\s+/g,"-")}`}});var Color_exports={};__export(Color_exports,{ColorControl:()=>ColorControl,default:()=>Color_default});var import_react24,import_react_colorful,import_color_convert,import_throttle,import_theming18,import_components15,import_icons5,Wrapper8,PickerTooltip,TooltipContent,Note,Swatches,SwatchColor,swatchBackground,Swatch,Input2,ToggleIcon,ColorSpace,COLOR_SPACES,COLOR_REGEXP,RGB_REGEXP,HSL_REGEXP,HEX_REGEXP,SHORTHEX_REGEXP,ColorPicker,fallbackColor,stringToArgs,parseValue,getRealValue,useColorInput,id,usePresets,ColorControl,Color_default,init_Color=__esm({"src/controls/Color.tsx"(){import_react24=__toESM(require("react")),import_react_colorful=require("react-colorful"),import_color_convert=__toESM(require("color-convert")),import_throttle=__toESM(require("lodash/throttle.js")),import_theming18=require("@storybook/theming"),import_components15=require("@storybook/components");init_helpers();import_icons5=require("@storybook/icons"),Wrapper8=import_theming18.styled.div({position:"relative",maxWidth:250,'&[aria-readonly="true"]':{opacity:.5}}),PickerTooltip=(0,import_theming18.styled)(import_components15.WithTooltip)({position:"absolute",zIndex:1,top:4,left:4,"[aria-readonly=true] &":{cursor:"not-allowed"}}),TooltipContent=import_theming18.styled.div({width:200,margin:5,".react-colorful__saturation":{borderRadius:"4px 4px 0 0"},".react-colorful__hue":{boxShadow:"inset 0 0 0 1px rgb(0 0 0 / 5%)"},".react-colorful__last-control":{borderRadius:"0 0 4px 4px"}}),Note=(0,import_theming18.styled)(import_components15.TooltipNote)(({theme})=>({fontFamily:theme.typography.fonts.base})),Swatches=import_theming18.styled.div({display:"grid",gridTemplateColumns:"repeat(9, 16px)",gap:6,padding:3,marginTop:5,width:200}),SwatchColor=import_theming18.styled.div(({theme,active})=>({width:16,height:16,boxShadow:active?`${theme.appBorderColor} 0 0 0 1px inset, ${theme.textMutedColor}50 0 0 0 4px`:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:theme.appBorderRadius})),swatchBackground=`url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')`,Swatch=({value:value2,style,...props})=>{let backgroundImage=`linear-gradient(${value2}, ${value2}), ${swatchBackground}, linear-gradient(#fff, #fff)`;return import_react24.default.createElement(SwatchColor,{...props,style:{...style,backgroundImage}})},Input2=(0,import_theming18.styled)(import_components15.Form.Input)(({theme,readOnly})=>({width:"100%",paddingLeft:30,paddingRight:30,boxSizing:"border-box",fontFamily:theme.typography.fonts.base})),ToggleIcon=(0,import_theming18.styled)(import_icons5.MarkupIcon)(({theme})=>({position:"absolute",zIndex:1,top:6,right:7,width:20,height:20,padding:4,boxSizing:"border-box",cursor:"pointer",color:theme.input.color})),ColorSpace=(ColorSpace2=>(ColorSpace2
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.darken)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.darken)(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.lighten)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.lighten)(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:6,width:"100%",height:6,cursor:disabled?"not-allowed":"pointer"},"&::-webkit-slider-thumb":{marginTop:"-6px",width:16,height:16,border:`1px solid ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,borderRadius:"50px",boxShadow:`0 1px 3px 0px ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,cursor:disabled?"not-allowed":"grab",appearance:"none",background:`${theme.input.background}`,transition:"all 150ms ease-out","&:hover":{background:`${(0,import_polished5.darken)(.05,theme.input.background)}`,transform:"scale3d(1.1, 1.1, 1.1) translateY(-1px)",transition:"all 50ms ease-out"},"&:active":{background:`${theme.input.background}`,transform:"scale3d(1, 1, 1) translateY(0px)",cursor:disabled?"not-allowed":"grab"}},"&:focus":{outline:"none","&::-webkit-slider-runnable-track":{borderColor:(0,import_polished5.rgba)(theme.color.secondary,.4)},"&::-webkit-slider-thumb":{borderColor:theme.color.secondary,boxShadow:`0 0px 5px 0px ${theme.color.secondary}`}},"&::-moz-range-track":{background:theme.base==="light"?`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.darken)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.darken)(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.lighten)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.lighten)(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:6,width:"100%",height:6,cursor:disabled?"not-allowed":"pointer",outline:"none"},"&::-moz-range-thumb":{width:16,height:16,border:`1px solid ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,borderRadius:"50px",boxShadow:`0 1px 3px 0px ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,cursor:disabled?"not-allowed":"grap",background:`${theme.input.background}`,transition:"all 150ms ease-out","&:hover":{background:`${(0,import_polished5.darken)(.05,theme.input.background)}`,transform:"scale3d(1.1, 1.1, 1.1) translateY(-1px)",transition:"all 50ms ease-out"},"&:active":{background:`${theme.input.background}`,transform:"scale3d(1, 1, 1) translateY(0px)",cursor:"grabbing"}},"&::-ms-track":{background:theme.base==="light"?`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.darken)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.darken)(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${(0,import_polished5.lighten)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+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};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 getControlId,getControlSetterButtonId,init_helpers=__esm({"src/controls/helpers.ts"(){getControlId=value2=>`control-${value2.replace(/\s+/g,"-")}`,getControlSetterButtonId=value2=>`set-${value2.replace(/\s+/g,"-")}`}});var Color_exports={};__export(Color_exports,{ColorControl:()=>ColorControl,default:()=>Color_default});var import_react24,import_react_colorful,import_color_convert,import_throttle,import_theming18,import_components15,import_icons5,Wrapper8,PickerTooltip,TooltipContent,Note,Swatches,SwatchColor,swatchBackground,Swatch,Input2,ToggleIcon,ColorSpace,COLOR_SPACES,COLOR_REGEXP,RGB_REGEXP,HSL_REGEXP,HEX_REGEXP,SHORTHEX_REGEXP,ColorPicker,fallbackColor,stringToArgs,parseValue,getRealValue,useColorInput,id,usePresets,ColorControl,Color_default,init_Color=__esm({"src/controls/Color.tsx"(){import_react24=__toESM(require("react")),import_react_colorful=require("react-colorful"),import_color_convert=__toESM(require("color-convert")),import_throttle=__toESM(require("lodash/throttle.js")),import_theming18=require("@storybook/theming"),import_components15=require("@storybook/components");init_helpers();import_icons5=require("@storybook/icons"),Wrapper8=import_theming18.styled.div({position:"relative",maxWidth:250,'&[aria-readonly="true"]':{opacity:.5}}),PickerTooltip=(0,import_theming18.styled)(import_components15.WithTooltip)({position:"absolute",zIndex:1,top:4,left:4,"[aria-readonly=true] &":{cursor:"not-allowed"}}),TooltipContent=import_theming18.styled.div({width:200,margin:5,".react-colorful__saturation":{borderRadius:"4px 4px 0 0"},".react-colorful__hue":{boxShadow:"inset 0 0 0 1px rgb(0 0 0 / 5%)"},".react-colorful__last-control":{borderRadius:"0 0 4px 4px"}}),Note=(0,import_theming18.styled)(import_components15.TooltipNote)(({theme})=>({fontFamily:theme.typography.fonts.base})),Swatches=import_theming18.styled.div({display:"grid",gridTemplateColumns:"repeat(9, 16px)",gap:6,padding:3,marginTop:5,width:200}),SwatchColor=import_theming18.styled.div(({theme,active})=>({width:16,height:16,boxShadow:active?`${theme.appBorderColor} 0 0 0 1px inset, ${theme.textMutedColor}50 0 0 0 4px`:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:theme.appBorderRadius})),swatchBackground=`url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')`,Swatch=({value:value2,style,...props})=>{let backgroundImage=`linear-gradient(${value2}, ${value2}), ${swatchBackground}, linear-gradient(#fff, #fff)`;return import_react24.default.createElement(SwatchColor,{...props,style:{...style,backgroundImage}})},Input2=(0,import_theming18.styled)(import_components15.Form.Input)(({theme,readOnly})=>({width:"100%",paddingLeft:30,paddingRight:30,boxSizing:"border-box",fontFamily:theme.typography.fonts.base})),ToggleIcon=(0,import_theming18.styled)(import_icons5.MarkupIcon)(({theme})=>({position:"absolute",zIndex:1,top:6,right:7,width:20,height:20,padding:4,boxSizing:"border-box",cursor:"pointer",color:theme.input.color})),ColorSpace=(ColorSpace2=>(ColorSpace2
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.darken)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.darken)(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.lighten)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.lighten)(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:6,width:"100%",height:6,cursor:disabled?"not-allowed":"pointer"},"&::-webkit-slider-thumb":{marginTop:"-6px",width:16,height:16,border:`1px solid ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,borderRadius:"50px",boxShadow:`0 1px 3px 0px ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,cursor:disabled?"not-allowed":"grab",appearance:"none",background:`${theme.input.background}`,transition:"all 150ms ease-out","&:hover":{background:`${(0,import_polished5.darken)(.05,theme.input.background)}`,transform:"scale3d(1.1, 1.1, 1.1) translateY(-1px)",transition:"all 50ms ease-out"},"&:active":{background:`${theme.input.background}`,transform:"scale3d(1, 1, 1) translateY(0px)",cursor:disabled?"not-allowed":"grab"}},"&:focus":{outline:"none","&::-webkit-slider-runnable-track":{borderColor:(0,import_polished5.rgba)(theme.color.secondary,.4)},"&::-webkit-slider-thumb":{borderColor:theme.color.secondary,boxShadow:`0 0px 5px 0px ${theme.color.secondary}`}},"&::-moz-range-track":{background:theme.base==="light"?`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.darken)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.darken)(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.lighten)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.lighten)(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:6,width:"100%",height:6,cursor:disabled?"not-allowed":"pointer",outline:"none"},"&::-moz-range-thumb":{width:16,height:16,border:`1px solid ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,borderRadius:"50px",boxShadow:`0 1px 3px 0px ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,cursor:disabled?"not-allowed":"grap",background:`${theme.input.background}`,transition:"all 150ms ease-out","&:hover":{background:`${(0,import_polished5.darken)(.05,theme.input.background)}`,transform:"scale3d(1.1, 1.1, 1.1) translateY(-1px)",transition:"all 50ms ease-out"},"&:active":{background:`${theme.input.background}`,transform:"scale3d(1, 1, 1) translateY(0px)",cursor:"grabbing"}},"&::-ms-track":{background:theme.base==="light"?`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.darken)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.darken)(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${(0,import_polished5.lighten)(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
${(0,import_polished5.lighten)(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,color:"transparent",width:"100%",height:"6px",cursor:"pointer"},"&::-ms-fill-lower":{borderRadius:6},"&::-ms-fill-upper":{borderRadius:6},"&::-ms-thumb":{width:16,height:16,background:`${theme.input.background}`,border:`1px solid ${(0,import_polished5.rgba)(theme.appBorderColor,.2)}`,borderRadius:50,cursor:"grab",marginTop:0},"@supports (-ms-ime-align:auto)":{"input[type=range]":{margin:"0"}}})),RangeLabel=import_theming15.styled.span({paddingLeft:5,paddingRight:5,fontSize:12,whiteSpace:"nowrap",fontFeatureSettings:"tnum",fontVariantNumeric:"tabular-nums","[aria-readonly=true] &":{opacity:.5}}),RangeCurrentAndMaxLabel=(0,import_theming15.styled)(RangeLabel)(({numberOFDecimalsPlaces,max})=>({width:`${numberOFDecimalsPlaces+max.toString().length*2+3}ch`,textAlign:"right",flexShrink:0})),RangeWrapper=import_theming15.styled.div({display:"flex",alignItems:"center",width:"100%"});function getNumberOfDecimalPlaces(number){let match=number.toString().match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);return match?Math.max(0,(match[1]?match[1].length:0)-(match[2]?+match[2]:0)):0}var RangeControl=({name,value:value2,onChange,min=0,max=100,step=1,onBlur,onFocus,argType})=>{let handleChange=event=>{onChange(parse2(event.target.value))},hasValue=value2!==void 0,numberOFDecimalsPlaces=(0,import_react21.useMemo)(()=>getNumberOfDecimalPlaces(step),[step]),readonly=!!argType?.table?.readonly;return import_react21.default.createElement(RangeWrapper,{"aria-readonly":readonly},import_react21.default.createElement(RangeLabel,null,min),import_react21.default.createElement(RangeInput,{id:getControlId(name),type:"range",disabled:readonly,onChange:handleChange,name,value:value2,min,max,step,onFocus,onBlur}),import_react21.default.createElement(RangeCurrentAndMaxLabel,{numberOFDecimalsPlaces,max},hasValue?value2.toFixed(numberOFDecimalsPlaces):"--"," / ",max))};var import_react22=__toESM(require("react")),import_theming16=require("@storybook/theming"),import_components13=require("@storybook/components");init_helpers();var Wrapper7=import_theming16.styled.label({display:"flex"}),MaxLength=import_theming16.styled.div(({isMaxed})=>({marginLeft:"0.75rem",paddingTop:"0.35rem",color:isMaxed?"red":void 0})),TextControl=({name,value:value2,onChange,onFocus,onBlur,maxLength,argType})=>{let handleChange=event=>{onChange(event.target.value)},readonly=!!argType?.table?.readonly,[forceVisible,setForceVisible]=(0,import_react22.useState)(!1),onForceVisible=(0,import_react22.useCallback)(()=>{onChange(""),setForceVisible(!0)},[setForceVisible]);if(value2===void 0)return import_react22.default.createElement(import_components13.Button,{variant:"outline",size:"medium",disabled:readonly,id:getControlSetterButtonId(name),onClick:onForceVisible},"Set string");let isValid=typeof value2=="string";return import_react22.default.createElement(Wrapper7,null,import_react22.default.createElement(import_components13.Form.Textarea,{id:getControlId(name),maxLength,onChange:handleChange,disabled:readonly,size:"flex",placeholder:"Edit string...",autoFocus:forceVisible,valid:isValid?null:"error",name,value:isValid?value2:"",onFocus,onBlur}),maxLength&&import_react22.default.createElement(MaxLength,{isMaxed:value2?.length===maxLength},value2?.length??0," / ",maxLength))};var import_react23=__toESM(require("react")),import_theming17=require("@storybook/theming"),import_components14=require("@storybook/components");init_helpers();var FileInput=(0,import_theming17.styled)(import_components14.Form.Input)({padding:10});function revokeOldUrls(urls){urls.forEach(url=>{url.startsWith("blob:")&&URL.revokeObjectURL(url)})}var FilesControl=({onChange,name,accept="image/*",value:value2,argType})=>{let inputElement=(0,import_react23.useRef)(null),readonly=argType?.control?.readOnly;function handleFileChange(e){if(!e.target.files)return;let fileUrls=Array.from(e.target.files).map(file=>URL.createObjectURL(file));onChange(fileUrls),revokeOldUrls(value2)}return(0,import_reac
|
||
|
|
This is often caused by not wrapping the child in a template string.
|
||
|
|
-
|
||
|
|
+
|
||
|
|
This is invalid:
|
||
|
|
<Markdown>
|
||
|
|
# Some heading
|
||
|
|
@@ -32,4 +32,4 @@ var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropD
|
||
|
|
A paragraph
|
||
|
|
\`}
|
||
|
|
</Markdown>
|
||
|
|
- `);return import_react49.default.createElement(import_markdown_to_jsx2.default,{...props,options:{forceBlock:!0,overrides:{code:CodeOrSourceMdx,a:AnchorMdx,...HeadersMdx,...props?.options?.overrides},...props?.options}})};var DescriptionType=(DescriptionType2=>(DescriptionType2.INFO="info",DescriptionType2.NOTES="notes",DescriptionType2.DOCGEN="docgen",DescriptionType2.AUTO="auto",DescriptionType2))(DescriptionType||{}),getDescriptionFromResolvedOf=resolvedOf=>{switch(resolvedOf.type){case"story":return resolvedOf.story.parameters.docs?.description?.story||null;case"meta":{let{parameters,component}=resolvedOf.preparedMeta,metaDescription=parameters.docs?.description?.component;return metaDescription||parameters.docs?.extractComponentDescription?.(component,{component,parameters})||null}case"component":{let{component,projectAnnotations:{parameters}}=resolvedOf;return parameters.docs?.extractComponentDescription?.(component,{component,parameters})||null}default:throw new Error(`Unrecognized module type resolved from 'useOf', got: ${resolvedOf.type}`)}},DescriptionContainer=props=>{let{of}=props;if("of"in props&&of===void 0)throw new Error("Unexpected `of={undefined}`, did you mistype a CSF file reference?");let resolvedOf=useOf(of||"meta"),markdown=getDescriptionFromResolvedOf(resolvedOf);return markdown?import_react50.default.createElement(Markdown2,null,markdown):null};var import_react61=__toESM(require("react"));var import_react52=__toESM(require("react")),import_global7=require("@storybook/global"),import_theming29=require("@storybook/theming");var import_react51=__toESM(require("react")),import_theming28=require("@storybook/theming"),tocbot=__toESM(require("tocbot")),Wrapper11=import_theming28.styled.div(({theme})=>({width:"10rem","@media (max-width: 768px)":{display:"none"}})),Content=import_theming28.styled.div(({theme})=>({position:"fixed",bottom:0,top:0,width:"10rem",paddingTop:"4rem",paddingBottom:"2rem",overflowY:"auto",fontFamily:theme.typography.fonts.base,fontSize:theme.typography.size.s2,WebkitFontSmoothing:"antialiased",MozOsxFontSmoothing:"grayscale",WebkitTapHighlightColor:"rgba(0, 0, 0, 0)",WebkitOverflowScrolling:"touch","& *":{boxSizing:"border-box"},"& > .toc-wrapper > .toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`,".toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`,".toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`}}},"& .toc-list-item":{position:"relative",listStyleType:"none",marginLeft:20,paddingTop:3,paddingBottom:3},"& .toc-list-item::before":{content:'""',position:"absolute",height:"100%",top:0,left:0,transform:"translateX(calc(-2px - 20px))",borderLeft:`solid 2px ${theme.color.mediumdark}`,opacity:0,transition:"opacity 0.2s"},"& .toc-list-item.is-active-li::before":{opacity:1},"& .toc-list-item > a":{color:theme.color.defaultText,textDecoration:"none"},"& .toc-list-item.is-active-li > a":{fontWeight:600,color:theme.color.secondary,textDecoration:"none"}})),Heading=import_theming28.styled.p(({theme})=>({fontWeight:600,fontSize:"0.875em",color:theme.textColor,textTransform:"uppercase",marginBottom:10})),OptionalTitle=({title})=>title===null?null:typeof title=="string"?import_react51.default.createElement(Heading,null,title):title,TableOfContents=({title,disable,headingSelector,contentsSelector,ignoreSelector,unsafeTocbotOptions})=>((0,import_react51.useEffect)(()=>{let configuration={tocSelector:".toc-wrapper",contentSelector:contentsSelector??".sbdocs-content",headingSelector:headingSelector??"h3",ignoreSelector:ignoreSelector??".docs-story *, .skip-toc",headingsOffset:40,scrollSmoothOffset:-40,orderedList:!1,onClick:()=>!1,...unsafeTocbotOptions},timeout=setTimeout(()=>tocbot.init(configuration),100);return()=>{clearTimeout(timeout),tocbot.destroy()}},[disable]),import_react51.default.createElement(import_react51.default.Fragment,null,import_react51.default.createElement(Wrapper11,null,disable?null:import_react51.default.createElement(Content,null,import_react51.default.createElement(OptionalTitle,{title:ti
|
||
|
|
+ `);return import_react49.default.createElement(import_markdown_to_jsx2.default,{...props,options:{forceBlock:!0,overrides:{code:CodeOrSourceMdx,a:AnchorMdx,...HeadersMdx,...props?.options?.overrides},...props?.options}})};var DescriptionType=(DescriptionType2=>(DescriptionType2.INFO="info",DescriptionType2.NOTES="notes",DescriptionType2.DOCGEN="docgen",DescriptionType2.AUTO="auto",DescriptionType2))(DescriptionType||{}),getDescriptionFromResolvedOf=resolvedOf=>{switch(resolvedOf.type){case"story":return resolvedOf.story.parameters.docs?.description?.story||null;case"meta":{let{parameters,component}=resolvedOf.preparedMeta,metaDescription=parameters.docs?.description?.component;return metaDescription||parameters.docs?.extractComponentDescription?.(component,{component,parameters})||null}case"component":{let{component,projectAnnotations:{parameters}}=resolvedOf;return parameters.docs?.extractComponentDescription?.(component,{component,parameters})||null}default:throw new Error(`Unrecognized module type resolved from 'useOf', got: ${resolvedOf.type}`)}},DescriptionContainer=props=>{let{of}=props;if("of"in props&&of===void 0)throw new Error("Unexpected `of={undefined}`, did you mistype a CSF file reference?");let resolvedOf=useOf(of||"meta"),markdown=getDescriptionFromResolvedOf(resolvedOf);return markdown?import_react50.default.createElement(Markdown2,null,markdown):null};var import_react61=__toESM(require("react"));var import_react52=__toESM(require("react")),import_global7=require("@storybook/global"),import_theming29=require("@storybook/theming");var import_react51=__toESM(require("react")),import_theming28=require("@storybook/theming"),tocbot=__toESM(require("tocbot")),Wrapper11=import_theming28.styled.div(({theme})=>({width:"10rem","@media (max-width: 768px)":{display:"none"}})),Content=import_theming28.styled.div(({theme})=>({position:"fixed",bottom:0,top:0,width:"10rem",paddingTop:"4rem",paddingBottom:"2rem",overflowY:"auto",fontFamily:theme.typography.fonts.base,fontSize:theme.typography.size.s2,WebkitFontSmoothing:"antialiased",MozOsxFontSmoothing:"grayscale",WebkitTapHighlightColor:"rgba(0, 0, 0, 0)",WebkitOverflowScrolling:"touch","& *":{boxSizing:"border-box"},"& > .toc-wrapper > .toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`,".toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`,".toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`}}},"& .toc-list-item":{position:"relative",listStyleType:"none",marginLeft:20,paddingTop:3,paddingBottom:3},"& .toc-list-item::before":{content:'""',position:"absolute",height:"100%",top:0,left:0,transform:"translateX(calc(-2px - 20px))",borderLeft:`solid 2px ${theme.color.mediumdark}`,opacity:0,transition:"opacity 0.2s"},"& .toc-list-item.is-active-li::before":{opacity:1},"& .toc-list-item > a":{color:theme.color.defaultText,textDecoration:"none"},"& .toc-list-item.is-active-li > a":{fontWeight:600,color:theme.color.secondary,textDecoration:"none"}})),Heading=import_theming28.styled.p(({theme})=>({fontWeight:600,fontSize:"0.875em",color:theme.textColor,textTransform:"uppercase",marginBottom:10})),OptionalTitle=({title})=>title===null?null:typeof title=="string"?import_react51.default.createElement(Heading,null,title):title,TableOfContents=({title,disable,headingSelector,contentsSelector,ignoreSelector,unsafeTocbotOptions})=>((0,import_react51.useEffect)(()=>{let configuration={tocSelector:".toc-wrapper",contentSelector:contentsSelector??".sbdocs-content",headingSelector:headingSelector??"h3",ignoreSelector:ignoreSelector??".docs-story *, .skip-toc",headingsOffset:40,scrollSmoothOffset:-40,orderedList:!1,onClick:()=>!1,...unsafeTocbotOptions},timeout=setTimeout(()=>tocbot.init(configuration),100);return()=>{clearTimeout(timeout),tocbot.destroy()}},[disable]),import_react51.default.createElement(import_react51.default.Fragment,null,import_react51.default.createElement(Wrapper11,null,disable?null:import_react51.default.createElement(Content,null,import_react51.default.createElement(OptionalTitle,{title:ti
|
||
|
|
diff --git a/dist/index.mjs b/dist/index.mjs
|
||
|
|
index a626b2de91e14417fad86dbea9cc5c4dac49a222..0cf497db98ebdf4961a06e25ca634f7081a68665 100644
|
||
|
|
--- a/dist/index.mjs
|
||
|
|
+++ b/dist/index.mjs
|
||
|
|
@@ -20,27 +20,27 @@ import dedent from 'ts-dedent';
|
||
|
|
import * as tocbot from 'tocbot';
|
||
|
|
import { Channel } from '@storybook/channels';
|
||
|
|
|
||
|
|
-var Wrapper=styled.div(withReset,({theme})=>({backgroundColor:theme.base==="light"?"rgba(0,0,0,.01)":"rgba(255,255,255,.01)",borderRadius:theme.appBorderRadius,border:`1px dashed ${theme.appBorderColor}`,display:"flex",alignItems:"center",justifyContent:"center",padding:20,margin:"25px 0 40px",color:transparentize(.3,theme.color.defaultText),fontSize:theme.typography.size.s2})),EmptyBlock=props=>React17.createElement(Wrapper,{...props,className:"docblock-emptyblock sb-unstyled"});var StyledSyntaxHighlighter=styled(SyntaxHighlighter)(({theme})=>({fontSize:`${theme.typography.size.s2-1}px`,lineHeight:"19px",margin:"25px 0 40px",borderRadius:theme.appBorderRadius,boxShadow:theme.base==="light"?"rgba(0, 0, 0, 0.10) 0 1px 3px 0":"rgba(0, 0, 0, 0.20) 0 2px 5px 0","pre.prismjs":{padding:20,background:"inherit"}}));var SourceSkeletonWrapper=styled.div(({theme})=>({background:theme.background.content,borderRadius:theme.appBorderRadius,border:`1px solid ${theme.appBorderColor}`,boxShadow:theme.base==="light"?"rgba(0, 0, 0, 0.10) 0 1px 3px 0":"rgba(0, 0, 0, 0.20) 0 2px 5px 0",margin:"25px 0 40px",padding:"20px 20px 20px 22px"})),SourceSkeletonPlaceholder=styled.div(({theme})=>({animation:`${theme.animation.glow} 1.5s ease-in-out infinite`,background:theme.appBorderColor,height:17,marginTop:1,width:"60%",[`&:first-child${ignoreSsrWarning}`]:{margin:0}})),SourceSkeleton=()=>React17.createElement(SourceSkeletonWrapper,null,React17.createElement(SourceSkeletonPlaceholder,null),React17.createElement(SourceSkeletonPlaceholder,{style:{width:"80%"}}),React17.createElement(SourceSkeletonPlaceholder,{style:{width:"30%"}}),React17.createElement(SourceSkeletonPlaceholder,{style:{width:"80%"}})),Source=({isLoading,error,language,code,dark,format:format2=!1,...rest})=>{let{typography}=useTheme();if(isLoading)return React17.createElement(SourceSkeleton,null);if(error)return React17.createElement(EmptyBlock,null,error);let syntaxHighlighter=React17.createElement(StyledSyntaxHighlighter,{bordered:!0,copyable:!0,format:format2,language,className:"docblock-source sb-unstyled",...rest},code);if(typeof dark>"u")return syntaxHighlighter;let overrideTheme=dark?themes.dark:themes.light;return React17.createElement(ThemeProvider,{theme:convert({...overrideTheme,fontCode:typography.fonts.mono,fontBase:typography.fonts.base})},syntaxHighlighter)};var toGlobalSelector=element=>`& :where(${element}:not(.sb-anchor, .sb-unstyled, .sb-unstyled ${element}))`,breakpoint=600,Title=styled.h1(withReset,({theme})=>({color:theme.color.defaultText,fontSize:theme.typography.size.m3,fontWeight:theme.typography.weight.bold,lineHeight:"32px",[`@media (min-width: ${breakpoint}px)`]:{fontSize:theme.typography.size.l1,lineHeight:"36px",marginBottom:"16px"}})),Subtitle=styled.h2(withReset,({theme})=>({fontWeight:theme.typography.weight.regular,fontSize:theme.typography.size.s3,lineHeight:"20px",borderBottom:"none",marginBottom:15,[`@media (min-width: ${breakpoint}px)`]:{fontSize:theme.typography.size.m1,lineHeight:"28px",marginBottom:24},color:transparentize(.25,theme.color.defaultText)})),DocsContent=styled.div(({theme})=>{let reset={fontFamily:theme.typography.fonts.base,fontSize:theme.typography.size.s3,margin:0,WebkitFontSmoothing:"antialiased",MozOsxFontSmoothing:"grayscale",WebkitTapHighlightColor:"rgba(0, 0, 0, 0)",WebkitOverflowScrolling:"touch"},headers={margin:"20px 0 8px",padding:0,cursor:"text",position:"relative",color:theme.color.defaultText,"&:first-of-type":{marginTop:0,paddingTop:0},"&:hover a.anchor":{textDecoration:"none"},"& code":{fontSize:"inherit"}},code={lineHeight:1,margin:"0 2px",padding:"3px 5px",whiteSpace:"nowrap",borderRadius:3,fontSize:theme.typography.size.s2-1,border:theme.base==="light"?`1px solid ${theme.color.mediumlight}`:`1px solid ${theme.color.darker}`,color:theme.base==="light"?transparentize(.1,theme.color.defaultText):transparentize(.3,theme.color.defaultText),backgroundColor:theme.base==="light"?theme.color.lighter:theme.color.border};return {maxWidth:1e3,width:"100%",[toGlobalSelector("a")]:{...reset,fontSize:"inherit",lineHeight:"2
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${darken(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${darken(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${lighten(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${lighten(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:6,width:"100%",height:6,cursor:disabled?"not-allowed":"pointer"},"&::-webkit-slider-thumb":{marginTop:"-6px",width:16,height:16,border:`1px solid ${rgba(theme.appBorderColor,.2)}`,borderRadius:"50px",boxShadow:`0 1px 3px 0px ${rgba(theme.appBorderColor,.2)}`,cursor:disabled?"not-allowed":"grab",appearance:"none",background:`${theme.input.background}`,transition:"all 150ms ease-out","&:hover":{background:`${darken(.05,theme.input.background)}`,transform:"scale3d(1.1, 1.1, 1.1) translateY(-1px)",transition:"all 50ms ease-out"},"&:active":{background:`${theme.input.background}`,transform:"scale3d(1, 1, 1) translateY(0px)",cursor:disabled?"not-allowed":"grab"}},"&:focus":{outline:"none","&::-webkit-slider-runnable-track":{borderColor:rgba(theme.color.secondary,.4)},"&::-webkit-slider-thumb":{borderColor:theme.color.secondary,boxShadow:`0 0px 5px 0px ${theme.color.secondary}`}},"&::-moz-range-track":{background:theme.base==="light"?`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${darken(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${darken(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${lighten(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${lighten(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:6,width:"100%",height:6,cursor:disabled?"not-allowed":"pointer",outline:"none"},"&::-moz-range-thumb":{width:16,height:16,border:`1px solid ${rgba(theme.appBorderColor,.2)}`,borderRadius:"50px",boxShadow:`0 1px 3px 0px ${rgba(theme.appBorderColor,.2)}`,cursor:disabled?"not-allowed":"grap",background:`${theme.input.background}`,transition:"all 150ms ease-out","&:hover":{background:`${darken(.05,theme.input.background)}`,transform:"scale3d(1.1, 1.1, 1.1) translateY(-1px)",transition:"all 50ms ease-out"},"&:active":{background:`${theme.input.background}`,transform:"scale3d(1, 1, 1) translateY(0px)",cursor:"grabbing"}},"&::-ms-track":{background:theme.base==="light"?`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${darken(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${darken(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
- ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
- ${lighten(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+var Wrapper=styled.div(withReset,({theme})=>({backgroundColor:theme.base==="light"?"rgba(0,0,0,.01)":"rgba(255,255,255,.01)",borderRadius:theme.appBorderRadius,border:`1px dashed ${theme.appBorderColor}`,display:"flex",alignItems:"center",justifyContent:"center",padding:20,margin:"25px 0 40px",color:transparentize(.3,theme.color.defaultText),fontSize:theme.typography.size.s2})),EmptyBlock=props=>React17.createElement(Wrapper,{...props,className:"docblock-emptyblock sb-unstyled"});var StyledSyntaxHighlighter=styled(SyntaxHighlighter)(({theme})=>({fontSize:`${theme.typography.size.s2-1}px`,lineHeight:"19px",margin:"25px 0 40px",borderRadius:theme.appBorderRadius,boxShadow:theme.base==="light"?"rgba(0, 0, 0, 0.10) 0 1px 3px 0":"rgba(0, 0, 0, 0.20) 0 2px 5px 0","pre.prismjs":{padding:20,background:"inherit"}}));var SourceSkeletonWrapper=styled.div(({theme})=>({background:theme.background.content,borderRadius:theme.appBorderRadius,border:`1px solid ${theme.appBorderColor}`,boxShadow:theme.base==="light"?"rgba(0, 0, 0, 0.10) 0 1px 3px 0":"rgba(0, 0, 0, 0.20) 0 2px 5px 0",margin:"25px 0 40px",padding:"20px 20px 20px 22px"})),SourceSkeletonPlaceholder=styled.div(({theme})=>({animation:`${theme.animation.glow} 1.5s ease-in-out infinite`,background:theme.appBorderColor,height:17,marginTop:1,width:"60%",[`&:first-child${ignoreSsrWarning}`]:{margin:0}})),SourceSkeleton=()=>React17.createElement(SourceSkeletonWrapper,null,React17.createElement(SourceSkeletonPlaceholder,null),React17.createElement(SourceSkeletonPlaceholder,{style:{width:"80%"}}),React17.createElement(SourceSkeletonPlaceholder,{style:{width:"30%"}}),React17.createElement(SourceSkeletonPlaceholder,{style:{width:"80%"}})),Source=({isLoading,error,language,code,dark,format:format2=!1,...rest})=>{let{typography}=useTheme();if(isLoading)return React17.createElement(SourceSkeleton,null);if(error)return React17.createElement(EmptyBlock,null,error);let syntaxHighlighter=React17.createElement(StyledSyntaxHighlighter,{bordered:!0,copyable:!0,format:format2,language,className:"docblock-source sb-unstyled",...rest},code);if(typeof dark>"u")return syntaxHighlighter;let overrideTheme=dark?themes.dark:themes.light;return React17.createElement(ThemeProvider,{theme:convert({...overrideTheme,fontCode:typography.fonts.mono,fontBase:typography.fonts.base})},syntaxHighlighter)};var toGlobalSelector=element=>`& :where(${element}:not(.sb-anchor, .sb-unstyled, .sb-unstyled ${element}))`,breakpoint=600,Title=styled.h1(withReset,({theme})=>({color:theme.color.defaultText,fontSize:theme.typography.size.m3,fontWeight:theme.typography.weight.bold,lineHeight:"32px",[`@media (min-width: ${breakpoint}px)`]:{fontSize:theme.typography.size.l1,lineHeight:"36px",marginBottom:"16px"}})),Subtitle=styled.h2(withReset,({theme})=>({fontWeight:theme.typography.weight.regular,fontSize:theme.typography.size.s3,lineHeight:"20px",borderBottom:"none",marginBottom:15,[`@media (min-width: ${breakpoint}px)`]:{fontSize:theme.typography.size.m1,lineHeight:"28px",marginBottom:24},color:transparentize(.25,theme.color.defaultText)})),DocsContent=styled.div(({theme})=>{let reset={fontFamily:theme.typography.fonts.base,fontSize:theme.typography.size.s3,margin:0,WebkitFontSmoothing:"antialiased",MozOsxFontSmoothing:"grayscale",WebkitTapHighlightColor:"rgba(0, 0, 0, 0)",WebkitOverflowScrolling:"touch"},headers={margin:"20px 0 8px",padding:0,cursor:"text",position:"relative",color:theme.color.defaultText,"&:first-of-type":{marginTop:0,paddingTop:0},"&:hover a.anchor":{textDecoration:"none"},"& code":{fontSize:"inherit"}},code={lineHeight:1,margin:"0 2px",padding:"3px 5px",whiteSpace:"nowrap",borderRadius:3,fontSize:theme.typography.size.s2-1,border:theme.base==="light"?`1px solid ${theme.color.mediumlight}`:`1px solid ${theme.color.darker}`,color:theme.base==="light"?transparentize(.1,theme.color.defaultText):transparentize(.3,theme.color.defaultText),backgroundColor:theme.base==="light"?theme.color.lighter:theme.color.border};return {maxWidth:1e3,width:"100%",[toGlobalSelector("a")]:{...reset,fontSize:"inherit",lineHeight:"2
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${darken(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${darken(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${lighten(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${lighten(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:6,width:"100%",height:6,cursor:disabled?"not-allowed":"pointer"},"&::-webkit-slider-thumb":{marginTop:"-6px",width:16,height:16,border:`1px solid ${rgba(theme.appBorderColor,.2)}`,borderRadius:"50px",boxShadow:`0 1px 3px 0px ${rgba(theme.appBorderColor,.2)}`,cursor:disabled?"not-allowed":"grab",appearance:"none",background:`${theme.input.background}`,transition:"all 150ms ease-out","&:hover":{background:`${darken(.05,theme.input.background)}`,transform:"scale3d(1.1, 1.1, 1.1) translateY(-1px)",transition:"all 50ms ease-out"},"&:active":{background:`${theme.input.background}`,transform:"scale3d(1, 1, 1) translateY(0px)",cursor:disabled?"not-allowed":"grab"}},"&:focus":{outline:"none","&::-webkit-slider-runnable-track":{borderColor:rgba(theme.color.secondary,.4)},"&::-webkit-slider-thumb":{borderColor:theme.color.secondary,boxShadow:`0 0px 5px 0px ${theme.color.secondary}`}},"&::-moz-range-track":{background:theme.base==="light"?`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${darken(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${darken(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${lighten(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${lighten(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,borderRadius:6,width:"100%",height:6,cursor:disabled?"not-allowed":"pointer",outline:"none"},"&::-moz-range-thumb":{width:16,height:16,border:`1px solid ${rgba(theme.appBorderColor,.2)}`,borderRadius:"50px",boxShadow:`0 1px 3px 0px ${rgba(theme.appBorderColor,.2)}`,cursor:disabled?"not-allowed":"grap",background:`${theme.input.background}`,transition:"all 150ms ease-out","&:hover":{background:`${darken(.05,theme.input.background)}`,transform:"scale3d(1.1, 1.1, 1.1) translateY(-1px)",transition:"all 50ms ease-out"},"&:active":{background:`${theme.input.background}`,transform:"scale3d(1, 1, 1) translateY(0px)",cursor:"grabbing"}},"&::-ms-track":{background:theme.base==="light"?`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${darken(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${darken(.02,theme.input.background)} 100%)`:`linear-gradient(to right,
|
||
|
|
+ ${theme.color.green} 0%, ${theme.color.green} ${(value2-min)/(max-min)*100}%,
|
||
|
|
+ ${lighten(.02,theme.input.background)} ${(value2-min)/(max-min)*100}%,
|
||
|
|
${lighten(.02,theme.input.background)} 100%)`,boxShadow:`${theme.appBorderColor} 0 0 0 1px inset`,color:"transparent",width:"100%",height:"6px",cursor:"pointer"},"&::-ms-fill-lower":{borderRadius:6},"&::-ms-fill-upper":{borderRadius:6},"&::-ms-thumb":{width:16,height:16,background:`${theme.input.background}`,border:`1px solid ${rgba(theme.appBorderColor,.2)}`,borderRadius:50,cursor:"grab",marginTop:0},"@supports (-ms-ime-align:auto)":{"input[type=range]":{margin:"0"}}})),RangeLabel=styled.span({paddingLeft:5,paddingRight:5,fontSize:12,whiteSpace:"nowrap",fontFeatureSettings:"tnum",fontVariantNumeric:"tabular-nums","[aria-readonly=true] &":{opacity:.5}}),RangeCurrentAndMaxLabel=styled(RangeLabel)(({numberOFDecimalsPlaces,max})=>({width:`${numberOFDecimalsPlaces+max.toString().length*2+3}ch`,textAlign:"right",flexShrink:0})),RangeWrapper=styled.div({display:"flex",alignItems:"center",width:"100%"});function getNumberOfDecimalPlaces(number){let match=number.toString().match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);return match?Math.max(0,(match[1]?match[1].length:0)-(match[2]?+match[2]:0)):0}var RangeControl=({name,value:value2,onChange,min=0,max=100,step=1,onBlur,onFocus,argType})=>{let handleChange=event=>{onChange(parse2(event.target.value));},hasValue=value2!==void 0,numberOFDecimalsPlaces=useMemo(()=>getNumberOfDecimalPlaces(step),[step]),readonly=!!argType?.table?.readonly;return React17.createElement(RangeWrapper,{"aria-readonly":readonly},React17.createElement(RangeLabel,null,min),React17.createElement(RangeInput,{id:getControlId(name),type:"range",disabled:readonly,onChange:handleChange,name,value:value2,min,max,step,onFocus,onBlur}),React17.createElement(RangeCurrentAndMaxLabel,{numberOFDecimalsPlaces,max},hasValue?value2.toFixed(numberOFDecimalsPlaces):"--"," / ",max))};var Wrapper7=styled.label({display:"flex"}),MaxLength=styled.div(({isMaxed})=>({marginLeft:"0.75rem",paddingTop:"0.35rem",color:isMaxed?"red":void 0})),TextControl=({name,value:value2,onChange,onFocus,onBlur,maxLength,argType})=>{let handleChange=event=>{onChange(event.target.value);},readonly=!!argType?.table?.readonly,[forceVisible,setForceVisible]=useState(!1),onForceVisible=useCallback(()=>{onChange(""),setForceVisible(!0);},[setForceVisible]);if(value2===void 0)return React17.createElement(Button,{variant:"outline",size:"medium",disabled:readonly,id:getControlSetterButtonId(name),onClick:onForceVisible},"Set string");let isValid=typeof value2=="string";return React17.createElement(Wrapper7,null,React17.createElement(Form.Textarea,{id:getControlId(name),maxLength,onChange:handleChange,disabled:readonly,size:"flex",placeholder:"Edit string...",autoFocus:forceVisible,valid:isValid?null:"error",name,value:isValid?value2:"",onFocus,onBlur}),maxLength&&React17.createElement(MaxLength,{isMaxed:value2?.length===maxLength},value2?.length??0," / ",maxLength))};var FileInput=styled(Form.Input)({padding:10});function revokeOldUrls(urls){urls.forEach(url=>{url.startsWith("blob:")&&URL.revokeObjectURL(url);});}var FilesControl=({onChange,name,accept="image/*",value:value2,argType})=>{let inputElement=useRef(null),readonly=argType?.control?.readOnly;function handleFileChange(e){if(!e.target.files)return;let fileUrls=Array.from(e.target.files).map(file=>URL.createObjectURL(file));onChange(fileUrls),revokeOldUrls(value2);}return useEffect(()=>{value2==null&&inputElement.current&&(inputElement.current.value=null);},[value2,name]),React17.createElement(FileInput,{ref:inputElement,id:getControlId(name),type:"file",name,multiple:!0,disabled:readonly,onChange:handleFileChange,accept,size:"flex"})};var LazyColorControl=lazy(()=>import('./Color-PRSJMWNM.mjs')),ColorControl=props=>React17.createElement(Suspense,{fallback:React17.createElement("div",null)},React17.createElement(LazyColorControl,{...props}));var Controls2={array:ObjectControl,object:ObjectControl,boolean:BooleanControl,color:ColorControl,date:DateControl,number:NumberControl,check:OptionsControl,"inline-check":OptionsControl,radio:OptionsControl,"inline-radio":OptionsControl,select:OptionsCont
|
||
|
|
This is often caused by not wrapping the child in a template string.
|
||
|
|
-
|
||
|
|
+
|
||
|
|
This is invalid:
|
||
|
|
<Markdown>
|
||
|
|
# Some heading
|
||
|
|
@@ -56,4 +56,4 @@ var Wrapper=styled.div(withReset,({theme})=>({backgroundColor:theme.base==="ligh
|
||
|
|
</Markdown>
|
||
|
|
`);return React17.createElement(Markdown,{...props,options:{forceBlock:!0,overrides:{code:CodeOrSourceMdx,a:AnchorMdx,...HeadersMdx,...props?.options?.overrides},...props?.options}})};var DescriptionType=(DescriptionType2=>(DescriptionType2.INFO="info",DescriptionType2.NOTES="notes",DescriptionType2.DOCGEN="docgen",DescriptionType2.AUTO="auto",DescriptionType2))(DescriptionType||{}),getDescriptionFromResolvedOf=resolvedOf=>{switch(resolvedOf.type){case"story":return resolvedOf.story.parameters.docs?.description?.story||null;case"meta":{let{parameters,component}=resolvedOf.preparedMeta,metaDescription=parameters.docs?.description?.component;return metaDescription||parameters.docs?.extractComponentDescription?.(component,{component,parameters})||null}case"component":{let{component,projectAnnotations:{parameters}}=resolvedOf;return parameters.docs?.extractComponentDescription?.(component,{component,parameters})||null}default:throw new Error(`Unrecognized module type resolved from 'useOf', got: ${resolvedOf.type}`)}},DescriptionContainer=props=>{let{of}=props;if("of"in props&&of===void 0)throw new Error("Unexpected `of={undefined}`, did you mistype a CSF file reference?");let resolvedOf=useOf(of||"meta"),markdown=getDescriptionFromResolvedOf(resolvedOf);return markdown?React17.createElement(Markdown2,null,markdown):null};var Wrapper10=styled.div(({theme})=>({width:"10rem","@media (max-width: 768px)":{display:"none"}})),Content=styled.div(({theme})=>({position:"fixed",bottom:0,top:0,width:"10rem",paddingTop:"4rem",paddingBottom:"2rem",overflowY:"auto",fontFamily:theme.typography.fonts.base,fontSize:theme.typography.size.s2,WebkitFontSmoothing:"antialiased",MozOsxFontSmoothing:"grayscale",WebkitTapHighlightColor:"rgba(0, 0, 0, 0)",WebkitOverflowScrolling:"touch","& *":{boxSizing:"border-box"},"& > .toc-wrapper > .toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`,".toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`,".toc-list":{paddingLeft:0,borderLeft:`solid 2px ${theme.color.mediumlight}`}}},"& .toc-list-item":{position:"relative",listStyleType:"none",marginLeft:20,paddingTop:3,paddingBottom:3},"& .toc-list-item::before":{content:'""',position:"absolute",height:"100%",top:0,left:0,transform:"translateX(calc(-2px - 20px))",borderLeft:`solid 2px ${theme.color.mediumdark}`,opacity:0,transition:"opacity 0.2s"},"& .toc-list-item.is-active-li::before":{opacity:1},"& .toc-list-item > a":{color:theme.color.defaultText,textDecoration:"none"},"& .toc-list-item.is-active-li > a":{fontWeight:600,color:theme.color.secondary,textDecoration:"none"}})),Heading=styled.p(({theme})=>({fontWeight:600,fontSize:"0.875em",color:theme.textColor,textTransform:"uppercase",marginBottom:10})),OptionalTitle=({title})=>title===null?null:typeof title=="string"?React17.createElement(Heading,null,title):title,TableOfContents=({title,disable,headingSelector,contentsSelector,ignoreSelector,unsafeTocbotOptions})=>(useEffect(()=>{let configuration={tocSelector:".toc-wrapper",contentSelector:contentsSelector??".sbdocs-content",headingSelector:headingSelector??"h3",ignoreSelector:ignoreSelector??".docs-story *, .skip-toc",headingsOffset:40,scrollSmoothOffset:-40,orderedList:!1,onClick:()=>!1,...unsafeTocbotOptions},timeout=setTimeout(()=>tocbot.init(configuration),100);return ()=>{clearTimeout(timeout),tocbot.destroy();}},[disable]),React17.createElement(React17.Fragment,null,React17.createElement(Wrapper10,null,disable?null:React17.createElement(Content,null,React17.createElement(OptionalTitle,{title:title||null}),React17.createElement("div",{className:"toc-wrapper"})))));var {document:document3,window:globalWindow3}=global,DocsContainer=({context,theme,children})=>{let toc;try{toc=context.resolveOf("meta",["meta"]).preparedMeta.parameters?.docs?.toc;}catch{toc=context?.projectAnnotations?.parameters?.docs?.toc;}return useEffect(()=>{let url;try{if(url=new URL(globalWindow3.parent.location.toString()),url.hash){let element=document3.getElementById(url.hash.substring(1));element&&setTimeout(()=>{scrollToElem
|
||
|
|
|
||
|
|
-export { AddContext, Anchor, AnchorMdx, ArgTypes, BooleanControl, Canvas, CodeOrSourceMdx, ColorControl, ColorItem, ColorPalette, Controls3 as Controls, DateControl, DescriptionContainer as Description, DescriptionType, Docs, DocsContainer, DocsContext, DocsPage, DocsStory, ExternalDocs, ExternalDocsContainer, FilesControl, HeaderMdx, HeadersMdx, Heading2 as Heading, IconGallery, IconItem, Markdown2 as Markdown, Meta, NumberControl, ObjectControl, OptionsControl, PRIMARY_STORY, Primary, ArgsTable as PureArgsTable, RangeControl, Source2 as Source, SourceContainer, SourceContext, Stories, Story2 as Story, Subheading, Subtitle2 as Subtitle, TextControl, Title2 as Title, Typeset, UNKNOWN_ARGS_HASH, Unstyled, Wrapper11 as Wrapper, anchorBlockIdFromId, argsHash, assertIsFn, extractTitle, format, formatDate, formatTime, getStoryId2 as getStoryId, getStoryProps, parse2 as parse, parseDate, parseTime, useOf, useSourceProps };
|
||
|
|
+export { AddContext, Anchor, AnchorMdx, ArgTypes, BooleanControl, Canvas, CodeOrSourceMdx, ColorControl, ColorItem, ColorPalette, Controls3 as Controls, DateControl, DescriptionContainer as Description, DescriptionType, Docs, DocsContainer, DocsContext, DocsPage, DocsStory, ExternalDocs, ExternalDocsContainer, FilesControl, HeaderMdx, HeadersMdx, Heading2 as Heading, IconGallery, IconItem, Markdown2 as Markdown, Meta, NumberControl, ObjectControl, OptionsControl, PRIMARY_STORY, Preview, Primary, ArgsTable as PureArgsTable, RangeControl, Source2 as Source, SourceContainer, SourceContext, Stories, Story2 as Story, Subheading, Subtitle2 as Subtitle, TextControl, Title2 as Title, Typeset, UNKNOWN_ARGS_HASH, Unstyled, Wrapper11 as Wrapper, anchorBlockIdFromId, argsHash, assertIsFn, extractTitle, format, formatDate, formatTime, getStoryId2 as getStoryId, getStoryProps, parse2 as parse, parseDate, parseTime, useOf, useSourceProps };
|