From f84c371d44eefcc74ffedccc6fd13cc4e473a796 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Tue, 19 Jun 2018 15:01:56 +0200 Subject: [PATCH 01/84] accessible autocomplete, first pass --- .../post-author/accessible-autocomplete.css | 141 ++++++++++++++++++ editor/components/post-author/index.js | 29 +++- 2 files changed, 165 insertions(+), 5 deletions(-) create mode 100644 editor/components/post-author/accessible-autocomplete.css diff --git a/editor/components/post-author/accessible-autocomplete.css b/editor/components/post-author/accessible-autocomplete.css new file mode 100644 index 00000000000000..e935c20ea031a7 --- /dev/null +++ b/editor/components/post-author/accessible-autocomplete.css @@ -0,0 +1,141 @@ +.autocomplete__wrapper { + position: relative; +} + +.autocomplete__hint, +.autocomplete__input { + -webkit-appearance: none; + border: 2px solid; + border-radius: 0; /* Safari 10 on iOS adds implicit border rounding. */ + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + margin-bottom: 0; /* BUG: Safari 10 on macOS seems to add an implicit margin. */ + width: 100%; +} + +.autocomplete__input { + background-color: transparent; + position: relative; +} + +.autocomplete__hint { + color: #BFC1C3; + position: absolute; +} + +.autocomplete__input--default{ + padding: 4px; +} + +.autocomplete__input--focused { + outline-offset: 0; + outline: 3px solid #ffbf47; +} + +.autocomplete__input--show-all-values { + padding: 4px 34px 4px 4px; + cursor: pointer; +} + +.autocomplete__dropdown-arrow-down{ + z-index: -1; + display: inline-block; + position: absolute; + right: 8px; + width: 24px; + height: 24px; + top: 10px; +} + +.autocomplete__menu { + background-color: #fff; + border: 2px solid #0B0C0C; + border-top: 0; + color: #34384B; + margin: 0; + max-height: 342px; + overflow-x: hidden; + padding: 0; + width: 100%; + width: calc(100% - 4px); +} + +.autocomplete__menu--visible { + display: block; +} + +.autocomplete__menu--hidden { + display: none; +} + +.autocomplete__menu--overlay { + box-shadow: rgba(0, 0, 0, 0.256863) 0px 2px 6px; + left: 0; + position: absolute; + top: 100%; + z-index: 100; +} + +.autocomplete__menu--inline { + position: relative; +} + +.autocomplete__option { + border-bottom: solid #BFC1C3; + border-width: 1px 0; + cursor: pointer; + display: block; + position: relative; +} + +.autocomplete__option > * { + pointer-events: none; +} + +.autocomplete__option:first-of-type { + border-top-width: 0; +} + +.autocomplete__option:last-of-type { + border-bottom-width: 0; +} + +.autocomplete__option--odd { + background-color: #FAFAFA; +} + +.autocomplete__option--focused, +.autocomplete__option:hover { + background-color: #005EA5; + border-color: #005EA5; + color: white; + outline: none; +} + +.autocomplete__option--no-results { + background-color: #FAFAFA; + color: #646b6f; + cursor: not-allowed; +} + +.autocomplete__hint, +.autocomplete__input, +.autocomplete__option { + font-size: 16px; + line-height: 1.25; +} + +.autocomplete__hint, +.autocomplete__option { + padding: 4px; +} + +@media (min-width: 641px) { + .autocomplete__hint, + .autocomplete__input, + .autocomplete__option { + font-size: 19px; + line-height: 1.31579; + } +} diff --git a/editor/components/post-author/index.js b/editor/components/post-author/index.js index 46e3b4b3fe220a..ce2751cc529b1a 100644 --- a/editor/components/post-author/index.js +++ b/editor/components/post-author/index.js @@ -11,6 +11,13 @@ import { withSelect, withDispatch } from '@wordpress/data'; */ import PostAuthorCheck from './check'; +/** + * External dependencies + */ +import accessibleAutocomplete from 'accessible-autocomplete'; +import './accessible-autocomplete.css'; +import { findWhere } from 'underscore'; + export class PostAuthor extends Component { constructor() { super( ...arguments ); @@ -18,10 +25,23 @@ export class PostAuthor extends Component { this.setAuthorId = this.setAuthorId.bind( this ); } - setAuthorId( event ) { - const { onUpdateAuthor } = this.props; - const { value } = event.target; - onUpdateAuthor( Number( value ) ); + componentDidMount() { + const { instanceId } = this.props; + accessibleAutocomplete.enhanceSelectElement( { + selectElement: document.querySelector( '#post-author-selector-' + instanceId ), + minLength: 2, + showAllValues: true, + autoselect: true, + displayMenu: 'overlay', + onConfirm: this.setAuthorId + } ); + } + + setAuthorId( selectedName ) { + const { onUpdateAuthor, authors } = this.props; + const author = findWhere( authors, { name: selectedName } ); + console.log( 'author.id', author.id ); + onUpdateAuthor( Number( author.id ) ); } render() { @@ -37,7 +57,6 @@ export class PostAuthor extends Component { + { authors.map( ( author ) => ( + + ) ) } + ; + } else { + selector = + __( `Type in ${ minQueryLength } or more characters for results` ) } + tStatusNoResults={ () => __( 'No search results' ) } + tStatusSelectedOption={ ( selectedOption, length ) => __( `${ selectedOption } (1 of ${ length }) is selected` ) } + tStatusResults={ ( length, contentSelectedOption ) => { + const words = { + result: ( length === 1 ) ? __( 'result' ) : __( 'results' ), + is: ( length === 1 ) ? __( 'is' ) : __( 'are' ), + }; + return { length } { words.result } { words.is } available. { contentSelectedOption }; + } } + + />; + } /* eslint-disable jsx-a11y/no-onchange */ return ( - + { postAuthor[0] && selector } ); /* eslint-enable jsx-a11y/no-onchange */ @@ -100,7 +104,10 @@ export class PostAuthor extends Component { export default compose( [ withSelect( ( select ) => { return { - postAuthor: select( 'core/editor' ).getEditedPostAttribute( 'author' ), + postAuthorId: select( 'core/editor' ).getEditedPostAttribute( 'author' ), + postAuthor: select( 'core' ).getAuthor( + select( 'core/editor' ).getEditedPostAttribute( 'author' ) + ), authors: select( 'core' ).getAuthors(), }; } ), diff --git a/packages/core-data/src/resolvers.js b/packages/core-data/src/resolvers.js index af646632e2a72b..1341addb0f177f 100644 --- a/packages/core-data/src/resolvers.js +++ b/packages/core-data/src/resolvers.js @@ -36,6 +36,15 @@ export async function* getAuthors() { yield receiveUserQuery( 'authors', users ); } +/** + * Request a single author from the REST API. + */ +export async function* getAuthor( state, id = '' ) { + const users = await apiRequest( { path: `/wp/v2/users/${id}?who=authors&per_page=100` } ); + yield receiveUserQuery( 'author', users ); +} + + /** * Requests an entity's record from the REST API. * diff --git a/packages/core-data/src/selectors.js b/packages/core-data/src/selectors.js index 7d36a4c65558a5..c0704cd1302b72 100644 --- a/packages/core-data/src/selectors.js +++ b/packages/core-data/src/selectors.js @@ -86,6 +86,17 @@ export function getAuthors( state ) { return getUserQueryResults( state, 'authors' ); } +/** + * Returns all available authors. + * + * @param {Object} state Data state. + * + * @return {Array} Authors list. + */ +export function getAuthor( state ) { + return getUserQueryResults( state, 'author' ); +} + /** * Returns all the users returned by a query ID. * From 42c6a607ab91732c4279bf3cd5ff67febc99e58f Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Tue, 19 Jun 2018 15:01:56 +0200 Subject: [PATCH 16/84] accessible autocomplete, first pass --- .../post-author/accessible-autocomplete.css | 141 ++++++++++++++++++ editor/components/post-author/index.js | 29 +++- 2 files changed, 165 insertions(+), 5 deletions(-) create mode 100644 editor/components/post-author/accessible-autocomplete.css diff --git a/editor/components/post-author/accessible-autocomplete.css b/editor/components/post-author/accessible-autocomplete.css new file mode 100644 index 00000000000000..e935c20ea031a7 --- /dev/null +++ b/editor/components/post-author/accessible-autocomplete.css @@ -0,0 +1,141 @@ +.autocomplete__wrapper { + position: relative; +} + +.autocomplete__hint, +.autocomplete__input { + -webkit-appearance: none; + border: 2px solid; + border-radius: 0; /* Safari 10 on iOS adds implicit border rounding. */ + box-sizing: border-box; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + margin-bottom: 0; /* BUG: Safari 10 on macOS seems to add an implicit margin. */ + width: 100%; +} + +.autocomplete__input { + background-color: transparent; + position: relative; +} + +.autocomplete__hint { + color: #BFC1C3; + position: absolute; +} + +.autocomplete__input--default{ + padding: 4px; +} + +.autocomplete__input--focused { + outline-offset: 0; + outline: 3px solid #ffbf47; +} + +.autocomplete__input--show-all-values { + padding: 4px 34px 4px 4px; + cursor: pointer; +} + +.autocomplete__dropdown-arrow-down{ + z-index: -1; + display: inline-block; + position: absolute; + right: 8px; + width: 24px; + height: 24px; + top: 10px; +} + +.autocomplete__menu { + background-color: #fff; + border: 2px solid #0B0C0C; + border-top: 0; + color: #34384B; + margin: 0; + max-height: 342px; + overflow-x: hidden; + padding: 0; + width: 100%; + width: calc(100% - 4px); +} + +.autocomplete__menu--visible { + display: block; +} + +.autocomplete__menu--hidden { + display: none; +} + +.autocomplete__menu--overlay { + box-shadow: rgba(0, 0, 0, 0.256863) 0px 2px 6px; + left: 0; + position: absolute; + top: 100%; + z-index: 100; +} + +.autocomplete__menu--inline { + position: relative; +} + +.autocomplete__option { + border-bottom: solid #BFC1C3; + border-width: 1px 0; + cursor: pointer; + display: block; + position: relative; +} + +.autocomplete__option > * { + pointer-events: none; +} + +.autocomplete__option:first-of-type { + border-top-width: 0; +} + +.autocomplete__option:last-of-type { + border-bottom-width: 0; +} + +.autocomplete__option--odd { + background-color: #FAFAFA; +} + +.autocomplete__option--focused, +.autocomplete__option:hover { + background-color: #005EA5; + border-color: #005EA5; + color: white; + outline: none; +} + +.autocomplete__option--no-results { + background-color: #FAFAFA; + color: #646b6f; + cursor: not-allowed; +} + +.autocomplete__hint, +.autocomplete__input, +.autocomplete__option { + font-size: 16px; + line-height: 1.25; +} + +.autocomplete__hint, +.autocomplete__option { + padding: 4px; +} + +@media (min-width: 641px) { + .autocomplete__hint, + .autocomplete__input, + .autocomplete__option { + font-size: 19px; + line-height: 1.31579; + } +} diff --git a/editor/components/post-author/index.js b/editor/components/post-author/index.js index 46e3b4b3fe220a..ce2751cc529b1a 100644 --- a/editor/components/post-author/index.js +++ b/editor/components/post-author/index.js @@ -11,6 +11,13 @@ import { withSelect, withDispatch } from '@wordpress/data'; */ import PostAuthorCheck from './check'; +/** + * External dependencies + */ +import accessibleAutocomplete from 'accessible-autocomplete'; +import './accessible-autocomplete.css'; +import { findWhere } from 'underscore'; + export class PostAuthor extends Component { constructor() { super( ...arguments ); @@ -18,10 +25,23 @@ export class PostAuthor extends Component { this.setAuthorId = this.setAuthorId.bind( this ); } - setAuthorId( event ) { - const { onUpdateAuthor } = this.props; - const { value } = event.target; - onUpdateAuthor( Number( value ) ); + componentDidMount() { + const { instanceId } = this.props; + accessibleAutocomplete.enhanceSelectElement( { + selectElement: document.querySelector( '#post-author-selector-' + instanceId ), + minLength: 2, + showAllValues: true, + autoselect: true, + displayMenu: 'overlay', + onConfirm: this.setAuthorId + } ); + } + + setAuthorId( selectedName ) { + const { onUpdateAuthor, authors } = this.props; + const author = findWhere( authors, { name: selectedName } ); + console.log( 'author.id', author.id ); + onUpdateAuthor( Number( author.id ) ); } render() { @@ -37,7 +57,6 @@ export class PostAuthor extends Component { + { authors.map( ( author ) => ( + + ) ) } + ; + } else { + selector = + __( `Type in ${ minQueryLength } or more characters for results` ) } + tStatusNoResults={ () => __( 'No search results' ) } + tStatusSelectedOption={ ( selectedOption, length ) => __( `${ selectedOption } (1 of ${ length }) is selected` ) } + tStatusResults={ ( length, contentSelectedOption ) => { + const words = { + result: ( length === 1 ) ? __( 'result' ) : __( 'results' ), + is: ( length === 1 ) ? __( 'is' ) : __( 'are' ), + }; + return { length } { words.result } { words.is } available. { contentSelectedOption }; + } } + + />; + } /* eslint-disable jsx-a11y/no-onchange */ return ( - + { postAuthor[0] && selector } ); /* eslint-enable jsx-a11y/no-onchange */ @@ -100,7 +104,10 @@ export class PostAuthor extends Component { export default compose( [ withSelect( ( select ) => { return { - postAuthor: select( 'core/editor' ).getEditedPostAttribute( 'author' ), + postAuthorId: select( 'core/editor' ).getEditedPostAttribute( 'author' ), + postAuthor: select( 'core' ).getAuthor( + select( 'core/editor' ).getEditedPostAttribute( 'author' ) + ), authors: select( 'core' ).getAuthors(), }; } ), diff --git a/packages/core-data/src/resolvers.js b/packages/core-data/src/resolvers.js index af646632e2a72b..1341addb0f177f 100644 --- a/packages/core-data/src/resolvers.js +++ b/packages/core-data/src/resolvers.js @@ -36,6 +36,15 @@ export async function* getAuthors() { yield receiveUserQuery( 'authors', users ); } +/** + * Request a single author from the REST API. + */ +export async function* getAuthor( state, id = '' ) { + const users = await apiRequest( { path: `/wp/v2/users/${id}?who=authors&per_page=100` } ); + yield receiveUserQuery( 'author', users ); +} + + /** * Requests an entity's record from the REST API. * diff --git a/packages/core-data/src/selectors.js b/packages/core-data/src/selectors.js index 7d36a4c65558a5..c0704cd1302b72 100644 --- a/packages/core-data/src/selectors.js +++ b/packages/core-data/src/selectors.js @@ -86,6 +86,17 @@ export function getAuthors( state ) { return getUserQueryResults( state, 'authors' ); } +/** + * Returns all available authors. + * + * @param {Object} state Data state. + * + * @return {Array} Authors list. + */ +export function getAuthor( state ) { + return getUserQueryResults( state, 'author' ); +} + /** * Returns all the users returned by a query ID. * From 7ec4b6c3074452b01fe841978c0fc6758949a69f Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Mon, 9 Jul 2018 09:48:07 -0400 Subject: [PATCH 31/84] Bail early if no postAuthor, add missing semicolon --- editor/components/post-author/index.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/editor/components/post-author/index.js b/editor/components/post-author/index.js index a2ffcdb9108215..a9c34bae49bae4 100644 --- a/editor/components/post-author/index.js +++ b/editor/components/post-author/index.js @@ -15,7 +15,7 @@ import PostAuthorCheck from './check'; /** * External dependencies */ -import Autocomplete from 'accessible-autocomplete/react' +import Autocomplete from 'accessible-autocomplete/react'; import './accessible-autocomplete.css'; import { findWhere, debounce } from 'underscore'; @@ -53,6 +53,10 @@ export class PostAuthor extends Component { const selectId = 'post-author-selector-' + instanceId; let selector; + if ( ! postAuthor ) { + return null; + } + if ( authors.length < 50 ) { selector = - { authors.map( ( author ) => ( - - ) ) } - ; + selector = + ; } else { - selector = - __( `Type in ${ minQueryLength } or more characters for results` ) } - tStatusNoResults={ () => __( 'No search results' ) } - tStatusSelectedOption={ ( selectedOption, length ) => __( `${ selectedOption } (1 of ${ length }) is selected` ) } - tStatusResults={ ( length, contentSelectedOption ) => { - const words = { - result: ( length === 1 ) ? __( 'result' ) : __( 'results' ), - is: ( length === 1 ) ? __( 'is' ) : __( 'are' ), - }; - return { length } { words.result } { words.is } available. { contentSelectedOption }; - } } + selector = + + __( `Type in ${ minQueryLength } or more characters for results` ) } + tStatusNoResults={ () => __( 'No search results' ) } + tStatusSelectedOption={ ( selectedOption, length ) => __( `${ selectedOption } (1 of ${ length }) is selected` ) } + tStatusResults={ ( length, contentSelectedOption ) => { + const words = { + result: ( length === 1 ) ? __( 'result' ) : __( 'results' ), + is: ( length === 1 ) ? __( 'is' ) : __( 'are' ), + }; + return { length } { words.result } { words.is } available. { contentSelectedOption }; + } } - />; + />; } /* eslint-disable jsx-a11y/no-onchange */ return ( - { postAuthor[0] && selector } + { postAuthor[ 0 ] && selector } ); /* eslint-enable jsx-a11y/no-onchange */ diff --git a/packages/core-data/src/resolvers.js b/packages/core-data/src/resolvers.js index 1341addb0f177f..18127add3ee40e 100644 --- a/packages/core-data/src/resolvers.js +++ b/packages/core-data/src/resolvers.js @@ -38,13 +38,15 @@ export async function* getAuthors() { /** * Request a single author from the REST API. + * + * @param {Object} state State tree. + * @param {string} id Author id. */ export async function* getAuthor( state, id = '' ) { - const users = await apiRequest( { path: `/wp/v2/users/${id}?who=authors&per_page=100` } ); + const users = await apiRequest( { path: `/wp/v2/users/${ id }?who=authors&per_page=100` } ); yield receiveUserQuery( 'author', users ); } - /** * Requests an entity's record from the REST API. * From a683a1c71a83c5ac4ed44bec44a8d81824453ea2 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 27 Jul 2018 12:51:40 -0600 Subject: [PATCH 33/84] update package-lock --- package-lock.json | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/package-lock.json b/package-lock.json index b632e135554bf5..6da3adb28d9c78 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3758,6 +3758,15 @@ "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==", "dev": true }, + "accessible-autocomplete": { + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/accessible-autocomplete/-/accessible-autocomplete-1.6.1.tgz", + "integrity": "sha512-75asizh6ld4NPzxId/IcL8IjT1MzZfARCkWp5eShv0gXBt3kKj6BGFRiS/qSkeep4OM8Fz20FqiftTuPSJNITw==", + "dev": true, + "requires": { + "preact": "^8.1.0" + } + }, "acorn": { "version": "5.7.1", "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.7.1.tgz", @@ -16681,6 +16690,12 @@ } } }, + "preact": { + "version": "8.2.9", + "resolved": "https://registry.npmjs.org/preact/-/preact-8.2.9.tgz", + "integrity": "sha512-ThuGXBmJS3VsT+jIP+eQufD3L8pRw/PY3FoCys6O9Pu6aF12Pn9zAJDX99TfwRAFOCEKm/P0lwiPTbqKMJp0fA==", + "dev": true + }, "prelude-ls": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz", From 46d27f908f43a5e10d97188526ccceb52bdb2791 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 27 Jul 2018 12:52:26 -0600 Subject: [PATCH 34/84] add css --- editor/components/post-author/accessible-autocomplete.min.css | 1 + 1 file changed, 1 insertion(+) create mode 100644 editor/components/post-author/accessible-autocomplete.min.css diff --git a/editor/components/post-author/accessible-autocomplete.min.css b/editor/components/post-author/accessible-autocomplete.min.css new file mode 100644 index 00000000000000..f8052b03c872f0 --- /dev/null +++ b/editor/components/post-author/accessible-autocomplete.min.css @@ -0,0 +1 @@ +.autocomplete__wrapper{position:relative}.autocomplete__hint,.autocomplete__input{-webkit-appearance:none;border:2px solid;border-radius:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin-bottom:0;width:100%}.autocomplete__input{background-color:transparent;position:relative}.autocomplete__hint{color:#bfc1c3;position:absolute}.autocomplete__input--default{padding:4px}.autocomplete__input--focused{outline-offset:0;outline:3px solid #ffbf47}.autocomplete__input--show-all-values{padding:4px 34px 4px 4px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#34384b;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:rgba(0,0,0,.256863) 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #bfc1c3;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#005ea5;border-color:#005ea5;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:16px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:4px}@media (min-width:641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:19px;line-height:1.31579}} \ No newline at end of file From 79b6c66c88cdb200d9ff49ae570c87ef52ef18be Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Thu, 18 Oct 2018 09:46:51 -0600 Subject: [PATCH 35/84] include postAuthor data in PostAuthor test --- .../editor/src/components/post-author/test/index.js | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/packages/editor/src/components/post-author/test/index.js b/packages/editor/src/components/post-author/test/index.js index 4bce35e977b0bb..fc9d098d534f72 100644 --- a/packages/editor/src/components/post-author/test/index.js +++ b/packages/editor/src/components/post-author/test/index.js @@ -41,6 +41,13 @@ describe( 'PostAuthor', () => { }, }; + const postAuthor = [ + { + id: 1, + name: 'admin', + }, + ]; + describe( '#render()', () => { it( 'should update author', () => { const onUpdateAuthor = jest.fn(); @@ -48,7 +55,9 @@ describe( 'PostAuthor', () => { + onUpdateAuthor={ onUpdateAuthor } + postAuthor={ postAuthor } + /> ); wrapper.find( 'select' ).simulate( 'change', { From 708fd55873bab0f91780185ff6941a0994515325 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Thu, 18 Oct 2018 10:35:28 -0600 Subject: [PATCH 36/84] override some dropdown styles --- packages/editor/src/components/post-author/style.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/editor/src/components/post-author/style.scss b/packages/editor/src/components/post-author/style.scss index 8eef6d726d8dca..be64516ba0399d 100644 --- a/packages/editor/src/components/post-author/style.scss +++ b/packages/editor/src/components/post-author/style.scss @@ -139,3 +139,8 @@ line-height: 1.31579; } } + +.autocomplete__option { + padding: 2px; + font-size: 13px; +} From c6a9b18e96ed13ba81e56fecc585b0818144e110 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Mon, 3 Dec 2018 08:56:20 -0700 Subject: [PATCH 37/84] update package lock --- package-lock.json | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/package-lock.json b/package-lock.json index 61059aacdca531..2221367b9568f9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2826,15 +2826,6 @@ "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==", "dev": true }, - "accessible-autocomplete": { - "version": "1.6.1", - "resolved": "https://registry.npmjs.org/accessible-autocomplete/-/accessible-autocomplete-1.6.1.tgz", - "integrity": "sha512-75asizh6ld4NPzxId/IcL8IjT1MzZfARCkWp5eShv0gXBt3kKj6BGFRiS/qSkeep4OM8Fz20FqiftTuPSJNITw==", - "dev": true, - "requires": { - "preact": "^8.1.0" - } - }, "accepts": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.5.tgz", @@ -2845,6 +2836,15 @@ "negotiator": "0.6.1" } }, + "accessible-autocomplete": { + "version": "1.6.1", + "resolved": "https://registry.npmjs.org/accessible-autocomplete/-/accessible-autocomplete-1.6.1.tgz", + "integrity": "sha512-75asizh6ld4NPzxId/IcL8IjT1MzZfARCkWp5eShv0gXBt3kKj6BGFRiS/qSkeep4OM8Fz20FqiftTuPSJNITw==", + "dev": true, + "requires": { + "preact": "^8.1.0" + } + }, "acorn": { "version": "5.7.1", "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.7.1.tgz", @@ -11413,7 +11413,7 @@ }, "yargs": { "version": "11.1.0", - "resolved": "http://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", "integrity": "sha512-NwW69J42EsCSanF8kyn5upxvjp5ds+t3+udGBeTbFnERA+lF541DDpMawzo4z6W/QrzNM18D+BPMiOBibnFV5A==", "dev": true, "requires": { @@ -12724,7 +12724,7 @@ }, "yargs": { "version": "11.1.0", - "resolved": "http://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", "integrity": "sha512-NwW69J42EsCSanF8kyn5upxvjp5ds+t3+udGBeTbFnERA+lF541DDpMawzo4z6W/QrzNM18D+BPMiOBibnFV5A==", "dev": true, "requires": { From 550c63add88e76215fdce22b136e920f5fc0d227 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Sun, 16 Dec 2018 23:31:00 -0700 Subject: [PATCH 38/84] current author load on mount --- .../developers/data/data-core.md | 12 ------- package-lock.json | 18 +++++------ package.json | 2 +- packages/core-data/src/selectors.js | 11 ------- .../src/components/post-author/index.js | 31 ++++++++++++++----- 5 files changed, 33 insertions(+), 41 deletions(-) diff --git a/docs/designers-developers/developers/data/data-core.md b/docs/designers-developers/developers/data/data-core.md index 99e4c2a5ea730f..2a98c3bb5d3974 100644 --- a/docs/designers-developers/developers/data/data-core.md +++ b/docs/designers-developers/developers/data/data-core.md @@ -24,18 +24,6 @@ Returns all available authors. Authors list. -### getAuthor - -Returns all available authors. - -*Parameters* - - * state: Data state. - -*Returns* - -Authors list. - ### getUserQueryResults Returns all the users returned by a query ID. diff --git a/package-lock.json b/package-lock.json index 0bf9f88d8c6360..5a4abcb29ff476 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2847,12 +2847,12 @@ } }, "accessible-autocomplete": { - "version": "1.6.1", - "resolved": "https://registry.npmjs.org/accessible-autocomplete/-/accessible-autocomplete-1.6.1.tgz", - "integrity": "sha512-75asizh6ld4NPzxId/IcL8IjT1MzZfARCkWp5eShv0gXBt3kKj6BGFRiS/qSkeep4OM8Fz20FqiftTuPSJNITw==", + "version": "1.6.2", + "resolved": "https://registry.npmjs.org/accessible-autocomplete/-/accessible-autocomplete-1.6.2.tgz", + "integrity": "sha512-7S+6Vi82LQFSSd5feKedu46tiY2/DShpdXiRp0NY3cLwc+DKe1ayWd66mb3JVi8LTQubRM7jco+u92e6w0bbvg==", "dev": true, "requires": { - "preact": "^8.1.0" + "preact": "^8.3.1" } }, "acorn": { @@ -11368,7 +11368,7 @@ }, "yargs": { "version": "11.1.0", - "resolved": "https://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", + "resolved": "http://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", "integrity": "sha512-NwW69J42EsCSanF8kyn5upxvjp5ds+t3+udGBeTbFnERA+lF541DDpMawzo4z6W/QrzNM18D+BPMiOBibnFV5A==", "dev": true, "requires": { @@ -12679,7 +12679,7 @@ }, "yargs": { "version": "11.1.0", - "resolved": "https://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", + "resolved": "http://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", "integrity": "sha512-NwW69J42EsCSanF8kyn5upxvjp5ds+t3+udGBeTbFnERA+lF541DDpMawzo4z6W/QrzNM18D+BPMiOBibnFV5A==", "dev": true, "requires": { @@ -17516,9 +17516,9 @@ } }, "preact": { - "version": "8.2.9", - "resolved": "https://registry.npmjs.org/preact/-/preact-8.2.9.tgz", - "integrity": "sha512-ThuGXBmJS3VsT+jIP+eQufD3L8pRw/PY3FoCys6O9Pu6aF12Pn9zAJDX99TfwRAFOCEKm/P0lwiPTbqKMJp0fA==", + "version": "8.4.2", + "resolved": "https://registry.npmjs.org/preact/-/preact-8.4.2.tgz", + "integrity": "sha512-TsINETWiisfB6RTk0wh3/mvxbGRvx+ljeBccZ4Z6MPFKgu/KFGyf2Bmw3Z/jlXhL5JlNKY6QAbA9PVyzIy9//A==", "dev": true }, "prelude-ls": { diff --git a/package.json b/package.json index 3a133e073f5177..69cc00277c14f4 100644 --- a/package.json +++ b/package.json @@ -67,7 +67,7 @@ "@wordpress/npm-package-json-lint-config": "file:packages/npm-package-json-lint-config", "@wordpress/postcss-themes": "file:packages/postcss-themes", "@wordpress/scripts": "file:packages/scripts", - "accessible-autocomplete": "1.6.1", + "accessible-autocomplete": "1.6.2", "autoprefixer": "8.2.0", "babel-loader": "8.0.0", "benchmark": "2.1.4", diff --git a/packages/core-data/src/selectors.js b/packages/core-data/src/selectors.js index 2c2203f8d202e1..95e9f867aa3c02 100644 --- a/packages/core-data/src/selectors.js +++ b/packages/core-data/src/selectors.js @@ -52,17 +52,6 @@ export function getAuthors( state ) { return getUserQueryResults( state, 'authors' ); } -/** - * Returns all available authors. - * - * @param {Object} state Data state. - * - * @return {Array} Authors list. - */ -export function getAuthor( state ) { - return getUserQueryResults( state, 'author' ); -} - /** * Returns all the users returned by a query ID. * diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index f27d8031724f7b..82fa692f16976e 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -25,6 +25,15 @@ export class PostAuthor extends Component { this.setAuthorId = this.setAuthorId.bind( this ); this.suggestAuthor = this.suggestAuthor.bind( this ); + this.getCurrentAuthor = this.getCurrentAuthor.bind( this ); + this.state = { + postAuthor: false, + }; + } + + componentDidMount() { + const { postAuthorId } = this.props; + this.getCurrentAuthor( postAuthorId ); } suggestAuthor( query, populateResults ) { @@ -38,6 +47,15 @@ export class PostAuthor extends Component { } ); } + getCurrentAuthor( authorId ) { + if ( ! authorId ) { + return; + } + apiFetch( { path: '/wp/v2/users/' + encodeURIComponent( authorId ) } ).then( ( results ) => { + this.setState( { postAuthor: results } ); + } ); + } + setAuthorId( selection ) { if ( ! selection ) { return; @@ -54,10 +72,10 @@ export class PostAuthor extends Component { } render() { - const { postAuthorId, postAuthor, instanceId, authors } = this.props; - const selectId = 'post-author-selector-' + instanceId; + const { postAuthor } = this.state; + const { postAuthorId, instanceId, authors } = this.props; + const selectId = `post-author-selector-${ instanceId }`; let selector; - if ( ! postAuthor ) { return null; } @@ -81,8 +99,8 @@ export class PostAuthor extends Component { id={ selectId } minLength={ 2 } showAllValues={ true } - defaultValue={ postAuthor && postAuthor[ 0 ] ? postAuthor[ 0 ].name : '' } autoselect={ true } + defaultValue={ postAuthor ? postAuthor.name : '' } displayMenu="overlay" onConfirm={ this.setAuthorId } source={ debounce( this.suggestAuthor, 300 ) } @@ -105,7 +123,7 @@ export class PostAuthor extends Component { return ( - { postAuthor[ 0 ] && selector } + { postAuthor && selector } ); /* eslint-enable jsx-a11y/no-onchange */ @@ -116,9 +134,6 @@ export default compose( [ withSelect( ( select ) => { return { postAuthorId: select( 'core/editor' ).getEditedPostAttribute( 'author' ), - postAuthor: select( 'core' ).getAuthor( - select( 'core/editor' ).getEditedPostAttribute( 'author' ) - ), authors: select( 'core' ).getAuthors(), }; } ), From d1731ecab0ac8793cfb6d85598278c983f9a1f90 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Mon, 17 Dec 2018 07:57:49 -0700 Subject: [PATCH 39/84] Set or fetch the current author --- packages/editor/src/components/post-author/index.js | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index 82fa692f16976e..b1e7e33bec4a9d 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -32,8 +32,15 @@ export class PostAuthor extends Component { } componentDidMount() { - const { postAuthorId } = this.props; - this.getCurrentAuthor( postAuthorId ); + const { postAuthorId, authors } = this.props; + const authorInAuthors = findWhere( authors, { id: postAuthorId } ); + + // Set or fetch the current author. + if ( authorInAuthors ) { + this.setState( { postAuthor: authorInAuthors } ); + } else { + this.getCurrentAuthor( postAuthorId ); + } } suggestAuthor( query, populateResults ) { From 6585f700616c58d72cd4aa471ceae8e9060a6611 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Mon, 17 Dec 2018 08:11:22 -0700 Subject: [PATCH 40/84] If the postAuthor is provided, use it directly. Fixes test, enables passing author if available. --- packages/editor/src/components/post-author/index.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index b1e7e33bec4a9d..153c3e16ec89fc 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -32,7 +32,13 @@ export class PostAuthor extends Component { } componentDidMount() { - const { postAuthorId, authors } = this.props; + const { postAuthorId, authors, postAuthor } = this.props; + + // If the postAuthor is provided, use it directly. + if ( postAuthor ) { + this.setState( { postAuthor } ); + } + const authorInAuthors = findWhere( authors, { id: postAuthorId } ); // Set or fetch the current author. From 74e4083d969fb57f493a54032599da4f727bc572 Mon Sep 17 00:00:00 2001 From: Pascal Birchler Date: Tue, 18 Dec 2018 13:08:33 +0100 Subject: [PATCH 41/84] Build docs --- docs/manifest.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/manifest.json b/docs/manifest.json index 79512ef3b96ca5..4dc762893f571b 100644 --- a/docs/manifest.json +++ b/docs/manifest.json @@ -270,7 +270,7 @@ "parent": "designers-developers" }, { - "title": "Contributors", + "title": "Contributors Guide", "slug": "contributors", "markdown_source": "https://raw.githubusercontent.com/WordPress/gutenberg/master/docs/contributors/readme.md", "parent": null From c70e125b204715487f80cd26128f68b05749259f Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Tue, 18 Dec 2018 07:32:57 -0700 Subject: [PATCH 42/84] remove unused getAuthor resolver --- packages/core-data/src/resolvers.js | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/packages/core-data/src/resolvers.js b/packages/core-data/src/resolvers.js index 1c192bd66264f8..d2950ceabedfcd 100644 --- a/packages/core-data/src/resolvers.js +++ b/packages/core-data/src/resolvers.js @@ -29,17 +29,6 @@ export function* getAuthors() { yield receiveUserQuery( 'authors', users ); } -/** - * Request a single author from the REST API. - * - * @param {Object} state State tree. - * @param {string} id Author id. - */ -export function* getAuthor( state, id = '' ) { - const users = yield apiFetch( { path: `/wp/v2/users/${ id }?who=authors&per_page=100` } ); - yield receiveUserQuery( 'author', users ); -} - /** * Requests an entity's record from the REST API. * From 4aded2ff3f308ab35f5fed8b44f5851a5ccbc895 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Tue, 18 Dec 2018 10:19:11 -0700 Subject: [PATCH 43/84] lodash! --- packages/editor/src/components/post-author/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index 153c3e16ec89fc..fea1d882b14f4e 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -17,7 +17,7 @@ import PostAuthorCheck from './check'; */ import Autocomplete from 'accessible-autocomplete/react'; -import { findWhere, debounce } from 'underscore'; +import { findWhere, debounce } from 'lodash'; export class PostAuthor extends Component { constructor() { From f1b5739d43acc11b5fc586e2eec30b3bffcbddc6 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Tue, 18 Dec 2018 10:26:02 -0700 Subject: [PATCH 44/84] findWhere -> find --- packages/editor/src/components/post-author/index.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index fea1d882b14f4e..a0764cc556ba65 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -17,7 +17,7 @@ import PostAuthorCheck from './check'; */ import Autocomplete from 'accessible-autocomplete/react'; -import { findWhere, debounce } from 'lodash'; +import { debounce } from 'lodash'; export class PostAuthor extends Component { constructor() { @@ -39,7 +39,9 @@ export class PostAuthor extends Component { this.setState( { postAuthor } ); } - const authorInAuthors = findWhere( authors, { id: postAuthorId } ); + const authorInAuthors = authors.find( ( singleAuthor ) => { + return singleAuthor.id === postAuthorId; + } ); // Set or fetch the current author. if ( authorInAuthors ) { @@ -76,7 +78,9 @@ export class PostAuthor extends Component { const { onUpdateAuthor } = this.props; if ( typeof selection === 'string' ) { // Author name from the autocompleter. - const author = findWhere( this.authors, { name: selection } ); + const author = this.authors.find( ( singleAuthor ) => { + return singleAuthor.name === selection; + } ); onUpdateAuthor( Number( author.id ) ); } else { // Author ID from the select. From 790c2c24eaf3344b02c808fdcb511725dfa51250 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Tue, 18 Dec 2018 22:02:25 -0700 Subject: [PATCH 45/84] add caching; only debounce remote requests --- .../src/components/post-author/index.js | 29 +++++++++++++++---- 1 file changed, 23 insertions(+), 6 deletions(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index a0764cc556ba65..fab74ee13fb472 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -26,9 +26,19 @@ export class PostAuthor extends Component { this.setAuthorId = this.setAuthorId.bind( this ); this.suggestAuthor = this.suggestAuthor.bind( this ); this.getCurrentAuthor = this.getCurrentAuthor.bind( this ); + this.resolveResults = this.resolveResults.bind( this ); this.state = { postAuthor: false, }; + this.searchCache = []; + this.requestResults = debounce( ( query, populateResults ) => { + const payload = '?search=' + encodeURIComponent( query ); + apiFetch( { path: '/wp/v2/users' + payload } ).then( ( results ) => { + populateResults( this.resolveResults( results ) ); + this.searchCache[ query ] = results; + } ); + }, 300 ); + this.requestResults = this.requestResults.bind( this ); } componentDidMount() { @@ -55,11 +65,18 @@ export class PostAuthor extends Component { if ( query.length < 2 ) { return; } - const payload = '?search=' + encodeURIComponent( query ); - apiFetch( { path: '/wp/v2/users' + payload } ).then( ( results ) => { - this.authors = results; - populateResults( results.map( ( author ) => ( author.name ) ) ); - } ); + + if ( this.searchCache[ query ] ) { + populateResults( this.resolveResults( this.searchCache[ query ] ) ); + return; + } + + this.requestResults( query, populateResults ); + } + + resolveResults( results ) { + this.authors = results; + return results.map( ( author ) => ( author.name ) ); } getCurrentAuthor( authorId ) { @@ -120,7 +137,7 @@ export class PostAuthor extends Component { defaultValue={ postAuthor ? postAuthor.name : '' } displayMenu="overlay" onConfirm={ this.setAuthorId } - source={ debounce( this.suggestAuthor, 300 ) } + source={ this.suggestAuthor } showNoResultsFound={ false } tStatusQueryTooShort={ ( minQueryLength ) => __( `Type in ${ minQueryLength } or more characters for results` ) } From e6a87130059df1dca3f8b6415cd8e08f88be9ddb Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 11 Jan 2019 23:09:24 -0700 Subject: [PATCH 46/84] remove autoprefixer --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 849488ee24629f..052d4e6540467c 100644 --- a/package.json +++ b/package.json @@ -69,7 +69,6 @@ "@wordpress/scripts": "file:packages/scripts", "@wordpress/tests-e2e": "file:packages/tests-e2e", "accessible-autocomplete": "1.6.2", - "autoprefixer": "8.2.0", "babel-loader": "8.0.0", "benchmark": "2.1.4", "browserslist": "3.2.8", From 74e4f711b037db172dfc6504a768f29f16608309 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 11 Jan 2019 23:26:06 -0700 Subject: [PATCH 47/84] use string literals --- packages/editor/src/components/autocompleters/user.js | 4 ++-- packages/editor/src/components/post-author/index.js | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/editor/src/components/autocompleters/user.js b/packages/editor/src/components/autocompleters/user.js index 0ca90dad349675..44c3ab6ca83e12 100644 --- a/packages/editor/src/components/autocompleters/user.js +++ b/packages/editor/src/components/autocompleters/user.js @@ -15,9 +15,9 @@ export default { options( search ) { let payload = ''; if ( search ) { - payload = '?search=' + encodeURIComponent( search ); + payload = `?search=${ encodeURIComponent( search ) }`; } - return apiFetch( { path: '/wp/v2/users' + payload } ); + return apiFetch( { path: `/wp/v2/users${ payload }` } ); }, isDebounced: true, getOptionKeywords( user ) { diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index fab74ee13fb472..f33e439724e510 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -1,7 +1,7 @@ /** * WordPress dependencies */ -import { __ } from '@wordpress/i18n'; +import { sprintf, __, _n } from '@wordpress/i18n'; import { withInstanceId, compose } from '@wordpress/compose'; import { Component } from '@wordpress/element'; import { withSelect, withDispatch } from '@wordpress/data'; @@ -33,7 +33,7 @@ export class PostAuthor extends Component { this.searchCache = []; this.requestResults = debounce( ( query, populateResults ) => { const payload = '?search=' + encodeURIComponent( query ); - apiFetch( { path: '/wp/v2/users' + payload } ).then( ( results ) => { + apiFetch( { path: `/wp/v2/users${ payload }` } ).then( ( results ) => { populateResults( this.resolveResults( results ) ); this.searchCache[ query ] = results; } ); @@ -83,7 +83,7 @@ export class PostAuthor extends Component { if ( ! authorId ) { return; } - apiFetch( { path: '/wp/v2/users/' + encodeURIComponent( authorId ) } ).then( ( results ) => { + apiFetch( { path: `/wp/v2/users/${ encodeURIComponent( authorId ) }` } ).then( ( results ) => { this.setState( { postAuthor: results } ); } ); } From ac7bedd2d2c2e4e501d333ad3ff6e3c9b7e49fd4 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 11 Jan 2019 23:26:39 -0700 Subject: [PATCH 48/84] use sprintf --- packages/editor/src/components/post-author/index.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index f33e439724e510..a97c7aa8aa075f 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -140,7 +140,9 @@ export class PostAuthor extends Component { source={ this.suggestAuthor } showNoResultsFound={ false } tStatusQueryTooShort={ ( minQueryLength ) => - __( `Type in ${ minQueryLength } or more characters for results` ) } + // translators: %d: the number characters required to initiate an author search. + sprintf( __( 'Type in %d or more characters for results' ), minQueryLength ) + } tStatusNoResults={ () => __( 'No search results' ) } tStatusSelectedOption={ ( selectedOption, length ) => __( `${ selectedOption } (1 of ${ length }) is selected` ) } tStatusResults={ ( length, contentSelectedOption ) => { From 783655cc6dc4e2431eda8366c3e34cd60ae7cfad Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 11 Jan 2019 23:27:57 -0700 Subject: [PATCH 49/84] use _n --- packages/editor/src/components/post-author/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index a97c7aa8aa075f..3a1c7410089e50 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -147,8 +147,8 @@ export class PostAuthor extends Component { tStatusSelectedOption={ ( selectedOption, length ) => __( `${ selectedOption } (1 of ${ length }) is selected` ) } tStatusResults={ ( length, contentSelectedOption ) => { const words = { - result: ( length === 1 ) ? __( 'result' ) : __( 'results' ), - is: ( length === 1 ) ? __( 'is' ) : __( 'are' ), + result: _n( 'result', 'results', length ), + is: _n( 'is', 'are', length ), }; return { length } { words.result } { words.is } available. { contentSelectedOption }; } } From 525cf40d548cd3d6a2ef42c4f29ffbc07648bc55 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 18 Jan 2019 09:32:33 -0700 Subject: [PATCH 50/84] remove minified styles, unused --- editor/components/post-author/accessible-autocomplete.min.css | 1 - 1 file changed, 1 deletion(-) delete mode 100644 editor/components/post-author/accessible-autocomplete.min.css diff --git a/editor/components/post-author/accessible-autocomplete.min.css b/editor/components/post-author/accessible-autocomplete.min.css deleted file mode 100644 index f8052b03c872f0..00000000000000 --- a/editor/components/post-author/accessible-autocomplete.min.css +++ /dev/null @@ -1 +0,0 @@ -.autocomplete__wrapper{position:relative}.autocomplete__hint,.autocomplete__input{-webkit-appearance:none;border:2px solid;border-radius:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;margin-bottom:0;width:100%}.autocomplete__input{background-color:transparent;position:relative}.autocomplete__hint{color:#bfc1c3;position:absolute}.autocomplete__input--default{padding:4px}.autocomplete__input--focused{outline-offset:0;outline:3px solid #ffbf47}.autocomplete__input--show-all-values{padding:4px 34px 4px 4px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#34384b;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:rgba(0,0,0,.256863) 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #bfc1c3;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#005ea5;border-color:#005ea5;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:16px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:4px}@media (min-width:641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:19px;line-height:1.31579}} \ No newline at end of file From 93b5396bd55dfd09e13832d394ba6899a2f00c24 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 18 Jan 2019 09:35:25 -0700 Subject: [PATCH 51/84] imports in order of increasing locality --- packages/editor/src/components/post-author/index.js | 13 ++++++------- 1 file changed, 6 insertions(+), 7 deletions(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index 3a1c7410089e50..a3a3114e12c4ce 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -1,3 +1,9 @@ +/** + * External dependencies + */ +import Autocomplete from 'accessible-autocomplete/react'; +import { debounce } from 'lodash'; + /** * WordPress dependencies */ @@ -12,13 +18,6 @@ import apiFetch from '@wordpress/api-fetch'; */ import PostAuthorCheck from './check'; -/** - * External dependencies - */ -import Autocomplete from 'accessible-autocomplete/react'; - -import { debounce } from 'lodash'; - export class PostAuthor extends Component { constructor() { super( ...arguments ); From 9a3517246d556dab3d86de9d07f60546829d6022 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 18 Jan 2019 09:45:57 -0700 Subject: [PATCH 52/84] remove un-needed bind --- packages/editor/src/components/post-author/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index a3a3114e12c4ce..4a6c007ecdf24a 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -37,7 +37,6 @@ export class PostAuthor extends Component { this.searchCache[ query ] = results; } ); }, 300 ); - this.requestResults = this.requestResults.bind( this ); } componentDidMount() { From 31d50b5ec4524be0fac61cae8bb24fea0e63c2e1 Mon Sep 17 00:00:00 2001 From: Adam Silverstein Date: Fri, 18 Jan 2019 09:55:34 -0700 Subject: [PATCH 53/84] re-add disable reason --- packages/editor/src/components/post-author/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/editor/src/components/post-author/index.js b/packages/editor/src/components/post-author/index.js index 4a6c007ecdf24a..01d70547119a79 100644 --- a/packages/editor/src/components/post-author/index.js +++ b/packages/editor/src/components/post-author/index.js @@ -113,6 +113,7 @@ export class PostAuthor extends Component { } if ( authors.length < 50 ) { + // Disable reason: A select with an onchange throws a warning. /* eslint-disable jsx-a11y/no-onchange */ selector =