@atlaskit/editor-core
Version:
A package contains Atlassian editor core functionality
74 lines • 3.22 kB
JavaScript
import * as tslib_1 from "tslib";
import * as assert from 'assert';
import * as React from 'react';
import { PureComponent } from 'react';
import styled from 'styled-components';
import { FilmstripView } from '@atlaskit/media-filmstrip';
import { stateKey as mediaStateKey } from '../../plugins/media';
// tslint:disable-next-line:variable-name
var Wrapper = (_a = ["\n padding: 0 0 8px 0;\n &&& ul {\n padding: 0;\n }\n"], _a.raw = ["\n padding: 0 0 8px 0;\n &&& ul {\n padding: 0;\n }\n"], styled.div(_a));
var MediaGroupNode = (function (_super) {
tslib_1.__extends(MediaGroupNode, _super);
function MediaGroupNode(props) {
var _this = _super.call(this, props) || this;
_this.state = {
animate: false,
offset: 0
};
_this.handleSize = function (_a) {
var offset = _a.offset;
return _this.setState({ offset: offset });
};
_this.handleScroll = function (_a) {
var animate = _a.animate, offset = _a.offset;
return _this.setState({ animate: animate, offset: offset });
};
_this.getMediaNodesIds = function (children) {
return React.Children.map(children, function (child) {
return child.props.node.attrs.id;
}) || [];
};
_this.mediaPluginState = mediaStateKey.getState(props.view.state);
assert(_this.mediaPluginState, 'Media is not enabled');
return _this;
}
/**
* Save all childNodes ids into "mediaNodesIds"
*/
MediaGroupNode.prototype.componentDidMount = function () {
this.mediaNodesIds = this.getMediaNodesIds(this.props.children);
};
/**
* Update "mediaNodesIds" and notify media plugin about removed nodes
*/
MediaGroupNode.prototype.componentWillReceiveProps = function (nextProps) {
var _this = this;
var newMediaNodesIds = this.getMediaNodesIds(nextProps.children);
var removedNodesIds = this.mediaNodesIds.filter(function (id) { return newMediaNodesIds.indexOf(id) === -1; });
removedNodesIds.forEach(function (mediaNodeId) {
_this.mediaPluginState.cancelInFlightUpload(mediaNodeId);
});
this.mediaNodesIds = newMediaNodesIds;
};
MediaGroupNode.prototype.render = function () {
var _a = this.state, animate = _a.animate, offset = _a.offset;
return (React.createElement(Wrapper, null,
React.createElement(FilmstripView, { animate: animate, offset: offset, onSize: this.handleSize, onScroll: this.handleScroll }, React.Children.map(this.props.children, function (child) {
switch (child.props.node.attrs.type) {
case 'file':
return child;
default:
case 'link':
return React.cloneElement(child, {
cardDimensions: {
width: 343,
},
});
}
}))));
};
return MediaGroupNode;
}(PureComponent));
export default MediaGroupNode;
var _a;
//# sourceMappingURL=media-group.js.map