kibana/packages/shared-ux/markdown/impl
Spencer 7058e1fb55
rename codeowners from shared-ux to global-experience (#144746)
https://github.com/elastic/kibana/pull/144326 attempted to change the
owners for packages, but because of a misconfiguration in CI the correct
codeowners file wasn't determined until after the PR was merged. This
fixed the issue by modifying the kibana.jsonc files of the packages to
use the correct owner, which then ends up in the codeowners file.

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
2022-11-08 09:13:16 -07:00
..
__snapshots__ Bumping EUI to version 67.1.8 (#141279) 2022-11-07 21:45:50 +00:00
BUILD.bazel [auto] migrate existing plugin/package configs 2022-10-28 14:06:46 -05:00
index.ts [Shared UX] Markdown Component (#142228) 2022-10-18 13:37:03 -07:00
jest.config.js [Shared UX] Markdown Component (#142228) 2022-10-18 13:37:03 -07:00
kibana.jsonc rename codeowners from shared-ux to global-experience (#144746) 2022-11-08 09:13:16 -07:00
markdown.test.tsx [Shared UX] Markdown Component (#142228) 2022-10-18 13:37:03 -07:00
markdown.tsx [Shared UX] Markdown Component (#142228) 2022-10-18 13:37:03 -07:00
markdown_editor.stories.tsx [Shared UX] Markdown Component (#142228) 2022-10-18 13:37:03 -07:00
markdown_format.stories.tsx [Shared UX] Markdown Component (#142228) 2022-10-18 13:37:03 -07:00
package.json [auto] migrate existing plugin/package configs 2022-10-28 14:06:46 -05:00
README.mdx [Shared UX] Markdown Component (#142228) 2022-10-18 13:37:03 -07:00
tsconfig.json fix(NA): wrongly spread stripInternal and rootDir configs across packages (#144463) 2022-11-03 01:04:55 +00:00

---
id: sharedUX/Components/Markdown
slug: /shared-ux/components/markdown
title: Markdown
description: A wrapper around EuiMarkdownEditor and EuiMarkdownFormat.
tags: ['shared-ux', 'component']
date: 2022-10-03
---

## Description

This markdown component uses the **EuiMarkdownEditor** and **EuiMarkdownFormat** managed by `@elastic/eui`. If `readOnly` is set to true, and `markdownContent` or `children` are set, then the component renders **EuiMarkdownFormat** text. Otherwise the component will render the **EuiMarkdownEditor**. The height of the component can be set, but in order the control the width of the component, you can place the `<Markdown />` component in another component.
Markdown extends all the EuiMarkdownEditorProps except for the `editorId`, `uiPlugins`, and `MarkdownFormatProps`.

## Component Properties 

| Prop Name | Type | Description |
|---|---|---|
| `readOnly` | `boolean` | Needed to differentiate where markdown is used as a presentation of error messages. This was previous the MarkdownSimple component |
| `openLinksInNewTab` | `boolean` | An optional property needed to replace the Markdown component from kibana-react |
|`markdownContent` | `string` | This prop can be set along with `readOnly` to display error.message etc text to the kibana user. This property is optional. |
| `ariaLabelContent` | `string` | An optional property to be set for the markdown component. It will be `markdown component` if not set explicitly. |
| `height` | `number` or `'full'` | The height of the markdown component can be set to a number. By default, height is set to `'full'`. To set the width, include a container for the markdown component to be within with set width. |
| `placeholder` | `string` or `undefined` | This prop can be set to a string to display the placeholder content of the markdown component. |
| `defaultValue` | `string` | The default value for the markdown editor. If not set it will default to an empty string. |

## API

| Export | Description |
|---|---|
| `Markdown` | This component provides a markdown editor or text to be supported with Markdown formatting (must have static content set for the `markdownContent`) prop and be `readOnly` |
| `MarkdownProps` | Exported by `@kbn/shared-ux-markdown-types` |