@atlaskit/editor-plugin-help-dialog
Version:
Help Dialog plugin for @atlaskit/editor-core
136 lines • 5.09 kB
JavaScript
/**
* @jsxRuntime classic
* @jsx jsx
*/
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
import { jsx } from '@emotion/react';
import { getBrowserInfo } from '@atlaskit/editor-common/browser';
// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
import { Box, xcss } from '@atlaskit/primitives';
import { componentFromKeymapWrapperStyles } from './styles';
var codeLg = xcss({
borderRadius: 'radius.small',
display: 'inline-block',
height: "var(--ds-space-300, 24px)",
lineHeight: "var(--ds-space-300, 24px)",
textAlign: 'center',
paddingInline: 'space.150',
backgroundColor: 'color.background.neutral'
});
var codeMd = xcss({
backgroundColor: 'color.background.neutral',
borderRadius: 'radius.small',
display: 'inline-block',
height: "var(--ds-space-300, 24px)",
lineHeight: "var(--ds-space-300, 24px)",
width: '50px',
textAlign: 'center'
});
var codeSm = xcss({
backgroundColor: 'color.background.neutral',
borderRadius: 'radius.small',
width: "var(--ds-space-300, 24px)",
display: 'inline-block',
height: "var(--ds-space-300, 24px)",
lineHeight: "var(--ds-space-300, 24px)",
textAlign: 'center'
});
var arrowSymbols = {
arrowup: '↑',
arrowdown: '↓',
arrowleft: '←',
arrowright: '→'
};
var getKeyParts = function getKeyParts(keymap) {
var browser = getBrowserInfo();
var shortcut = keymap[browser.mac ? 'mac' : 'windows'];
if (browser.mac) {
shortcut = shortcut.replace('Alt', 'Opt');
}
// Ignored via go/ees005
// eslint-disable-next-line require-unicode-regexp
return shortcut.replace(/\-(?=.)/g, ' + ').split(' ');
};
export var shortcutNamesWithoutKeymap = ['table', 'emoji', 'mention', 'quickInsert'];
export var getComponentFromKeymap = function getComponentFromKeymap(keymap) {
var keyParts = getKeyParts(keymap);
return (
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
jsx("span", {
css: componentFromKeymapWrapperStyles
}, keyParts.map(function (part, index) {
if (part === '+') {
return (
// Ignored via go/ees005
// eslint-disable-next-line react/no-array-index-key
jsx(Box, {
as: "span",
key: "".concat(keyParts, "-").concat(index)
}, ' + ')
);
} else if (part === 'Cmd') {
return (
// Ignored via go/ees005
// eslint-disable-next-line react/no-array-index-key
jsx(Box, {
as: "span",
xcss: codeSm,
key: "".concat(keyParts, "-").concat(index)
}, "\u2318")
);
} else if (['ctrl', 'alt', 'opt', 'shift'].indexOf(part.toLowerCase()) >= 0) {
return (
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
// Ignored via go/ees005
// eslint-disable-next-line react/no-array-index-key
jsx(Box, {
as: "span",
xcss: codeMd,
key: "".concat(keyParts, "-").concat(index)
}, part)
);
} else if (['f9', 'f10'].indexOf(part.toLowerCase()) >= 0) {
return (
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
// Ignored via go/ees005
// eslint-disable-next-line react/no-array-index-key
jsx(Box, {
as: "span",
xcss: codeLg,
key: "".concat(keyParts, "-").concat(index)
}, part)
);
} else if (part.toLowerCase() === 'enter') {
return jsx(Box, {
as: "span",
"data-editor-help-dialog-enter-keymap": "true",
xcss: codeSm
// Ignored via go/ees005
// eslint-disable-next-line react/no-array-index-key
,
key: "".concat(keyParts, "-").concat(index)
}, '⏎');
} else if (['arrowup', 'arrowdown', 'arrowleft', 'arrowright'].indexOf(part.toLowerCase()) >= 0) {
return (
// Ignored via go/ees005
// eslint-disable-next-line react/no-array-index-key
jsx(Box, {
as: "span",
xcss: codeSm,
key: "".concat(keyParts, "-").concat(index)
}, arrowSymbols[part.toLowerCase()])
);
}
return (
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
// Ignored via go/ees005
// eslint-disable-next-line react/no-array-index-key
jsx(Box, {
as: "span",
xcss: codeSm,
key: "".concat(keyParts, "-").concat(index)
}, part.toUpperCase())
);
}))
);
};