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

<Meta title='@dxtmisha/vi/scripts/Classes/PropertiesValues - Giá trị thuộc tính'/>

# Lớp PropertiesValues

Lớp `PropertiesValues` cung cấp các phương thức hỗ trợ để xác thực và chuẩn hóa các giá trị thuộc tính (token). Nó chịu trách nhiệm nhận dạng các định dạng dữ liệu (màu sắc, giá trị đầy đủ) và đưa chúng về một tiêu chuẩn thống nhất trước khi sử dụng trong việc tạo kiểu.

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

- **Nhận dạng điểm đánh dấu** — xác định các giá trị được đánh dấu là "đầy đủ" (không yêu cầu xử lý thêm).
- **Xác thực màu sắc** — kiểm tra các chuỗi theo định dạng HEX (bao gồm cả độ trong suốt).
- **Chuẩn hóa kiểu** — tự động chuyển đổi các giá trị số thành chuỗi để đảm bảo tính nhất quán.
- **Làm sạch dữ liệu** — loại bỏ các điểm đánh dấu hệ thống trước khi sử dụng giá trị cuối cùng.

## Khởi tạo

Lớp này chỉ chứa các phương thức tĩnh, vì vậy không cần phải khởi tạo thông qua `new`.

```typescript
import { PropertiesValues } from '@dxtmisha/scripts'

// Truy cập các phương thức tĩnh
const isFull = PropertiesValues.isFull('=someValue')
```

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

### `isFull`
Kiểm tra xem một giá trị chuỗi có bắt đầu bằng điểm đánh dấu đặc biệt `=` (dấu bằng) hay không. Điểm đánh dấu này báo hiệu cho hệ thống rằng giá trị đó là cuối cùng và không yêu cầu xử lý tham chiếu hoặc các chuyển đổi khác.

**Tham số:**
- `value: PropertyItemPartial['value']` — giá trị thuộc tính cần xác minh.

**Trả về:** `boolean` — `true` nếu giá trị được đánh dấu là đầy đủ.

```typescript
const result = PropertiesValues.isFull('=100%');
// Kết quả: true
```

### `isColor`
Kiểm tra xem chuỗi được cung cấp có phải là màu HEX hợp lệ hay không (bắt đầu bằng biểu tượng `#`).

**Tham số:**
- `value: PropertyItemPartial['__c']` — giá trị cần xác minh.

**Trả về:** `boolean` — `true` nếu chuỗi giống với màu HEX.

```typescript
const isHex = PropertiesValues.isColor('#ff0000');
// Kết quả: true
```

### `isColorWithOpacity`
Một kiểm tra chuyên biệt cho các màu HEX có kênh alpha. Nó kiểm tra xem chuỗi có khớp với định dạng HEX tám chữ số hay không (ví dụ: `#rrggbbaa`).

**Tham số:**
- `value: PropertyItemPartial['__c']` — giá trị cần xác minh.

**Trả về:** `boolean` — `true` nếu đó là màu có độ trong suốt.

```typescript
const isTrans = PropertiesValues.isColorWithOpacity('#ff000080');
// Kết quả: true
```

### `reValue`
Chuẩn hóa giá trị để sử dụng tiếp. Nếu giá trị được đánh dấu là "đầy đủ", điểm đánh dấu `=` sẽ bị loại bỏ. Nếu giá trị là một số, nó sẽ được chuyển đổi thành chuỗi.

**Tham số:**
- `value: PropertyItemPartial['value']` — giá trị thuộc tính ban đầu.

**Trả về:** `PropertyItemPartial['value']` — giá trị chuỗi (hoặc đối tượng ban đầu) đã được chuẩn hóa.

```typescript
const val1 = PropertiesValues.reValue('=12px'); // '12px'
const val2 = PropertiesValues.reValue(24); // '24'
```

### `getExpFull`
Trả về biểu thức chính quy được sử dụng để xác định điểm đánh dấu giá trị đầy đủ.

**Trả về:** `RegExp` — biểu thức chính quy `/^=/`.

```typescript
const regex = PropertiesValues.getExpFull();
```

## Các thao tác (Operations)

### Quy trình chuẩn hóa giá trị (Value Normalization Process)

1. **Kiểm tra tính "đầy đủ"**: Phương thức `isFull` xác định xem có nên bỏ qua giai đoạn xử lý tham chiếu hay không.
2. **Định kiểu**: Tất cả các số được chuyển đổi thành kiểu chuỗi thông qua `reValue` để tránh lỗi khi nối chuỗi trong CSS/SCSS.
3. **Lọc**: Các điểm đánh dấu điều khiển (như `=`) được loại bỏ khỏi chuỗi cuối cùng để ngăn chúng xuất hiện trong mã CSS kết quả.

## Ví dụ (Examples)

### Xác thực và làm sạch dữ liệu đầu vào
```typescript
import { PropertiesValues } from '@dxtmisha/scripts'

const rawValue = '=rgba(0,0,0,0.5)'

if (PropertiesValues.isFull(rawValue)) {
  const cleanValue = PropertiesValues.reValue(rawValue)
  console.log(cleanValue) // 'rgba(0,0,0,0.5)'
}
```
