@contentful/field-editor-markdown 1.2.1 → 1.3.1

package/dist/cjs/dialogs/EmdebExternalContentDialog.js

@@ -0,0 +1,202 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    EmbedExternalContentModal: function() {
+        return EmbedExternalContentModal;
+    },
+    openEmbedExternalContentDialog: function() {
+        return openEmbedExternalContentDialog;
+    }
+});
+const _react = _interop_require_wildcard(require("react"));
+const _f36components = require("@contentful/f36-components");
+const _f36tokens = _interop_require_default(require("@contentful/f36-tokens"));
+const _emotion = require("emotion");
+const _types = require("../types");
+const _isValidUrl = require("../utils/isValidUrl");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const styles = {
+    widthFiledGroup: (0, _emotion.css)({
+        display: 'flex',
+        flexWrap: 'nowrap',
+        alignItems: 'flex-start'
+    }),
+    radioButtonGroup: (0, _emotion.css)({
+        display: 'inline-flex',
+        alignItems: 'flex-start',
+        paddingTop: _f36tokens.default.spacingXl
+    }),
+    radioButton: (0, _emotion.css)({
+        marginLeft: _f36tokens.default.spacingM
+    })
+};
+const makeEmbedlyLink = ({ url , width , selectedUnit , attachSocial  })=>{
+    const s = {
+        percent: '%',
+        px: 'px'
+    };
+    return [
+        '<a href="' + url + '" class="embedly-card" ',
+        'data-card-width="' + width + s[selectedUnit] + '" ',
+        'data-card-controls="' + (attachSocial ? '1' : '0') + '"',
+        '>Embedded content: ' + url + '</a>'
+    ].join('');
+};
+const isWidthValid = (width, unit)=>unit === 'percent' ? width <= 100 : true;
+const EmbedExternalContentModal = ({ onClose  })=>{
+    const mainInputRef = (0, _react.useRef)(null);
+    const [url, setUrl] = (0, _react.useState)('https://');
+    const [selectedUnit, setUnit] = (0, _react.useState)('percent');
+    const [urlIsValid, setUrlValidity] = (0, _react.useState)(true);
+    const [width, setWidth] = (0, _react.useState)('100');
+    const [attachSocial, setAttachSocial] = (0, _react.useState)(false);
+    (0, _react.useEffect)(()=>{
+        if (mainInputRef.current?.focus) {
+            mainInputRef.current.focus();
+        }
+    }, [
+        mainInputRef
+    ]);
+    return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_f36components.ModalContent, {
+        testId: "embed-external-dialog"
+    }, _react.default.createElement(_f36components.Form, null, _react.default.createElement(_f36components.FormControl, {
+        id: "external-link-url-field",
+        isRequired: true,
+        isInvalid: !urlIsValid
+    }, _react.default.createElement(_f36components.FormControl.Label, null, "Content URL"), _react.default.createElement(_f36components.TextInput, {
+        name: "external-link-url",
+        value: url,
+        onChange: (e)=>{
+            const value = e.target.value;
+            setUrl(value);
+            setUrlValidity((0, _isValidUrl.isValidUrl)(value));
+        },
+        testId: "external-link-url-field",
+        placeholder: "https://example.com",
+        ref: mainInputRef
+    }), _react.default.createElement(_f36components.FormControl.HelpText, null, "Include protocol (e.g. https://)"), !urlIsValid && _react.default.createElement(_f36components.FormControl.ValidationMessage, null, "URL is invalid")), _react.default.createElement(_f36components.TextLink, {
+        href: "http://embed.ly/providers",
+        target: "_blank",
+        rel: "noopener noreferrer"
+    }, "Supported sources"), _react.default.createElement("div", {
+        className: styles.widthFiledGroup
+    }, _react.default.createElement(_f36components.FormControl, {
+        id: "embedded-content-width",
+        isRequired: true,
+        isInvalid: !isWidthValid(Number(width), selectedUnit)
+    }, _react.default.createElement(_f36components.FormControl.Label, null, "Width"), _react.default.createElement(_f36components.TextInput, {
+        value: width,
+        name: "embedded-content-width",
+        testId: "embedded-content-width",
+        type: "number",
+        width: "small",
+        onChange: (e)=>setWidth(e.target.value)
+    }), !isWidthValid(Number(width), selectedUnit) && _react.default.createElement(_f36components.FormControl.ValidationMessage, null, "Should be equal or less then 100")), _react.default.createElement("div", {
+        className: styles.radioButtonGroup
+    }, _react.default.createElement(_f36components.Radio, {
+        id: "unit-option-percent",
+        value: "percent",
+        isChecked: selectedUnit === 'percent',
+        onChange: ()=>setUnit('percent'),
+        className: styles.radioButton
+    }, "percent"), _react.default.createElement(_f36components.Radio, {
+        id: "unit-option-pixels",
+        value: "pixels",
+        isChecked: selectedUnit === 'px',
+        onChange: ()=>setUnit('px'),
+        className: styles.radioButton
+    }, "pixels"))), _react.default.createElement(_f36components.Checkbox, {
+        id: "attach-social-checkbox",
+        name: "attach-social-checkbox",
+        value: "Yes",
+        isChecked: attachSocial,
+        onChange: ()=>setAttachSocial(!attachSocial),
+        testId: "attach-social-checkbox"
+    }, "Attach social sharing links to this element"), _react.default.createElement(_f36components.Text, {
+        as: "p",
+        fontColor: "gray500",
+        marginTop: "spacingXs"
+    }, "To enable this embedded content in your application make sure to add the\xa0", _react.default.createElement(_f36components.TextLink, {
+        href: "http://embed.ly/docs/products/cards",
+        target: "_blank",
+        rel: "noopener noreferrer"
+    }, "Embedly's platform.js"), "\xa0on your development environment"))), _react.default.createElement(_f36components.ModalControls, null, _react.default.createElement(_f36components.Button, {
+        testId: "emded-external-cancel",
+        onClick: ()=>onClose(false),
+        variant: "secondary",
+        size: "small"
+    }, "Cancel"), _react.default.createElement(_f36components.Button, {
+        testId: "embed-external-confirm",
+        onClick: ()=>onClose(makeEmbedlyLink({
+                url,
+                width: Number(width),
+                selectedUnit,
+                attachSocial
+            })),
+        variant: "positive",
+        size: "small"
+    }, "Insert")));
+};
+const openEmbedExternalContentDialog = (dialogs)=>{
+    return dialogs.openCurrent({
+        title: 'Embed external content',
+        width: 'large',
+        minHeight: '435px',
+        shouldCloseOnEscapePress: true,
+        shouldCloseOnOverlayClick: true,
+        parameters: {
+            type: _types.MarkdownDialogType.embedExternalContent
+        }
+    });
+};

