Neo UI

Description

This is a React UI components library.

Getting Started

Prerequisites

• NPM
• React

Installing

A step by step guide to help you get started with Neo-UI for react

Firstly, run

npm install @bettbrian08/neo-ui-react

In your root React Component, import this to have the default CSS stylings for Neo-UI

import "@bettbrian08/neo-ui-react/dist/themes/default";

Here is an example for how to use a UI component

export default class BaseComponent extends Component {
    state = {
        neoComponents: {}
    }

    // This is used to mimic an asynchronous call demonstrating how the button updates its
    // state
    delay = () => new Promise(resolve => setTimeout(() => resolve(), 2000));

    onClick = () => {
        const { neoComponents } = this.state;
        neoComponents['saveButton'].setStatus('loading');
        this.delay().then(() => {
            neoComponents['saveButton'].setStatus('success');
        });
    }

    render() {
        return (
            <Button
                name="saveButton"
                parent={this}
                config={{
                    label: "Save",
                    action: this.onClick
                }}
            />
        )
    }
}

For more examples, visit the storybook documentation

Built With

• React - The javascript framework for frontend development
• Storybook - The UI components development environment

Contributing

Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.

Versioning

We use SemVer for versioning. For the versions available, see the tags on this repository.

Authors

• Brian K. Bett - Initial work

See also the list of contributors who participated in this project.

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Credit

Created by @bettblake08.