@vcnkit/core

VCNKit Core UI Components

Usage no npm install needed!

<script type="module">
  import vcnkitCore from 'https://cdn.skypack.dev/@vcnkit/core';
</script>

README

VCNKit/Core

Core UI components for VCNKit.

Installation

NPM

npm install @vcnkit/core

Yarn

yarn add @vcnkit/core

Usage

ThemeProvider

import { ThemeProvider } from '@vcnkit/core';

const App = () => (
    <ThemeProvider
        theme={ themeOverrides }
    >
        <YourApp />
    </ThemeProvider>
);

Button

import * as Button from '@vcnkit/core/Button';

const Component = () => (
    <Button.Primary
        onClick={ handleClick }
    >
        Save
    </Button.Primary>
);

ActionBar

import ActionBar from '@vcnkit/core/ActionBar';
import * as Button from '@vcnkit/core/Button';

const Component = () => (
    <ActionBar>
        <Button.Primary>Button 1</Button.Primary>
        <Button.Primary>Button 2</Button.Primary>
    </ActionBar>
);

Icons

import { Info, Flask } from '@vcnkit/core/Icons';

const Component = () => (
    <>
        <Info />
        <Flash />
    </>
);

MessageBar

import * as MessageBar from '@vcnkit/core/MessageBar';

const Component = () => (
    <MessageBar.Info>
        You are now using the MessageBar component.
    </MessageBar.Info>
);

Storybook

yarn install && yarn storybook