Editor

CSEditor

Редактор форматированного текста с настраиваемой панелью инструментов через CSEditorToolbar.

Предпросмотр

Интерактивный компонент

Использование

Vue · публичный API CS UI Kit

<script setup lang="ts">
import { ref } from 'vue'
import { CSEditor } from '@cassoft-support/cs-platform-ui-kit/editor'
import { CSEditorToolbar } from '@cassoft-support/cs-platform-ui-kit/editor-toolbar'

const content = ref('<p>Введите текст...</p>')
const items = [[
  { kind: 'mark', mark: 'bold', icon: 'i-lucide-bold' },
  { kind: 'mark', mark: 'italic', icon: 'i-lucide-italic' },
]]
</script>

<template>
  <CSEditor v-model="content" content-type="html">
    <template #default="{ editor }">
      <CSEditorToolbar v-if="editor" :editor="editor" :items="items" />
    </template>
  </CSEditor>
</template>

Пример использует компонент библиотеки. Подключите Nuxt-модуль `@cassoft-support/cs-platform-ui-kit/nuxt` или импортируйте компонент из публичного package entry.