A next-generation tool to create blazing-fast documentation sites
API
created:3/17/2020
,
updated:2/17/2021

ComponentSource

@component-controls/blocks
2.11.3

Displays import statement for a component as well as the component file source code Optionally also displays some repository information from the component's package.json

import { ComponentSource } from '@component-controls/blocks';

Overview

import ArrowButton from '@component-controls/blocks';

Name
Description
Default
- (3 properties)
onSelect

callback to be called when the tab changes if the function returns false, it can stop chabging to the new tab

(((name: string, component: Component) => boolean | void) & ((event: SyntheticEvent<HTMLDivElement, Event>) => void))
-
ref
((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null
-
visibility

by default will show both controls and props tables user setting can display only props table or only controls

allcontrolsinfo
-
SpaceProps (28 properties)
HTMLAttributes (42 properties)
BlockContainerOwnProps (6 properties)
Attributes (2 properties)
AriaAttributes (48 properties)
DOMAttributes (160 properties)
BoxOwnProps (3 properties)
BackgroundColorProps (2 properties)
OpacityProps (1 properties)
ComponentInputProps (2 properties)
ActionContainerProps (1 properties)
SyntaxHighlighterProps (5 properties)

package
imports
peer
SourceProps
react
^17.0.1
ReactFC
*

file
imports
"../BlockContainer/components/ComponentsBlockContainer"
ComponentsBlockContainerComponentsBlockContainerProps
"./BaseComponentSource"
BaseComponentSource

Stories

Theme

import { Button } from '../../components/button-named-arrow-func';

Title

import ArrowButton from '@component-controls/blocks';

Custom Title

import ArrowButton from '@component-controls/blocks';

Not Collapsible

import ArrowButton from '@component-controls/blocks';

No Component

import ArrowButton from '@component-controls/blocks';