https://github.com/b2bfinance/tablo
Display a list of products.
https://github.com/b2bfinance/tablo
comparison-tool products react
Last synced: 3 months ago
JSON representation
Display a list of products.
- Host: GitHub
- URL: https://github.com/b2bfinance/tablo
- Owner: b2bfinance
- Created: 2017-10-25T09:28:24.000Z (over 8 years ago)
- Default Branch: main
- Last Pushed: 2023-07-11T11:38:47.000Z (about 3 years ago)
- Last Synced: 2025-11-07T11:29:37.981Z (9 months ago)
- Topics: comparison-tool, products, react
- Language: TypeScript
- Homepage: https://b2bfinance.github.io/tablo
- Size: 5.45 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
README
# Tablo
[![npm package][npm-badge]][npm]
Display a list of products.
## Installation
```sh
// with npm
npm install @b2bfinance/tablo
// with yarn
yarn add @b2bfinance/tablo
```
## Usage
```jsx
import React from "react";
import ReactDOM from "react-dom";
import { EmbedWrapper } from "@b2bfinance/tablo";
function App() {
const noOp = () => {};
return (
);
}
ReactDOM.render(
,
document.querySelector("#element-to-render-products-into")
);
```
### Theme Options
You can use [style overrides](https://mui.com/material-ui/customization/theme-components/#theme-style-overrides) from mui. Tablo named components are as follows:
```
TabloProductHeadingRow
TabloProductWrapper
TabloProductList
TabloProductListEmpty
TabloProductColumns
TabloProductFeaturePoint
TabloProductMoreInfoHeader
TabloProductMoreInfoBody
TabloProductMoreInfoFooter
```
[npm-badge]: https://img.shields.io/npm/v/@b2bfinance/tablo.png?style=flat-square
[npm]: https://www.npmjs.org/package/@b2bfinance/tablo