From cf8e9f665fea22db7bf693be1a72bc2a518c036a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9rgio=20Est=C3=AAv=C3=A3o?= Date: Mon, 30 Sep 2019 13:39:42 +0100 Subject: [PATCH 1/7] Rnmobile/fix link editing on start (#17631) * Don't try to clear links if text is clean. * Commented LinkUI removal test when no URL. * Don't try to remove link if we are at start of link and no actual selection is --- packages/format-library/src/link/index.native.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/packages/format-library/src/link/index.native.js b/packages/format-library/src/link/index.native.js index 8457682d07d285..c9640b62de77bf 100644 --- a/packages/format-library/src/link/index.native.js +++ b/packages/format-library/src/link/index.native.js @@ -94,7 +94,15 @@ export const link = { } onRemoveFormat() { - const { onChange, speak } = this.props; + const { onChange, speak, value } = this.props; + const startFormat = getActiveFormat( value, 'core/link' ); + + // If the previous position from start doesn't have the link is because we are at the start + const linkStart = ! find( value.formats[ value.start - 1 ], startFormat ); + if ( linkStart && isCollapsed( value ) ) { + return; + } + const linkSelection = this.getLinkSelection(); onChange( removeFormat( linkSelection, name ) ); From 14de63d2874bbea54721954906e07a36b6b4537a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9rgio=20Est=C3=AAv=C3=A3o?= Date: Tue, 1 Oct 2019 10:09:55 +0100 Subject: [PATCH 2/7] Mobile master to master (#17652) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * [RNMobile] Native mobile release v1.11.0 (#17181) * [RNMobile] Fix crash when adding separator * Build: remove global install of latest npm since we want to use the paired node/npm version (#17134) * Build: remove global install of latest npm since we want to use the paired node/npm version * Also update travis to remove --latest-npm flag * [RNMobile] Try dark mode (iOS) (#17067) * Adding dark mode component implemented on list and list block * Adding DarkMode handling to RichText, ToolBar and SafeArea * Mobile: Using DarkMode as HOC * iOS DarkMode: Modified colors on block list and block container * iOS DarkMode: Improved Header Toolbar colors * iOS DarkMode: Removing background from buttons * iOS DarkMode warning and unsupported * iOS DarkMode: MediaPlaceholder * iOS DarkMode: BottomSheets * iOS DarkMode: Inserter * iOS DarkMode: DefaultBlockAppender * iOS DarkMode: PostTite * Update hardcoded colors with variables * iOS DarkMode: Fix bottom-sheet cell value color * iOS DarkMode: More - PageBreak - Add Block Here * iOS DarkMode: Better text color * iOS Darkmode: Code block * iOS DarkMode: HTML View * iOS DarkMode: Improve colors on SafeArea * Fix toolbar not avoiding keyboard regression * Fix native unit tests * Fix gutenberg-mobile unit tests * Adding RNDarkMode mocks * RNMobile: Fix crash when viewing HTML on iOS * [RNMobile] Remove toolbar from html view * [RNMobile] Fix MaxListenersExceededWarning caused by dark-mode event emitter (#17186) * Fix MaxListenersExceededWarning caused by dark-mode event emitter * Checking for setMaxListeners trying to avoid CI error * Adding remove listener to DarkMode HOC * DarkMode: Binding this.onModeChanged to `this` * DarkMode: Adding conditional needed to pass UI Tests on CI * Fix focus title on new posts regression (#17180) * BottomSheet: Setting DashIcon color directly when theme is default (light) (#17193) * Activate Travis CI on rnmobile/master branch (#17229) * Add native support for the MediaText block (#16305) * First working version of the MediaText component for native mobile * Fix adding a block to an innerblock list * Disable mediaText on production * MediaText native: improve editor visuals * Move BlockToolbar from BlockList to Layout * Remove BlockEditorProvider from BlockList and add native version of EditorProvider to Editor. Plus support InsertionPoint and BlockListAppender * Update BlockMover for native to hide if locked or if it's the only block * Make the vertical align button work, add more styling options for toolbar buttons * Make sure registerCoreBlocks does not break in production * Copy docblock comment from the web version for registerCoreBlocks * Fix focusing on the media placeholder * Only support adding image for now * Update usage of MediaPlaceholder in MediaContainer * Enable autoScroll for just the out most block list * Fix JS Unit tests * Roll back to IconButton refactor and fix tests * Fix BlockVerticalAlignmentToolbar buttons style on mobile * Fix thing for web and ensure ariaPressed is always passed down * Use AriaPressed directly to style SVG on mobile * Update snapshots * MediaUpload and MediaPlaceholder unify props (#17145) * Unify media placeholder and upload props within media-text (#17268) * [RNMobile] Fix dismiss keyboard button for the post title (#17260) * Recover border colors (#17269) * [RNMobile] Insure tapping at end of post inserts at end Previously, tapping at the end of the post would insert a block immediately after the currently selected block. In addition, this commit is cleaning out a few unusued props in the block-list file. * Support group block on mobile (#17251) * First working version of the MediaText component for native mobile * Fix adding a block to an innerblock list * Disable mediaText on production * MediaText native: improve editor visuals * Move BlockToolbar from BlockList to Layout * Remove BlockEditorProvider from BlockList and add native version of EditorProvider to Editor. Plus support InsertionPoint and BlockListAppender * Update BlockMover for native to hide if locked or if it's the only block * Make the vertical align button work, add more styling options for toolbar buttons * Make sure registerCoreBlocks does not break in production * Copy docblock comment from the web version for registerCoreBlocks * Fix focusing on the media placeholder * Only support adding image for now * Update usage of MediaPlaceholder in MediaContainer * Enable autoScroll for just the out most block list * Fix JS Unit tests * Roll back to IconButton refactor and fix tests * Fix BlockVerticalAlignmentToolbar buttons style on mobile * Fix thing for web and ensure ariaPressed is always passed down * Use AriaPressed directly to style SVG on mobile * Update snapshots * Support group block on mobile * Extend shouldShowInsertionPoint condition to be false when group is selected * Code refactor * Update package-lock * Remove redundant bg color within button appender (#17325) * [RNMobile] DarkMode improvements (#17309) * Remove the need to import `useStyle` and pass the theme prop on every instance that `withStyle` is used * Implement dark-mode refactor on all components * Fix broken native tests * Fix default block appender background color on DarkMode * DarkMode: Make `useStyle` a class function * [RNMobile] Add autosave to mobile apps (#17329) * [RNMobile] Fix crash when adding separator * Build: remove global install of latest npm since we want to use the paired node/npm version (#17134) * Build: remove global install of latest npm since we want to use the paired node/npm version * Also update travis to remove --latest-npm flag * [RNMobile] Try dark mode (iOS) (#17067) * Adding dark mode component implemented on list and list block * Adding DarkMode handling to RichText, ToolBar and SafeArea * Mobile: Using DarkMode as HOC * iOS DarkMode: Modified colors on block list and block container * iOS DarkMode: Improved Header Toolbar colors * iOS DarkMode: Removing background from buttons * iOS DarkMode warning and unsupported * iOS DarkMode: MediaPlaceholder * iOS DarkMode: BottomSheets * iOS DarkMode: Inserter * iOS DarkMode: DefaultBlockAppender * iOS DarkMode: PostTite * Update hardcoded colors with variables * iOS DarkMode: Fix bottom-sheet cell value color * iOS DarkMode: More - PageBreak - Add Block Here * iOS DarkMode: Better text color * iOS Darkmode: Code block * iOS DarkMode: HTML View * iOS DarkMode: Improve colors on SafeArea * Fix toolbar not avoiding keyboard regression * Fix native unit tests * Fix gutenberg-mobile unit tests * Adding RNDarkMode mocks * RNMobile: Fix crash when viewing HTML on iOS * [RNMobile] Remove toolbar from html view * [RNMobile] Fix MaxListenersExceededWarning caused by dark-mode event emitter (#17186) * Fix MaxListenersExceededWarning caused by dark-mode event emitter * Checking for setMaxListeners trying to avoid CI error * Adding remove listener to DarkMode HOC * DarkMode: Binding this.onModeChanged to `this` * DarkMode: Adding conditional needed to pass UI Tests on CI * Fix focus title on new posts regression (#17180) * BottomSheet: Setting DashIcon color directly when theme is default (light) (#17193) * Add a preliminary version of the AutosaveMonitor for mobile that calls the "bridge" and asks the native side to save the content * Add autosave mock function for tests * Fix merge conflicts * Fix lint * Re-add autosave on mobile that was removed erroneously during import-merge from rnmobile/master * Remove native variant of AutosaveMonitor and introduces changes at editor store level * Default to false for `isEditedPostAutosaveable` on mobile. There was a typo in the returing value on the previous commit. * Make sure to consider edits to the Title when checking if auto-save is needed * Fix lint * Add isAppender functionality on mobile (#17195) * Add isAppender functionality on mobile * refactor isAppender conditions * Replace dropZoneUIOnly in favour of showMediaSelectionUI * deprecate dropZoneUIOnly and add disableMediaSelection prop * Update test * Refactor tests and change prop name * Remove redundant empty lines * Refactor conditions inside MediaPlaceholder * Update block-editor CHANGELOG * Update packages/block-editor/CHANGELOG.md Co-Authored-By: Grzegorz (Greg) Ziółkowski * Autosave monitor - Make the mobile editor ping the native at each keystroke, since the deboucing logic is already well defined in the apps. (#17548) * [RNMobile] Refactor Dark Mode HOC (#17552) * [RNMobile] Refactor the Dark Mode HOC to fix naming antipatterns * Fix lint errors * Add .native.js suffix to usePreferredColorScheme * Update usage of theme props renamed to preferredColorScheme * Update usage of theme props renamed to preferredColorScheme * Add missing heading levels to the UI (H4, H5, H6) (#17533) * Fix lint issue (#17598) * Fix list filter on paste for RN mobile. (#17550) * Fix method for RN mobile. * Use array.From instead of slice. * Remove comment and use Array.from directly * Convert from NodeList spreadable to Array.from * Fix lint errors. * Fix documentation examples to use Array.from * Add empty line. * [RNMobile] Move MediaUploadPorgress to its own component folder (#17392) * Move MediaUploadPorgress to its own component folder (native) * MediaUploadProgress - Fix import to code standards * MediaUploadProgress readme * Mobile - MediaUploadProgress README update * Rnmobile/fix link editing on start (#17631) * Don't try to clear links if text is clean. * Commented LinkUI removal test when no URL. * Don't try to remove link if we are at start of link and no actual selection is * Simplify the code to check for active link * Update index.native.js # Conflicts: # packages/format-library/src/link/index.native.js --- packages/format-library/src/link/index.native.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/format-library/src/link/index.native.js b/packages/format-library/src/link/index.native.js index c9640b62de77bf..a804ebf1a15db5 100644 --- a/packages/format-library/src/link/index.native.js +++ b/packages/format-library/src/link/index.native.js @@ -97,9 +97,8 @@ export const link = { const { onChange, speak, value } = this.props; const startFormat = getActiveFormat( value, 'core/link' ); - // If the previous position from start doesn't have the link is because we are at the start - const linkStart = ! find( value.formats[ value.start - 1 ], startFormat ); - if ( linkStart && isCollapsed( value ) ) { + // Before we try to remove anything we check if there is something at the caret position to remove. + if ( isCollapsed( value ) && startFormat === undefined ) { return; } From ae562fb492c46485950b1f756b6511a9ae41c268 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9rgio=20Est=C3=AAv=C3=A3o?= Date: Wed, 2 Oct 2019 15:06:19 +0100 Subject: [PATCH 3/7] Make sure that HTML that is sent is correctly updated. (#17710) * Make sure that HTML that is sent is correctly updated. * Fix issue in Android. * Fix lint issues. --- .../rich-text/src/component/index.native.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/packages/rich-text/src/component/index.native.js b/packages/rich-text/src/component/index.native.js index 206680d3c87668..7dd7be39d15dfd 100644 --- a/packages/rich-text/src/component/index.native.js +++ b/packages/rich-text/src/component/index.native.js @@ -440,7 +440,7 @@ export class RichText extends Component { /** * Handles a paste event from the native Aztec Wrapper. * - * @param {PasteEvent} event The paste event which wraps `nativeEvent`. + * @param {Object} event The paste event which wraps `nativeEvent`. */ onPaste( event ) { const { @@ -753,13 +753,19 @@ export class RichText extends Component { getHtmlToRender( record, tagName ) { // Save back to HTML from React tree - const value = this.valueToFormat( record ); + let value = this.valueToFormat( record ); - if ( value === undefined || value === '' ) { + if ( value === undefined ) { this.lastEventCount = undefined; // force a refresh on the native side - return ''; - } else if ( tagName ) { - return `<${ tagName }>${ value }`; + value = ''; + } + // On android if content is empty we need to send no content or else the placeholder with not show. + if ( ! this.iOS && value === '' ) { + return value; + } + + if ( tagName ) { + value = `<${ tagName }>${ value }`; } return value; } From e7bfe8ed25f7e69724a528e3e94ab66925aa5d90 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Thu, 3 Oct 2019 15:57:50 +0200 Subject: [PATCH 4/7] Pass active state to HeadingLevelIcon in order to native start working (#17747) --- packages/block-library/src/heading/heading-level-icon.js | 5 +++-- packages/block-library/src/heading/heading-toolbar.js | 5 +++-- packages/components/src/primitives/svg/index.js | 2 +- packages/components/src/primitives/svg/index.native.js | 4 ++-- 4 files changed, 9 insertions(+), 7 deletions(-) diff --git a/packages/block-library/src/heading/heading-level-icon.js b/packages/block-library/src/heading/heading-level-icon.js index a65d9f4a0ecb64..0625824a437840 100644 --- a/packages/block-library/src/heading/heading-level-icon.js +++ b/packages/block-library/src/heading/heading-level-icon.js @@ -3,7 +3,8 @@ */ import { Path, SVG } from '@wordpress/components'; -export default function HeadingLevelIcon( { level } ) { +export default function HeadingLevelIcon( { level, __unstableActive } ) { + const levelToPath = { 1: 'M9 5h2v10H9v-4H5v4H3V5h2v4h4V5zm6.6 0c-.6.9-1.5 1.7-2.6 2v1h2v7h2V5h-1.4z', 2: 'M7 5h2v10H7v-4H3v4H1V5h2v4h4V5zm8 8c.5-.4.6-.6 1.1-1.1.4-.4.8-.8 1.2-1.3.3-.4.6-.8.9-1.3.2-.4.3-.8.3-1.3 0-.4-.1-.9-.3-1.3-.2-.4-.4-.7-.8-1-.3-.3-.7-.5-1.2-.6-.5-.2-1-.2-1.5-.2-.4 0-.7 0-1.1.1-.3.1-.7.2-1 .3-.3.1-.6.3-.9.5-.3.2-.6.4-.8.7l1.2 1.2c.3-.3.6-.5 1-.7.4-.2.7-.3 1.2-.3s.9.1 1.3.4c.3.3.5.7.5 1.1 0 .4-.1.8-.4 1.1-.3.5-.6.9-1 1.2-.4.4-1 .9-1.6 1.4-.6.5-1.4 1.1-2.2 1.6V15h8v-2H15z', @@ -17,7 +18,7 @@ export default function HeadingLevelIcon( { level } ) { } return ( - + ); diff --git a/packages/block-library/src/heading/heading-toolbar.js b/packages/block-library/src/heading/heading-toolbar.js index f3a089a8fafefe..0b4ddbf05ec647 100644 --- a/packages/block-library/src/heading/heading-toolbar.js +++ b/packages/block-library/src/heading/heading-toolbar.js @@ -17,11 +17,12 @@ import HeadingLevelIcon from './heading-level-icon'; class HeadingToolbar extends Component { createLevelControl( targetLevel, selectedLevel, onChange ) { + const isActive = targetLevel === selectedLevel; return { - icon: , + icon: , // translators: %s: heading level e.g: "1", "2", "3" title: sprintf( __( 'Heading %d' ), targetLevel ), - isActive: targetLevel === selectedLevel, + isActive, onClick: () => onChange( targetLevel ), }; } diff --git a/packages/components/src/primitives/svg/index.js b/packages/components/src/primitives/svg/index.js index abb15e121dc2b0..8a75464f6f07c9 100644 --- a/packages/components/src/primitives/svg/index.js +++ b/packages/components/src/primitives/svg/index.js @@ -19,5 +19,5 @@ export const SVG = ( props ) => { // Disable reason: We need to have a way to render HTML tag for web. // eslint-disable-next-line react/forbid-elements - return ; + return ; }; diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index 4ee8dbae9b798d..8d6d8da8bc8ea4 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -18,8 +18,8 @@ export { export const SVG = ( props ) => { const stylesFromClasses = ( props.className || '' ).split( ' ' ).map( ( element ) => styles[ element ] ).filter( Boolean ); - const stylesFromAriaPressed = props.ariaPressed ? styles[ 'is-active' ] : styles[ 'components-toolbar__control' ]; - const styleValues = Object.assign( {}, props.style, stylesFromAriaPressed, ...stylesFromClasses ); + const defaultStyle = props.__unstableActive ? styles[ 'is-active' ] : styles[ 'components-toolbar__control' ]; + const styleValues = Object.assign( {}, props.style, defaultStyle, ...stylesFromClasses ); const safeProps = { ...props, style: styleValues }; From f47b1911cc1d5866eb9b41e147f05de73618fbce Mon Sep 17 00:00:00 2001 From: etoledom Date: Fri, 4 Oct 2019 10:48:22 +0200 Subject: [PATCH 5/7] Fix typo this.iOS -> this.isIOS (#17763) --- packages/rich-text/src/component/index.native.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/rich-text/src/component/index.native.js b/packages/rich-text/src/component/index.native.js index 7dd7be39d15dfd..63a0be642cb63d 100644 --- a/packages/rich-text/src/component/index.native.js +++ b/packages/rich-text/src/component/index.native.js @@ -760,7 +760,7 @@ export class RichText extends Component { value = ''; } // On android if content is empty we need to send no content or else the placeholder with not show. - if ( ! this.iOS && value === '' ) { + if ( ! this.isIOS && value === '' ) { return value; } From 3143ea928cfce6c8ed8fd8570cd7e4312cf58d6f Mon Sep 17 00:00:00 2001 From: etoledom Date: Mon, 7 Oct 2019 14:29:35 +0200 Subject: [PATCH 6/7] Fix lint errors (#17808) --- packages/block-library/src/heading/heading-level-icon.js | 1 - packages/block-library/src/heading/heading-toolbar.js | 2 +- packages/components/src/primitives/svg/index.js | 5 +++++ 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/heading/heading-level-icon.js b/packages/block-library/src/heading/heading-level-icon.js index 0625824a437840..aa1e964f3ec417 100644 --- a/packages/block-library/src/heading/heading-level-icon.js +++ b/packages/block-library/src/heading/heading-level-icon.js @@ -4,7 +4,6 @@ import { Path, SVG } from '@wordpress/components'; export default function HeadingLevelIcon( { level, __unstableActive } ) { - const levelToPath = { 1: 'M9 5h2v10H9v-4H5v4H3V5h2v4h4V5zm6.6 0c-.6.9-1.5 1.7-2.6 2v1h2v7h2V5h-1.4z', 2: 'M7 5h2v10H7v-4H3v4H1V5h2v4h4V5zm8 8c.5-.4.6-.6 1.1-1.1.4-.4.8-.8 1.2-1.3.3-.4.6-.8.9-1.3.2-.4.3-.8.3-1.3 0-.4-.1-.9-.3-1.3-.2-.4-.4-.7-.8-1-.3-.3-.7-.5-1.2-.6-.5-.2-1-.2-1.5-.2-.4 0-.7 0-1.1.1-.3.1-.7.2-1 .3-.3.1-.6.3-.9.5-.3.2-.6.4-.8.7l1.2 1.2c.3-.3.6-.5 1-.7.4-.2.7-.3 1.2-.3s.9.1 1.3.4c.3.3.5.7.5 1.1 0 .4-.1.8-.4 1.1-.3.5-.6.9-1 1.2-.4.4-1 .9-1.6 1.4-.6.5-1.4 1.1-2.2 1.6V15h8v-2H15z', diff --git a/packages/block-library/src/heading/heading-toolbar.js b/packages/block-library/src/heading/heading-toolbar.js index 0b4ddbf05ec647..6d19cc0822f894 100644 --- a/packages/block-library/src/heading/heading-toolbar.js +++ b/packages/block-library/src/heading/heading-toolbar.js @@ -19,7 +19,7 @@ class HeadingToolbar extends Component { createLevelControl( targetLevel, selectedLevel, onChange ) { const isActive = targetLevel === selectedLevel; return { - icon: , + icon: , // translators: %s: heading level e.g: "1", "2", "3" title: sprintf( __( 'Heading %d' ), targetLevel ), isActive, diff --git a/packages/components/src/primitives/svg/index.js b/packages/components/src/primitives/svg/index.js index 8a75464f6f07c9..6aabda291fd88e 100644 --- a/packages/components/src/primitives/svg/index.js +++ b/packages/components/src/primitives/svg/index.js @@ -1,3 +1,8 @@ +/** + * External dependencies + */ +import { omit } from 'lodash'; + /** * WordPress dependencies */ From f650decebac69573cdc55895fe5919c2fd7112b7 Mon Sep 17 00:00:00 2001 From: Marko Savic Date: Tue, 8 Oct 2019 09:54:28 +0200 Subject: [PATCH 7/7] Update packages/components/src/primitives/svg/index.native.js Co-Authored-By: etoledom --- packages/components/src/primitives/svg/index.native.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/src/primitives/svg/index.native.js b/packages/components/src/primitives/svg/index.native.js index 5311040b2ed6dd..8cf9a2d7cee274 100644 --- a/packages/components/src/primitives/svg/index.native.js +++ b/packages/components/src/primitives/svg/index.native.js @@ -19,7 +19,7 @@ export { export const SVG = ( props ) => { const colorScheme = props.colorScheme || 'light'; const stylesFromClasses = ( props.className || '' ).split( ' ' ).map( ( element ) => styles[ element ] ).filter( Boolean ); - const defaultStyle = props.__unstableActive ? styles[ 'is-active' ] : styles[ 'components-toolbar__control' ]; + const defaultStyle = props.__unstableActive ? styles[ 'is-active' ] : styles[ 'components-toolbar__control-' + colorScheme ]; const styleValues = Object.assign( {}, props.style, defaultStyle, ...stylesFromClasses ); const safeProps = { ...props, style: styleValues };