@procore/labs-comments
A component to render comments, with avatar
$ cnpm install @procore/labs-comments 
SYNC missed versions from official npm registry.

Comments

The description.

Installation

yarn add @procore/labs-comments

Usage

import * as Comments from '@procore/labs-comments';

const MyComments = () => {
    const today = new Date();
    const comments = [
        {
            author: 'Evan Freymiller',
            title: 'Software Engineer',
            date: today.toString(),
            body: "This is good news, let's try to get the deal in by Friday.",
        },
        {
            author: 'Evan Freymiller',
            title: 'Software Engineer',
            date: today.toString(),
            body: "Sound good, I'll reach out today.",
        },
        {
            author: 'Evan Freymiller',
            title: 'Software Engineer',
            date: today.toString(),
            body: 'Please let me know by the close of business.',
        },
    ];
    return comments.map((comment, index) => (
        <Comment.Container border={index !== 0}>
            <Comment.Header>
                <Comment.Avatar>{comment.author}</Comment.Avatar>
                <Comment.Author date={comment.date}>
                    <Comment.AuthorName>{comment.author}</Comment.AuthorName>
                    <Comment.AuthorJobTitle>{comment.title}</Comment.AuthorJobTitle>
                </Comment.Author>
            </Comment.Header>
            <Comment.Body>{comment.body}</Comment.Body>
        </Comment.Container>
    ));
}

Components


<Container \/>

props type
children reactNode
border boolean

<Body \/>

props type
children reactNode

<Header \/>

props type
children reactNode

<Author \/>

props type
date Date or string
children reactNode

<AuthorName \/>

props type
children reactNode

<AuthorJobTitle \/>

props type
children reactNode

<AuthorDate \/>

props type
children reactNode

<Avatar \/>

props type
children string
url string

<Actions \/>

props type
children array of Action[]
disabled boolean
onSelect function

<Action \/>

props type
onClick function
key string

<Attachment \/>

props type
fileUrl string
fileName string

Dependencies

@procore/core-react and react are listed as external peer dependencies. The package will not bundle the code, and requires the app client to provide it as a dependency. The external peer dep is to assure React Context is consistent in a client's React tree, the child consumers can reference the correct parent provider. If the package uses latest features or bug fixes and a new minimum version of core-react is required, it should be considered a breaking change as the peer dependency version must be met.

Current Tags

  • 0.1.1                                ...           latest (2 months ago)

3 Versions

  • 0.1.0-alpha.1                                ...           2 months ago
  • 0.1.1                                ...           2 months ago
  • 0.1.1-alpha.1                                ...           2 months ago

Copyright 2014 - 2016 © taobao.org |