Skip to content

Creatiwity/CreatDataTable

Repository files navigation

Creat Datatable

npm version npm downloads License Nuxt

⚠️ This package is under development stay tuned. ⚠️

Nuxt3 Typescript Simple Datatable that handles dynamic row content with generic typing

Features

  •  Table
  •  Generic typing
  •  Dynamic row content

Quick Setup

  1. Add @creatiwity/datatable dependency to your project
# Using pnpm
pnpm add @creatiwity/datatable

# Using yarn
yarn add @creatiwity/datatable

# Using npm
npm install @creatiwity/datatable
  1. Add @creatiwity/datatable to the modules section of nuxt.config.ts
export default defineNuxtConfig({
  modules: ["@creatiwity/datatable"],
});

That's it! You can now use Creat Datatable in your Nuxt app ✨

Usage

const dataTableInfos = {
  headers: [
    {
      id: "name",
      label: "Nom",
    },
  ],
  data: [{ name: "Toto" }, { name: "Tata" }],
};
<CreatDatable id="creat-datatable" :infos="dataTableInfos">
  <template #name="category">
    <strong>{{ category.data.name }}</strong>
  </template>
</CreatDatable>