@atlaskit/editor-plugin-caption 0.1.0 → 0.2.1

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 CHANGED
@@ -1,5 +1,18 @@
1
1
  # @atlaskit/editor-plugin-caption
2
2
 
3
+ ## 0.2.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#40750](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/40750) [`fc19a7b9edd`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fc19a7b9edd) - [ED-19875] Extraction of Editor Core's Selection Plugin into independent package '@atlaskit/editor-plugin-selection'.
8
+ - Updated dependencies
9
+
10
+ ## 0.2.0
11
+
12
+ ### Minor Changes
13
+
14
+ - [#41239](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41239) [`7d70b962986`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7d70b962986) - Extract Caption Plugin from Editor Core
15
+
3
16
  ## 0.1.0
4
17
 
5
18
  ### Minor Changes
package/dist/cjs/index.js CHANGED
@@ -1,5 +1,13 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
- });
6
+ });
7
+ Object.defineProperty(exports, "captionPlugin", {
8
+ enumerable: true,
9
+ get: function get() {
10
+ return _plugin.default;
11
+ }
12
+ });
13
+ var _plugin = _interopRequireDefault(require("./plugin"));
@@ -0,0 +1,81 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.CaptionNodeView = void 0;
8
+ exports.default = captionNodeView;
9
+ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
10
+ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
11
+ var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
12
+ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
13
+ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
14
+ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
15
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
16
+ var _react = _interopRequireDefault(require("react"));
17
+ var _selectionBasedNodeView = require("@atlaskit/editor-common/selection-based-node-view");
18
+ var _ui = require("@atlaskit/editor-common/ui");
19
+ 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); }; }
20
+ 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; } }
21
+ var CaptionNodeView = exports.CaptionNodeView = /*#__PURE__*/function (_SelectionBasedNodeVi) {
22
+ (0, _inherits2.default)(CaptionNodeView, _SelectionBasedNodeVi);
23
+ var _super = _createSuper(CaptionNodeView);
24
+ function CaptionNodeView() {
25
+ var _this;
26
+ (0, _classCallCheck2.default)(this, CaptionNodeView);
27
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
28
+ args[_key] = arguments[_key];
29
+ }
30
+ _this = _super.call.apply(_super, [this].concat(args));
31
+ (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "selected", _this.insideSelection());
32
+ return _this;
33
+ }
34
+ (0, _createClass2.default)(CaptionNodeView, [{
35
+ key: "createDomRef",
36
+ value: function createDomRef() {
37
+ var domRef = document.createElement('figcaption');
38
+ domRef.setAttribute('data-caption', 'true');
39
+ return domRef;
40
+ }
41
+ }, {
42
+ key: "getContentDOM",
43
+ value: function getContentDOM() {
44
+ var dom = document.createElement('div');
45
+ // setting a className prevents PM/Chrome mutation observer from
46
+ // incorrectly deleting nodes
47
+ dom.className = 'caption-wrapper';
48
+ return {
49
+ dom: dom
50
+ };
51
+ }
52
+ }, {
53
+ key: "render",
54
+ value: function render(_props, forwardRef) {
55
+ return /*#__PURE__*/_react.default.createElement(_ui.Caption, {
56
+ selected: this.insideSelection(),
57
+ hasContent: this.node.content.childCount > 0
58
+ }, /*#__PURE__*/_react.default.createElement("div", {
59
+ ref: forwardRef
60
+ }));
61
+ }
62
+ }, {
63
+ key: "viewShouldUpdate",
64
+ value: function viewShouldUpdate(nextNode) {
65
+ if (this.node.childCount !== nextNode.childCount) {
66
+ return true;
67
+ }
68
+ var newSelected = this.insideSelection();
69
+ var selectedStateChange = this.selected !== newSelected;
70
+ this.selected = newSelected;
71
+ return selectedStateChange;
72
+ }
73
+ }]);
74
+ return CaptionNodeView;
75
+ }(_selectionBasedNodeView.SelectionBasedNodeView);
76
+ function captionNodeView(portalProviderAPI, eventDispatcher, pluginInjectionApi) {
77
+ return function (node, view, getPos) {
78
+ var hasIntlContext = true;
79
+ return new CaptionNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {}, undefined, undefined, undefined, hasIntlContext).init();
80
+ };
81
+ }
@@ -0,0 +1,38 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = void 0;
8
+ var _adfSchema = require("@atlaskit/adf-schema");
9
+ var _keymap = require("./pm-plugins/keymap");
10
+ var _main = _interopRequireDefault(require("./pm-plugins/main"));
11
+ var captionPlugin = function captionPlugin(_ref) {
12
+ var api = _ref.api;
13
+ return {
14
+ name: 'caption',
15
+ nodes: function nodes() {
16
+ return [{
17
+ name: 'caption',
18
+ node: _adfSchema.caption
19
+ }];
20
+ },
21
+ pmPlugins: function pmPlugins() {
22
+ return [{
23
+ name: 'caption',
24
+ plugin: function plugin(_ref2) {
25
+ var portalProviderAPI = _ref2.portalProviderAPI,
26
+ providerFactory = _ref2.providerFactory,
27
+ eventDispatcher = _ref2.eventDispatcher,
28
+ dispatch = _ref2.dispatch;
29
+ return (0, _main.default)(portalProviderAPI, eventDispatcher, providerFactory, dispatch, api);
30
+ }
31
+ }, {
32
+ name: 'captionKeymap',
33
+ plugin: _keymap.captionKeymap
34
+ }];
35
+ }
36
+ };
37
+ };
38
+ var _default = exports.default = captionPlugin;
@@ -0,0 +1,72 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.captionKeymap = captionKeymap;
7
+ var _keymaps = require("@atlaskit/editor-common/keymaps");
8
+ var _selection = require("@atlaskit/editor-common/selection");
9
+ var _utils = require("@atlaskit/editor-common/utils");
10
+ var _keymap = require("@atlaskit/editor-prosemirror/keymap");
11
+ var _state = require("@atlaskit/editor-prosemirror/state");
12
+ var _utils2 = require("@atlaskit/editor-prosemirror/utils");
13
+ function captionKeymap() {
14
+ var list = {};
15
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.moveDown.common, createNewParagraphBelowCaption, list);
16
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.enter.common, createNewParagraphBelowCaption, list);
17
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.moveDown.common, getOutOfCaption, list);
18
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.enter.common, getOutOfCaption, list);
19
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.moveUp.common, selectParentMediaSingle, list);
20
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.shiftTab.common, selectParentMediaSingle, list);
21
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.tab.common, getOutOfCaption, list);
22
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.moveLeft.common, gapCursorSelectLeftParentMediaSingle, list);
23
+ return (0, _keymap.keymap)(list);
24
+ }
25
+ var createNewParagraphBelowCaption = function createNewParagraphBelowCaption(state, dispatch) {
26
+ var caption = (0, _utils2.findParentNodeOfType)(state.schema.nodes.caption)(state.selection);
27
+ if (caption) {
28
+ return (0, _utils.createNewParagraphBelow)(state, dispatch);
29
+ }
30
+ return false;
31
+ };
32
+ var getOutOfCaption = function getOutOfCaption(state, dispatch) {
33
+ var caption = (0, _utils2.findParentNodeOfType)(state.schema.nodes.caption)(state.selection);
34
+ if (caption) {
35
+ if (dispatch) {
36
+ var tr = state.tr.setSelection(_state.Selection.near(state.tr.doc.resolve(caption.pos + caption.node.nodeSize)));
37
+ dispatch(tr);
38
+ }
39
+ return true;
40
+ }
41
+ return false;
42
+ };
43
+ var selectParentMediaSingle = function selectParentMediaSingle(state, dispatch) {
44
+ if ((0, _utils2.findParentNodeOfType)(state.schema.nodes.caption)(state.selection)) {
45
+ var mediaSingleParent = (0, _utils2.findParentNodeOfType)(state.schema.nodes.mediaSingle)(state.selection);
46
+ if (mediaSingleParent) {
47
+ if (dispatch) {
48
+ var tr = state.tr.setSelection(_state.Selection.near(state.tr.doc.resolve(mediaSingleParent.pos)));
49
+ dispatch(tr);
50
+ }
51
+ return true;
52
+ }
53
+ }
54
+ return false;
55
+ };
56
+ var gapCursorSelectLeftParentMediaSingle = function gapCursorSelectLeftParentMediaSingle(state, dispatch) {
57
+ var caption = (0, _utils2.findParentNodeOfType)(state.schema.nodes.caption)(state.selection);
58
+ if (caption) {
59
+ var mediaSingleParent = (0, _utils2.findParentNodeOfType)(state.schema.nodes.mediaSingle)(state.selection);
60
+ if (mediaSingleParent && state.selection.empty && state.tr.doc.resolve(state.selection.from).parentOffset === 0) {
61
+ var gapCursorSelection = _selection.GapCursorSelection.findFrom(state.tr.doc.resolve(mediaSingleParent.pos), 0, false);
62
+ if (gapCursorSelection) {
63
+ if (dispatch) {
64
+ var tr = state.tr.setSelection(gapCursorSelection);
65
+ dispatch(tr);
66
+ }
67
+ return true;
68
+ }
69
+ }
70
+ }
71
+ return false;
72
+ };
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = void 0;
8
+ var _analytics = require("@atlaskit/editor-common/analytics");
9
+ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
10
+ var _utils = require("@atlaskit/editor-prosemirror/utils");
11
+ var _nodeviews = _interopRequireDefault(require("../nodeviews"));
12
+ var _pluginKey = require("./plugin-key");
13
+ var fireAnalytics = function fireAnalytics(tr, action, analyticsApi) {
14
+ analyticsApi === null || analyticsApi === void 0 || analyticsApi.attachAnalyticsEvent({
15
+ action: action,
16
+ eventType: _analytics.EVENT_TYPE.TRACK,
17
+ actionSubject: _analytics.ACTION_SUBJECT.MEDIA_SINGLE,
18
+ actionSubjectId: _analytics.ACTION_SUBJECT_ID.CAPTION
19
+ })(tr);
20
+ };
21
+ var _default = exports.default = function _default(portalProviderAPI, eventDispatcher, providerFactory, dispatch, pluginInjectionApi) {
22
+ var _pluginInjectionApi$a;
23
+ var analyticsApi = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions;
24
+ return new _safePlugin.SafePlugin({
25
+ appendTransaction: function appendTransaction(transactions, oldState, newState) {
26
+ // only run for transactions that change selection
27
+ if (!transactions.find(function (tr) {
28
+ return tr.selectionSet;
29
+ })) {
30
+ return;
31
+ }
32
+ var newSelection = !newState.selection.eq(oldState.selection);
33
+ var findCaption = (0, _utils.findParentNodeOfType)(oldState.schema.nodes.caption);
34
+ var oldSelectionCaption = findCaption(oldState.selection);
35
+ var tr = newState.tr;
36
+
37
+ // if selecting away from caption, or selecting a different caption
38
+ if (newSelection && oldSelectionCaption) {
39
+ if (oldSelectionCaption.node.childCount === 0) {
40
+ tr.delete(oldSelectionCaption.start - 1, oldSelectionCaption.start);
41
+ tr.setMeta('scrollIntoView', false);
42
+ fireAnalytics(tr, _analytics.ACTION.DELETED, analyticsApi);
43
+ return tr;
44
+ } else {
45
+ fireAnalytics(tr, _analytics.ACTION.EDITED, analyticsApi);
46
+ return tr;
47
+ }
48
+ }
49
+ },
50
+ key: _pluginKey.pluginKey,
51
+ props: {
52
+ nodeViews: {
53
+ caption: (0, _nodeviews.default)(portalProviderAPI, eventDispatcher, pluginInjectionApi)
54
+ }
55
+ }
56
+ });
57
+ };
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.pluginKey = void 0;
7
+ var _state = require("@atlaskit/editor-prosemirror/state");
8
+ var pluginKey = exports.pluginKey = new _state.PluginKey('caption');
@@ -1 +1 @@
1
- export {};
1
+ export { default as captionPlugin } from './plugin';
@@ -0,0 +1,47 @@
1
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+ import React from 'react';
3
+ import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-node-view';
4
+ import { Caption } from '@atlaskit/editor-common/ui';
5
+ export class CaptionNodeView extends SelectionBasedNodeView {
6
+ constructor(...args) {
7
+ super(...args);
8
+ _defineProperty(this, "selected", this.insideSelection());
9
+ }
10
+ createDomRef() {
11
+ const domRef = document.createElement('figcaption');
12
+ domRef.setAttribute('data-caption', 'true');
13
+ return domRef;
14
+ }
15
+ getContentDOM() {
16
+ const dom = document.createElement('div');
17
+ // setting a className prevents PM/Chrome mutation observer from
18
+ // incorrectly deleting nodes
19
+ dom.className = 'caption-wrapper';
20
+ return {
21
+ dom
22
+ };
23
+ }
24
+ render(_props, forwardRef) {
25
+ return /*#__PURE__*/React.createElement(Caption, {
26
+ selected: this.insideSelection(),
27
+ hasContent: this.node.content.childCount > 0
28
+ }, /*#__PURE__*/React.createElement("div", {
29
+ ref: forwardRef
30
+ }));
31
+ }
32
+ viewShouldUpdate(nextNode) {
33
+ if (this.node.childCount !== nextNode.childCount) {
34
+ return true;
35
+ }
36
+ const newSelected = this.insideSelection();
37
+ const selectedStateChange = this.selected !== newSelected;
38
+ this.selected = newSelected;
39
+ return selectedStateChange;
40
+ }
41
+ }
42
+ export default function captionNodeView(portalProviderAPI, eventDispatcher, pluginInjectionApi) {
43
+ return (node, view, getPos) => {
44
+ const hasIntlContext = true;
45
+ return new CaptionNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {}, undefined, undefined, undefined, hasIntlContext).init();
46
+ };
47
+ }
@@ -0,0 +1,31 @@
1
+ import { caption } from '@atlaskit/adf-schema';
2
+ import { captionKeymap } from './pm-plugins/keymap';
3
+ import { default as createCaptionPlugin } from './pm-plugins/main';
4
+ const captionPlugin = ({
5
+ api
6
+ }) => {
7
+ return {
8
+ name: 'caption',
9
+ nodes() {
10
+ return [{
11
+ name: 'caption',
12
+ node: caption
13
+ }];
14
+ },
15
+ pmPlugins() {
16
+ return [{
17
+ name: 'caption',
18
+ plugin: ({
19
+ portalProviderAPI,
20
+ providerFactory,
21
+ eventDispatcher,
22
+ dispatch
23
+ }) => createCaptionPlugin(portalProviderAPI, eventDispatcher, providerFactory, dispatch, api)
24
+ }, {
25
+ name: 'captionKeymap',
26
+ plugin: captionKeymap
27
+ }];
28
+ }
29
+ };
30
+ };
31
+ export default captionPlugin;
@@ -0,0 +1,66 @@
1
+ import { bindKeymapWithCommand, enter, moveDown, moveLeft, moveUp, shiftTab, tab } from '@atlaskit/editor-common/keymaps';
2
+ import { GapCursorSelection } from '@atlaskit/editor-common/selection';
3
+ import { createNewParagraphBelow } from '@atlaskit/editor-common/utils';
4
+ import { keymap } from '@atlaskit/editor-prosemirror/keymap';
5
+ import { Selection } from '@atlaskit/editor-prosemirror/state';
6
+ import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
7
+ export function captionKeymap() {
8
+ const list = {};
9
+ bindKeymapWithCommand(moveDown.common, createNewParagraphBelowCaption, list);
10
+ bindKeymapWithCommand(enter.common, createNewParagraphBelowCaption, list);
11
+ bindKeymapWithCommand(moveDown.common, getOutOfCaption, list);
12
+ bindKeymapWithCommand(enter.common, getOutOfCaption, list);
13
+ bindKeymapWithCommand(moveUp.common, selectParentMediaSingle, list);
14
+ bindKeymapWithCommand(shiftTab.common, selectParentMediaSingle, list);
15
+ bindKeymapWithCommand(tab.common, getOutOfCaption, list);
16
+ bindKeymapWithCommand(moveLeft.common, gapCursorSelectLeftParentMediaSingle, list);
17
+ return keymap(list);
18
+ }
19
+ const createNewParagraphBelowCaption = (state, dispatch) => {
20
+ const caption = findParentNodeOfType(state.schema.nodes.caption)(state.selection);
21
+ if (caption) {
22
+ return createNewParagraphBelow(state, dispatch);
23
+ }
24
+ return false;
25
+ };
26
+ const getOutOfCaption = (state, dispatch) => {
27
+ const caption = findParentNodeOfType(state.schema.nodes.caption)(state.selection);
28
+ if (caption) {
29
+ if (dispatch) {
30
+ const tr = state.tr.setSelection(Selection.near(state.tr.doc.resolve(caption.pos + caption.node.nodeSize)));
31
+ dispatch(tr);
32
+ }
33
+ return true;
34
+ }
35
+ return false;
36
+ };
37
+ const selectParentMediaSingle = (state, dispatch) => {
38
+ if (findParentNodeOfType(state.schema.nodes.caption)(state.selection)) {
39
+ const mediaSingleParent = findParentNodeOfType(state.schema.nodes.mediaSingle)(state.selection);
40
+ if (mediaSingleParent) {
41
+ if (dispatch) {
42
+ const tr = state.tr.setSelection(Selection.near(state.tr.doc.resolve(mediaSingleParent.pos)));
43
+ dispatch(tr);
44
+ }
45
+ return true;
46
+ }
47
+ }
48
+ return false;
49
+ };
50
+ const gapCursorSelectLeftParentMediaSingle = (state, dispatch) => {
51
+ const caption = findParentNodeOfType(state.schema.nodes.caption)(state.selection);
52
+ if (caption) {
53
+ const mediaSingleParent = findParentNodeOfType(state.schema.nodes.mediaSingle)(state.selection);
54
+ if (mediaSingleParent && state.selection.empty && state.tr.doc.resolve(state.selection.from).parentOffset === 0) {
55
+ const gapCursorSelection = GapCursorSelection.findFrom(state.tr.doc.resolve(mediaSingleParent.pos), 0, false);
56
+ if (gapCursorSelection) {
57
+ if (dispatch) {
58
+ const tr = state.tr.setSelection(gapCursorSelection);
59
+ dispatch(tr);
60
+ }
61
+ return true;
62
+ }
63
+ }
64
+ }
65
+ return false;
66
+ };
@@ -0,0 +1,50 @@
1
+ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
2
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
3
+ import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
4
+ import captionNodeView from '../nodeviews';
5
+ import { pluginKey } from './plugin-key';
6
+ const fireAnalytics = (tr, action, analyticsApi) => {
7
+ analyticsApi === null || analyticsApi === void 0 ? void 0 : analyticsApi.attachAnalyticsEvent({
8
+ action,
9
+ eventType: EVENT_TYPE.TRACK,
10
+ actionSubject: ACTION_SUBJECT.MEDIA_SINGLE,
11
+ actionSubjectId: ACTION_SUBJECT_ID.CAPTION
12
+ })(tr);
13
+ };
14
+ export default ((portalProviderAPI, eventDispatcher, providerFactory, dispatch, pluginInjectionApi) => {
15
+ var _pluginInjectionApi$a;
16
+ const analyticsApi = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions;
17
+ return new SafePlugin({
18
+ appendTransaction(transactions, oldState, newState) {
19
+ // only run for transactions that change selection
20
+ if (!transactions.find(tr => tr.selectionSet)) {
21
+ return;
22
+ }
23
+ const newSelection = !newState.selection.eq(oldState.selection);
24
+ const findCaption = findParentNodeOfType(oldState.schema.nodes.caption);
25
+ const oldSelectionCaption = findCaption(oldState.selection);
26
+ const {
27
+ tr
28
+ } = newState;
29
+
30
+ // if selecting away from caption, or selecting a different caption
31
+ if (newSelection && oldSelectionCaption) {
32
+ if (oldSelectionCaption.node.childCount === 0) {
33
+ tr.delete(oldSelectionCaption.start - 1, oldSelectionCaption.start);
34
+ tr.setMeta('scrollIntoView', false);
35
+ fireAnalytics(tr, ACTION.DELETED, analyticsApi);
36
+ return tr;
37
+ } else {
38
+ fireAnalytics(tr, ACTION.EDITED, analyticsApi);
39
+ return tr;
40
+ }
41
+ }
42
+ },
43
+ key: pluginKey,
44
+ props: {
45
+ nodeViews: {
46
+ caption: captionNodeView(portalProviderAPI, eventDispatcher, pluginInjectionApi)
47
+ }
48
+ }
49
+ });
50
+ });
@@ -0,0 +1,2 @@
1
+ import { PluginKey } from '@atlaskit/editor-prosemirror/state';
2
+ export const pluginKey = new PluginKey('caption');
package/dist/esm/index.js CHANGED
@@ -1 +1 @@
1
- export {};
1
+ export { default as captionPlugin } from './plugin';
@@ -0,0 +1,73 @@
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
+ 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); }; }
9
+ 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; } }
10
+ import React from 'react';
11
+ import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-node-view';
12
+ import { Caption } from '@atlaskit/editor-common/ui';
13
+ export var CaptionNodeView = /*#__PURE__*/function (_SelectionBasedNodeVi) {
14
+ _inherits(CaptionNodeView, _SelectionBasedNodeVi);
15
+ var _super = _createSuper(CaptionNodeView);
16
+ function CaptionNodeView() {
17
+ var _this;
18
+ _classCallCheck(this, CaptionNodeView);
19
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
20
+ args[_key] = arguments[_key];
21
+ }
22
+ _this = _super.call.apply(_super, [this].concat(args));
23
+ _defineProperty(_assertThisInitialized(_this), "selected", _this.insideSelection());
24
+ return _this;
25
+ }
26
+ _createClass(CaptionNodeView, [{
27
+ key: "createDomRef",
28
+ value: function createDomRef() {
29
+ var domRef = document.createElement('figcaption');
30
+ domRef.setAttribute('data-caption', 'true');
31
+ return domRef;
32
+ }
33
+ }, {
34
+ key: "getContentDOM",
35
+ value: function getContentDOM() {
36
+ var dom = document.createElement('div');
37
+ // setting a className prevents PM/Chrome mutation observer from
38
+ // incorrectly deleting nodes
39
+ dom.className = 'caption-wrapper';
40
+ return {
41
+ dom: dom
42
+ };
43
+ }
44
+ }, {
45
+ key: "render",
46
+ value: function render(_props, forwardRef) {
47
+ return /*#__PURE__*/React.createElement(Caption, {
48
+ selected: this.insideSelection(),
49
+ hasContent: this.node.content.childCount > 0
50
+ }, /*#__PURE__*/React.createElement("div", {
51
+ ref: forwardRef
52
+ }));
53
+ }
54
+ }, {
55
+ key: "viewShouldUpdate",
56
+ value: function viewShouldUpdate(nextNode) {
57
+ if (this.node.childCount !== nextNode.childCount) {
58
+ return true;
59
+ }
60
+ var newSelected = this.insideSelection();
61
+ var selectedStateChange = this.selected !== newSelected;
62
+ this.selected = newSelected;
63
+ return selectedStateChange;
64
+ }
65
+ }]);
66
+ return CaptionNodeView;
67
+ }(SelectionBasedNodeView);
68
+ export default function captionNodeView(portalProviderAPI, eventDispatcher, pluginInjectionApi) {
69
+ return function (node, view, getPos) {
70
+ var hasIntlContext = true;
71
+ return new CaptionNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {}, undefined, undefined, undefined, hasIntlContext).init();
72
+ };
73
+ }
@@ -0,0 +1,31 @@
1
+ import { caption } from '@atlaskit/adf-schema';
2
+ import { captionKeymap } from './pm-plugins/keymap';
3
+ import { default as createCaptionPlugin } from './pm-plugins/main';
4
+ var captionPlugin = function captionPlugin(_ref) {
5
+ var api = _ref.api;
6
+ return {
7
+ name: 'caption',
8
+ nodes: function nodes() {
9
+ return [{
10
+ name: 'caption',
11
+ node: caption
12
+ }];
13
+ },
14
+ pmPlugins: function pmPlugins() {
15
+ return [{
16
+ name: 'caption',
17
+ plugin: function plugin(_ref2) {
18
+ var portalProviderAPI = _ref2.portalProviderAPI,
19
+ providerFactory = _ref2.providerFactory,
20
+ eventDispatcher = _ref2.eventDispatcher,
21
+ dispatch = _ref2.dispatch;
22
+ return createCaptionPlugin(portalProviderAPI, eventDispatcher, providerFactory, dispatch, api);
23
+ }
24
+ }, {
25
+ name: 'captionKeymap',
26
+ plugin: captionKeymap
27
+ }];
28
+ }
29
+ };
30
+ };
31
+ export default captionPlugin;
@@ -0,0 +1,66 @@
1
+ import { bindKeymapWithCommand, enter, moveDown, moveLeft, moveUp, shiftTab, tab } from '@atlaskit/editor-common/keymaps';
2
+ import { GapCursorSelection } from '@atlaskit/editor-common/selection';
3
+ import { createNewParagraphBelow } from '@atlaskit/editor-common/utils';
4
+ import { keymap } from '@atlaskit/editor-prosemirror/keymap';
5
+ import { Selection } from '@atlaskit/editor-prosemirror/state';
6
+ import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
7
+ export function captionKeymap() {
8
+ var list = {};
9
+ bindKeymapWithCommand(moveDown.common, createNewParagraphBelowCaption, list);
10
+ bindKeymapWithCommand(enter.common, createNewParagraphBelowCaption, list);
11
+ bindKeymapWithCommand(moveDown.common, getOutOfCaption, list);
12
+ bindKeymapWithCommand(enter.common, getOutOfCaption, list);
13
+ bindKeymapWithCommand(moveUp.common, selectParentMediaSingle, list);
14
+ bindKeymapWithCommand(shiftTab.common, selectParentMediaSingle, list);
15
+ bindKeymapWithCommand(tab.common, getOutOfCaption, list);
16
+ bindKeymapWithCommand(moveLeft.common, gapCursorSelectLeftParentMediaSingle, list);
17
+ return keymap(list);
18
+ }
19
+ var createNewParagraphBelowCaption = function createNewParagraphBelowCaption(state, dispatch) {
20
+ var caption = findParentNodeOfType(state.schema.nodes.caption)(state.selection);
21
+ if (caption) {
22
+ return createNewParagraphBelow(state, dispatch);
23
+ }
24
+ return false;
25
+ };
26
+ var getOutOfCaption = function getOutOfCaption(state, dispatch) {
27
+ var caption = findParentNodeOfType(state.schema.nodes.caption)(state.selection);
28
+ if (caption) {
29
+ if (dispatch) {
30
+ var tr = state.tr.setSelection(Selection.near(state.tr.doc.resolve(caption.pos + caption.node.nodeSize)));
31
+ dispatch(tr);
32
+ }
33
+ return true;
34
+ }
35
+ return false;
36
+ };
37
+ var selectParentMediaSingle = function selectParentMediaSingle(state, dispatch) {
38
+ if (findParentNodeOfType(state.schema.nodes.caption)(state.selection)) {
39
+ var mediaSingleParent = findParentNodeOfType(state.schema.nodes.mediaSingle)(state.selection);
40
+ if (mediaSingleParent) {
41
+ if (dispatch) {
42
+ var tr = state.tr.setSelection(Selection.near(state.tr.doc.resolve(mediaSingleParent.pos)));
43
+ dispatch(tr);
44
+ }
45
+ return true;
46
+ }
47
+ }
48
+ return false;
49
+ };
50
+ var gapCursorSelectLeftParentMediaSingle = function gapCursorSelectLeftParentMediaSingle(state, dispatch) {
51
+ var caption = findParentNodeOfType(state.schema.nodes.caption)(state.selection);
52
+ if (caption) {
53
+ var mediaSingleParent = findParentNodeOfType(state.schema.nodes.mediaSingle)(state.selection);
54
+ if (mediaSingleParent && state.selection.empty && state.tr.doc.resolve(state.selection.from).parentOffset === 0) {
55
+ var gapCursorSelection = GapCursorSelection.findFrom(state.tr.doc.resolve(mediaSingleParent.pos), 0, false);
56
+ if (gapCursorSelection) {
57
+ if (dispatch) {
58
+ var tr = state.tr.setSelection(gapCursorSelection);
59
+ dispatch(tr);
60
+ }
61
+ return true;
62
+ }
63
+ }
64
+ }
65
+ return false;
66
+ };
@@ -0,0 +1,50 @@
1
+ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
2
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
3
+ import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
4
+ import captionNodeView from '../nodeviews';
5
+ import { pluginKey } from './plugin-key';
6
+ var fireAnalytics = function fireAnalytics(tr, action, analyticsApi) {
7
+ analyticsApi === null || analyticsApi === void 0 || analyticsApi.attachAnalyticsEvent({
8
+ action: action,
9
+ eventType: EVENT_TYPE.TRACK,
10
+ actionSubject: ACTION_SUBJECT.MEDIA_SINGLE,
11
+ actionSubjectId: ACTION_SUBJECT_ID.CAPTION
12
+ })(tr);
13
+ };
14
+ export default (function (portalProviderAPI, eventDispatcher, providerFactory, dispatch, pluginInjectionApi) {
15
+ var _pluginInjectionApi$a;
16
+ var analyticsApi = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions;
17
+ return new SafePlugin({
18
+ appendTransaction: function appendTransaction(transactions, oldState, newState) {
19
+ // only run for transactions that change selection
20
+ if (!transactions.find(function (tr) {
21
+ return tr.selectionSet;
22
+ })) {
23
+ return;
24
+ }
25
+ var newSelection = !newState.selection.eq(oldState.selection);
26
+ var findCaption = findParentNodeOfType(oldState.schema.nodes.caption);
27
+ var oldSelectionCaption = findCaption(oldState.selection);
28
+ var tr = newState.tr;
29
+
30
+ // if selecting away from caption, or selecting a different caption
31
+ if (newSelection && oldSelectionCaption) {
32
+ if (oldSelectionCaption.node.childCount === 0) {
33
+ tr.delete(oldSelectionCaption.start - 1, oldSelectionCaption.start);
34
+ tr.setMeta('scrollIntoView', false);
35
+ fireAnalytics(tr, ACTION.DELETED, analyticsApi);
36
+ return tr;
37
+ } else {
38
+ fireAnalytics(tr, ACTION.EDITED, analyticsApi);
39
+ return tr;
40
+ }
41
+ }
42
+ },
43
+ key: pluginKey,
44
+ props: {
45
+ nodeViews: {
46
+ caption: captionNodeView(portalProviderAPI, eventDispatcher, pluginInjectionApi)
47
+ }
48
+ }
49
+ });
50
+ });
@@ -0,0 +1,2 @@
1
+ import { PluginKey } from '@atlaskit/editor-prosemirror/state';
2
+ export var pluginKey = new PluginKey('caption');
@@ -1 +1,2 @@
1
1
  export type { CaptionPlugin } from './types';
