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

<Meta title='@dxtmisha/en/scripts/Classes/DesignStructure - Component Data Resolution Engine'/>

# DesignStructure Class

The `DesignStructure` class is the foundational data resolver for design system components. It orchestrates the reading, caching, and processing of structured component data, including properties, CSS class hierarchies, and style tokens. It acts as an abstraction layer between raw configuration files and the template transformation engines.

## Key Features

- **Unified Data Access** — Provides a centralized API to retrieve all metadata associated with a specific component.
- **Intelligent Caching** — Utilizes `PropertiesCache` to avoid redundant file system operations and speed up multi-component processing.
- **Subclass Mapping** — Resolves complex CSS class hierarchies for recursive component structures.
- **Style Token Exposure** — Extracts and formats design tokens into a format ready for SCSS generation.
- **Naming Convention Orchestration** — Standardizes component, design, and file naming across the entire building process.

## Initialization

To initialize a structure resolver, provide the component's identifier. The class will automatically link it to the current project's design configuration.

**Parameters:**
- `component?: string` — The identifier for the component (e.g., `'button'`, `'list'`). Defaults to `'component'`.

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

const structure = new DesignStructure('button')
const properties = structure.get()
```

## Methods

### Data Acquisition

- `get(): DesignStructureList` — Retrieves the full list of component properties and metadata, with caching.
- `getClasses(): DesignStructureClassesList` — Resolves the hierarchy of CSS classes for the component.
- `getStyles(): string[]` — Returns the formatted style tokens derived from the component's structure.

### Naming & Identity

- `getDesign(): string` — Returns the current design system identifier (e.g., `'misha'`).
- `getDesignFirst(): string` — Returns the design identifier formatted with an uppercase first letter.
- `getComponentName(): string` — Returns the raw component name.
- `getComponentNameFirst(): string` — Returns the component name with an uppercase first letter.
- `getFullComponentName(): string` — Combines design and component names (e.g., `'MishaButton'`).
- `getFileName(): string` — Returns the standardized filename for the component's implementation.
- `getPathName(): string` — Returns the unique identifier for cache keys and system paths.

## Operations

### The Resolution Pipeline

When data is requested (e.g., via `get()` or `getClasses()`), the class triggers a modular resolution process:
1. **Cache Validation**: It first checks if the processed data already exists in the `PropertiesCache` under a key generated by `getPathName()`.
2. **Modular Delegation**: If data is missing from cache, it delegates the heavy lifting to specialized "Read" classes:
    - **DesignStructureRead**: Handles the extraction of properties and values.
    - **DesignStructureClasses**: Manages the construction of class trees.
    - **DesignStructureStyles**: Processes tokens into style strings.
3. **Persistance**: The resolved data is stored back into the cache to enhance performance for subsequent calls during the same build cycle.

### Integration with Template Engines

`DesignStructure` provides the "Source of Truth" for classes like `DesignReplace`. By standardizing how names and paths are resolved, it ensures that every generated file (Vue, TS, SCSS) uses consistent identifiers and maintains correct relative path references across the workspace.
