Installation

Choose a framework from the header. The requirements, package name, and imports below follow that selection.

Requirements

Destyler UI for Vue requires vue >=3.5.0.

Destyler UI for React requires react and react-dom >=18.0.0.

Destyler UI for Solid requires solid-js >=1.8.0 <2.0.0.

Destyler UI for Svelte requires svelte >=5.29.0.

Install the package

pnpm add @destyler-ui/vue vue

pnpm add @destyler-ui/react react react-dom

pnpm add @destyler-ui/solid solid-js

pnpm add @destyler-ui/svelte svelte

Use the equivalent npm install, yarn add, or bun add command when your project uses another package manager.

Import components

<script setup lang="ts">
import { Avatar, Toggle } from '@destyler-ui/vue'
</script>

Vue components and providers are exported from the package root.

import { Avatar, Toggle } from '@destyler-ui/react'

React components and providers are exported from the package root.

import { Avatar, Toggle } from '@destyler-ui/solid'

Solid components and providers are exported from the package root.

<script lang="ts">
  import { Avatar, Toggle } from '@destyler-ui/svelte'
</script>

Svelte components and providers are available from the package root and from direct entries such as @destyler-ui/svelte/avatar.

No stylesheet is required. Destyler UI provides behavior, accessibility attributes, and component state while leaving the visual design to your CSS or styling system.