@atlaskit/renderer 97.0.0 → 99.0.0
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 +28 -0
- package/dist/cjs/react/hooks/use-bidi-warnings.js +45 -0
- package/dist/cjs/react/hooks/use-in-viewport.js +63 -0
- package/dist/cjs/react/index.js +5 -2
- package/dist/cjs/react/nodes/codeBlock/codeBlock.js +49 -0
- package/dist/cjs/react/nodes/codeBlock/components/codeBlockContainer.js +55 -0
- package/dist/cjs/react/nodes/codeBlock/components/lightWeightCodeBlock.js +82 -0
- package/dist/cjs/react/nodes/codeBlock/windowedCodeBlock.js +103 -0
- package/dist/cjs/react/nodes/codeBlockCopyButton.js +24 -27
- package/dist/cjs/react/nodes/heading.js +15 -18
- package/dist/cjs/react/nodes/index.js +34 -5
- package/dist/cjs/react/nodes/layoutColumn.js +7 -2
- package/dist/cjs/react/utils/clipboard.js +24 -0
- package/dist/cjs/ui/Renderer/index.js +12 -7
- package/dist/cjs/ui/Renderer/style.js +4 -2
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/react/hooks/use-bidi-warnings.js +28 -0
- package/dist/es2019/react/hooks/use-in-viewport.js +25 -0
- package/dist/es2019/react/index.js +5 -2
- package/dist/es2019/react/nodes/codeBlock/codeBlock.js +33 -0
- package/dist/es2019/react/nodes/codeBlock/components/codeBlockContainer.js +44 -0
- package/dist/es2019/react/nodes/codeBlock/components/lightWeightCodeBlock.js +58 -0
- package/dist/es2019/react/nodes/codeBlock/windowedCodeBlock.js +58 -0
- package/dist/es2019/react/nodes/codeBlockCopyButton.js +24 -28
- package/dist/es2019/react/nodes/heading.js +16 -20
- package/dist/es2019/react/nodes/index.js +22 -5
- package/dist/es2019/react/nodes/layoutColumn.js +7 -3
- package/dist/es2019/react/utils/clipboard.js +9 -0
- package/dist/es2019/ui/Renderer/index.js +9 -4
- package/dist/es2019/ui/Renderer/style.js +3 -0
- package/dist/es2019/version.json +1 -1
- package/dist/esm/react/hooks/use-bidi-warnings.js +29 -0
- package/dist/esm/react/hooks/use-in-viewport.js +51 -0
- package/dist/esm/react/index.js +5 -2
- package/dist/esm/react/nodes/codeBlock/codeBlock.js +32 -0
- package/dist/esm/react/nodes/codeBlock/components/codeBlockContainer.js +40 -0
- package/dist/esm/react/nodes/codeBlock/components/lightWeightCodeBlock.js +57 -0
- package/dist/esm/react/nodes/codeBlock/windowedCodeBlock.js +80 -0
- package/dist/esm/react/nodes/codeBlockCopyButton.js +24 -27
- package/dist/esm/react/nodes/heading.js +15 -18
- package/dist/esm/react/nodes/index.js +33 -5
- package/dist/esm/react/nodes/layoutColumn.js +8 -3
- package/dist/esm/react/utils/clipboard.js +15 -0
- package/dist/esm/ui/Renderer/index.js +12 -6
- package/dist/esm/ui/Renderer/style.js +3 -2
- package/dist/esm/version.json +1 -1
- package/dist/types/react/hooks/use-bidi-warnings.d.ts +10 -0
- package/dist/types/react/hooks/use-in-viewport.d.ts +5 -0
- package/dist/types/react/index.d.ts +5 -1
- package/dist/types/react/nodes/{codeBlock.d.ts → codeBlock/codeBlock.d.ts} +1 -1
- package/dist/types/react/nodes/codeBlock/components/codeBlockContainer.d.ts +12 -0
- package/dist/types/react/nodes/codeBlock/components/lightWeightCodeBlock.d.ts +9 -0
- package/dist/types/react/nodes/codeBlock/windowedCodeBlock.d.ts +4 -0
- package/dist/types/react/nodes/index.d.ts +8 -5
- package/dist/types/react/utils/clipboard.d.ts +1 -0
- package/dist/types/ui/Renderer/types.d.ts +4 -0
- package/dist/types/ui/renderer-props.d.ts +2 -1
- package/package.json +16 -15
- package/report.api.md +590 -119
- package/dist/cjs/react/nodes/codeBlock.js +0 -74
- package/dist/cjs/react/nodes/copy-text-provider.js +0 -174
- package/dist/es2019/react/nodes/codeBlock.js +0 -59
- package/dist/es2019/react/nodes/copy-text-provider.js +0 -93
- package/dist/esm/react/nodes/codeBlock.js +0 -55
- package/dist/esm/react/nodes/copy-text-provider.js +0 -140
- package/dist/types/react/nodes/copy-text-provider.d.ts +0 -20
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.default = void 0;
|
|
9
|
-
|
|
10
|
-
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
11
|
-
|
|
12
|
-
var _react = require("@emotion/react");
|
|
13
|
-
|
|
14
|
-
var _reactIntlNext = require("react-intl-next");
|
|
15
|
-
|
|
16
|
-
var _code = require("@atlaskit/code");
|
|
17
|
-
|
|
18
|
-
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
19
|
-
|
|
20
|
-
var _colors = require("@atlaskit/theme/colors");
|
|
21
|
-
|
|
22
|
-
var _components = require("@atlaskit/theme/components");
|
|
23
|
-
|
|
24
|
-
var _constants = require("@atlaskit/theme/constants");
|
|
25
|
-
|
|
26
|
-
var _messages = require("@atlaskit/editor-common/messages");
|
|
27
|
-
|
|
28
|
-
var _useFeatureFlags = require("../../use-feature-flags");
|
|
29
|
-
|
|
30
|
-
var _codeBlockCopyButton = _interopRequireDefault(require("./codeBlockCopyButton"));
|
|
31
|
-
|
|
32
|
-
var _templateObject;
|
|
33
|
-
|
|
34
|
-
// TODO: Quality ticket https://product-fabric.atlassian.net/browse/DSP-4118
|
|
35
|
-
|
|
36
|
-
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
37
|
-
var codeBlockStyle = function codeBlockStyle(props) {
|
|
38
|
-
return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n tab-size: 4;\n [data-ds--code--code-block] {\n font-size: ", ";\n line-height: 1.5rem;\n background-image: ", ";\n background-attachment: local, scroll, scroll;\n background-position: 100% 0, 100% 0, 0 0;\n }\n "])), (0, _editorSharedStyles.relativeFontSizeToBase16)((0, _constants.fontSize)()), (0, _editorSharedStyles.overflowShadow)({
|
|
39
|
-
background: (0, _components.themed)({
|
|
40
|
-
light: _colors.N20,
|
|
41
|
-
dark: _colors.DN50
|
|
42
|
-
})(props),
|
|
43
|
-
width: "".concat((0, _constants.gridSize)(), "px")
|
|
44
|
-
}));
|
|
45
|
-
};
|
|
46
|
-
/* eslint-enable */
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
function CodeBlock(props) {
|
|
50
|
-
var text = props.text,
|
|
51
|
-
language = props.language,
|
|
52
|
-
_props$allowCopyToCli = props.allowCopyToClipboard,
|
|
53
|
-
allowCopyToClipboard = _props$allowCopyToCli === void 0 ? false : _props$allowCopyToCli,
|
|
54
|
-
codeBidiWarningTooltipEnabled = props.codeBidiWarningTooltipEnabled;
|
|
55
|
-
var featureFlags = (0, _useFeatureFlags.useFeatureFlags)();
|
|
56
|
-
var codeBidiWarningLabel = props.intl.formatMessage(_messages.codeBidiWarningMessages.label);
|
|
57
|
-
var className = ['code-block', props.className].join(' ');
|
|
58
|
-
return (0, _react.jsx)("div", {
|
|
59
|
-
className: className,
|
|
60
|
-
css: codeBlockStyle
|
|
61
|
-
}, allowCopyToClipboard ? (0, _react.jsx)(_codeBlockCopyButton.default, {
|
|
62
|
-
content: text
|
|
63
|
-
}) : null, (0, _react.jsx)(_code.CodeBlock, {
|
|
64
|
-
language: language,
|
|
65
|
-
text: text,
|
|
66
|
-
codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
|
|
67
|
-
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
68
|
-
codeBidiWarningTooltipEnabled: codeBidiWarningTooltipEnabled
|
|
69
|
-
}));
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
var _default = (0, _reactIntlNext.injectIntl)(CodeBlock);
|
|
73
|
-
|
|
74
|
-
exports.default = _default;
|
|
@@ -1,174 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.ieClipboardApiSupported = exports.copyToClipboardLegacy = exports.copyToClipboardIE = exports.copyToClipboard = exports.clipboardApiSupported = exports.CopyTextProvider = exports.CopyTextContext = exports.CopyTextConsumer = exports.CopyArea = void 0;
|
|
9
|
-
|
|
10
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
-
|
|
12
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
-
|
|
14
|
-
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
15
|
-
|
|
16
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
17
|
-
|
|
18
|
-
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
19
|
-
|
|
20
|
-
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
21
|
-
|
|
22
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
23
|
-
|
|
24
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
25
|
-
|
|
26
|
-
var _react = _interopRequireDefault(require("react"));
|
|
27
|
-
|
|
28
|
-
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
|
|
29
|
-
|
|
30
|
-
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
31
|
-
|
|
32
|
-
var clipboardApiSupported = function clipboardApiSupported() {
|
|
33
|
-
return !!navigator.clipboard && typeof navigator.clipboard.writeText === 'function';
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
exports.clipboardApiSupported = clipboardApiSupported;
|
|
37
|
-
|
|
38
|
-
var ieClipboardApiSupported = function ieClipboardApiSupported() {
|
|
39
|
-
return window.clipboardData && typeof window.clipboardData.setData === 'function';
|
|
40
|
-
};
|
|
41
|
-
|
|
42
|
-
exports.ieClipboardApiSupported = ieClipboardApiSupported;
|
|
43
|
-
var isClipboardApiSupported = clipboardApiSupported();
|
|
44
|
-
var isIEClipboardApiSupported = ieClipboardApiSupported(); // for IE we can remove this if we dropped IE support.
|
|
45
|
-
|
|
46
|
-
var copyToClipboardIE = function copyToClipboardIE(textToCopy) {
|
|
47
|
-
return new Promise(function (resolve, reject) {
|
|
48
|
-
if (ieClipboardApiSupported()) {
|
|
49
|
-
window.clipboardData.setData('text', textToCopy);
|
|
50
|
-
resolve();
|
|
51
|
-
} else {
|
|
52
|
-
reject('IE clipboard api is not supported');
|
|
53
|
-
}
|
|
54
|
-
});
|
|
55
|
-
}; // This function is needed for safari .
|
|
56
|
-
// This function is a synchronous function, but it is wrapped into a promise
|
|
57
|
-
// to be consistent with "copyToClipboard".
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
exports.copyToClipboardIE = copyToClipboardIE;
|
|
61
|
-
|
|
62
|
-
var copyToClipboardLegacy = function copyToClipboardLegacy(textToCopy, copyAreaRef) {
|
|
63
|
-
return new Promise(function (resolve, reject) {
|
|
64
|
-
if (copyAreaRef) {
|
|
65
|
-
var textArea = document.createElement('textarea');
|
|
66
|
-
textArea.readOnly = true;
|
|
67
|
-
textArea.defaultValue = textToCopy;
|
|
68
|
-
copyAreaRef.appendChild(textArea);
|
|
69
|
-
textArea.select();
|
|
70
|
-
var wasCopied = document.execCommand('copy');
|
|
71
|
-
copyAreaRef.removeChild(textArea);
|
|
72
|
-
|
|
73
|
-
if (wasCopied) {
|
|
74
|
-
resolve();
|
|
75
|
-
} else {
|
|
76
|
-
reject('Failed to copy');
|
|
77
|
-
}
|
|
78
|
-
} else {
|
|
79
|
-
reject('Copy area reference is not defined');
|
|
80
|
-
}
|
|
81
|
-
});
|
|
82
|
-
};
|
|
83
|
-
|
|
84
|
-
exports.copyToClipboardLegacy = copyToClipboardLegacy;
|
|
85
|
-
|
|
86
|
-
var copyToClipboard = function copyToClipboard(textToCopy) {
|
|
87
|
-
return new Promise(function (resolve, reject) {
|
|
88
|
-
if (clipboardApiSupported()) {
|
|
89
|
-
navigator.clipboard.writeText(textToCopy).then(function () {
|
|
90
|
-
return resolve();
|
|
91
|
-
}, function (e) {
|
|
92
|
-
return reject(e);
|
|
93
|
-
});
|
|
94
|
-
} else {
|
|
95
|
-
reject('Clipboard api is not supported');
|
|
96
|
-
}
|
|
97
|
-
});
|
|
98
|
-
};
|
|
99
|
-
|
|
100
|
-
exports.copyToClipboard = copyToClipboard;
|
|
101
|
-
|
|
102
|
-
var CopyTextContext = /*#__PURE__*/_react.default.createContext({
|
|
103
|
-
copyTextToClipboard: function copyTextToClipboard() {
|
|
104
|
-
return new Promise(function (_resolve, reject) {
|
|
105
|
-
return reject('"copyTextToClipboard" is not initialized');
|
|
106
|
-
});
|
|
107
|
-
}
|
|
108
|
-
});
|
|
109
|
-
|
|
110
|
-
exports.CopyTextContext = CopyTextContext;
|
|
111
|
-
var Provider = CopyTextContext.Provider,
|
|
112
|
-
Consumer = CopyTextContext.Consumer;
|
|
113
|
-
exports.CopyTextConsumer = Consumer;
|
|
114
|
-
|
|
115
|
-
var CopyArea = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
116
|
-
return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
|
|
117
|
-
ref: ref // eslint-disable-next-line @atlaskit/design-system/use-visually-hidden
|
|
118
|
-
,
|
|
119
|
-
style: {
|
|
120
|
-
position: 'absolute',
|
|
121
|
-
left: '-9999px',
|
|
122
|
-
width: '1px',
|
|
123
|
-
height: '1px',
|
|
124
|
-
overflow: 'hidden'
|
|
125
|
-
}
|
|
126
|
-
}, props));
|
|
127
|
-
});
|
|
128
|
-
|
|
129
|
-
exports.CopyArea = CopyArea;
|
|
130
|
-
|
|
131
|
-
var CopyTextProvider = /*#__PURE__*/function (_React$Component) {
|
|
132
|
-
(0, _inherits2.default)(CopyTextProvider, _React$Component);
|
|
133
|
-
|
|
134
|
-
var _super = _createSuper(CopyTextProvider);
|
|
135
|
-
|
|
136
|
-
function CopyTextProvider() {
|
|
137
|
-
var _this;
|
|
138
|
-
|
|
139
|
-
(0, _classCallCheck2.default)(this, CopyTextProvider);
|
|
140
|
-
|
|
141
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
142
|
-
args[_key] = arguments[_key];
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
_this = _super.call.apply(_super, [this].concat(args));
|
|
146
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "copyAreaRef", /*#__PURE__*/_react.default.createRef());
|
|
147
|
-
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "copyTextToClipboard", function (textToCopy) {
|
|
148
|
-
if (isClipboardApiSupported) {
|
|
149
|
-
return copyToClipboard(textToCopy);
|
|
150
|
-
} else if (isIEClipboardApiSupported) {
|
|
151
|
-
return copyToClipboardIE(textToCopy);
|
|
152
|
-
} else {
|
|
153
|
-
return copyToClipboardLegacy(textToCopy, _this.copyAreaRef.current);
|
|
154
|
-
}
|
|
155
|
-
});
|
|
156
|
-
return _this;
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
(0, _createClass2.default)(CopyTextProvider, [{
|
|
160
|
-
key: "render",
|
|
161
|
-
value: function render() {
|
|
162
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !isClipboardApiSupported && /*#__PURE__*/_react.default.createElement(CopyArea, {
|
|
163
|
-
ref: this.copyAreaRef
|
|
164
|
-
}), /*#__PURE__*/_react.default.createElement(Provider, {
|
|
165
|
-
value: {
|
|
166
|
-
copyTextToClipboard: this.copyTextToClipboard
|
|
167
|
-
}
|
|
168
|
-
}, this.props.children));
|
|
169
|
-
}
|
|
170
|
-
}]);
|
|
171
|
-
return CopyTextProvider;
|
|
172
|
-
}(_react.default.Component);
|
|
173
|
-
|
|
174
|
-
exports.CopyTextProvider = CopyTextProvider;
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
/** @jsx jsx */
|
|
2
|
-
import { jsx, css } from '@emotion/react';
|
|
3
|
-
import { injectIntl } from 'react-intl-next';
|
|
4
|
-
import { CodeBlock as AkCodeBlock } from '@atlaskit/code';
|
|
5
|
-
import { overflowShadow, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
|
|
6
|
-
import { N20, DN50 } from '@atlaskit/theme/colors';
|
|
7
|
-
import { themed } from '@atlaskit/theme/components';
|
|
8
|
-
import { fontSize, gridSize } from '@atlaskit/theme/constants';
|
|
9
|
-
import { codeBidiWarningMessages } from '@atlaskit/editor-common/messages';
|
|
10
|
-
import { useFeatureFlags } from '../../use-feature-flags';
|
|
11
|
-
import CopyButton from './codeBlockCopyButton';
|
|
12
|
-
|
|
13
|
-
// TODO: Quality ticket https://product-fabric.atlassian.net/browse/DSP-4118
|
|
14
|
-
|
|
15
|
-
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
16
|
-
const codeBlockStyle = props => css`
|
|
17
|
-
tab-size: 4;
|
|
18
|
-
[data-ds--code--code-block] {
|
|
19
|
-
font-size: ${relativeFontSizeToBase16(fontSize())};
|
|
20
|
-
line-height: 1.5rem;
|
|
21
|
-
background-image: ${overflowShadow({
|
|
22
|
-
background: themed({
|
|
23
|
-
light: N20,
|
|
24
|
-
dark: DN50
|
|
25
|
-
})(props),
|
|
26
|
-
width: `${gridSize()}px`
|
|
27
|
-
})};
|
|
28
|
-
background-attachment: local, scroll, scroll;
|
|
29
|
-
background-position: 100% 0, 100% 0, 0 0;
|
|
30
|
-
}
|
|
31
|
-
`;
|
|
32
|
-
/* eslint-enable */
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
function CodeBlock(props) {
|
|
36
|
-
const {
|
|
37
|
-
text,
|
|
38
|
-
language,
|
|
39
|
-
allowCopyToClipboard = false,
|
|
40
|
-
codeBidiWarningTooltipEnabled
|
|
41
|
-
} = props;
|
|
42
|
-
const featureFlags = useFeatureFlags();
|
|
43
|
-
const codeBidiWarningLabel = props.intl.formatMessage(codeBidiWarningMessages.label);
|
|
44
|
-
const className = ['code-block', props.className].join(' ');
|
|
45
|
-
return jsx("div", {
|
|
46
|
-
className: className,
|
|
47
|
-
css: codeBlockStyle
|
|
48
|
-
}, allowCopyToClipboard ? jsx(CopyButton, {
|
|
49
|
-
content: text
|
|
50
|
-
}) : null, jsx(AkCodeBlock, {
|
|
51
|
-
language: language,
|
|
52
|
-
text: text,
|
|
53
|
-
codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
|
|
54
|
-
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
55
|
-
codeBidiWarningTooltipEnabled: codeBidiWarningTooltipEnabled
|
|
56
|
-
}));
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
export default injectIntl(CodeBlock);
|
|
@@ -1,93 +0,0 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
-
import React from 'react';
|
|
4
|
-
export const clipboardApiSupported = () => !!navigator.clipboard && typeof navigator.clipboard.writeText === 'function';
|
|
5
|
-
export const ieClipboardApiSupported = () => window.clipboardData && typeof window.clipboardData.setData === 'function';
|
|
6
|
-
const isClipboardApiSupported = clipboardApiSupported();
|
|
7
|
-
const isIEClipboardApiSupported = ieClipboardApiSupported(); // for IE we can remove this if we dropped IE support.
|
|
8
|
-
|
|
9
|
-
export const copyToClipboardIE = textToCopy => new Promise((resolve, reject) => {
|
|
10
|
-
if (ieClipboardApiSupported()) {
|
|
11
|
-
window.clipboardData.setData('text', textToCopy);
|
|
12
|
-
resolve();
|
|
13
|
-
} else {
|
|
14
|
-
reject('IE clipboard api is not supported');
|
|
15
|
-
}
|
|
16
|
-
}); // This function is needed for safari .
|
|
17
|
-
// This function is a synchronous function, but it is wrapped into a promise
|
|
18
|
-
// to be consistent with "copyToClipboard".
|
|
19
|
-
|
|
20
|
-
export const copyToClipboardLegacy = (textToCopy, copyAreaRef) => new Promise((resolve, reject) => {
|
|
21
|
-
if (copyAreaRef) {
|
|
22
|
-
const textArea = document.createElement('textarea');
|
|
23
|
-
textArea.readOnly = true;
|
|
24
|
-
textArea.defaultValue = textToCopy;
|
|
25
|
-
copyAreaRef.appendChild(textArea);
|
|
26
|
-
textArea.select();
|
|
27
|
-
const wasCopied = document.execCommand('copy');
|
|
28
|
-
copyAreaRef.removeChild(textArea);
|
|
29
|
-
|
|
30
|
-
if (wasCopied) {
|
|
31
|
-
resolve();
|
|
32
|
-
} else {
|
|
33
|
-
reject('Failed to copy');
|
|
34
|
-
}
|
|
35
|
-
} else {
|
|
36
|
-
reject('Copy area reference is not defined');
|
|
37
|
-
}
|
|
38
|
-
});
|
|
39
|
-
export const copyToClipboard = textToCopy => new Promise((resolve, reject) => {
|
|
40
|
-
if (clipboardApiSupported()) {
|
|
41
|
-
navigator.clipboard.writeText(textToCopy).then(() => resolve(), e => reject(e));
|
|
42
|
-
} else {
|
|
43
|
-
reject('Clipboard api is not supported');
|
|
44
|
-
}
|
|
45
|
-
});
|
|
46
|
-
const CopyTextContext = /*#__PURE__*/React.createContext({
|
|
47
|
-
copyTextToClipboard: () => new Promise((_resolve, reject) => reject('"copyTextToClipboard" is not initialized'))
|
|
48
|
-
});
|
|
49
|
-
const {
|
|
50
|
-
Provider,
|
|
51
|
-
Consumer
|
|
52
|
-
} = CopyTextContext;
|
|
53
|
-
export const CopyArea = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("div", _extends({
|
|
54
|
-
ref: ref // eslint-disable-next-line @atlaskit/design-system/use-visually-hidden
|
|
55
|
-
,
|
|
56
|
-
style: {
|
|
57
|
-
position: 'absolute',
|
|
58
|
-
left: '-9999px',
|
|
59
|
-
width: '1px',
|
|
60
|
-
height: '1px',
|
|
61
|
-
overflow: 'hidden'
|
|
62
|
-
}
|
|
63
|
-
}, props)));
|
|
64
|
-
export class CopyTextProvider extends React.Component {
|
|
65
|
-
constructor(...args) {
|
|
66
|
-
super(...args);
|
|
67
|
-
|
|
68
|
-
_defineProperty(this, "copyAreaRef", /*#__PURE__*/React.createRef());
|
|
69
|
-
|
|
70
|
-
_defineProperty(this, "copyTextToClipboard", textToCopy => {
|
|
71
|
-
if (isClipboardApiSupported) {
|
|
72
|
-
return copyToClipboard(textToCopy);
|
|
73
|
-
} else if (isIEClipboardApiSupported) {
|
|
74
|
-
return copyToClipboardIE(textToCopy);
|
|
75
|
-
} else {
|
|
76
|
-
return copyToClipboardLegacy(textToCopy, this.copyAreaRef.current);
|
|
77
|
-
}
|
|
78
|
-
});
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
render() {
|
|
82
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, !isClipboardApiSupported && /*#__PURE__*/React.createElement(CopyArea, {
|
|
83
|
-
ref: this.copyAreaRef
|
|
84
|
-
}), /*#__PURE__*/React.createElement(Provider, {
|
|
85
|
-
value: {
|
|
86
|
-
copyTextToClipboard: this.copyTextToClipboard
|
|
87
|
-
}
|
|
88
|
-
}, this.props.children));
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
}
|
|
92
|
-
export { Consumer as CopyTextConsumer };
|
|
93
|
-
export { CopyTextContext };
|
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
|
|
2
|
-
|
|
3
|
-
var _templateObject;
|
|
4
|
-
|
|
5
|
-
/** @jsx jsx */
|
|
6
|
-
import { jsx, css } from '@emotion/react';
|
|
7
|
-
import { injectIntl } from 'react-intl-next';
|
|
8
|
-
import { CodeBlock as AkCodeBlock } from '@atlaskit/code';
|
|
9
|
-
import { overflowShadow, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
|
|
10
|
-
import { N20, DN50 } from '@atlaskit/theme/colors';
|
|
11
|
-
import { themed } from '@atlaskit/theme/components';
|
|
12
|
-
import { fontSize, gridSize } from '@atlaskit/theme/constants';
|
|
13
|
-
import { codeBidiWarningMessages } from '@atlaskit/editor-common/messages';
|
|
14
|
-
import { useFeatureFlags } from '../../use-feature-flags';
|
|
15
|
-
import CopyButton from './codeBlockCopyButton';
|
|
16
|
-
|
|
17
|
-
// TODO: Quality ticket https://product-fabric.atlassian.net/browse/DSP-4118
|
|
18
|
-
|
|
19
|
-
/* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
|
|
20
|
-
var codeBlockStyle = function codeBlockStyle(props) {
|
|
21
|
-
return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n tab-size: 4;\n [data-ds--code--code-block] {\n font-size: ", ";\n line-height: 1.5rem;\n background-image: ", ";\n background-attachment: local, scroll, scroll;\n background-position: 100% 0, 100% 0, 0 0;\n }\n "])), relativeFontSizeToBase16(fontSize()), overflowShadow({
|
|
22
|
-
background: themed({
|
|
23
|
-
light: N20,
|
|
24
|
-
dark: DN50
|
|
25
|
-
})(props),
|
|
26
|
-
width: "".concat(gridSize(), "px")
|
|
27
|
-
}));
|
|
28
|
-
};
|
|
29
|
-
/* eslint-enable */
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
function CodeBlock(props) {
|
|
33
|
-
var text = props.text,
|
|
34
|
-
language = props.language,
|
|
35
|
-
_props$allowCopyToCli = props.allowCopyToClipboard,
|
|
36
|
-
allowCopyToClipboard = _props$allowCopyToCli === void 0 ? false : _props$allowCopyToCli,
|
|
37
|
-
codeBidiWarningTooltipEnabled = props.codeBidiWarningTooltipEnabled;
|
|
38
|
-
var featureFlags = useFeatureFlags();
|
|
39
|
-
var codeBidiWarningLabel = props.intl.formatMessage(codeBidiWarningMessages.label);
|
|
40
|
-
var className = ['code-block', props.className].join(' ');
|
|
41
|
-
return jsx("div", {
|
|
42
|
-
className: className,
|
|
43
|
-
css: codeBlockStyle
|
|
44
|
-
}, allowCopyToClipboard ? jsx(CopyButton, {
|
|
45
|
-
content: text
|
|
46
|
-
}) : null, jsx(AkCodeBlock, {
|
|
47
|
-
language: language,
|
|
48
|
-
text: text,
|
|
49
|
-
codeBidiWarnings: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.codeBidiWarnings,
|
|
50
|
-
codeBidiWarningLabel: codeBidiWarningLabel,
|
|
51
|
-
codeBidiWarningTooltipEnabled: codeBidiWarningTooltipEnabled
|
|
52
|
-
}));
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
export default injectIntl(CodeBlock);
|
|
@@ -1,140 +0,0 @@
|
|
|
1
|
-
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
2
|
-
import _createClass from "@babel/runtime/helpers/createClass";
|
|
3
|
-
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
|
4
|
-
import _inherits from "@babel/runtime/helpers/inherits";
|
|
5
|
-
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
6
|
-
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
7
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
8
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
9
|
-
|
|
10
|
-
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
11
|
-
|
|
12
|
-
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
13
|
-
|
|
14
|
-
import React from 'react';
|
|
15
|
-
export var clipboardApiSupported = function clipboardApiSupported() {
|
|
16
|
-
return !!navigator.clipboard && typeof navigator.clipboard.writeText === 'function';
|
|
17
|
-
};
|
|
18
|
-
export var ieClipboardApiSupported = function ieClipboardApiSupported() {
|
|
19
|
-
return window.clipboardData && typeof window.clipboardData.setData === 'function';
|
|
20
|
-
};
|
|
21
|
-
var isClipboardApiSupported = clipboardApiSupported();
|
|
22
|
-
var isIEClipboardApiSupported = ieClipboardApiSupported(); // for IE we can remove this if we dropped IE support.
|
|
23
|
-
|
|
24
|
-
export var copyToClipboardIE = function copyToClipboardIE(textToCopy) {
|
|
25
|
-
return new Promise(function (resolve, reject) {
|
|
26
|
-
if (ieClipboardApiSupported()) {
|
|
27
|
-
window.clipboardData.setData('text', textToCopy);
|
|
28
|
-
resolve();
|
|
29
|
-
} else {
|
|
30
|
-
reject('IE clipboard api is not supported');
|
|
31
|
-
}
|
|
32
|
-
});
|
|
33
|
-
}; // This function is needed for safari .
|
|
34
|
-
// This function is a synchronous function, but it is wrapped into a promise
|
|
35
|
-
// to be consistent with "copyToClipboard".
|
|
36
|
-
|
|
37
|
-
export var copyToClipboardLegacy = function copyToClipboardLegacy(textToCopy, copyAreaRef) {
|
|
38
|
-
return new Promise(function (resolve, reject) {
|
|
39
|
-
if (copyAreaRef) {
|
|
40
|
-
var textArea = document.createElement('textarea');
|
|
41
|
-
textArea.readOnly = true;
|
|
42
|
-
textArea.defaultValue = textToCopy;
|
|
43
|
-
copyAreaRef.appendChild(textArea);
|
|
44
|
-
textArea.select();
|
|
45
|
-
var wasCopied = document.execCommand('copy');
|
|
46
|
-
copyAreaRef.removeChild(textArea);
|
|
47
|
-
|
|
48
|
-
if (wasCopied) {
|
|
49
|
-
resolve();
|
|
50
|
-
} else {
|
|
51
|
-
reject('Failed to copy');
|
|
52
|
-
}
|
|
53
|
-
} else {
|
|
54
|
-
reject('Copy area reference is not defined');
|
|
55
|
-
}
|
|
56
|
-
});
|
|
57
|
-
};
|
|
58
|
-
export var copyToClipboard = function copyToClipboard(textToCopy) {
|
|
59
|
-
return new Promise(function (resolve, reject) {
|
|
60
|
-
if (clipboardApiSupported()) {
|
|
61
|
-
navigator.clipboard.writeText(textToCopy).then(function () {
|
|
62
|
-
return resolve();
|
|
63
|
-
}, function (e) {
|
|
64
|
-
return reject(e);
|
|
65
|
-
});
|
|
66
|
-
} else {
|
|
67
|
-
reject('Clipboard api is not supported');
|
|
68
|
-
}
|
|
69
|
-
});
|
|
70
|
-
};
|
|
71
|
-
var CopyTextContext = /*#__PURE__*/React.createContext({
|
|
72
|
-
copyTextToClipboard: function copyTextToClipboard() {
|
|
73
|
-
return new Promise(function (_resolve, reject) {
|
|
74
|
-
return reject('"copyTextToClipboard" is not initialized');
|
|
75
|
-
});
|
|
76
|
-
}
|
|
77
|
-
});
|
|
78
|
-
var Provider = CopyTextContext.Provider,
|
|
79
|
-
Consumer = CopyTextContext.Consumer;
|
|
80
|
-
export var CopyArea = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
81
|
-
return /*#__PURE__*/React.createElement("div", _extends({
|
|
82
|
-
ref: ref // eslint-disable-next-line @atlaskit/design-system/use-visually-hidden
|
|
83
|
-
,
|
|
84
|
-
style: {
|
|
85
|
-
position: 'absolute',
|
|
86
|
-
left: '-9999px',
|
|
87
|
-
width: '1px',
|
|
88
|
-
height: '1px',
|
|
89
|
-
overflow: 'hidden'
|
|
90
|
-
}
|
|
91
|
-
}, props));
|
|
92
|
-
});
|
|
93
|
-
export var CopyTextProvider = /*#__PURE__*/function (_React$Component) {
|
|
94
|
-
_inherits(CopyTextProvider, _React$Component);
|
|
95
|
-
|
|
96
|
-
var _super = _createSuper(CopyTextProvider);
|
|
97
|
-
|
|
98
|
-
function CopyTextProvider() {
|
|
99
|
-
var _this;
|
|
100
|
-
|
|
101
|
-
_classCallCheck(this, CopyTextProvider);
|
|
102
|
-
|
|
103
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
104
|
-
args[_key] = arguments[_key];
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
_this = _super.call.apply(_super, [this].concat(args));
|
|
108
|
-
|
|
109
|
-
_defineProperty(_assertThisInitialized(_this), "copyAreaRef", /*#__PURE__*/React.createRef());
|
|
110
|
-
|
|
111
|
-
_defineProperty(_assertThisInitialized(_this), "copyTextToClipboard", function (textToCopy) {
|
|
112
|
-
if (isClipboardApiSupported) {
|
|
113
|
-
return copyToClipboard(textToCopy);
|
|
114
|
-
} else if (isIEClipboardApiSupported) {
|
|
115
|
-
return copyToClipboardIE(textToCopy);
|
|
116
|
-
} else {
|
|
117
|
-
return copyToClipboardLegacy(textToCopy, _this.copyAreaRef.current);
|
|
118
|
-
}
|
|
119
|
-
});
|
|
120
|
-
|
|
121
|
-
return _this;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
_createClass(CopyTextProvider, [{
|
|
125
|
-
key: "render",
|
|
126
|
-
value: function render() {
|
|
127
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, !isClipboardApiSupported && /*#__PURE__*/React.createElement(CopyArea, {
|
|
128
|
-
ref: this.copyAreaRef
|
|
129
|
-
}), /*#__PURE__*/React.createElement(Provider, {
|
|
130
|
-
value: {
|
|
131
|
-
copyTextToClipboard: this.copyTextToClipboard
|
|
132
|
-
}
|
|
133
|
-
}, this.props.children));
|
|
134
|
-
}
|
|
135
|
-
}]);
|
|
136
|
-
|
|
137
|
-
return CopyTextProvider;
|
|
138
|
-
}(React.Component);
|
|
139
|
-
export { Consumer as CopyTextConsumer };
|
|
140
|
-
export { CopyTextContext };
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
export declare const clipboardApiSupported: () => boolean;
|
|
3
|
-
export declare const ieClipboardApiSupported: () => any;
|
|
4
|
-
export declare const copyToClipboardIE: (textToCopy: string) => Promise<void>;
|
|
5
|
-
export declare const copyToClipboardLegacy: (textToCopy: string, copyAreaRef: HTMLElement | null) => Promise<void>;
|
|
6
|
-
export declare const copyToClipboard: (textToCopy: string) => Promise<void>;
|
|
7
|
-
declare const CopyTextContext: React.Context<{
|
|
8
|
-
copyTextToClipboard: (textToCopy: string) => Promise<void>;
|
|
9
|
-
}>;
|
|
10
|
-
declare const Consumer: React.Consumer<{
|
|
11
|
-
copyTextToClipboard: (textToCopy: string) => Promise<void>;
|
|
12
|
-
}>;
|
|
13
|
-
export declare const CopyArea: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<unknown>>;
|
|
14
|
-
export declare class CopyTextProvider extends React.Component {
|
|
15
|
-
private copyAreaRef;
|
|
16
|
-
copyTextToClipboard: (textToCopy: string) => Promise<void>;
|
|
17
|
-
render(): JSX.Element;
|
|
18
|
-
}
|
|
19
|
-
export { Consumer as CopyTextConsumer };
|
|
20
|
-
export { CopyTextContext };
|