@billogram/example-app-components NPM

@billogram/example-app-components

React components that should be used in example apps

Install

yarn add @billogram/example-app-components

Usage

import {
    ComponentValueState,
    ExampleApp,
    ExampleAppSection,
    ExampleComponent,
    ExampleComponentGroup,
    ExampleComponentGroupSection,
    useCopy,
} from '@billogram/example-app-components';

`ComponentValueState`

<ComponentValueState
    onChange={ noop }>
    { (props) => (
        
    ) }
</ComponentValueState>

`ExampleApp`

Represents an <h1> tag. Most example apps should use this component.

<ExampleApp
    note={ null }
    title={ }>
    ...
</ExampleApp>

`ExampleAppSection`

Represents an <h2> tag. Most example apps should use this component.

<ExampleAppSection
    title={ }>
    ...
</ExampleAppSection>

`ExampleComponentGroupSection`

Represents an <h3> tag. This component is typically optional. It should primarily be used to represent different UI states of a React component.

<ExampleComponentGroupSection
    title={ }>
    ...
</ExampleComponentGroupSection>

`ExampleComponentGroup`

Represents a group of React component states. This component can either have a transparent or a gray background.

<ExampleComponentGroup
    ui="transparent">
    ...
</ExampleComponentGroup>

`ExampleComponent`

Represents a React component state.

<ExampleComponent
    description={ null }
    ui="transparent">
    ...
</ExampleComponent>

Note

This library is being published with our use cases in mind and is not necessarily meant to be consumed by the broader public. We probably won't take your feature requests unless they align with our own needs.