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

<Meta title='@dxtmisha/vi/scripts/Classes/StylesClasses - Trình tạo Class cơ sở'/>

# Lớp StylesClasses

Lớp `StylesClasses` chịu trách nhiệm tạo các lớp CSS cơ sở từ các thuộc tính thiết kế. Nó lọc danh sách thuộc tính cho các danh mục như `class` và `theme` và tạo ra các cấu trúc lớp riêng lẻ.

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

- **Lọc theo danh mục** — Nhắm mục tiêu cụ thể vào các thuộc tính được phân loại là `class` hoặc `theme`.
- **Tạo Class động** — Tạo một từ điển các khối SCSS, trong đó mỗi khóa là tên lớp.
- **Điều phối phụ thuộc** — Sử dụng `StylesProperties` để tạo các quy tắc kiểu nội bộ (thuộc tính, mixin, v.v.) cho mỗi lớp.
- **Quản lý Import** — Tự động bao gồm các chỉ thị SCSS `@use` cần thiết để liên kết các tệp lớp được tạo.

## Khởi tạo

Để khởi tạo đối tượng, hãy gọi hàm khởi tạo `StylesClasses(items)`.

**Tham số:**
- `items: PropertiesItems` — một đối tượng để làm việc với danh sách các thuộc tính thiết kế.

```typescript
import { StylesClasses, PropertiesItems } from '@dxtmisha/scripts'

// 1. Khởi tạo PropertiesItems
const items = new PropertiesItems(designData)

// 2. Khởi tạo StylesClasses
const generator = new StylesClasses(items)
```

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

### Điều khiển

- `init(): StylesClassesItem` — Điểm bắt đầu chính. Xử lý danh sách thuộc tính và trả về một đối tượng chứa danh sách các import cần thiết và nội dung lớp được tạo.

## Các kiểu dữ liệu

### StylesClassesItem

- `data: string[]` — Một mảng các câu lệnh SCSS `@use` cho các tệp lớp được tạo.
- `classes: Record<string, string[]>` — Một từ điển trong đó mỗi khóa là tên lớp và giá trị là một mảng các chuỗi đại diện cho nội dung SCSS của lớp đó.