2
+ export { default as captionPlugin } from './plugin';
@@ -0,0 +1,19 @@
1
+ /// <reference types="react" />
2
+ import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
3
+ import type { PortalProviderAPI } from '@atlaskit/editor-common/portal-provider';
4
+ import type { ForwardRef } from '@atlaskit/editor-common/react-node-view';
5
+ import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-node-view';
6
+ import type { ExtractInjectionAPI, getPosHandler } from '@atlaskit/editor-common/types';
7
+ import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
8
+ import type { EditorView } from '@atlaskit/editor-prosemirror/view';
9
+ import type { CaptionPlugin } from '../types';
10
+ export declare class CaptionNodeView extends SelectionBasedNodeView {
11
+ private selected;
12
+ createDomRef(): HTMLElement;
13
+ getContentDOM(): {
14
+ dom: HTMLDivElement;
15
+ };
16
+ render(_props: never, forwardRef: ForwardRef): JSX.Element;
17
+ viewShouldUpdate(nextNode: PMNode): boolean;
18
+ }
19
+ export default function captionNodeView(portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, pluginInjectionApi: ExtractInjectionAPI<CaptionPlugin> | undefined): (node: PMNode, view: EditorView, getPos: getPosHandler) => CaptionNodeView;
@@ -0,0 +1,3 @@
1
+ import type { CaptionPlugin } from './types';
2
+ declare const captionPlugin: CaptionPlugin;
3
+ export default captionPlugin;
@@ -0,0 +1,2 @@
1
+ import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
+ export declare function captionKeymap(): SafePlugin;
@@ -0,0 +1,8 @@
1
+ import type { Dispatch, EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
2
+ import type { PortalProviderAPI } from '@atlaskit/editor-common/portal-provider';
3
+ import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
4
+ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
5
+ import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
6
+ import type { CaptionPlugin } from '../types';
7
+ declare const _default: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, dispatch: Dispatch, pluginInjectionApi: ExtractInjectionAPI<CaptionPlugin> | undefined) => SafePlugin<any>;
8
+ export default _default;
@@ -0,0 +1,2 @@
1
+ import { PluginKey } from '@atlaskit/editor-prosemirror/state';
2
+ export declare const pluginKey: PluginKey<any>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-caption",
3
- "version": "0.1.0",
3
+ "version": "0.2.1",
4
4
  "description": "Caption plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -8,7 +8,7 @@
