@wordpress/components 29.10.0 → 29.12.0

package/src/input-control/test/index.js

@@ -72,23 +72,6 @@ describe( 'InputControl', () => {
 		} );
 	} );
 
-	describe( 'Ensurance of focus for number inputs', () => {
-		it( 'should focus its input on mousedown events', async () => {
-			const user = await userEvent.setup();
-			const spy = jest.fn();
-			render( <InputControl type="number" onFocus={ spy } /> );
-			const target = getInput();
-
-			// Hovers the input and presses (without releasing) primary button.
-			await user.pointer( [
-				{ target },
-				{ keys: '[MouseLeft]', target },
-			] );
-
-			expect( spy ).toHaveBeenCalledTimes( 1 );
-		} );
-	} );
-
 	describe( 'Value', () => {
 		it( 'should update value onChange', async () => {
 			const user = await userEvent.setup();

package/src/mobile/image/index.native.js

@@ -282,7 +282,7 @@ const ImageComponent = ( {
 				accessible
 				disabled={ ! isSelected }
 				accessibilityLabel={ alt }
-				accessibilityHint={ __( 'Double tap and hold to edit' ) }
+				accessibilityHint={ __( 'Double tap to view larger.' ) }
 				accessibilityRole="imagebutton"
 				key={ url }
 				style={ imageContainerStyles }

package/src/mobile/utils/get-px-from-css-unit.native.js

@@ -116,7 +116,7 @@ function isMathExpression( cssUnit ) {
  * Evaluates the math expression and return a px value.
  *
  * @param {string} cssUnit the cssUnit value being evaluated.
- * @return {string} return a converfted value to px.
+ * @return {string} return a converted value to px.
  */
 function evalMathExpression( cssUnit ) {
 	let errorFound = false;

package/src/private-apis.ts

@@ -6,7 +6,8 @@ import { Menu } from './menu';
 import { ComponentsContext } from './context/context-system-provider';
 import Theme from './theme';
 import { Tabs } from './tabs';
-import { kebabCase } from './utils/strings';
+import { kebabCase, normalizeTextString } from './utils/strings';
+import { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';
 import { lock } from './lock-unlock';
 import Badge from './badge';
 
@@ -18,5 +19,7 @@ lock( privateApis, {
 	Theme,
 	Menu,
 	kebabCase,
+	withIgnoreIMEEvents,
 	Badge,
+	normalizeTextString,
 } );

package/src/toolbar/toolbar/style.scss

@@ -1,6 +1,6 @@
 .components-accessible-toolbar {
 	display: inline-flex;
-	border: $border-width solid $gray-900;
+	border: $border-width solid $components-color-foreground;
 	border-radius: $radius-small;
 	flex-shrink: 0;
 
@@ -14,13 +14,11 @@
 		& > .components-toolbar-group {
 			border-right: none;
 		}
-
 	}
 }
 
 .components-accessible-toolbar,
 .components-toolbar {
-
 	&[aria-orientation="vertical"] {
 		display: flex;
 		flex-direction: column;
@@ -56,7 +54,7 @@
 			z-index: -1;
 
 			// Animate in.
-			@media not (prefers-reduced-motion) {
+			@media not ( prefers-reduced-motion ) {
 				animation: components-button__appear-animation 0.1s ease;
 				animation-fill-mode: forwards;
 			}
@@ -79,7 +77,7 @@
 			}
 
 			&::before {
-				background: $gray-900;
+				background: $components-color-foreground;
 			}
 		}
 
@@ -99,7 +97,6 @@
 	}
 }
 
-
 @keyframes components-button__appear-animation {
 	from {
 		transform: scaleY(0);

package/src/toolbar/toolbar-group/style.scss

@@ -1,7 +1,7 @@
 .components-toolbar-group {
 	min-height: $block-toolbar-height;
-	border-right: $border-width solid $gray-900;
-	background-color: $white;
+	border-right: $border-width solid $components-color-foreground;
+	background-color: $components-color-background;
 	display: inline-flex;
 	flex-shrink: 0;
 	flex-wrap: wrap;
@@ -41,8 +41,8 @@
 .components-toolbar {
 	min-height: $block-toolbar-height;
 	margin: 0;
-	border: $border-width solid $gray-900;
-	background-color: $white;
+	border: $border-width solid $components-color-foreground;
+	background-color: $components-color-background;
 	display: inline-flex;
 	flex-shrink: 0;
 	flex-wrap: wrap;

package/src/utils/strings.ts

@@ -20,6 +20,7 @@ const ALL_UNICODE_DASH_CHARACTERS = new RegExp(
 
 export const normalizeTextString = ( value: string ): string => {
 	return removeAccents( value )
+		.normalize( 'NFKC' )
 		.toLocaleLowerCase()
 		.replace( ALL_UNICODE_DASH_CHARACTERS, '-' );
 };

package/src/utils/test/strings.js

@@ -169,4 +169,15 @@ describe( 'normalizeTextString', () => {
 			'-'.repeat( dashCharacters.length )
 		);
 	} );
+
+	it( 'should normalize unicode to standard characters', () => {
+		expect( normalizeTextString( '①' ) ).toBe( '1' );
+		expect( normalizeTextString( 'Ⅸ' ) ).toBe( 'ix' );
+		expect( normalizeTextString( 'MC²' ) ).toBe( 'mc2' );
+		expect( normalizeTextString( 'ＰｌａｙＳｔａｔｉｏｎ　２' ) ).toBe(
+			'playstation 2'
+		);
+		expect( normalizeTextString( 'ＡＢＣ' ) ).toBe( 'abc' );
+		expect( normalizeTextString( 'Amélie' ) ).toBe( 'amelie' );
+	} );
 } );