@crave/farmblocks-empty-state

Empty State

A placeholder to use on screens without content.

Design specs

Neutral Empty State Customized Empty State In Section - Empty States

Usage

import React from 'react';
import { render } from 'react-dom';

import EmptyState from '@crave/farmblocks-empty-state';

const text =
  "Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Etiam porta sem malesuada magna mollis euismod.";
const imgSrc =
  "https://sourcewhatsgood.com/assets/images/utility_images/gallery-third-about-a518a29f64.jpg";

const App = () => (
  <EmptyState
    imageSrc={imgSrc}
    title="Empty State Title"
    description={text}
    primaryButtonLabel="Primary Action"
    onPrimaryButtonClick={action("clicked")}
    info={text}
  />
);

render(<App />, document.getElementById('root'));

API

Text properties: title(required), description, info Button: primaryButtonLabel, onPrimaryButtonClick Thumbnail: imageSrc

License

MIT