From 7f864b96ea35b26ec827ab317bc48fb2b3dd78ec Mon Sep 17 00:00:00 2001 From: iseulde Date: Thu, 7 Feb 2019 15:17:42 +0100 Subject: [PATCH 1/9] Basic functionality --- lib/packages-dependencies.php | 3 +- package-lock.json | 3 +- .../editor/src/components/rich-text/index.js | 9 +++-- packages/format-library/package.json | 1 - packages/format-library/src/image/index.js | 39 +++++++++++++++++-- packages/format-library/src/image/style.scss | 14 +++++++ packages/format-library/src/link/inline.js | 2 +- packages/rich-text/package.json | 2 + .../components}/positioned-at-selection.js | 4 +- packages/rich-text/src/index.js | 2 + packages/rich-text/src/to-dom.js | 3 +- 11 files changed, 68 insertions(+), 14 deletions(-) create mode 100644 packages/format-library/src/image/style.scss rename packages/{format-library/src/link => rich-text/src/components}/positioned-at-selection.js (95%) diff --git a/lib/packages-dependencies.php b/lib/packages-dependencies.php index fbf5eda814717c..ebd41da12f1561 100644 --- a/lib/packages-dependencies.php +++ b/lib/packages-dependencies.php @@ -166,7 +166,6 @@ 'wp-escape-html' => array(), 'wp-format-library' => array( 'wp-components', - 'wp-dom', 'wp-editor', 'wp-element', 'wp-i18n', @@ -214,6 +213,8 @@ 'wp-rich-text' => array( 'lodash', 'wp-data', + 'wp-dom', + 'wp-element', 'wp-escape-html', ), 'wp-shortcode' => array( diff --git a/package-lock.json b/package-lock.json index e59039690658a6..98776dbda3fbb9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2818,7 +2818,6 @@ "requires": { "@babel/runtime": "^7.3.1", "@wordpress/components": "file:packages/components", - "@wordpress/dom": "file:packages/dom", "@wordpress/editor": "file:packages/editor", "@wordpress/element": "file:packages/element", "@wordpress/i18n": "file:packages/i18n", @@ -2978,6 +2977,8 @@ "@babel/runtime": "^7.3.1", "@wordpress/compose": "file:packages/compose", "@wordpress/data": "file:packages/data", + "@wordpress/dom": "file:packages/dom", + "@wordpress/element": "file:packages/element", "@wordpress/escape-html": "file:packages/escape-html", "lodash": "^4.17.11", "rememo": "^3.0.0" diff --git a/packages/editor/src/components/rich-text/index.js b/packages/editor/src/components/rich-text/index.js index ca4a598acb2756..70a179cf25169a 100644 --- a/packages/editor/src/components/rich-text/index.js +++ b/packages/editor/src/components/rich-text/index.js @@ -169,13 +169,14 @@ export class RichText extends Component { } ); } - applyRecord( record ) { + applyRecord( record, { withoutSelectionApplication } = {} ) { apply( { value: record, current: this.editableRef, multilineTag: this.multilineTag, multilineWrapperTags: this.multilineWrapperTags, prepareEditableTree: this.props.prepareEditableTree, + withoutSelectionApplication, } ); } @@ -448,8 +449,10 @@ export class RichText extends Component { * @param {boolean} $2.withoutHistory If true, no undo level will be * created. */ - onChange( record, { withoutHistory } = {} ) { - this.applyRecord( record ); + onChange( record, { withoutHistory, noFocusReturn } = {} ) { + this.applyRecord( record, { + withoutSelectionApplication: noFocusReturn, + } ); const { start, end, formatPlaceholder, selectedFormat } = record; diff --git a/packages/format-library/package.json b/packages/format-library/package.json index c3e3d6b018950f..d8fd5b4b7f3665 100644 --- a/packages/format-library/package.json +++ b/packages/format-library/package.json @@ -22,7 +22,6 @@ "dependencies": { "@babel/runtime": "^7.3.1", "@wordpress/components": "file:../components", - "@wordpress/dom": "file:../dom", "@wordpress/editor": "file:../editor", "@wordpress/element": "file:../element", "@wordpress/i18n": "file:../i18n", diff --git a/packages/format-library/src/image/index.js b/packages/format-library/src/image/index.js index c26bcca626a5dd..0bc53644736d1c 100644 --- a/packages/format-library/src/image/index.js +++ b/packages/format-library/src/image/index.js @@ -1,10 +1,10 @@ /** * WordPress dependencies */ -import { Path, SVG } from '@wordpress/components'; +import { Path, SVG, TextControl, Popover } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { Component } from '@wordpress/element'; -import { insertObject } from '@wordpress/rich-text'; +import { insertObject, PositionedAtSelection } from '@wordpress/rich-text'; import { MediaUpload, RichTextInserterItem, MediaUploadCheck } from '@wordpress/editor'; const ALLOWED_MEDIA_TYPES = [ 'image' ]; @@ -43,7 +43,8 @@ export const image = { } render() { - const { value, onChange } = this.props; + const { value, onChange, isActive, activeAttributes } = this.props; + const { style } = activeAttributes; return ( @@ -73,6 +74,38 @@ export const image = { return null; } } /> } + { isActive && + + { + const newFormats = value.formats.slice( 0 ); + + newFormats[ value.start ] = [ { + type: name, + attributes: { + ...activeAttributes, + style: `width: ${ newWidth }px;`, + }, + } ]; + + onChange( { + ...value, + formats: newFormats, + }, { + noFocusReturn: true, + } ); + } } + /> + + } ); } diff --git a/packages/format-library/src/image/style.scss b/packages/format-library/src/image/style.scss new file mode 100644 index 00000000000000..f500c0de9d67c1 --- /dev/null +++ b/packages/format-library/src/image/style.scss @@ -0,0 +1,14 @@ +.editor-format-toolbar__link-container-value { + margin: $grid-size - $border-width; + flex-grow: 1; + flex-shrink: 1; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + min-width: 150px; + max-width: 500px; + + &.has-invalid-link { + color: $alert-red; + } +} diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js index cb2e4ea1025d96..93f010efa6d205 100644 --- a/packages/format-library/src/link/inline.js +++ b/packages/format-library/src/link/inline.js @@ -23,13 +23,13 @@ import { applyFormat, getTextContent, slice, + PositionedAtSelection, } from '@wordpress/rich-text'; import { URLInput, URLPopover } from '@wordpress/editor'; /** * Internal dependencies */ -import PositionedAtSelection from './positioned-at-selection'; import { isValidHref } from './utils'; const stopKeyPropagation = ( event ) => event.stopPropagation(); diff --git a/packages/rich-text/package.json b/packages/rich-text/package.json index cfae343520b6eb..32146af482bfa7 100644 --- a/packages/rich-text/package.json +++ b/packages/rich-text/package.json @@ -23,6 +23,8 @@ "@babel/runtime": "^7.3.1", "@wordpress/compose": "file:../compose", "@wordpress/data": "file:../data", + "@wordpress/dom": "file:../dom", + "@wordpress/element": "file:../element", "@wordpress/escape-html": "file:../escape-html", "lodash": "^4.17.11", "rememo": "^3.0.0" diff --git a/packages/format-library/src/link/positioned-at-selection.js b/packages/rich-text/src/components/positioned-at-selection.js similarity index 95% rename from packages/format-library/src/link/positioned-at-selection.js rename to packages/rich-text/src/components/positioned-at-selection.js index 484cd56debcf58..08915efa513d86 100644 --- a/packages/format-library/src/link/positioned-at-selection.js +++ b/packages/rich-text/src/components/positioned-at-selection.js @@ -43,7 +43,7 @@ function getCurrentCaretPositionStyle() { * * @type {WPComponent} */ -class PositionedAtSelection extends Component { +export class PositionedAtSelection extends Component { constructor() { super( ...arguments ); @@ -63,5 +63,3 @@ class PositionedAtSelection extends Component { ); } } - -export default PositionedAtSelection; diff --git a/packages/rich-text/src/index.js b/packages/rich-text/src/index.js index 423046079132bd..575eff9c433cd1 100644 --- a/packages/rich-text/src/index.js +++ b/packages/rich-text/src/index.js @@ -3,6 +3,8 @@ */ import './store'; +export { PositionedAtSelection } from './components/positioned-at-selection'; + export { applyFormat } from './apply-format'; export { charAt } from './char-at'; export { concat } from './concat'; diff --git a/packages/rich-text/src/to-dom.js b/packages/rich-text/src/to-dom.js index 3d02aab725bd9e..4c8b79c471143d 100644 --- a/packages/rich-text/src/to-dom.js +++ b/packages/rich-text/src/to-dom.js @@ -212,6 +212,7 @@ export function apply( { multilineTag, multilineWrapperTags, prepareEditableTree, + withoutSelectionApplication, } ) { // Construct a new element tree in memory. const { body, selection } = toDom( { @@ -223,7 +224,7 @@ export function apply( { applyValue( body, current ); - if ( value.start !== undefined ) { + if ( value.start !== undefined && ! withoutSelectionApplication ) { applySelection( selection, current ); } } From 2bae7d7e9e3d4b47bcec47b8611c711697c6b066 Mon Sep 17 00:00:00 2001 From: iseulde Date: Thu, 7 Feb 2019 16:10:56 +0100 Subject: [PATCH 2/9] Only update width on submit --- .../editor/src/components/rich-text/index.js | 9 +-- packages/format-library/src/image/index.js | 71 +++++++++++++++---- packages/rich-text/src/to-dom.js | 3 +- 3 files changed, 63 insertions(+), 20 deletions(-) diff --git a/packages/editor/src/components/rich-text/index.js b/packages/editor/src/components/rich-text/index.js index 70a179cf25169a..ca4a598acb2756 100644 --- a/packages/editor/src/components/rich-text/index.js +++ b/packages/editor/src/components/rich-text/index.js @@ -169,14 +169,13 @@ export class RichText extends Component { } ); } - applyRecord( record, { withoutSelectionApplication } = {} ) { + applyRecord( record ) { apply( { value: record, current: this.editableRef, multilineTag: this.multilineTag, multilineWrapperTags: this.multilineWrapperTags, prepareEditableTree: this.props.prepareEditableTree, - withoutSelectionApplication, } ); } @@ -449,10 +448,8 @@ export class RichText extends Component { * @param {boolean} $2.withoutHistory If true, no undo level will be * created. */ - onChange( record, { withoutHistory, noFocusReturn } = {} ) { - this.applyRecord( record, { - withoutSelectionApplication: noFocusReturn, - } ); + onChange( record, { withoutHistory } = {} ) { + this.applyRecord( record ); const { start, end, formatPlaceholder, selectedFormat } = record; diff --git a/packages/format-library/src/image/index.js b/packages/format-library/src/image/index.js index 0bc53644736d1c..c8dd94fa1310a0 100644 --- a/packages/format-library/src/image/index.js +++ b/packages/format-library/src/image/index.js @@ -1,16 +1,19 @@ /** * WordPress dependencies */ -import { Path, SVG, TextControl, Popover } from '@wordpress/components'; +import { Path, SVG, TextControl, Popover, IconButton } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { Component } from '@wordpress/element'; import { insertObject, PositionedAtSelection } from '@wordpress/rich-text'; import { MediaUpload, RichTextInserterItem, MediaUploadCheck } from '@wordpress/editor'; +import { LEFT, RIGHT, UP, DOWN, BACKSPACE, ENTER } from '@wordpress/keycodes'; const ALLOWED_MEDIA_TYPES = [ 'image' ]; const name = 'core/image'; +const stopKeyPropagation = ( event ) => event.stopPropagation(); + export const image = { name, title: __( 'Image' ), @@ -27,6 +30,8 @@ export const image = { edit: class ImageEdit extends Component { constructor() { super( ...arguments ); + this.onChange = this.onChange.bind( this ); + this.onKeyDown = this.onKeyDown.bind( this ); this.openModal = this.openModal.bind( this ); this.closeModal = this.closeModal.bind( this ); this.state = { @@ -34,6 +39,37 @@ export const image = { }; } + static getDerivedStateFromProps( props, state ) { + const { value, activeAttributes: { style } } = props; + + if ( value.start === state.previousStart ) { + return null; + } + + if ( ! style ) { + return { + width: undefined, + previousStart: value.start, + }; + } + + return { + width: style.replace( /\D/g, '' ), + previousStart: value.start, + }; + } + + onChange( width ) { + this.setState( { width } ); + } + + onKeyDown( event ) { + if ( [ LEFT, DOWN, RIGHT, UP, BACKSPACE, ENTER ].indexOf( event.keyCode ) > -1 ) { + // Stop the key event from propagating up to ObserveTyping.startTypingInTextField. + event.stopPropagation(); + } + } + openModal() { this.setState( { modal: true } ); } @@ -45,6 +81,7 @@ export const image = { render() { const { value, onChange, isActive, activeAttributes } = this.props; const { style } = activeAttributes; + const key = value.start + style; return ( @@ -74,36 +111,46 @@ export const image = { return null; } } /> } - { isActive && + { isActive && - { + { // Disable reason: KeyPress must be suppressed so the block doesn't hide the toolbar + /* eslint-disable jsx-a11y/no-noninteractive-element-interactions */ } +
{ const newFormats = value.formats.slice( 0 ); newFormats[ value.start ] = [ { type: name, attributes: { ...activeAttributes, - style: `width: ${ newWidth }px;`, + style: `width: ${ this.state.width }px;`, }, } ]; onChange( { ...value, formats: newFormats, - }, { - noFocusReturn: true, } ); + + event.preventDefault(); } } - /> + > + + + + { /* eslint-enable jsx-a11y/no-noninteractive-element-interactions */ }
} diff --git a/packages/rich-text/src/to-dom.js b/packages/rich-text/src/to-dom.js index 4c8b79c471143d..3d02aab725bd9e 100644 --- a/packages/rich-text/src/to-dom.js +++ b/packages/rich-text/src/to-dom.js @@ -212,7 +212,6 @@ export function apply( { multilineTag, multilineWrapperTags, prepareEditableTree, - withoutSelectionApplication, } ) { // Construct a new element tree in memory. const { body, selection } = toDom( { @@ -224,7 +223,7 @@ export function apply( { applyValue( body, current ); - if ( value.start !== undefined && ! withoutSelectionApplication ) { + if ( value.start !== undefined ) { applySelection( selection, current ); } } From 846a4e5141a05b86ca5254456853e2c535a18858 Mon Sep 17 00:00:00 2001 From: iseulde Date: Thu, 7 Feb 2019 16:29:24 +0100 Subject: [PATCH 3/9] Fix styles --- packages/format-library/src/image/index.js | 3 ++- packages/format-library/src/image/style.scss | 10 +++++----- packages/format-library/src/style.scss | 1 + 3 files changed, 8 insertions(+), 6 deletions(-) diff --git a/packages/format-library/src/image/index.js b/packages/format-library/src/image/index.js index c8dd94fa1310a0..da19ddd58c4941 100644 --- a/packages/format-library/src/image/index.js +++ b/packages/format-library/src/image/index.js @@ -113,13 +113,13 @@ export const image = { /> } { isActive && { // Disable reason: KeyPress must be suppressed so the block doesn't hide the toolbar /* eslint-disable jsx-a11y/no-noninteractive-element-interactions */ }
{ @@ -142,6 +142,7 @@ export const image = { } } > Date: Fri, 8 Feb 2019 09:52:53 +0100 Subject: [PATCH 4/9] Push a little polish --- packages/format-library/src/image/style.scss | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/packages/format-library/src/image/style.scss b/packages/format-library/src/image/style.scss index fa39ec8a086551..bfc4599920a21a 100644 --- a/packages/format-library/src/image/style.scss +++ b/packages/format-library/src/image/style.scss @@ -1,14 +1,21 @@ .editor-format-toolbar__image-container-content { display: flex; + + .components-icon-button { + height: $icon-button-size + $grid-size + $grid-size; + align-self: flex-end; + } } .editor-format-toolbar__image-container-value { margin: $grid-size - $border-width; flex-grow: 1; flex-shrink: 1; - overflow: hidden; - text-overflow: ellipsis; white-space: nowrap; min-width: 150px; max-width: 500px; + + &.components-base-control .components-base-control__field { + margin-bottom: 0; + } } From dfc532ce281341e43506ee556c85a02efc0035b2 Mon Sep 17 00:00:00 2001 From: iseulde Date: Fri, 15 Feb 2019 12:28:45 +0100 Subject: [PATCH 5/9] Select objects when clicked --- .../src/components/rich-text/editable.js | 4 +++ .../editor/src/components/rich-text/index.js | 29 +++++++++++++++++++ 2 files changed, 33 insertions(+) diff --git a/packages/editor/src/components/rich-text/editable.js b/packages/editor/src/components/rich-text/editable.js index cd668ada44a8a6..e375794e907be0 100644 --- a/packages/editor/src/components/rich-text/editable.js +++ b/packages/editor/src/components/rich-text/editable.js @@ -168,6 +168,8 @@ export default class Editable extends Component { onCompositionEnd, onFocus, onBlur, + onMouseDown, + onTouchStart, } = this.props; ariaProps.role = 'textbox'; @@ -188,6 +190,8 @@ export default class Editable extends Component { onBlur, onKeyDown, onCompositionEnd, + onMouseDown, + onTouchStart, } ); } } diff --git a/packages/editor/src/components/rich-text/index.js b/packages/editor/src/components/rich-text/index.js index ca4a598acb2756..48b66e4bdb594e 100644 --- a/packages/editor/src/components/rich-text/index.js +++ b/packages/editor/src/components/rich-text/index.js @@ -111,6 +111,7 @@ export class RichText extends Component { this.setRef = this.setRef.bind( this ); this.valueToEditableHTML = this.valueToEditableHTML.bind( this ); this.handleHorizontalNavigation = this.handleHorizontalNavigation.bind( this ); + this.onPointerDown = this.onPointerDown.bind( this ); this.formatToValue = memize( this.formatToValue.bind( this ), { size: 1 } ); @@ -742,6 +743,32 @@ export class RichText extends Component { this.onSplit( before, after, ...blocks ); } + /** + * Select object when they are clicked. The browser will not set any + * selection when clicking e.g. an image. + * + * @param {SyntheticEvent} event Synthetic mousedown or touchstart event. + */ + onPointerDown( event ) { + const { target } = event; + + // If the child element has no text content, it must be an object. + if ( target === this.editableRef || target.textContent ) { + return; + } + + const { parentNode } = target; + const index = Array.from( parentNode.childNodes ).indexOf( target ); + const range = target.ownerDocument.createRange(); + const selection = getSelection(); + + range.setStart( target.parentNode, index ); + range.setEnd( target.parentNode, index + 1 ); + + selection.removeAllRanges(); + selection.addRange( range ); + } + componentDidUpdate( prevProps ) { const { tagName, value, isSelected } = this.props; @@ -978,6 +1005,8 @@ export class RichText extends Component { onKeyDown={ this.onKeyDown } onFocus={ this.onFocus } onBlur={ this.onBlur } + onMouseDown={ this.onPointerDown } + onTouchStart={ this.onPointerDown } multilineTag={ this.multilineTag } multilineWrapperTags={ this.multilineWrapperTags } setRef={ this.setRef } From f96dbe0d9e8d0d89ca0b317910dcdadd0fb408a3 Mon Sep 17 00:00:00 2001 From: iseulde Date: Fri, 15 Feb 2019 12:36:42 +0100 Subject: [PATCH 6/9] Fix getDerivedStateFromProps --- packages/format-library/src/image/index.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/format-library/src/image/index.js b/packages/format-library/src/image/index.js index da19ddd58c4941..5482be828375f8 100644 --- a/packages/format-library/src/image/index.js +++ b/packages/format-library/src/image/index.js @@ -40,22 +40,22 @@ export const image = { } static getDerivedStateFromProps( props, state ) { - const { value, activeAttributes: { style } } = props; + const { activeAttributes: { style } } = props; - if ( value.start === state.previousStart ) { + if ( style === state.previousStyle ) { return null; } if ( ! style ) { return { width: undefined, - previousStart: value.start, + previousStyle: style, }; } return { width: style.replace( /\D/g, '' ), - previousStart: value.start, + previousStyle: style, }; } From 9a68817a3b8b31f470659eda6c1d652a6a182e13 Mon Sep 17 00:00:00 2001 From: iseulde Date: Fri, 15 Feb 2019 12:50:34 +0100 Subject: [PATCH 7/9] Reselect image after update --- packages/format-library/src/image/index.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/format-library/src/image/index.js b/packages/format-library/src/image/index.js index 5482be828375f8..ec2b631917609e 100644 --- a/packages/format-library/src/image/index.js +++ b/packages/format-library/src/image/index.js @@ -81,6 +81,8 @@ export const image = { render() { const { value, onChange, isActive, activeAttributes } = this.props; const { style } = activeAttributes; + // Rerender PositionedAtSelection when the selection changes or when + // the width changes. const key = value.start + style; return ( @@ -127,6 +129,7 @@ export const image = { newFormats[ value.start ] = [ { type: name, + object: true, attributes: { ...activeAttributes, style: `width: ${ this.state.width }px;`, From b60bd4a2a3d46ac225e34dbf6a52d18b6ef09177 Mon Sep 17 00:00:00 2001 From: iseulde Date: Fri, 15 Feb 2019 15:06:13 +0100 Subject: [PATCH 8/9] Move PositionedAtSelection --- lib/packages-dependencies.php | 2 -- package-lock.json | 2 -- packages/components/src/index.js | 1 + .../src/positioned-at-selection/index.js} | 0 packages/format-library/src/image/index.js | 4 ++-- packages/format-library/src/link/inline.js | 2 +- packages/rich-text/package.json | 2 -- packages/rich-text/src/index.js | 2 -- 8 files changed, 4 insertions(+), 11 deletions(-) rename packages/{rich-text/src/components/positioned-at-selection.js => components/src/positioned-at-selection/index.js} (100%) diff --git a/lib/packages-dependencies.php b/lib/packages-dependencies.php index ebd41da12f1561..c559fce1618072 100644 --- a/lib/packages-dependencies.php +++ b/lib/packages-dependencies.php @@ -213,8 +213,6 @@ 'wp-rich-text' => array( 'lodash', 'wp-data', - 'wp-dom', - 'wp-element', 'wp-escape-html', ), 'wp-shortcode' => array( diff --git a/package-lock.json b/package-lock.json index 98776dbda3fbb9..3483eb2ea6175b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2977,8 +2977,6 @@ "@babel/runtime": "^7.3.1", "@wordpress/compose": "file:packages/compose", "@wordpress/data": "file:packages/data", - "@wordpress/dom": "file:packages/dom", - "@wordpress/element": "file:packages/element", "@wordpress/escape-html": "file:packages/escape-html", "lodash": "^4.17.11", "rememo": "^3.0.0" diff --git a/packages/components/src/index.js b/packages/components/src/index.js index 2bc81c542f0198..f98c278e4fc9d3 100644 --- a/packages/components/src/index.js +++ b/packages/components/src/index.js @@ -43,6 +43,7 @@ export { default as PanelHeader } from './panel/header'; export { default as PanelRow } from './panel/row'; export { default as Placeholder } from './placeholder'; export { default as Popover } from './popover'; +export { PositionedAtSelection } from './positioned-at-selection'; export { default as QueryControls } from './query-controls'; export { default as RadioControl } from './radio-control'; export { default as RangeControl } from './range-control'; diff --git a/packages/rich-text/src/components/positioned-at-selection.js b/packages/components/src/positioned-at-selection/index.js similarity index 100% rename from packages/rich-text/src/components/positioned-at-selection.js rename to packages/components/src/positioned-at-selection/index.js diff --git a/packages/format-library/src/image/index.js b/packages/format-library/src/image/index.js index ec2b631917609e..b44d6ddc57c629 100644 --- a/packages/format-library/src/image/index.js +++ b/packages/format-library/src/image/index.js @@ -1,10 +1,10 @@ /** * WordPress dependencies */ -import { Path, SVG, TextControl, Popover, IconButton } from '@wordpress/components'; +import { Path, SVG, TextControl, Popover, IconButton, PositionedAtSelection } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { Component } from '@wordpress/element'; -import { insertObject, PositionedAtSelection } from '@wordpress/rich-text'; +import { insertObject } from '@wordpress/rich-text'; import { MediaUpload, RichTextInserterItem, MediaUploadCheck } from '@wordpress/editor'; import { LEFT, RIGHT, UP, DOWN, BACKSPACE, ENTER } from '@wordpress/keycodes'; diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js index 93f010efa6d205..2d79e11735f1c7 100644 --- a/packages/format-library/src/link/inline.js +++ b/packages/format-library/src/link/inline.js @@ -13,6 +13,7 @@ import { IconButton, ToggleControl, withSpokenMessages, + PositionedAtSelection, } from '@wordpress/components'; import { LEFT, RIGHT, UP, DOWN, BACKSPACE, ENTER } from '@wordpress/keycodes'; import { prependHTTP, safeDecodeURI, filterURLForDisplay } from '@wordpress/url'; @@ -23,7 +24,6 @@ import { applyFormat, getTextContent, slice, - PositionedAtSelection, } from '@wordpress/rich-text'; import { URLInput, URLPopover } from '@wordpress/editor'; diff --git a/packages/rich-text/package.json b/packages/rich-text/package.json index 32146af482bfa7..cfae343520b6eb 100644 --- a/packages/rich-text/package.json +++ b/packages/rich-text/package.json @@ -23,8 +23,6 @@ "@babel/runtime": "^7.3.1", "@wordpress/compose": "file:../compose", "@wordpress/data": "file:../data", - "@wordpress/dom": "file:../dom", - "@wordpress/element": "file:../element", "@wordpress/escape-html": "file:../escape-html", "lodash": "^4.17.11", "rememo": "^3.0.0" diff --git a/packages/rich-text/src/index.js b/packages/rich-text/src/index.js index 575eff9c433cd1..423046079132bd 100644 --- a/packages/rich-text/src/index.js +++ b/packages/rich-text/src/index.js @@ -3,8 +3,6 @@ */ import './store'; -export { PositionedAtSelection } from './components/positioned-at-selection'; - export { applyFormat } from './apply-format'; export { charAt } from './char-at'; export { concat } from './concat'; From d03c77fecc135dfc852a0d8a18cb18fbd9f1aa9a Mon Sep 17 00:00:00 2001 From: Robert Anderson Date: Mon, 18 Feb 2019 11:15:38 +1100 Subject: [PATCH 9/9] Export PositionAtSelection in same way we export other @wordpress/components --- packages/components/src/index.js | 2 +- packages/components/src/positioned-at-selection/index.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/components/src/index.js b/packages/components/src/index.js index f98c278e4fc9d3..6e45caa6e1e055 100644 --- a/packages/components/src/index.js +++ b/packages/components/src/index.js @@ -43,7 +43,7 @@ export { default as PanelHeader } from './panel/header'; export { default as PanelRow } from './panel/row'; export { default as Placeholder } from './placeholder'; export { default as Popover } from './popover'; -export { PositionedAtSelection } from './positioned-at-selection'; +export { default as PositionedAtSelection } from './positioned-at-selection'; export { default as QueryControls } from './query-controls'; export { default as RadioControl } from './radio-control'; export { default as RangeControl } from './range-control'; diff --git a/packages/components/src/positioned-at-selection/index.js b/packages/components/src/positioned-at-selection/index.js index 08915efa513d86..050050ed1fe938 100644 --- a/packages/components/src/positioned-at-selection/index.js +++ b/packages/components/src/positioned-at-selection/index.js @@ -43,7 +43,7 @@ function getCurrentCaretPositionStyle() { * * @type {WPComponent} */ -export class PositionedAtSelection extends Component { +export default class PositionedAtSelection extends Component { constructor() { super( ...arguments );