From df432bdcb7a8f9be4955b5d1bf706fe768558556 Mon Sep 17 00:00:00 2001 From: Utsav Patel <75293077+up1512001@users.noreply.github.com> Date: Fri, 14 Jun 2024 23:57:17 +0530 Subject: [PATCH] Token-list: Convert package to TypeScript (#62584) Co-authored-by: jpstevens Co-authored-by: up1512001 Co-authored-by: sirreal --- packages/token-list/CHANGELOG.md | 4 + .../token-list/src/{index.js => index.ts} | 99 ++++++++----------- .../src/test/{index.js => index.ts} | 1 + 3 files changed, 47 insertions(+), 57 deletions(-) rename packages/token-list/src/{index.js => index.ts} (65%) rename packages/token-list/src/test/{index.js => index.ts} (98%) diff --git a/packages/token-list/CHANGELOG.md b/packages/token-list/CHANGELOG.md index 3cd9c7e7aa592..de8184dfc9792 100644 --- a/packages/token-list/CHANGELOG.md +++ b/packages/token-list/CHANGELOG.md @@ -2,6 +2,10 @@ ## Unreleased +### Internal + +- Refactor to TypeScript ([#62584](https://github.com/WordPress/gutenberg/pull/62584)). + ## 3.0.0 (2024-05-31) ### Breaking Changes diff --git a/packages/token-list/src/index.js b/packages/token-list/src/index.ts similarity index 65% rename from packages/token-list/src/index.js rename to packages/token-list/src/index.ts index efd4ab68c478e..f4da3d23293ed 100644 --- a/packages/token-list/src/index.js +++ b/packages/token-list/src/index.ts @@ -4,49 +4,33 @@ * @see https://dom.spec.whatwg.org/#domtokenlist */ export default class TokenList { + private _currentValue: string; + private _valueAsArray: string[]; + /** * Constructs a new instance of TokenList. * - * @param {string} initialValue Initial value to assign. + * @param initialValue Initial value to assign. */ - constructor( initialValue = '' ) { + constructor( initialValue: string = '' ) { + this._currentValue = ''; + this._valueAsArray = []; this.value = initialValue; - - // Disable reason: These are type hints on the class. - /* eslint-disable no-unused-expressions */ - /** @type {string} */ - this._currentValue; - - /** @type {string[]} */ - this._valueAsArray; - /* eslint-enable no-unused-expressions */ } - /** - * @param {Parameters['entries']>} args - */ - entries( ...args ) { + entries( ...args: Parameters< Array< string >[ 'entries' ] > ) { return this._valueAsArray.entries( ...args ); } - /** - * @param {Parameters['forEach']>} args - */ - forEach( ...args ) { + forEach( ...args: Parameters< Array< string >[ 'forEach' ] > ) { return this._valueAsArray.forEach( ...args ); } - /** - * @param {Parameters['keys']>} args - */ - keys( ...args ) { + keys( ...args: Parameters< Array< string >[ 'keys' ] > ) { return this._valueAsArray.keys( ...args ); } - /** - * @param {Parameters['values']>} args - */ - values( ...args ) { + values( ...args: Parameters< Array< string >[ 'values' ] > ) { return this._valueAsArray.values( ...args ); } @@ -55,9 +39,9 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-value * - * @return {string} Token set as string. + * @return Token set as string. */ - get value() { + get value(): string { return this._currentValue; } @@ -66,9 +50,9 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-value * - * @param {string} value New token set as string. + * @param value New token set as string. */ - set value( value ) { + set value( value: string ) { value = String( value ); this._valueAsArray = [ ...new Set( value.split( /\s+/g ).filter( Boolean ) ), @@ -81,9 +65,9 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-length * - * @return {number} Number of tokens. + * @return Number of tokens. */ - get length() { + get length(): number { return this._valueAsArray.length; } @@ -93,9 +77,9 @@ export default class TokenList { * @see https://dom.spec.whatwg.org/#DOMTokenList-stringification-behavior * @see https://www.ecma-international.org/ecma-262/9.0/index.html#sec-tostring * - * @return {string} Token set as string. + * @return Token set as string. */ - toString() { + toString(): string { return this.value; } @@ -104,9 +88,9 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#domtokenlist * - * @return {IterableIterator} TokenList iterator. + * @return TokenList iterator. */ - *[ Symbol.iterator ]() { + *[ Symbol.iterator ](): IterableIterator< string > { return yield* this._valueAsArray; } @@ -115,11 +99,11 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-item * - * @param {number} index Index at which to return token. + * @param index Index at which to return token. * - * @return {string|undefined} Token at index. + * @return Token at index. */ - item( index ) { + item( index: number ): string | undefined { return this._valueAsArray[ index ]; } @@ -128,11 +112,11 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-contains * - * @param {string} item Token to test. + * @param item Token to test. * - * @return {boolean} Whether token is present. + * @return Whether token is present. */ - contains( item ) { + contains( item: string ): boolean { return this._valueAsArray.indexOf( item ) !== -1; } @@ -141,9 +125,9 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-add * - * @param {...string} items Items to add. + * @param items Items to add. */ - add( ...items ) { + add( ...items: string[] ): void { this.value += ' ' + items.join( ' ' ); } @@ -152,9 +136,9 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-remove * - * @param {...string} items Items to remove. + * @param items Items to remove. */ - remove( ...items ) { + remove( ...items: string[] ): void { this.value = this._valueAsArray .filter( ( val ) => ! items.includes( val ) ) .join( ' ' ); @@ -168,12 +152,12 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-toggle * - * @param {string} token Token to toggle. - * @param {boolean} [force] Presence to force. + * @param token Token to toggle. + * @param [force] Presence to force. * - * @return {boolean} Whether token is present after toggle. + * @return Whether token is present after toggle. */ - toggle( token, force ) { + toggle( token: string, force?: boolean ): boolean { if ( undefined === force ) { force = ! this.contains( token ); } @@ -193,12 +177,12 @@ export default class TokenList { * * @see https://dom.spec.whatwg.org/#dom-domtokenlist-replace * - * @param {string} token Token to replace with `newToken`. - * @param {string} newToken Token to use in place of `token`. + * @param token Token to replace with `newToken`. + * @param newToken Token to use in place of `token`. * - * @return {boolean} Whether replacement occurred. + * @return Whether replacement occurred. */ - replace( token, newToken ) { + replace( token: string, newToken: string ): boolean { if ( ! this.contains( token ) ) { return false; } @@ -215,11 +199,12 @@ export default class TokenList { * * Always returns `true` in this implementation. * + * @param _token * @see https://dom.spec.whatwg.org/#dom-domtokenlist-supports * - * @return {boolean} Whether token is supported. + * @return Whether token is supported. */ - supports() { + supports( _token: string ): boolean { return true; } } diff --git a/packages/token-list/src/test/index.js b/packages/token-list/src/test/index.ts similarity index 98% rename from packages/token-list/src/test/index.js rename to packages/token-list/src/test/index.ts index e208742d0fc6c..fda0de0c53e48 100644 --- a/packages/token-list/src/test/index.js +++ b/packages/token-list/src/test/index.ts @@ -64,6 +64,7 @@ describe( 'token-list', () => { it( 'sets to stringified value', () => { const list = new TokenList(); + // @ts-expect-error The value should be a string, for testing we pass a "bad" value. list.value = undefined; expect( list.value ).toBe( 'undefined' );