@ember-eui/core 1.2.6 → 1.3.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +9 -0
- package/addon/components/common.ts +13 -0
- package/addon/components/eui-button/index.hbs +2 -0
- package/addon/components/eui-button-content/index.hbs +1 -0
- package/addon/components/eui-button-empty/index.hbs +2 -0
- package/addon/components/eui-button-icon/index.hbs +2 -0
- package/addon/components/eui-code/index.hbs +9 -0
- package/addon/components/eui-code-block/index.d.ts +2 -0
- package/addon/components/eui-code-block/index.hbs +10 -0
- package/addon/components/eui-code-block-impl/code-block-controls/index.hbs +33 -0
- package/addon/components/eui-code-block-impl/index.hbs +111 -0
- package/addon/components/eui-code-block-impl/index.ts +121 -0
- package/addon/components/eui-copy/index.hbs +8 -0
- package/addon/components/eui-copy/index.ts +37 -0
- package/addon/components/eui-icon/index.hbs +37 -32
- package/addon/components/eui-inner-text/index.hbs +1 -0
- package/addon/components/eui-inner-text/index.ts +61 -0
- package/addon/components/eui-markdown-editor/index.hbs +63 -0
- package/addon/components/eui-markdown-editor/index.ts +221 -0
- package/addon/components/eui-markdown-editor-drop-zone/index.hbs +21 -0
- package/addon/components/eui-markdown-editor-drop-zone/index.ts +5 -0
- package/addon/components/eui-markdown-editor-footer/index.hbs +108 -0
- package/addon/components/eui-markdown-editor-footer/index.ts +20 -0
- package/addon/components/eui-markdown-editor-text-area/index.hbs +8 -0
- package/addon/components/eui-markdown-editor-toolbar/index.hbs +86 -0
- package/addon/components/eui-markdown-editor-toolbar/index.ts +97 -0
- package/addon/components/eui-markdown-format/index.hbs +13 -0
- package/addon/components/eui-markdown-format/index.ts +45 -0
- package/addon/components/eui-markdown-format/markdown-checkbox/index.hbs +8 -0
- package/addon/components/eui-markdown-format/markdown-checkbox/index.ts +28 -0
- package/addon/components/eui-markdown-format/markdown-code/index.hbs +3 -0
- package/addon/components/eui-markdown-format/markdown-code-block/index.hbs +7 -0
- package/addon/components/eui-markdown-format/markdown-tooltip/index.hbs +8 -0
- package/addon/components/markdown-checkmark-icon/index.hbs +0 -0
- package/addon/modifiers/get-cursor-node.ts +54 -0
- package/addon/modifiers/resize-observer.ts +6 -2
- package/addon/utils/copy-to-clipboard.ts +70 -0
- package/addon/utils/css-mappings/eui-code-block-impl.ts +24 -0
- package/addon/utils/css-mappings/index.ts +2 -0
- package/addon/utils/markdown/markdown-actions.ts +616 -0
- package/addon/utils/markdown/markdown-modes.ts +23 -0
- package/addon/utils/markdown/markdown-types.ts +140 -0
- package/addon/utils/markdown/markdown-unified-plugins.d.ts +27 -0
- package/addon/utils/markdown/plugins/markdown-add-components.ts +63 -0
- package/addon/utils/markdown/plugins/markdown-checkbox.ts +80 -0
- package/addon/utils/markdown/plugins/markdown-default-plugins.ts +100 -0
- package/addon/utils/markdown/plugins/markdown-tooltip.ts +113 -0
- package/addon/utils/markdown/plugins/to-dom.ts +93 -0
- package/app/components/eui-code/index.js +1 -0
- package/app/components/eui-code-block/index.js +1 -0
- package/app/components/eui-code-block-impl/code-block-controls/index.js +1 -0
- package/app/components/eui-code-block-impl/index.js +1 -0
- package/app/components/eui-copy/index.js +1 -0
- package/app/components/eui-inner-text/index.js +1 -0
- package/app/components/eui-markdown-editor/index.js +1 -0
- package/app/components/eui-markdown-editor-drop-zone/index.js +1 -0
- package/app/components/eui-markdown-editor-footer/index.js +1 -0
- package/app/components/eui-markdown-editor-text-area/index.js +1 -0
- package/app/components/eui-markdown-editor-toolbar/index.js +1 -0
- package/app/components/eui-markdown-format/index.js +1 -0
- package/app/components/eui-markdown-format/markdown-checkbox/index.js +1 -0
- package/app/components/eui-markdown-format/markdown-code/index.js +1 -0
- package/app/components/eui-markdown-format/markdown-code-block/index.js +1 -0
- package/app/components/eui-markdown-format/markdown-tooltip/index.js +1 -0
- package/app/modifiers/get-cursor-node.js +1 -0
- package/app/styles/ember-eui.scss +13 -0
- package/docs/editors/code/code-block-demo/demo1.md +62 -0
- package/docs/editors/code/code-block.md +1 -0
- package/docs/editors/code/inline-demo/demo1.md +49 -0
- package/docs/editors/code/inline.md +1 -0
- package/docs/editors/markdown-editor/base-editor-demo/demo1.md +86 -0
- package/docs/editors/markdown-editor/base-editor.md +1 -0
- package/package.json +31 -5
- package/public/markdown-checkmark.svg +3 -0
- package/public/markdown-logo.svg +3 -0
|
File without changes
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { modifier } from 'ember-modifier';
|
|
2
|
+
import { EuiMarkdownAstNode } from '../utils/markdown/markdown-types';
|
|
3
|
+
|
|
4
|
+
export const getCursorNode = (
|
|
5
|
+
textareaRef: HTMLInputElement,
|
|
6
|
+
parsed: any
|
|
7
|
+
): EuiMarkdownAstNode => {
|
|
8
|
+
const { selectionStart } = textareaRef;
|
|
9
|
+
|
|
10
|
+
let node: EuiMarkdownAstNode = parsed.result ?? parsed.contents;
|
|
11
|
+
|
|
12
|
+
//eslint-disable-next-line
|
|
13
|
+
outer: while (true) {
|
|
14
|
+
if (node.children) {
|
|
15
|
+
for (let i = 0; i < node.children.length; i++) {
|
|
16
|
+
const child = node.children[i];
|
|
17
|
+
if (
|
|
18
|
+
child.position.start.offset < (selectionStart as number) &&
|
|
19
|
+
(selectionStart as number) < child.position.end.offset
|
|
20
|
+
) {
|
|
21
|
+
if (child.type === 'text') break outer; // don't dive into `text` nodes
|
|
22
|
+
node = child;
|
|
23
|
+
continue outer;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
break;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
return node;
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
function wrapper(
|
|
34
|
+
textarea: HTMLInputElement,
|
|
35
|
+
parsed: any,
|
|
36
|
+
callback: (node: EuiMarkdownAstNode) => void
|
|
37
|
+
) {
|
|
38
|
+
const node = getCursorNode(textarea, parsed);
|
|
39
|
+
callback(node);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
export default modifier(function getCursorNodeModifier(
|
|
43
|
+
textarea: HTMLInputElement,
|
|
44
|
+
[parsed, onSelectedNode]: [boolean, () => void]
|
|
45
|
+
) {
|
|
46
|
+
const fn = wrapper.bind(null, textarea, parsed, onSelectedNode);
|
|
47
|
+
textarea.addEventListener('keyup', fn);
|
|
48
|
+
textarea.addEventListener('mouseup', fn);
|
|
49
|
+
|
|
50
|
+
return () => {
|
|
51
|
+
textarea.removeEventListener('keyup', fn);
|
|
52
|
+
textarea.removeEventListener('mouseup', fn);
|
|
53
|
+
};
|
|
54
|
+
});
|
|
@@ -3,7 +3,8 @@ import { action } from '@ember/object';
|
|
|
3
3
|
|
|
4
4
|
// IE11 and Safari don't support the `ResizeObserver` API at the time of writing
|
|
5
5
|
const hasResizeObserver =
|
|
6
|
-
typeof window !== 'undefined' &&
|
|
6
|
+
typeof window !== 'undefined' &&
|
|
7
|
+
typeof (window as any).ResizeObserver !== 'undefined';
|
|
7
8
|
|
|
8
9
|
export interface Observer {
|
|
9
10
|
disconnect: () => void;
|
|
@@ -64,7 +65,10 @@ export default class ResizeObserver extends Modifier<ResizeObserverArgs> {
|
|
|
64
65
|
let [dimension] = this.args.positional;
|
|
65
66
|
const doesWidthMatter = dimension !== 'height';
|
|
66
67
|
const doesHeightMatter = dimension !== 'width';
|
|
67
|
-
if (
|
|
68
|
+
if (
|
|
69
|
+
(doesWidthMatter && width !== this.width) ||
|
|
70
|
+
(doesHeightMatter && height !== this.height)
|
|
71
|
+
) {
|
|
68
72
|
this.width = width;
|
|
69
73
|
this.height = height;
|
|
70
74
|
this.args.named?.onResize({ width, height });
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Licensed to Elasticsearch B.V. under one or more contributor
|
|
3
|
+
* license agreements. See the NOTICE file distributed with
|
|
4
|
+
* this work for additional information regarding copyright
|
|
5
|
+
* ownership. Elasticsearch B.V. licenses this file to you under
|
|
6
|
+
* the Apache License, Version 2.0 (the "License"); you may
|
|
7
|
+
* not use this file except in compliance with the License.
|
|
8
|
+
* You may obtain a copy of the License at
|
|
9
|
+
*
|
|
10
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
11
|
+
*
|
|
12
|
+
* Unless required by applicable law or agreed to in writing,
|
|
13
|
+
* software distributed under the License is distributed on an
|
|
14
|
+
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
15
|
+
* KIND, either express or implied. See the License for the
|
|
16
|
+
* specific language governing permissions and limitations
|
|
17
|
+
* under the License.
|
|
18
|
+
*/
|
|
19
|
+
|
|
20
|
+
function createHiddenTextElement(text: string): HTMLSpanElement {
|
|
21
|
+
const textElement = document.createElement('span');
|
|
22
|
+
textElement.textContent = text;
|
|
23
|
+
// @ts-ignore .all is a real property - https://drafts.csswg.org/css-cascade/#all-shorthand
|
|
24
|
+
textElement.style.all = 'unset';
|
|
25
|
+
// prevents scrolling to the end of the page
|
|
26
|
+
textElement.style.position = 'fixed';
|
|
27
|
+
textElement.style.top = '0';
|
|
28
|
+
textElement.style.clip = 'rect(0, 0, 0, 0)';
|
|
29
|
+
// used to preserve spaces and line breaks
|
|
30
|
+
textElement.style.whiteSpace = 'pre';
|
|
31
|
+
// do not inherit user-select (it may be `none`)
|
|
32
|
+
textElement.style.webkitUserSelect = 'text';
|
|
33
|
+
// @ts-ignore this one doesn't appear in the TS definitions for some reason
|
|
34
|
+
textElement.style.MozUserSelect = 'text';
|
|
35
|
+
// @ts-ignore this one doesn't appear in the TS definitions for some reason
|
|
36
|
+
textElement.style.msUserSelect = 'text';
|
|
37
|
+
textElement.style.userSelect = 'text';
|
|
38
|
+
return textElement;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
export function copyToClipboard(text: string): boolean {
|
|
42
|
+
let isCopied = true;
|
|
43
|
+
const range = document.createRange();
|
|
44
|
+
const selection = window.getSelection();
|
|
45
|
+
const elementToBeCopied = createHiddenTextElement(text);
|
|
46
|
+
|
|
47
|
+
document.body.appendChild(elementToBeCopied);
|
|
48
|
+
range.selectNode(elementToBeCopied);
|
|
49
|
+
if (selection) {
|
|
50
|
+
selection.removeAllRanges();
|
|
51
|
+
selection.addRange(range);
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
if (!document.execCommand('copy')) {
|
|
55
|
+
isCopied = false;
|
|
56
|
+
console.warn('Unable to copy to clipboard.');
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
if (selection) {
|
|
60
|
+
if (typeof selection.removeRange === 'function') {
|
|
61
|
+
selection.removeRange(range);
|
|
62
|
+
} else {
|
|
63
|
+
selection.removeAllRanges();
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
document.body.removeChild(elementToBeCopied);
|
|
68
|
+
|
|
69
|
+
return isCopied;
|
|
70
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
export const baseClass = 'euiCodeBlock';
|
|
2
|
+
|
|
3
|
+
export const fontSizeMapping = {
|
|
4
|
+
s: `${baseClass}--fontSmall`,
|
|
5
|
+
m: `${baseClass}--fontMedium`,
|
|
6
|
+
l: `${baseClass}--fontLarge`
|
|
7
|
+
};
|
|
8
|
+
|
|
9
|
+
export const paddingSizeMapping = {
|
|
10
|
+
none: '',
|
|
11
|
+
s: `${baseClass}--paddingSmall`,
|
|
12
|
+
m: `${baseClass}--paddingMedium`,
|
|
13
|
+
l: `${baseClass}--paddingLarge`
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
const mapping: ComponentMapping = {
|
|
17
|
+
base: baseClass,
|
|
18
|
+
properties: {
|
|
19
|
+
fontSize: fontSizeMapping,
|
|
20
|
+
paddingSize: paddingSizeMapping
|
|
21
|
+
}
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export default mapping;
|
|
@@ -52,8 +52,10 @@ import EuiRangeLevels from './eui-range-levels';
|
|
|
52
52
|
import EuiToolTip from './eui-tool-tip';
|
|
53
53
|
import EuiToast from './eui-toast';
|
|
54
54
|
import EuiGlobalToastList from './eui-global-toast-list';
|
|
55
|
+
import EuiCodeBlockImpl from './eui-code-block-impl';
|
|
55
56
|
|
|
56
57
|
const mapping: Mapping = {
|
|
58
|
+
EuiCodeBlockImpl,
|
|
57
59
|
EuiAccordion,
|
|
58
60
|
EuiIcon,
|
|
59
61
|
EuiModal,
|