README
Aha Design System - React
Collection of React Components for building web applications.
Explore Aha docs »
Report bug
·
Request feature
Status
Quick start
Installation
You have to install both @ahaui/react
and @ahaui/css
# With npm
npm install @ahaui/react @ahaui/css
# Or with yarn
yarn add @ahaui/react @ahaui/css
Usage
import '@ahaui/css/dist/index.min.css';
import React from 'react';
import { Button } from '@ahaui/react';
function Example() {
const onButtonClick = () => {
alert('Aha!');
};
return (
<Button
onClick={onButtonClick}
>
Click me!
</Button>
);
}
Aha! Just simple as that!
Customization
Plugins
You can customize specific Aha React Components via plugins!
For now, to provide your custom assets to Logo, Avatar, EmptyState, you can use AssetPlugin.
import { AssetPlugin, Plugins, Logo } from '@ahaui/react';
const LogoAssetsPlugin = new AssetPlugin({
prefix: 'logo',
assets: {
mylogo: require('./assets/images/logo/my-logo.svg').default,
foobar: 'https://foo.bar/image.jpg',
}
});
Plugins.loadPlugin(LogoAssetsPlugin);
function Example() {
return (
<Logo name="mylogo" />
);
}
Various types of plugin will be developed in the future, stay tune!
Plugins could also be published standalone as a npm package (follow the template here).
Custom CSS
Further instruction could be found in here.
Copyright and License
Code and documentation copyright 2020 the Got It, Inc. Code released under the Apache-2.0 License.