Package Exports

@table-library/react-table-library

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@table-library/react-table-library) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React Table Library

Live TODO

Requirements

Installation & Usage

Project Setup:

create-react-app my-app
cd my-app
touch .npmrc

Copy the content of this proejct's .npmrc.azure file to your project's .npmrc and enter your credentials (password etc.) in this file for the placeholders.

Then on command line:

npm install @table-library/react-table-library

In your global CSS:

html {
  font-size: 1px;
}

body {
  font-size: 14rem;
}

And last but not least, in one of your React components:

import React from 'react';

import { Atoms } from '@table-library/react-table-library';

const { ContentButtonPrimary } = Atoms;

const App = () => {
  return (
    <div>
      <ContentButtonPrimary label="Click me" />
    </div>
  );
};

export default App;

You are ready to go.

Relative Imports

Keep the bundle size small with relative imports:

// imports the whole library
import { Atoms } from '@table-library/react-table-library';

// imports all Atoms from the library
import { ContentButtonPrimary } from '@table-library/react-table-library/lib/Atoms';

// imports only the component and its dependencies
import ContentButtonPrimary from '@table-library/react-table-library/lib/ContentButtonPrimary';

// same goes for icons
// which is why its better to import them directly
// instead of importing all icons at once
import IconCockpit from '@table-library/react-table-library/lib/IconCockpit';

Contribution to Library

Setup:

git@github.com:table-library/react-table-library.git
follow ".npmrc"
npm install
follow "Docker" for Screenshot Testing

.npmrc

Docker

MacOS Setup / Windows Setup (TODO someone else needs to provide a working link here)
Docker Cheatsheet

Scripts

Run Storybook:

npm run storybook:dev

Build Storybook:

npm run storybook:build
npx http-server dist/

Build Library:

npm run library:build

Run Tests:

Run Once: npm test
Watch: npm run test:watch
Run Screenshot Tests with Docker: make loki:test
Update Screenshot Tests with Docker: make loki:update