Vue Common Types - AIIntegration

A class that activates AI services in DevExpress UI components.

import { AIIntegration } from "devextreme/common/ai-integration"

This object's constructor accepts an AIProvider object that specifies AI service settings. Pass the created AIIntegration object to components where you want to activate AI capabilities.

jQuery

You need to link AIIntegration source.

index.js
index.html
const aiIntegration = new DevExpress.aiIntegration(provider);

$("#htmlEditor").dxHtmlEditor({
    // ...
    aiIntegration,
});
<head>
    <!-- ... -->
    <script type="text/javascript" src="../artifacts/js/dx.ai-integration.js" charset="utf-8"></script>
    <!-- or if using CDN -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/devextreme-dist/25.1.3/js/dx.ai-integration.js"></script>
</head>
Angular
app.component.ts
app.component.html
import { AIIntegration } from 'devextreme-angular/common/ai-integration';
// ...
export class AppComponent {
    aiIntegration = new AIIntegration(provider);
}
<dx-html-editor [aiIntegration]="aiIntegration"></dx-html-editor>
Vue
App.vue
<template>
    <DxHtmlEditor :ai-integration="aiIntegration" />
</template>

<script setup lang="ts">
import { AIIntegration } from 'devextreme-vue/common/ai-integration';
const aiIntegration = new AIIntegration(provider);
</script>
React
App.tsx
import { AIIntegration } from 'devextreme-react/common/ai-integration';
const aiIntegration = new AIIntegration(provider);

const App = () => {
    return (
        <HtmlEditor aiIntegration={aiIntegration} />
    );
}