diff --git a/viz-lib/CHANGELOG.md b/viz-lib/CHANGELOG.md
new file mode 100644
index 0000000000..e468b426f2
--- /dev/null
+++ b/viz-lib/CHANGELOG.md
@@ -0,0 +1,5 @@
+# Change Log
+
+## v0.1.0 - 2020-05-05
+
+- Created the library from Redash codebase
diff --git a/viz-lib/README.md b/viz-lib/README.md
index 2e4cce905a..e1e0742d95 100644
--- a/viz-lib/README.md
+++ b/viz-lib/README.md
@@ -26,6 +26,8 @@ yarn add @redash/viz
## Usage
+### Basic Usage
+
You can check [our live example](https://codesandbox.io/s/redashviz-v9odv) or follow the code below:
```jsx
@@ -85,6 +87,100 @@ function Example() {
- Table: `TABLE`
- Word Cloud: `WORD_CLOUD`
+### Column Types
+
+Types used for the `columns` property in the `data` object. Currently used to determine the default column view for the Table Visualization. This field is not mandatory and can receive a `null` value.
+
+Example:
+
+```js
+const data = {
+ columns: [
+ { type: "string", name: "Country" },
+ { type: "float", name: "Amount" },
+ ],
+ rows: [],
+};
+```
+
+Available types:
+
+- `integer`
+- `float`
+- `boolean`
+- `string`
+- `datetime`
+- `date`
+
+### Customizable Settings
+
+| Option | Description | Type | Default |
+| -------------------------- | ----------------------------------------------------------------------------------------------- | -------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| dateFormat | Date Format | `string` | `"DD/MM/YYYY"` |
+| dateTimeFormat | DateTime Format | `string` | `"DD/MM/YYYY HH:mm"` |
+| integerFormat | Integer Format | `string` | `"0,0"` |
+| floatFormat | Float Format | `string` | `"0,0.00"` |
+| booleanValues | Boolean names | `Array [string, string]` (correspond to false and true values) | `["false", "true"]` |
+| tableCellMaxJSONSize | Max json size that will be parsed and rendered in a Table Cell | `integer` | `50000` |
+| allowCustomJSVisualization | Whether to allow the `Custom` chart type | `boolean` | `false` |
+| hidePlotlyModeBar | Whether to hide the Plotly Mode Bar on charts | `boolean` | `false` |
+| choroplethAvailableMaps | Configure the JSONs used for Choropleth maps (Note: Choropleth won't work without this setting) | `Object` (see example below) | `{}` |
+| HelpTriggerComponent | Component used to render helper links on the Editor | React component with `title` and `href` props | Renders a [tooltip with a link](https://github.com/getredash/redash/blob/fc246aafc445bdfc3ad2b82560141ef51f8753a9/viz-lib/src/visualizations/visualizationsSettings.js#L6-L33) |
+
+Example:
+
+```jsx
+import React from "react";
+import { Renderer, Editor, updateVisualizationsSettings } from "@redash/viz";
+
+import countriesDataUrl from "@redash/viz/lib/visualizations/choropleth/maps/countries.geo.json";
+import subdivJapanDataUrl from "@redash/viz/lib/visualizations/choropleth/maps/japan.prefectures.geo.json";
+
+function wrapComponentWithSettings(WrappedComponent) {
+ return function VisualizationComponent(props) {
+ updateVisualizationsSettings({
+ choroplethAvailableMaps: {
+ countries: {
+ name: "Countries",
+ url: countriesDataUrl,
+ },
+ subdiv_japan: {
+ name: "Japan/Prefectures",
+ url: subdivJapanDataUrl,
+ },
+ },
+ dateFormat: "YYYY/MM/DD",
+ booleanValues: ["False", "True"],
+ hidePlotlyModeBar: true,
+ });
+
+ return ;
+ };
+}
+
+export const ConfiguredRenderer = wrapComponentWithSettings(Renderer);
+export const ConfiguredEditor = wrapComponentWithSettings(Editor);
+```
+
+### Specific File Imports
+
+There is a transpiled only build aimed for specific file imports.
+
+**Note:** Currently requires Less.
+
+Usage:
+
+```jsx
+import React from "react";
+import JsonViewInteractive from "@redash/viz/lib/components/json-view-interactive/JsonViewInteractive";
+
+const example = { list: ["value1", "value2", "value3"], obj: { prop: "value" } };
+
+export default function App() {
+ return ;
+}
+```
+
## License
BSD-2-Clause.