@vtable-guild/vtable-guild
v2.3.0
Published
A highly customizable Vue 3 Table component library powered by tailwind-variants
Downloads
501
Maintainers
Readme
@vtable-guild/vtable-guild
Single public package for vtable-guild. Install one package, import one runtime entry, and use one CSS entry.
Installation
pnpm add @vtable-guild/vtable-guildQuick Start
vtable-guild supports three CSS modes.
prebuilt
Use the prebuilt CSS entry when the host app does not use Tailwind CSS:
import { createVTableGuild } from '@vtable-guild/vtable-guild'
import '@vtable-guild/vtable-guild/css/style'
const app = createApp(App)
app.use(createVTableGuild())This works without installing Tailwind CSS or configuring @tailwindcss/vite. Internal utility
classes are emitted with the vtg- prefix. If you need to override an internal utility in ui or
theme, use the same prefix, for example vtg-px-2.
tailwind3
Use the Tailwind 3 CSS entry, add @vtable-guild/vtable-guild/tailwind3-preset to presets, scan
node_modules/@vtable-guild, and enable cssMode: 'tailwind3'.
tailwind4
Use the Tailwind 4 CSS entry and runtime mode:
import '@vtable-guild/vtable-guild/css/tailwind4'
app.use(createVTableGuild({ cssMode: 'tailwind4' }))<template>
<VTable :columns="columns" :data-source="data" />
</template>Documentation
See the full documentation.
License
MIT