package/dist/cjs/dialogs/InsertLinkModalDialog.js

@@ -0,0 +1,149 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    InsertLinkModal: function() {
+        return InsertLinkModal;
+    },
+    openInsertLinkDialog: function() {
+        return openInsertLinkDialog;
+    }
+});
+const _react = _interop_require_wildcard(require("react"));
+const _f36components = require("@contentful/f36-components");
+const _types = require("../types");
+const _isValidUrl = require("../utils/isValidUrl");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const InsertLinkModal = ({ selectedText , onClose  })=>{
+    const mainInputRef = (0, _react.useRef)(null);
+    const [text, setText] = (0, _react.useState)(selectedText || '');
+    const [url, setUrl] = (0, _react.useState)('');
+    const [touched, setTouched] = (0, _react.useState)(false);
+    const [title, setTitle] = (0, _react.useState)('');
+    const onInsert = (values)=>onClose(values);
+    const urlIsValid = (0, _isValidUrl.isValidUrl)(url);
+    (0, _react.useEffect)(()=>{
+        if (mainInputRef?.current?.focus) {
+            mainInputRef.current.focus();
+        }
+    }, [
+        mainInputRef
+    ]);
+    return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_f36components.ModalContent, {
+        testId: "insert-link-modal"
+    }, _react.default.createElement(_f36components.Form, {
+        onSubmit: ()=>onInsert({
+                url,
+                text,
+                title
+            })
+    }, _react.default.createElement(_f36components.FormControl, {
+        id: "link-text-field",
+        isDisabled: Boolean(selectedText)
+    }, _react.default.createElement(_f36components.FormControl.Label, null, "Link text"), _react.default.createElement(_f36components.TextInput, {
+        name: "link-text",
+        value: text,
+        onChange: (e)=>{
+            setText(e.target.value);
+        },
+        testId: "link-text-field"
+    })), _react.default.createElement(_f36components.FormControl, {
+        id: "target-url-field",
+        isInvalid: touched && !urlIsValid
+    }, _react.default.createElement(_f36components.FormControl.Label, null, "Target URL"), _react.default.createElement(_f36components.TextInput, {
+        name: "target-url",
+        value: url,
+        onChange: (e)=>{
+            setUrl(e.target.value);
+            setTouched(true);
+        },
+        placeholder: "https://",
+        maxLength: 2100,
+        testId: "target-url-field",
+        ref: mainInputRef
+    }), _react.default.createElement(_f36components.FormControl.HelpText, null, "Include protocol (e.g. https://)"), touched && !urlIsValid && _react.default.createElement(_f36components.FormControl.ValidationMessage, null, "Invalid URL")), _react.default.createElement(_f36components.FormControl, {
+        id: "link-title-field"
+    }, _react.default.createElement(_f36components.FormControl.Label, null, "Link title"), _react.default.createElement(_f36components.TextInput, {
+        name: "link-title",
+        value: title,
+        onChange: (e)=>{
+            setTitle(e.target.value);
+        },
+        testId: "link-title-field"
+    }), _react.default.createElement(_f36components.FormControl.HelpText, null, "Extra link information, usually shown as a tooltip on mouse hover")))), _react.default.createElement(_f36components.ModalControls, null, _react.default.createElement(_f36components.Button, {
+        testId: "insert-link-cancel",
+        onClick: ()=>onClose(false),
+        variant: "secondary",
+        size: "small"
+    }, "Cancel"), _react.default.createElement(_f36components.Button, {
+        testId: "insert-link-confirm",
+        onClick: ()=>{
+            onInsert({
+                url,
+                text,
+                title
+            });
+        },
+        isDisabled: !urlIsValid,
+        variant: "positive",
+        size: "small"
+    }, "Insert")));
+};
+const openInsertLinkDialog = (dialogs, params)=>{
+    return dialogs.openCurrent({
+        title: 'Insert link',
+        width: 'large',
+        minHeight: '410px',
+        shouldCloseOnEscapePress: true,
+        shouldCloseOnOverlayClick: true,
+        parameters: {
+            type: _types.MarkdownDialogType.insertLink,
+            ...params
+        }
+    });
+};