8
8
  "registry": "https://registry.npmjs.org/"
9
9
  },
10
10
  "atlassian": {
11
- "team": "Editor: Lego",
11
+ "team": "Editor: Media Experience Porygon",
12
12
  "singleton": true,
13
13
  "releaseModel": "continuous"
14
14
  },
@@ -31,11 +31,25 @@
31
31
  ".": "./src/index.ts"
32
32
  },
33
33
  "dependencies": {
34
- "@atlaskit/editor-common": "^76.5.0",
34
+ "@atlaskit/adf-schema": "^32.0.0",
35
+ "@atlaskit/editor-common": "^76.8.0",
35
36
  "@atlaskit/editor-plugin-analytics": "^0.2.0",
37
+ "@atlaskit/editor-prosemirror": "1.1.0",
36
38
  "@babel/runtime": "^7.0.0"
37
39
  },
38
40
  "devDependencies": {
41
+ "@atlaskit/editor-plugin-copy-button": "^1.0.0",
42
+ "@atlaskit/editor-plugin-decorations": "^0.2.0",
43
+ "@atlaskit/editor-plugin-editor-disabled": "^0.2.0",
44
+ "@atlaskit/editor-plugin-feature-flags": "^1.0.0",
45
+ "@atlaskit/editor-plugin-floating-toolbar": "^0.6.0",
46
+ "@atlaskit/editor-plugin-focus": "^0.2.0",
47
+ "@atlaskit/editor-plugin-grid": "^0.3.0",
48
+ "@atlaskit/editor-plugin-guideline": "^0.5.0",
49
+ "@atlaskit/editor-plugin-selection": "^0.1.0",
50
+ "@atlaskit/editor-plugin-width": "^0.2.0",
51
+ "@atlaskit/renderer": "^108.15.0",
52
+ "@atlaskit/webdriver-runner": "*",
39
53
  "@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0"
40
54
  },
41
55
  "peerDependencies": {
package/report.api.md CHANGED
@@ -26,6 +26,9 @@ export type CaptionPlugin = NextEditorPlugin<
26
26
  }
27
27
  >;
28
28
 
29
+ // @public (undocumented)
30
+ export const captionPlugin: CaptionPlugin;
31
+
29
32
  // (No @packageDocumentation comment for this package)
30
33
  ```
31
34
 
@@ -1 +0,0 @@
1
- export type { CaptionPlugin } from './types';
@@ -1,7 +0,0 @@
1
- import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
2
- import type { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
3
- export type CaptionPlugin = NextEditorPlugin<'caption', {
4
- dependencies: [
5
- typeof analyticsPlugin
6
- ];
7
- }>;
@@ -1,17 +0,0 @@
1
- ## API Report File for "@atlaskit/editor-plugin-caption"
2
-
3
- > Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
4
-
5
- ```ts
6
-
7
- import type { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
8
- import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
9
-
10
- // @public (undocumented)
11
- export type CaptionPlugin = NextEditorPlugin<'caption', {
12
- dependencies: [typeof analyticsPlugin];
13
- }>;
14
-
15
- // (No @packageDocumentation comment for this package)
16
-
17
- ```