@npm-questionpro/wick-ui-editor
v0.14.1
Published
Wick Editor is a powerful and intuitive content editing component built with React. It provides a rich set of features for creating and managing content, making it ideal for applications that require dynamic and interactive content creation.
Maintainers
Readme
@npm-questionpro/wick-ui-editor
A rich text editor component built with React and TipTap. Part of the Wick UI design system.
Installation
# npm
npm install @npm-questionpro/wick-ui-editor
# pnpm
pnpm add @npm-questionpro/wick-ui-editor
# yarn
yarn add @npm-questionpro/wick-ui-editorUsage
CSS is automatically imported when you import the component.
import {WuContentEditor} from '@npm-questionpro/wick-ui-editor'
function App() {
return (
<WuContentEditor
defaultValue="<p>Start typing...</p>"
onUpdate={html => console.log(html)}
/>
)
}Props
| Prop | Type | Default | Description |
| ----------------------- | ------------------------ | ----------- | ------------------------------------- |
| defaultValue | string | undefined | Initial HTML content (auto-sanitized) |
| onUpdate | (html: string) => void | undefined | Fires when content changes |
| readonly | boolean | false | Disable editing |
| renderHtml | boolean | false | Render raw HTML in read-only mode |
| toolbarPosition | 'top' \| 'bottom' | 'top' | Toolbar placement |
| toolbarItems | IToolbarExtensionKey[] | all | Toolbar buttons to show |
| hideToolbar | boolean | false | Hide the toolbar |
| customFonts | string[] | undefined | Extra font families in font picker |
| customToolbarChildren | ReactNode | undefined | Custom elements appended to toolbar |
| className | string | undefined | Class on the root container |
Documentation
Full documentation and interactive examples: wick-ui-lib.pages.dev
License
ISC © QuestionPro