package/dist/cjs/dialogs/InsertTableModalDialog.js

@@ -0,0 +1,140 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    InsertTableModal: function() {
+        return InsertTableModal;
+    },
+    openInsertTableDialog: function() {
+        return openInsertTableDialog;
+    }
+});
+const _react = _interop_require_wildcard(require("react"));
+const _f36components = require("@contentful/f36-components");
+const _inRange = _interop_require_default(require("lodash/inRange"));
+const _types = require("../types");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const InsertTableModal = ({ onClose  })=>{
+    const mainInputRef = (0, _react.useRef)(null);
+    const [rows, setRows] = (0, _react.useState)(2);
+    const [cols, setColumns] = (0, _react.useState)(1);
+    const rowsAreValid = (0, _inRange.default)(rows, 2, 100);
+    const colsAreValid = (0, _inRange.default)(cols, 1, 100);
+    (0, _react.useEffect)(()=>{
+        if (mainInputRef.current?.focus) {
+            mainInputRef.current.focus();
+        }
+    }, [
+        mainInputRef
+    ]);
+    return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_f36components.ModalContent, {
+        testId: "insert-table-modal"
+    }, _react.default.createElement(_f36components.Form, null, _react.default.createElement(_f36components.FormControl, {
+        id: "insert-table-rows-number-field",
+        isRequired: true,
+        isInvalid: !rowsAreValid
+    }, _react.default.createElement(_f36components.FormControl.Label, null, "Number of rows"), _react.default.createElement(_f36components.TextInput, {
+        name: "rows",
+        value: rows.toString(),
+        onChange: (e)=>setRows(Number(e.target.value)),
+        testId: "insert-table-rows-number-field",
+        min: 2,
+        max: 100,
+        pattern: "[1-9][0-9]*",
+        type: "number",
+        width: "small",
+        autoComplete: "off",
+        ref: mainInputRef
+    }), !rowsAreValid && _react.default.createElement(_f36components.FormControl.ValidationMessage, null, "Should be between 2 and 100")), _react.default.createElement(_f36components.FormControl, {
+        id: "insert-table-columns-number-field",
+        isRequired: true,
+        isInvalid: !colsAreValid
+    }, _react.default.createElement(_f36components.FormControl.Label, null, "Number of columns"), _react.default.createElement(_f36components.TextInput, {
+        name: "columns",
+        value: cols.toString(),
+        onChange: (e)=>setColumns(Number(e.target.value)),
+        testId: "insert-table-columns-number-field",
+        min: 1,
+        max: 100,
+        pattern: "[1-9][0-9]*",
+        type: "number",
+        width: "small",
+        autoComplete: "off"
+    }), !colsAreValid && _react.default.createElement(_f36components.FormControl.ValidationMessage, null, "Should be between 1 and 100")))), _react.default.createElement(_f36components.ModalControls, null, _react.default.createElement(_f36components.Button, {
+        testId: "insert-table-cancel",
+        onClick: ()=>onClose(false),
+        variant: "secondary",
+        size: "small"
+    }, "Cancel"), _react.default.createElement(_f36components.Button, {
+        testId: "insert-table-confirm",
+        onClick: ()=>onClose({
+                rows,
+                cols
+            }),
+        variant: "positive",
+        size: "small",
+        isDisabled: !rowsAreValid || !colsAreValid
+    }, "Insert")));
+};
+const openInsertTableDialog = (dialogs)=>{
+    return dialogs.openCurrent({
+        title: 'Insert table',
+        width: 'medium',
+        minHeight: '260px',
+        shouldCloseOnEscapePress: true,
+        shouldCloseOnOverlayClick: true,
+        parameters: {
+            type: _types.MarkdownDialogType.insertTable
+        }
+    });
+};

