> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mastermindcms.com/llms.txt
> Use this file to discover all available pages before exploring further.

# msm-image-upload

> Web-компонент msm-image-upload.

`msm-image-upload` — web-компонент на Lit.

## Назначение

Отображение медиа (изображения/видео).

## Пример

```html theme={null}
<msm-image-upload></msm-image-upload>
```

## Атрибуты / свойства

| Имя        | Тип     | По умолчанию                              | Примечания |
| ---------- | ------- | ----------------------------------------- | ---------- |
| `variant`  | string  | `UploadType.fromValue(this.variant).name` |            |
| `command`  | string  | -                                         |            |
| `cdn-root` | string  | `""`                                      |            |
| `path`     | string  | `""`                                      |            |
| `src`      | string  | -                                         |            |
| `required` | boolean | -                                         |            |

## События

| Событие            | detail     | Когда |
| ------------------ | ---------- | ----- |
| `msm-image-upload` | `imageUrl` |       |
| `msm-image-remove` | `imageUrl` |       |

### Пример

```html theme={null}
<msm-image-upload>
</msm-image-upload>

<script>
  const el = document.querySelector("msm-image-upload");
  el.addEventListener("msm-image-upload", (e) => {
    console.log(e.detail);
  });

  el.addEventListener("msm-image-remove", (e) => {
    console.log(e.detail);
  });

</script>
```

## CSS parts

* `base`

## Слоты

Документированных слотов нет.

## Методы

* `validate()`

## Примечания

* Custom events bubble.