import {Meta} from '@storybook/addon-docs/blocks'

<Meta title='@dxtmisha/vi/scripts/Classes/LibraryAiWiki - Trình tạo AI Wiki'/>

# Lớp LibraryAiWiki

Lớp `LibraryAiWiki` chịu trách nhiệm tạo ra các tệp cần thiết để hiển thị danh sách các thành phần UI trong AI Wiki. Nó xác định các thành phần có triển khai AI Wiki và tạo ra cả tệp dữ liệu thư viện và thành phần Vue để hiển thị chúng.

## Các tính năng chính

- **Khám phá thành phần**: Quét qua các mục trong thư viện để tìm các thành phần có tệp `*AiWiki.vue`.
- **Tạo thư viện**: Tạo tệp `wiki.ts` chứa các lệnh nhập và danh sách tất cả các thành phần AI Wiki đã xác định.
- **Tích hợp UI**: Tạo thành phần `AiWiki.vue` sử dụng danh sách đã tạo để hiển thị danh sách neo (anchor) và bản thân các thành phần đó.

## Khởi tạo

Khởi tạo `LibraryAiWiki` bằng cách cung cấp một thực thể `LibraryItems`.

**Tham số:**
- `items: LibraryItems` — một đối tượng để làm việc với danh sách các thành phần và cung cấp chức năng ghi tệp.

```typescript
import { LibraryItems, LibraryAiWiki } from '@dxtmisha/scripts'

const items = new LibraryItems()
const aiWiki = new LibraryAiWiki(items)

// Kích hoạt quá trình tạo
aiWiki.make()
```

## Các phương thức

### Tạo dữ liệu

- `make(): void` — điểm nhập chính kích hoạt quá trình tạo. Nó điều phối việc tạo tệp danh sách thành phần và bản thân thành phần UI.

## Ví dụ

### Ví dụ tệp dữ liệu được tạo (`ai-list.wiki.ts`)
```typescript
// This file is generated by a script, do not edit.
import DxtButton from '../../components/DxtButton/DxtButtonAiWiki.vue'
import DxtInput from '../../components/DxtInput/DxtInputAiWiki.vue'

export const aiList: any[] = [
  DxtButton,
  DxtInput
]
```

### Ví dụ thành phần Vue được tạo (`AiWiki.vue`)
```vue
<script setup lang="ts">
import { DxtTestPage, DxtTestWikiAnchor } from '@dxtmisha/test'
import { aiList } from '../library/ai-list.wiki'

defineOptions({
  name: 'AiWiki'
})
</script>

<template>
  <DxtTestPage title="..." description="...">
    <DxtTestWikiAnchor :list="aiList"/>
    <component v-for="(item, key) in aiList" :is="item" :key="key"/>
  </DxtTestPage>
</template>
```