package/dist/cjs/dialogs/SpecialCharacterModalDialog.js

@@ -0,0 +1,146 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    SpecialCharacterModalDialog: function() {
+        return SpecialCharacterModalDialog;
+    },
+    openInsertSpecialCharacter: function() {
+        return openInsertSpecialCharacter;
+    }
+});
+const _react = _interop_require_wildcard(require("react"));
+const _f36components = require("@contentful/f36-components");
+const _f36tokens = _interop_require_default(require("@contentful/f36-tokens"));
+const _emotion = require("emotion");
+const _types = require("../types");
+const _specialCharacters = require("../utils/specialCharacters");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const styles = {
+    buttonPanel: (0, _emotion.css)({
+        display: 'flex',
+        flexWrap: 'wrap'
+    }),
+    charButton: (0, _emotion.css)({
+        border: `1px solid ${_f36tokens.default.gray500}`,
+        width: '4.1rem',
+        height: '4.1rem',
+        fontSize: _f36tokens.default.fontSizeXl,
+        marginTop: _f36tokens.default.spacing2Xs,
+        marginRight: _f36tokens.default.spacing2Xs
+    }),
+    selectedCharButton: (0, _emotion.css)({
+        backgroundColor: _f36tokens.default.gray100
+    }),
+    tooltip: (0, _emotion.css)({
+        zIndex: 1000
+    }),
+    button: (0, _emotion.css)({
+        marginTop: _f36tokens.default.spacingM,
+        marginRight: _f36tokens.default.spacingS
+    })
+};
+const SpecialCharacterModalDialog = ({ onClose  })=>{
+    const [selectedCharacter, setSelectedCharacter] = (0, _react.useState)(_specialCharacters.specialCharacters[0]);
+    return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_f36components.ModalContent, {
+        testId: "insert-special-character-modal"
+    }, _react.default.createElement(_f36components.Flex, {
+        flexDirection: "column",
+        alignItems: "center"
+    }, _react.default.createElement(_f36components.Text, {
+        as: "div",
+        lineHeight: "lineHeight3Xl",
+        fontSize: "fontSize3Xl",
+        marginBottom: "spacingS"
+    }, String.fromCharCode(selectedCharacter.code)), _react.default.createElement(_f36components.Text, {
+        as: "div",
+        marginBottom: "spacingS"
+    }, selectedCharacter.desc)), _react.default.createElement("div", {
+        className: styles.buttonPanel
+    }, _specialCharacters.specialCharacters.map((char)=>_react.default.createElement("div", {
+            key: char.code
+        }, _react.default.createElement(_f36components.Tooltip, {
+            className: styles.tooltip,
+            content: char.desc
+        }, _react.default.createElement(_f36components.Button, {
+            testId: "special-character-button",
+            isActive: char.code === selectedCharacter.code,
+            className: styles.charButton,
+            variant: "transparent",
+            onClick: ()=>setSelectedCharacter(char)
+        }, String.fromCharCode(char.code))))))), _react.default.createElement(_f36components.ModalControls, null, _react.default.createElement(_f36components.Button, {
+        testId: "insert-character-cancel",
+        className: styles.button,
+        onClick: ()=>onClose(false),
+        variant: "secondary",
+        size: "small"
+    }, "Cancel"), _react.default.createElement(_f36components.Button, {
+        className: styles.button,
+        testId: "insert-character-confirm",
+        onClick: ()=>onClose(String.fromCharCode(selectedCharacter.code)),
+        variant: "positive",
+        size: "small"
+    }, "Insert selected")));
+};
+const openInsertSpecialCharacter = (dialogs)=>{
+    return dialogs.openCurrent({
+        title: 'Insert special character',
+        width: 'large',
+        minHeight: '600px',
+        shouldCloseOnEscapePress: true,
+        shouldCloseOnOverlayClick: true,
+        parameters: {
+            type: _types.MarkdownDialogType.insertSpecialCharacter
+        }
+    });
+};