mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 17:28:26 -04:00
[Shared UX] Markdown Component (#142228)
This commit is contained in:
Rachel Shen
GitHub
parent
75f2d0c714
commit
4e3461a9b6
29 changed files with 1123 additions and 0 deletions
3
.github/CODEOWNERS
vendored
3
.github/CODEOWNERS
vendored
|
|
@ -990,6 +990,9 @@ packages/shared-ux/card/no_data/types @elastic/shared-ux
|
|||
packages/shared-ux/link/redirect_app/impl @elastic/shared-ux
|
||||
packages/shared-ux/link/redirect_app/mocks @elastic/shared-ux
|
||||
packages/shared-ux/link/redirect_app/types @elastic/shared-ux
|
||||
packages/shared-ux/markdown/impl @elastic/shared-ux
|
||||
packages/shared-ux/markdown/mocks @elastic/shared-ux
|
||||
packages/shared-ux/markdown/types @elastic/shared-ux
|
||||
packages/shared-ux/page/analytics_no_data/impl @elastic/shared-ux
|
||||
packages/shared-ux/page/analytics_no_data/mocks @elastic/shared-ux
|
||||
packages/shared-ux/page/analytics_no_data/types @elastic/shared-ux
|
||||
|
|
|
|||
|
|
@ -373,6 +373,9 @@
|
|||
"@kbn/shared-ux-link-redirect-app": "link:bazel-bin/packages/shared-ux/link/redirect_app/impl",
|
||||
"@kbn/shared-ux-link-redirect-app-mocks": "link:bazel-bin/packages/shared-ux/link/redirect_app/mocks",
|
||||
"@kbn/shared-ux-link-redirect-app-types": "link:bazel-bin/packages/shared-ux/link/redirect_app/types",
|
||||
"@kbn/shared-ux-markdown": "link:bazel-bin/packages/shared-ux/markdown/impl",
|
||||
"@kbn/shared-ux-markdown-mocks": "link:bazel-bin/packages/shared-ux/markdown/mocks",
|
||||
"@kbn/shared-ux-markdown-types": "link:bazel-bin/packages/shared-ux/markdown/types",
|
||||
"@kbn/shared-ux-page-analytics-no-data": "link:bazel-bin/packages/shared-ux/page/analytics_no_data/impl",
|
||||
"@kbn/shared-ux-page-analytics-no-data-mocks": "link:bazel-bin/packages/shared-ux/page/analytics_no_data/mocks",
|
||||
"@kbn/shared-ux-page-analytics-no-data-types": "link:bazel-bin/packages/shared-ux/page/analytics_no_data/types",
|
||||
|
|
@ -1133,6 +1136,9 @@
|
|||
"@types/kbn__shared-ux-link-redirect-app": "link:bazel-bin/packages/shared-ux/link/redirect_app/impl/npm_module_types",
|
||||
"@types/kbn__shared-ux-link-redirect-app-mocks": "link:bazel-bin/packages/shared-ux/link/redirect_app/mocks/npm_module_types",
|
||||
"@types/kbn__shared-ux-link-redirect-app-types": "link:bazel-bin/packages/shared-ux/link/redirect_app/types/npm_module_types",
|
||||
"@types/kbn__shared-ux-markdown": "link:bazel-bin/packages/shared-ux/markdown/impl/npm_module_types",
|
||||
"@types/kbn__shared-ux-markdown-mocks": "link:bazel-bin/packages/shared-ux/markdown/mocks/npm_module_types",
|
||||
"@types/kbn__shared-ux-markdown-types": "link:bazel-bin/packages/shared-ux/markdown/types/npm_module_types",
|
||||
"@types/kbn__shared-ux-page-analytics-no-data": "link:bazel-bin/packages/shared-ux/page/analytics_no_data/impl/npm_module_types",
|
||||
"@types/kbn__shared-ux-page-analytics-no-data-mocks": "link:bazel-bin/packages/shared-ux/page/analytics_no_data/mocks/npm_module_types",
|
||||
"@types/kbn__shared-ux-page-analytics-no-data-types": "link:bazel-bin/packages/shared-ux/page/analytics_no_data/types/npm_module_types",
|
||||
|
|
|
|||
|
|
@ -316,6 +316,9 @@ filegroup(
|
|||
"//packages/shared-ux/link/redirect_app/impl:build",
|
||||
"//packages/shared-ux/link/redirect_app/mocks:build",
|
||||
"//packages/shared-ux/link/redirect_app/types:build",
|
||||
"//packages/shared-ux/markdown/impl:build",
|
||||
"//packages/shared-ux/markdown/mocks:build",
|
||||
"//packages/shared-ux/markdown/types:build",
|
||||
"//packages/shared-ux/page/analytics_no_data/impl:build",
|
||||
"//packages/shared-ux/page/analytics_no_data/mocks:build",
|
||||
"//packages/shared-ux/page/analytics_no_data/types:build",
|
||||
|
|
@ -641,6 +644,9 @@ filegroup(
|
|||
"//packages/shared-ux/card/no_data/mocks:build_types",
|
||||
"//packages/shared-ux/link/redirect_app/impl:build_types",
|
||||
"//packages/shared-ux/link/redirect_app/mocks:build_types",
|
||||
"//packages/shared-ux/markdown/impl:build_types",
|
||||
"//packages/shared-ux/markdown/mocks:build_types",
|
||||
"//packages/shared-ux/markdown/types:build_types",
|
||||
"//packages/shared-ux/page/analytics_no_data/impl:build_types",
|
||||
"//packages/shared-ux/page/analytics_no_data/mocks:build_types",
|
||||
"//packages/shared-ux/page/kibana_no_data/impl:build_types",
|
||||
|
|
|
|||
147
packages/shared-ux/markdown/impl/BUILD.bazel
Normal file
147
packages/shared-ux/markdown/impl/BUILD.bazel
Normal file
|
|
@ -0,0 +1,147 @@
|
|||
load("@npm//@bazel/typescript:index.bzl", "ts_config")
|
||||
load("@build_bazel_rules_nodejs//:index.bzl", "js_library")
|
||||
load("//src/dev/bazel:index.bzl", "jsts_transpiler", "pkg_npm", "pkg_npm_types", "ts_project")
|
||||
|
||||
PKG_DIRNAME = "impl"
|
||||
PKG_REQUIRE_NAME = "@kbn/shared-ux-markdown"
|
||||
|
||||
SOURCE_FILES = glob(
|
||||
[
|
||||
"**/*.ts",
|
||||
"**/*.tsx",
|
||||
"**/*.mdx",
|
||||
],
|
||||
exclude = [
|
||||
"**/*.config.js",
|
||||
"**/*.mock.*",
|
||||
"**/*.test.*",
|
||||
"**/*.stories.*",
|
||||
"**/__snapshots__/**",
|
||||
"**/integration_tests/**",
|
||||
"**/mocks/**",
|
||||
"**/scripts/**",
|
||||
"**/storybook/**",
|
||||
"**/test_fixtures/**",
|
||||
"**/test_helpers/**",
|
||||
],
|
||||
)
|
||||
|
||||
SRCS = SOURCE_FILES
|
||||
|
||||
filegroup(
|
||||
name = "srcs",
|
||||
srcs = SRCS,
|
||||
)
|
||||
|
||||
NPM_MODULE_EXTRA_FILES = [
|
||||
"package.json",
|
||||
]
|
||||
|
||||
# In this array place runtime dependencies, including other packages and NPM packages
|
||||
# which must be available for this code to run.
|
||||
#
|
||||
# To reference other packages use:
|
||||
# "//repo/relative/path/to/package"
|
||||
# eg. "//packages/kbn-utils"
|
||||
#
|
||||
# To reference a NPM package use:
|
||||
# "@npm//name-of-package"
|
||||
# eg. "@npm//lodash"
|
||||
RUNTIME_DEPS = [
|
||||
"@npm//react",
|
||||
"@npm//enzyme",
|
||||
"@npm//@elastic/eui",
|
||||
"//packages/kbn-ambient-ui-types",
|
||||
]
|
||||
|
||||
# In this array place dependencies necessary to build the types, which will include the
|
||||
# :npm_module_types target of other packages and packages from NPM, including @types/*
|
||||
# packages.
|
||||
#
|
||||
# To reference the types for another package use:
|
||||
# "//repo/relative/path/to/package:npm_module_types"
|
||||
# eg. "//packages/kbn-utils:npm_module_types"
|
||||
#
|
||||
# References to NPM packages work the same as RUNTIME_DEPS
|
||||
TYPES_DEPS = [
|
||||
"@npm//@types/node",
|
||||
"@npm//@types/jest",
|
||||
"@npm//@types/react",
|
||||
"@npm//@elastic/eui",
|
||||
"//packages/kbn-ambient-ui-types",
|
||||
"//packages/kbn-shared-ux-utility:npm_module_types",
|
||||
"//packages/shared-ux/markdown/mocks",
|
||||
# "//packages/kbn-shared-ux-markdown-mocks:npm_module_types",
|
||||
]
|
||||
|
||||
jsts_transpiler(
|
||||
name = "target_node",
|
||||
srcs = SRCS,
|
||||
build_pkg_name = package_name(),
|
||||
)
|
||||
|
||||
jsts_transpiler(
|
||||
name = "target_web",
|
||||
srcs = SRCS,
|
||||
build_pkg_name = package_name(),
|
||||
web = True,
|
||||
additional_args = [
|
||||
"--copy-files",
|
||||
"--quiet"
|
||||
],
|
||||
)
|
||||
|
||||
ts_config(
|
||||
name = "tsconfig",
|
||||
src = "tsconfig.json",
|
||||
deps = [
|
||||
"//:tsconfig.base.json",
|
||||
"//:tsconfig.bazel.json",
|
||||
],
|
||||
)
|
||||
|
||||
ts_project(
|
||||
name = "tsc_types",
|
||||
args = ['--pretty'],
|
||||
srcs = SRCS,
|
||||
deps = TYPES_DEPS,
|
||||
declaration = True,
|
||||
declaration_map = True,
|
||||
emit_declaration_only = True,
|
||||
out_dir = "target_types",
|
||||
tsconfig = ":tsconfig",
|
||||
)
|
||||
|
||||
js_library(
|
||||
name = PKG_DIRNAME,
|
||||
srcs = NPM_MODULE_EXTRA_FILES,
|
||||
deps = RUNTIME_DEPS + [":target_node", ":target_web"],
|
||||
package_name = PKG_REQUIRE_NAME,
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
pkg_npm(
|
||||
name = "npm_module",
|
||||
deps = [":" + PKG_DIRNAME],
|
||||
)
|
||||
|
||||
filegroup(
|
||||
name = "build",
|
||||
srcs = [":npm_module"],
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
pkg_npm_types(
|
||||
name = "npm_module_types",
|
||||
srcs = SRCS,
|
||||
deps = [":tsc_types"],
|
||||
package_name = PKG_REQUIRE_NAME,
|
||||
tsconfig = ":tsconfig",
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
filegroup(
|
||||
name = "build_types",
|
||||
srcs = [":npm_module_types"],
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
33
packages/shared-ux/markdown/impl/README.mdx
Normal file
33
packages/shared-ux/markdown/impl/README.mdx
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
---
|
||||
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` |
|
||||
|
||||
247
packages/shared-ux/markdown/impl/__snapshots__/markdown.test.tsx.snap
generated
Normal file
247
packages/shared-ux/markdown/impl/__snapshots__/markdown.test.tsx.snap
generated
Normal file
|
|
@ -0,0 +1,247 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`shared ux markdown component renders for editor 1`] = `
|
||||
<div
|
||||
class="euiMarkdownEditor euiMarkdownEditor--fullHeight"
|
||||
>
|
||||
<div
|
||||
class="euiMarkdownEditorToolbar"
|
||||
data-test-subj="euiMarkdownEditorToolbar"
|
||||
>
|
||||
<div
|
||||
class="euiMarkdownEditorToolbar__buttons"
|
||||
>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Bold"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="editorBold"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Italic"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="editorItalic"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiMarkdownEditorToolbar__divider"
|
||||
/>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Unordered list"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="editorUnorderedList"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Ordered list"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="editorOrderedList"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Task list"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="editorChecklist"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiMarkdownEditorToolbar__divider"
|
||||
/>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Quote"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="quote"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Code"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="editorCodeBlock"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Link"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="editorLink"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiMarkdownEditorToolbar__divider"
|
||||
/>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Tooltip"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
data-test-subj="euiMarkdownEditorToolbarButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="editorComment"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<button
|
||||
class="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--small"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButtonEmpty__content"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="eye"
|
||||
/>
|
||||
<span
|
||||
class="euiButtonEmpty__text"
|
||||
>
|
||||
Preview
|
||||
</span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="euiMarkdownEditor__toggleContainer"
|
||||
style="height:calc(100% - 0px)"
|
||||
>
|
||||
<div
|
||||
class="euiMarkdownEditorDropZone"
|
||||
role="button"
|
||||
>
|
||||
<textarea
|
||||
aria-label="markdown component"
|
||||
class="euiMarkdownEditorTextArea"
|
||||
data-test-subj="euiMarkdownEditorTextArea"
|
||||
id="generated-id"
|
||||
placeholder=""
|
||||
rows="6"
|
||||
style="height:100%;max-height:"
|
||||
/>
|
||||
<div
|
||||
class="euiMarkdownEditorFooter"
|
||||
>
|
||||
<div
|
||||
class="euiMarkdownEditorFooter__actions"
|
||||
/>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Show markdown help"
|
||||
class="euiButtonIcon euiButtonIcon--text euiButtonIcon--empty euiButtonIcon--small euiMarkdownEditorFooter__helpButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="MarkdownLogo"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
<input
|
||||
autocomplete="off"
|
||||
multiple=""
|
||||
style="display:none"
|
||||
tabindex="-1"
|
||||
type="file"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
9
packages/shared-ux/markdown/impl/index.ts
Normal file
9
packages/shared-ux/markdown/impl/index.ts
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
|
||||
export { Markdown } from './markdown';
|
||||
13
packages/shared-ux/markdown/impl/jest.config.js
Normal file
13
packages/shared-ux/markdown/impl/jest.config.js
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
|
||||
module.exports = {
|
||||
preset: '@kbn/test',
|
||||
rootDir: '../../../..',
|
||||
roots: ['<rootDir>/packages/shared-ux/markdown/impl'],
|
||||
};
|
||||
7
packages/shared-ux/markdown/impl/kibana.jsonc
Normal file
7
packages/shared-ux/markdown/impl/kibana.jsonc
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"type": "shared-common",
|
||||
"id": "@kbn/shared-ux-markdown",
|
||||
"owner": "@elastic/shared-ux",
|
||||
"runtimeDeps": [],
|
||||
"typeDeps": [],
|
||||
}
|
||||
31
packages/shared-ux/markdown/impl/markdown.test.tsx
Normal file
31
packages/shared-ux/markdown/impl/markdown.test.tsx
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { Markdown } from './markdown';
|
||||
import { render } from 'enzyme';
|
||||
|
||||
describe('shared ux markdown component', () => {
|
||||
it('renders for editor', () => {
|
||||
const component = render(<Markdown readOnly={false} />);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders for displaying a readonly message', () => {
|
||||
const component = render(<Markdown readOnly markdownContent="error message" />);
|
||||
expect(component.text()).toContain('error message');
|
||||
});
|
||||
|
||||
it('will not render EuiMarkdownFormat when readOnly false and markdownContent specified', () => {
|
||||
const exampleMarkdownContent = 'error';
|
||||
const component = render(
|
||||
<Markdown readOnly={false} markdownContent={exampleMarkdownContent} />
|
||||
);
|
||||
expect(component.has('EuiMarkdownEditor')).toBeTruthy();
|
||||
});
|
||||
});
|
||||
78
packages/shared-ux/markdown/impl/markdown.tsx
Normal file
78
packages/shared-ux/markdown/impl/markdown.tsx
Normal file
|
|
@ -0,0 +1,78 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
|
||||
import {
|
||||
EuiLink,
|
||||
EuiMarkdownEditor,
|
||||
EuiMarkdownEditorProps,
|
||||
EuiMarkdownFormat,
|
||||
getDefaultEuiMarkdownProcessingPlugins,
|
||||
} from '@elastic/eui';
|
||||
import React, { useState } from 'react';
|
||||
|
||||
export type MarkdownProps = Partial<
|
||||
Omit<EuiMarkdownEditorProps, 'editorId' | 'uiPlugins' | 'markdownFormatProps'>
|
||||
> & {
|
||||
/**
|
||||
* @param readOnly is needed to differentiate where markdown is used as a presentation of error messages
|
||||
* This was previous the MarkdownSimple component
|
||||
*/
|
||||
readOnly: boolean;
|
||||
defaultValue?: string;
|
||||
markdownContent?: string;
|
||||
ariaLabelContent?: string;
|
||||
/** Eui allows the height of the markdown component to be set */
|
||||
height?: number | 'full';
|
||||
placeholder?: string | undefined;
|
||||
children?: string;
|
||||
openLinksInNewTab?: boolean;
|
||||
};
|
||||
|
||||
export const Markdown = ({
|
||||
ariaLabelContent,
|
||||
readOnly,
|
||||
markdownContent,
|
||||
children,
|
||||
openLinksInNewTab = true,
|
||||
defaultValue = '',
|
||||
placeholder = '',
|
||||
height = 'full',
|
||||
}: MarkdownProps) => {
|
||||
const [value, setValue] = useState(defaultValue);
|
||||
|
||||
// openLinksInNewTab functionality from https://codesandbox.io/s/relaxed-yalow-hy69r4?file=/demo.js:482-645
|
||||
const processingPlugins = getDefaultEuiMarkdownProcessingPlugins();
|
||||
processingPlugins[1][1].components.a = (props) => <EuiLink {...props} target="_blank" />;
|
||||
|
||||
// Render EuiMarkdownFormat when readOnly set to true
|
||||
if (readOnly) {
|
||||
if (!children && !markdownContent) {
|
||||
throw new Error('Markdown content is required in [readOnly] mode');
|
||||
}
|
||||
return (
|
||||
<EuiMarkdownFormat
|
||||
aria-label={ariaLabelContent ?? 'markdown component'}
|
||||
processingPluginList={openLinksInNewTab ? processingPlugins : undefined}
|
||||
>
|
||||
{children ?? markdownContent!}
|
||||
</EuiMarkdownFormat>
|
||||
);
|
||||
}
|
||||
|
||||
// Otherwise render the Markdown Editor if readOnly false
|
||||
return (
|
||||
<EuiMarkdownEditor
|
||||
aria-label={ariaLabelContent ?? 'markdown component'}
|
||||
placeholder={placeholder}
|
||||
value={value}
|
||||
onChange={setValue}
|
||||
height={height}
|
||||
processingPluginList={openLinksInNewTab ? processingPlugins : undefined}
|
||||
/>
|
||||
);
|
||||
};
|
||||
41
packages/shared-ux/markdown/impl/markdown_editor.stories.tsx
Normal file
41
packages/shared-ux/markdown/impl/markdown_editor.stories.tsx
Normal file
|
|
@ -0,0 +1,41 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
|
||||
import { MarkdownStorybookMock, MarkdownStorybookParams } from '@kbn/shared-ux-markdown-mocks';
|
||||
|
||||
import { EuiFlexItem } from '@elastic/eui';
|
||||
import mdx from './README.mdx';
|
||||
import { Markdown } from './markdown';
|
||||
|
||||
export default {
|
||||
title: 'Markdown/Markdown Editor',
|
||||
description: 'A wrapper around `EuiMarkdownEditor`, to be used for markdown within Kibana',
|
||||
parameters: {
|
||||
docs: {
|
||||
page: mdx,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MarkdownStorybookMock();
|
||||
const argTypes = mock.getArgumentTypes();
|
||||
|
||||
export const MarkdownStoryComponent = (params: MarkdownStorybookParams) => {
|
||||
return (
|
||||
// The markdown component is wrapped in the EuiFlexItem with width set to 50%
|
||||
// Height can be set for the markdown component
|
||||
<EuiFlexItem style={{ width: '400px' }}>
|
||||
{/* readOnly is set to false because the Markdown component editor will error if set to true without markdown content or children */}
|
||||
<Markdown {...params} readOnly={false} />
|
||||
</EuiFlexItem>
|
||||
);
|
||||
};
|
||||
|
||||
MarkdownStoryComponent.argTypes = argTypes;
|
||||
49
packages/shared-ux/markdown/impl/markdown_format.stories.tsx
Normal file
49
packages/shared-ux/markdown/impl/markdown_format.stories.tsx
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
|
||||
import { MarkdownStorybookMock, MarkdownStorybookParams } from '@kbn/shared-ux-markdown-mocks';
|
||||
|
||||
import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
|
||||
import mdx from './README.mdx';
|
||||
import { Markdown } from './markdown';
|
||||
|
||||
export default {
|
||||
title: 'Markdown/Markdown Format',
|
||||
description: 'Component to have EuiMarkdownFormat support to be used for markdown within Kibana',
|
||||
parameters: {
|
||||
docs: {
|
||||
page: mdx,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const mock = new MarkdownStorybookMock();
|
||||
const argTypes = mock.getArgumentTypes();
|
||||
|
||||
export const MarkdownStoryComponent = (params: MarkdownStorybookParams) => {
|
||||
return (
|
||||
<EuiFlexGroup>
|
||||
<EuiFlexItem>
|
||||
<Markdown
|
||||
{...params}
|
||||
readOnly={true}
|
||||
markdownContent={'My content in **markdown** format set as the *markdownContent prop*'}
|
||||
/>
|
||||
<Markdown {...params} readOnly={true}>
|
||||
{
|
||||
'My content in **markdown** format passed as *children* [test link to open in new tab or not](https://www.elastic.co)'
|
||||
}
|
||||
</Markdown>
|
||||
</EuiFlexItem>
|
||||
</EuiFlexGroup>
|
||||
);
|
||||
};
|
||||
|
||||
MarkdownStoryComponent.argTypes = argTypes;
|
||||
8
packages/shared-ux/markdown/impl/package.json
Normal file
8
packages/shared-ux/markdown/impl/package.json
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
{
|
||||
"name": "@kbn/shared-ux-markdown",
|
||||
"private": true,
|
||||
"version": "1.0.0",
|
||||
"main": "./target_node/index.js",
|
||||
"browser": "./target_web/index.js",
|
||||
"license": "SSPL-1.0 OR Elastic License 2.0"
|
||||
}
|
||||
20
packages/shared-ux/markdown/impl/tsconfig.json
Normal file
20
packages/shared-ux/markdown/impl/tsconfig.json
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
{
|
||||
"extends": "../../../../tsconfig.bazel.json",
|
||||
"compilerOptions": {
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
"emitDeclarationOnly": true,
|
||||
"outDir": "target_types",
|
||||
"stripInternal": false,
|
||||
"types": [
|
||||
"jest",
|
||||
"node",
|
||||
"react",
|
||||
"@kbn/ambient-ui-types",
|
||||
]
|
||||
},
|
||||
"include": [
|
||||
"**/*.ts",
|
||||
"**/*.tsx",
|
||||
]
|
||||
}
|
||||
142
packages/shared-ux/markdown/mocks/BUILD.bazel
Normal file
142
packages/shared-ux/markdown/mocks/BUILD.bazel
Normal file
|
|
@ -0,0 +1,142 @@
|
|||
load("@npm//@bazel/typescript:index.bzl", "ts_config")
|
||||
load("@build_bazel_rules_nodejs//:index.bzl", "js_library")
|
||||
load("//src/dev/bazel:index.bzl", "jsts_transpiler", "pkg_npm", "pkg_npm_types", "ts_project")
|
||||
|
||||
PKG_DIRNAME = "mocks"
|
||||
PKG_REQUIRE_NAME = "@kbn/shared-ux-markdown-mocks"
|
||||
|
||||
SOURCE_FILES = glob(
|
||||
[
|
||||
"**/*.ts",
|
||||
"**/*.tsx",
|
||||
],
|
||||
exclude = [
|
||||
"**/*.config.js",
|
||||
"**/*.mock.*",
|
||||
"**/*.test.*",
|
||||
"**/*.stories.*",
|
||||
"**/__snapshots__/**",
|
||||
"**/integration_tests/**",
|
||||
"**/mocks/**",
|
||||
"**/scripts/**",
|
||||
"**/storybook/**",
|
||||
"**/test_fixtures/**",
|
||||
"**/test_helpers/**",
|
||||
],
|
||||
)
|
||||
|
||||
SRCS = SOURCE_FILES
|
||||
|
||||
filegroup(
|
||||
name = "srcs",
|
||||
srcs = SRCS,
|
||||
)
|
||||
|
||||
NPM_MODULE_EXTRA_FILES = [
|
||||
"package.json",
|
||||
]
|
||||
|
||||
# In this array place runtime dependencies, including other packages and NPM packages
|
||||
# which must be available for this code to run.
|
||||
#
|
||||
# To reference other packages use:
|
||||
# "//repo/relative/path/to/package"
|
||||
# eg. "//packages/kbn-utils"
|
||||
#
|
||||
# To reference a NPM package use:
|
||||
# "@npm//name-of-package"
|
||||
# eg. "@npm//lodash"
|
||||
RUNTIME_DEPS = [
|
||||
"@npm//react",
|
||||
"@npm//@storybook/addon-actions",
|
||||
"//packages/shared-ux/storybook/mock",
|
||||
"//packages/shared-ux/markdown/impl",
|
||||
]
|
||||
|
||||
# In this array place dependencies necessary to build the types, which will include the
|
||||
# :npm_module_types target of other packages and packages from NPM, including @types/*
|
||||
# packages.
|
||||
#
|
||||
# To reference the types for another package use:
|
||||
# "//repo/relative/path/to/package:npm_module_types"
|
||||
# eg. "//packages/kbn-utils:npm_module_types"
|
||||
#
|
||||
# References to NPM packages work the same as RUNTIME_DEPS
|
||||
TYPES_DEPS = [
|
||||
"@npm//@types/react",
|
||||
"@npm//@storybook/addon-actions",
|
||||
"@npm//@types/jest",
|
||||
"@npm//@types/node",
|
||||
# "//packages/shared-ux/markdown/impl:npm_module_types",
|
||||
"//packages/shared-ux/storybook/mock:npm_module_types",
|
||||
"//packages/shared-ux/markdown/types:npm_module_types",
|
||||
|
||||
]
|
||||
|
||||
jsts_transpiler(
|
||||
name = "target_node",
|
||||
srcs = SRCS,
|
||||
build_pkg_name = package_name(),
|
||||
)
|
||||
|
||||
jsts_transpiler(
|
||||
name = "target_web",
|
||||
srcs = SRCS,
|
||||
build_pkg_name = package_name(),
|
||||
web = True,
|
||||
)
|
||||
|
||||
ts_config(
|
||||
name = "tsconfig",
|
||||
src = "tsconfig.json",
|
||||
deps = [
|
||||
"//:tsconfig.base.json",
|
||||
"//:tsconfig.bazel.json",
|
||||
],
|
||||
)
|
||||
|
||||
ts_project(
|
||||
name = "tsc_types",
|
||||
args = ['--pretty'],
|
||||
srcs = SRCS,
|
||||
deps = TYPES_DEPS,
|
||||
declaration = True,
|
||||
declaration_map = True,
|
||||
emit_declaration_only = True,
|
||||
out_dir = "target_types",
|
||||
tsconfig = ":tsconfig",
|
||||
)
|
||||
|
||||
js_library(
|
||||
name = PKG_DIRNAME,
|
||||
srcs = NPM_MODULE_EXTRA_FILES,
|
||||
deps = RUNTIME_DEPS + [":target_node", ":target_web"],
|
||||
package_name = PKG_REQUIRE_NAME,
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
pkg_npm(
|
||||
name = "npm_module",
|
||||
deps = [":" + PKG_DIRNAME],
|
||||
)
|
||||
|
||||
filegroup(
|
||||
name = "build",
|
||||
srcs = [":npm_module"],
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
pkg_npm_types(
|
||||
name = "npm_module_types",
|
||||
srcs = SRCS,
|
||||
deps = [":tsc_types"],
|
||||
package_name = PKG_REQUIRE_NAME,
|
||||
tsconfig = ":tsconfig",
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
filegroup(
|
||||
name = "build_types",
|
||||
srcs = [":npm_module_types"],
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
3
packages/shared-ux/markdown/mocks/README.md
Normal file
3
packages/shared-ux/markdown/mocks/README.md
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
# @kbn/shared-ux-markdown-mocks
|
||||
|
||||
Empty package generated by @kbn/generate
|
||||
9
packages/shared-ux/markdown/mocks/index.ts
Normal file
9
packages/shared-ux/markdown/mocks/index.ts
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
export { MarkdownStorybookMock } from './storybook';
|
||||
export type { Params as MarkdownStorybookParams } from './storybook';
|
||||
7
packages/shared-ux/markdown/mocks/kibana.jsonc
Normal file
7
packages/shared-ux/markdown/mocks/kibana.jsonc
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"type": "shared-common",
|
||||
"id": "@kbn/shared-ux-markdown-mocks",
|
||||
"owner": "@elastic/shared-ux",
|
||||
"runtimeDeps": [],
|
||||
"typeDeps": [],
|
||||
}
|
||||
8
packages/shared-ux/markdown/mocks/package.json
Normal file
8
packages/shared-ux/markdown/mocks/package.json
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
{
|
||||
"name": "@kbn/shared-ux-markdown-mocks",
|
||||
"private": true,
|
||||
"version": "1.0.0",
|
||||
"main": "./target_node/index.js",
|
||||
"browser": "./target_web/index.js",
|
||||
"license": "SSPL-1.0 OR Elastic License 2.0"
|
||||
}
|
||||
88
packages/shared-ux/markdown/mocks/storybook.ts
Normal file
88
packages/shared-ux/markdown/mocks/storybook.ts
Normal file
|
|
@ -0,0 +1,88 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
import { AbstractStorybookMock } from '@kbn/shared-ux-storybook-mock';
|
||||
|
||||
import type { MarkdownProps } from '@kbn/shared-ux-markdown-types';
|
||||
|
||||
type PropArguments = Pick<
|
||||
MarkdownProps,
|
||||
| 'readOnly'
|
||||
| 'placeholder'
|
||||
| 'markdownContent'
|
||||
| 'height'
|
||||
| 'ariaLabelContent'
|
||||
| 'openLinksInNewTab'
|
||||
>;
|
||||
|
||||
export type Params = Record<keyof PropArguments, any>;
|
||||
|
||||
/**
|
||||
* Storybook mock for the `Markdown` component
|
||||
*/
|
||||
|
||||
export class MarkdownStorybookMock extends AbstractStorybookMock<
|
||||
MarkdownProps,
|
||||
{},
|
||||
PropArguments,
|
||||
{}
|
||||
> {
|
||||
propArguments = {
|
||||
readOnly: {
|
||||
control: 'boolean',
|
||||
defaultValue: false,
|
||||
},
|
||||
openLinksInNewTab: {
|
||||
control: 'boolean',
|
||||
defaultValue: true,
|
||||
},
|
||||
placeholder: {
|
||||
control: {
|
||||
type: 'text',
|
||||
},
|
||||
defaultValue: '',
|
||||
},
|
||||
markdownContent: {
|
||||
control: {
|
||||
type: 'text',
|
||||
},
|
||||
defaultValue: '',
|
||||
},
|
||||
ariaLabelContent: {
|
||||
control: {
|
||||
type: 'text',
|
||||
},
|
||||
defaultValue: 'markdown component',
|
||||
},
|
||||
height: {
|
||||
control: {
|
||||
type: 'select',
|
||||
defaultValue: 'full',
|
||||
label: 'height',
|
||||
options: [0, 20, 50, 'full'],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
serviceArguments = {};
|
||||
dependencies = [];
|
||||
|
||||
getProps(params?: Params): MarkdownProps {
|
||||
return {
|
||||
readOnly: this.getArgumentValue('readOnly', params),
|
||||
placeholder: this.getArgumentValue('placeholder', params),
|
||||
markdownContent: this.getArgumentValue('markdownContent', params),
|
||||
height: this.getArgumentValue('height', params),
|
||||
ariaLabelContent: this.getArgumentValue('ariaLabelContent', params),
|
||||
openLinksInNewTab: this.getArgumentValue('openLinksInNewTab', params),
|
||||
};
|
||||
}
|
||||
|
||||
getServices() {
|
||||
return { ...this.getProps() };
|
||||
}
|
||||
}
|
||||
17
packages/shared-ux/markdown/mocks/tsconfig.json
Normal file
17
packages/shared-ux/markdown/mocks/tsconfig.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"extends": "../../../../tsconfig.bazel.json",
|
||||
"compilerOptions": {
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
"emitDeclarationOnly": true,
|
||||
"outDir": "target_types",
|
||||
"stripInternal": false,
|
||||
"types": [
|
||||
"node",
|
||||
"react"
|
||||
]
|
||||
},
|
||||
"include": [
|
||||
"**/*.ts",
|
||||
]
|
||||
}
|
||||
67
packages/shared-ux/markdown/types/BUILD.bazel
Normal file
67
packages/shared-ux/markdown/types/BUILD.bazel
Normal file
|
|
@ -0,0 +1,67 @@
|
|||
load("@npm//@bazel/typescript:index.bzl", "ts_config")
|
||||
load("@build_bazel_rules_nodejs//:index.bzl", "js_library")
|
||||
load("//src/dev/bazel:index.bzl", "jsts_transpiler", "pkg_npm", "pkg_npm_types", "ts_project")
|
||||
|
||||
PKG_DIRNAME = "types"
|
||||
PKG_REQUIRE_NAME = "@kbn/shared-ux-markdown-types"
|
||||
|
||||
SOURCE_FILES = glob(
|
||||
[
|
||||
"*.d.ts",
|
||||
],
|
||||
)
|
||||
|
||||
SRCS = SOURCE_FILES
|
||||
|
||||
filegroup(
|
||||
name = "srcs",
|
||||
srcs = SRCS,
|
||||
)
|
||||
|
||||
NPM_MODULE_EXTRA_FILES = [
|
||||
"package.json",
|
||||
]
|
||||
|
||||
# In this array place runtime dependencies, including other packages and NPM packages
|
||||
# which must be available for this code to run.
|
||||
#
|
||||
# To reference other packages use:
|
||||
# "//repo/relative/path/to/package"
|
||||
# eg. "//packages/kbn-utils"
|
||||
#
|
||||
# To reference a NPM package use:
|
||||
# "@npm//name-of-package"
|
||||
# eg. "@npm//lodash"
|
||||
RUNTIME_DEPS = [
|
||||
]
|
||||
|
||||
js_library(
|
||||
name = PKG_DIRNAME,
|
||||
srcs = SRCS + NPM_MODULE_EXTRA_FILES,
|
||||
deps = RUNTIME_DEPS,
|
||||
package_name = PKG_REQUIRE_NAME,
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
pkg_npm(
|
||||
name = "npm_module",
|
||||
deps = [":" + PKG_DIRNAME],
|
||||
)
|
||||
|
||||
filegroup(
|
||||
name = "build",
|
||||
srcs = [":npm_module"],
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
filegroup(
|
||||
name = "build_types",
|
||||
srcs = [":npm_module_types"],
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
|
||||
alias(
|
||||
name = "npm_module_types",
|
||||
actual = ":" + PKG_DIRNAME,
|
||||
visibility = ["//visibility:public"],
|
||||
)
|
||||
3
packages/shared-ux/markdown/types/README.md
Normal file
3
packages/shared-ux/markdown/types/README.md
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
# @kbn/shared-ux-markdown-types
|
||||
|
||||
Empty package generated by @kbn/generate
|
||||
25
packages/shared-ux/markdown/types/index.d.ts
vendored
Normal file
25
packages/shared-ux/markdown/types/index.d.ts
vendored
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
||||
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
||||
* Side Public License, v 1.
|
||||
*/
|
||||
import { EuiMarkdownEditorProps } from '@elastic/eui';
|
||||
|
||||
/** Props for the `Markdown` component. */
|
||||
export type MarkdownProps = Partial<
|
||||
Omit<EuiMarkdownEditorProps, 'editorId' | 'uiPlugins' | 'markdownFormatProps'>
|
||||
> & {
|
||||
/**
|
||||
* @param readOnly is needed to differentiate where markdown is used as a presentation of error messages
|
||||
* This was previous the MarkdownSimple component
|
||||
*/
|
||||
readOnly: boolean;
|
||||
markdownContent?: string;
|
||||
ariaLabelContent?: string;
|
||||
/** Eui allows the height of the markdown component to be set */
|
||||
height?: number | 'full';
|
||||
placeholder?: string | undefined;
|
||||
openLinksInNewTab?: boolean;
|
||||
};
|
||||
7
packages/shared-ux/markdown/types/kibana.jsonc
Normal file
7
packages/shared-ux/markdown/types/kibana.jsonc
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"type": "shared-common",
|
||||
"id": "@kbn/shared-ux-markdown-types",
|
||||
"owner": "@elastic/shared-ux",
|
||||
"runtimeDeps": [],
|
||||
"typeDeps": [],
|
||||
}
|
||||
8
packages/shared-ux/markdown/types/package.json
Normal file
8
packages/shared-ux/markdown/types/package.json
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
{
|
||||
"name": "@kbn/shared-ux-markdown-types",
|
||||
"private": true,
|
||||
"version": "1.0.0",
|
||||
"main": "./target_node/index.js",
|
||||
"browser": "./target_web/index.js",
|
||||
"license": "SSPL-1.0 OR Elastic License 2.0"
|
||||
}
|
||||
17
packages/shared-ux/markdown/types/tsconfig.json
Normal file
17
packages/shared-ux/markdown/types/tsconfig.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"extends": "../../../../tsconfig.bazel.json",
|
||||
"compilerOptions": {
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
"emitDeclarationOnly": true,
|
||||
"outDir": "target_types",
|
||||
"stripInternal": false,
|
||||
"types": [
|
||||
"rxjs",
|
||||
"@types/react",
|
||||
]
|
||||
},
|
||||
"include": [
|
||||
"*.d.ts"
|
||||
]
|
||||
}
|
||||
24
yarn.lock
24
yarn.lock
|
|
@ -3745,6 +3745,18 @@
|
|||
version "0.0.0"
|
||||
uid ""
|
||||
|
||||
"@kbn/shared-ux-markdown-mocks@link:bazel-bin/packages/shared-ux/markdown/mocks":
|
||||
version "0.0.0"
|
||||
uid ""
|
||||
|
||||
"@kbn/shared-ux-markdown-types@link:bazel-bin/packages/shared-ux/markdown/types":
|
||||
version "0.0.0"
|
||||
uid ""
|
||||
|
||||
"@kbn/shared-ux-markdown@link:bazel-bin/packages/shared-ux/markdown/impl":
|
||||
version "0.0.0"
|
||||
uid ""
|
||||
|
||||
"@kbn/shared-ux-page-analytics-no-data-mocks@link:bazel-bin/packages/shared-ux/page/analytics_no_data/mocks":
|
||||
version "0.0.0"
|
||||
uid ""
|
||||
|
|
@ -7897,6 +7909,18 @@
|
|||
version "0.0.0"
|
||||
uid ""
|
||||
|
||||
"@types/kbn__shared-ux-markdown-mocks@link:bazel-bin/packages/shared-ux/markdown/mocks/npm_module_types":
|
||||
version "0.0.0"
|
||||
uid ""
|
||||
|
||||
"@types/kbn__shared-ux-markdown-types@link:bazel-bin/packages/shared-ux/markdown/types/npm_module_types":
|
||||
version "0.0.0"
|
||||
uid ""
|
||||
|
||||
"@types/kbn__shared-ux-markdown@link:bazel-bin/packages/shared-ux/markdown/impl/npm_module_types":
|
||||
version "0.0.0"
|
||||
uid ""
|
||||
|
||||
"@types/kbn__shared-ux-page-analytics-no-data-mocks@link:bazel-bin/packages/shared-ux/page/analytics_no_data/mocks/npm_module_types":
|
||||
version "0.0.0"
|
||||
uid ""
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue