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

<Meta title='@dxtmisha/en/scripts/Classes/StylesToMedia - Media Query Generator'/>

# StylesToMedia Class

The `StylesToMedia` class is responsible for generating CSS `@media` queries from design properties. It implements the logic to wrap nested style rules within a media query block.

## Key Features

- **Media Query Wrapping** — Automatically wraps the generated style content within a `@media screen and ...` rule.
- **Dynamic Query Resolution** — Uses the design property name to define the media query condition.
- **Indentation Management** — Correctly handles block indentation and optional leading empty lines.

## Initialization

Initialize the `StylesToMedia` converter with the required property and a content callable for the nested rules.

**Parameters:**
- `property: PropertyItemsItem` — the current branch of the property tree being processed.
- `space: string` — the indentation string (e.g., `"  "` or `"\t"`).
- `content?: () => string[]` — a callable function that returns an array of strings representing the internal style rules.
- `first?: boolean` — indicates if this is the first element in the current level (optional, default: `true`).

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

// Usage in conversion logic
const converter = new StylesToMedia(property, '  ', contentCallable)
const result = converter.make()
```

## Methods

### Control

- `make(): string[]` — The main entry point. Orchestrates the transformation and adds the required indentation to each line.
