@wordpress/components 26.0.1-next.5a1d1283.0 → 26.0.2

package/build/autocomplete/autocompleter-ui.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_reactNative","_i18n","_components","_compose","_backgroundView","_interopRequireDefault","_getDefaultUseItems","_style","compose","stylesCompose","StyleSheet","getAutoCompleterUI","autocompleter","useItems","getDefaultUseItems","AutocompleterUI","filterValue","selectedIndex","onChangeOptions","onSelect","value","reset","items","filteredItems","filter","item","isDisabled","scrollViewRef","useRef","animationValue","Animated","Value","current","isVisible","setIsVisible","useState","text","useEffect","length","useLayoutEffect","scrollTo","x","animated","startAnimation","activeItemStyles","usePreferredColorSchemeStyle","styles","iconStyles","activeIconStyles","textStyles","activeTextStyles","useCallback","show","timing","toValue","duration","useNativeDriver","start","finished","contentStyles","transform","translateY","interpolate","inputRange","outputRange","height","createElement","__unstableAutocompletionItemsFill","View","style","default","ScrollView","testID","ref","horizontal","contentContainerStyle","showsHorizontalScrollIndicator","keyboardShouldPersistTaps","accessibilityLabel","__","map","option","index","isActive","itemStyle","textStyle","iconStyle","iconSource","icon","src","TouchableOpacity","activeOpacity","key","onPress","sprintf","title","Icon","size","Text","_default","exports"],"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tView,\n\tAnimated,\n\tStyleSheet,\n\tText,\n\tTouchableOpacity,\n\tScrollView,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseLayoutEffect,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tuseCallback,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tIcon,\n\t__unstableAutocompletionItemsFill as AutocompletionItemsFill,\n} from '@wordpress/components';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BackgroundView from './background-view';\nimport getDefaultUseItems from './get-default-use-items';\nimport styles from './style.scss';\n\nconst { compose: stylesCompose } = StyleSheet;\n\nexport function getAutoCompleterUI( autocompleter ) {\n\tconst useItems = autocompleter.useItems\n\t\t? autocompleter.useItems\n\t\t: getDefaultUseItems( autocompleter );\n\n\tfunction AutocompleterUI( {\n\t\tfilterValue,\n\t\tselectedIndex,\n\t\tonChangeOptions,\n\t\tonSelect,\n\t\tvalue,\n\t\treset,\n\t} ) {\n\t\tconst [ items ] = useItems( filterValue );\n\t\tconst filteredItems = items.filter( ( item ) => ! item.isDisabled );\n\t\tconst scrollViewRef = useRef();\n\t\tconst animationValue = useRef( new Animated.Value( 0 ) ).current;\n\t\tconst [ isVisible, setIsVisible ] = useState( false );\n\t\tconst { text } = value;\n\n\t\tuseEffect( () => {\n\t\t\tif ( ! isVisible && text.length > 0 ) {\n\t\t\t\tsetIsVisible( true );\n\t\t\t}\n\t\t}, [ isVisible, text ] );\n\n\t\tuseLayoutEffect( () => {\n\t\t\tonChangeOptions( items );\n\t\t\tscrollViewRef.current?.scrollTo( { x: 0, animated: false } );\n\n\t\t\tif ( isVisible && text.length > 0 ) {\n\t\t\t\tstartAnimation( true );\n\t\t\t} else if ( isVisible && text.length === 0 ) {\n\t\t\t\tstartAnimation( false );\n\t\t\t}\n\t\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t}, [ items, isVisible, text ] );\n\n\t\tconst activeItemStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__item-active' ],\n\t\t\tstyles[ 'components-autocomplete__item-active-dark' ]\n\t\t);\n\n\t\tconst iconStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__icon' ],\n\t\t\tstyles[ 'components-autocomplete__icon-active-dark' ]\n\t\t);\n\n\t\tconst activeIconStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__icon-active ' ],\n\t\t\tstyles[ 'components-autocomplete__icon-active-dark' ]\n\t\t);\n\n\t\tconst textStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__text' ],\n\t\t\tstyles[ 'components-autocomplete__text-dark' ]\n\t\t);\n\n\t\tconst activeTextStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__text-active' ],\n\t\t\tstyles[ 'components-autocomplete__text-active-dark' ]\n\t\t);\n\n\t\tconst startAnimation = useCallback(\n\t\t\t( show ) => {\n\t\t\t\tAnimated.timing( animationValue, {\n\t\t\t\t\ttoValue: show ? 1 : 0,\n\t\t\t\t\tduration: show ? 200 : 100,\n\t\t\t\t\tuseNativeDriver: true,\n\t\t\t\t} ).start( ( { finished } ) => {\n\t\t\t\t\tif ( finished && ! show && isVisible ) {\n\t\t\t\t\t\tsetIsVisible( false );\n\t\t\t\t\t\treset();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t},\n\t\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t\t[ isVisible ]\n\t\t);\n\n\t\tconst contentStyles = {\n\t\t\ttransform: [\n\t\t\t\t{\n\t\t\t\t\ttranslateY: animationValue.interpolate( {\n\t\t\t\t\t\tinputRange: [ 0, 1 ],\n\t\t\t\t\t\toutputRange: [\n\t\t\t\t\t\t\tstyles[ 'components-autocomplete' ].height,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t],\n\t\t\t\t\t} ),\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\n\t\tif ( ! filteredItems.length > 0 || ! isVisible ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<AutocompletionItemsFill>\n\t\t\t\t<View style={ styles[ 'components-autocomplete' ] }>\n\t\t\t\t\t<Animated.View style={ contentStyles }>\n\t\t\t\t\t\t<BackgroundView>\n\t\t\t\t\t\t\t<ScrollView\n\t\t\t\t\t\t\t\ttestID=\"autocompleter\"\n\t\t\t\t\t\t\t\tref={ scrollViewRef }\n\t\t\t\t\t\t\t\thorizontal\n\t\t\t\t\t\t\t\tcontentContainerStyle={\n\t\t\t\t\t\t\t\t\tstyles[ 'components-autocomplete__content' ]\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\t\t\t\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\t\t\t\t\t\taccessibilityLabel={\n\t\t\t\t\t\t\t\t\t// translators: Slash inserter autocomplete results\n\t\t\t\t\t\t\t\t\t__( 'Slash inserter results' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ filteredItems.map( ( option, index ) => {\n\t\t\t\t\t\t\t\t\tconst isActive = index === selectedIndex;\n\t\t\t\t\t\t\t\t\tconst itemStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\tstyles[\n\t\t\t\t\t\t\t\t\t\t\t'components-autocomplete__item'\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\tisActive && activeItemStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst textStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\ttextStyles,\n\t\t\t\t\t\t\t\t\t\tisActive && activeTextStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst iconStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\ticonStyles,\n\t\t\t\t\t\t\t\t\t\tisActive && activeIconStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst iconSource =\n\t\t\t\t\t\t\t\t\t\toption?.value?.icon?.src ||\n\t\t\t\t\t\t\t\t\t\toption?.value?.icon;\n\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<TouchableOpacity\n\t\t\t\t\t\t\t\t\t\t\tactiveOpacity={ 0.5 }\n\t\t\t\t\t\t\t\t\t\t\tstyle={ itemStyle }\n\t\t\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\t\t\tonPress={ () => onSelect( option ) }\n\t\t\t\t\t\t\t\t\t\t\taccessibilityLabel={ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: Block name e.g. \"Image block\"\n\t\t\t\t\t\t\t\t\t\t\t\t__( '%s block' ),\n\t\t\t\t\t\t\t\t\t\t\t\toption?.value?.title\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<View\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'components-autocomplete__icon'\n\t\t\t\t\t\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={ iconSource }\n\t\t\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={ iconStyle }\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t\t\t\t\t<Text style={ textStyle }>\n\t\t\t\t\t\t\t\t\t\t\t\t{ option?.value?.title }\n\t\t\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t\t\t</TouchableOpacity>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t</ScrollView>\n\t\t\t\t\t\t</BackgroundView>\n\t\t\t\t\t</Animated.View>\n\t\t\t\t</View>\n\t\t\t</AutocompletionItemsFill>\n\t\t);\n\t}\n\n\treturn AutocompleterUI;\n}\n\nexport default getAutoCompleterUI;\n"],"mappings":"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"}
+{"version":3,"names":["_reactNative","require","_element","_i18n","_components","_compose","_backgroundView","_interopRequireDefault","_getDefaultUseItems","_style","compose","stylesCompose","StyleSheet","getAutoCompleterUI","autocompleter","useItems","getDefaultUseItems","AutocompleterUI","filterValue","selectedIndex","onChangeOptions","onSelect","value","reset","items","filteredItems","filter","item","isDisabled","scrollViewRef","useRef","animationValue","Animated","Value","current","isVisible","setIsVisible","useState","text","useEffect","length","useLayoutEffect","scrollTo","x","animated","startAnimation","activeItemStyles","usePreferredColorSchemeStyle","styles","iconStyles","activeIconStyles","textStyles","activeTextStyles","useCallback","show","timing","toValue","duration","useNativeDriver","start","finished","contentStyles","transform","translateY","interpolate","inputRange","outputRange","height","_react","createElement","__unstableAutocompletionItemsFill","View","style","default","ScrollView","testID","ref","horizontal","contentContainerStyle","showsHorizontalScrollIndicator","keyboardShouldPersistTaps","accessibilityLabel","__","map","option","index","isActive","itemStyle","textStyle","iconStyle","iconSource","icon","src","TouchableOpacity","activeOpacity","key","onPress","sprintf","title","Icon","size","Text","_default","exports"],"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tView,\n\tAnimated,\n\tStyleSheet,\n\tText,\n\tTouchableOpacity,\n\tScrollView,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseLayoutEffect,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tuseCallback,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tIcon,\n\t__unstableAutocompletionItemsFill as AutocompletionItemsFill,\n} from '@wordpress/components';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BackgroundView from './background-view';\nimport getDefaultUseItems from './get-default-use-items';\nimport styles from './style.scss';\n\nconst { compose: stylesCompose } = StyleSheet;\n\nexport function getAutoCompleterUI( autocompleter ) {\n\tconst useItems = autocompleter.useItems\n\t\t? autocompleter.useItems\n\t\t: getDefaultUseItems( autocompleter );\n\n\tfunction AutocompleterUI( {\n\t\tfilterValue,\n\t\tselectedIndex,\n\t\tonChangeOptions,\n\t\tonSelect,\n\t\tvalue,\n\t\treset,\n\t} ) {\n\t\tconst [ items ] = useItems( filterValue );\n\t\tconst filteredItems = items.filter( ( item ) => ! item.isDisabled );\n\t\tconst scrollViewRef = useRef();\n\t\tconst animationValue = useRef( new Animated.Value( 0 ) ).current;\n\t\tconst [ isVisible, setIsVisible ] = useState( false );\n\t\tconst { text } = value;\n\n\t\tuseEffect( () => {\n\t\t\tif ( ! isVisible && text.length > 0 ) {\n\t\t\t\tsetIsVisible( true );\n\t\t\t}\n\t\t}, [ isVisible, text ] );\n\n\t\tuseLayoutEffect( () => {\n\t\t\tonChangeOptions( items );\n\t\t\tscrollViewRef.current?.scrollTo( { x: 0, animated: false } );\n\n\t\t\tif ( isVisible && text.length > 0 ) {\n\t\t\t\tstartAnimation( true );\n\t\t\t} else if ( isVisible && text.length === 0 ) {\n\t\t\t\tstartAnimation( false );\n\t\t\t}\n\t\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t}, [ items, isVisible, text ] );\n\n\t\tconst activeItemStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__item-active' ],\n\t\t\tstyles[ 'components-autocomplete__item-active-dark' ]\n\t\t);\n\n\t\tconst iconStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__icon' ],\n\t\t\tstyles[ 'components-autocomplete__icon-active-dark' ]\n\t\t);\n\n\t\tconst activeIconStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__icon-active ' ],\n\t\t\tstyles[ 'components-autocomplete__icon-active-dark' ]\n\t\t);\n\n\t\tconst textStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__text' ],\n\t\t\tstyles[ 'components-autocomplete__text-dark' ]\n\t\t);\n\n\t\tconst activeTextStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__text-active' ],\n\t\t\tstyles[ 'components-autocomplete__text-active-dark' ]\n\t\t);\n\n\t\tconst startAnimation = useCallback(\n\t\t\t( show ) => {\n\t\t\t\tAnimated.timing( animationValue, {\n\t\t\t\t\ttoValue: show ? 1 : 0,\n\t\t\t\t\tduration: show ? 200 : 100,\n\t\t\t\t\tuseNativeDriver: true,\n\t\t\t\t} ).start( ( { finished } ) => {\n\t\t\t\t\tif ( finished && ! show && isVisible ) {\n\t\t\t\t\t\tsetIsVisible( false );\n\t\t\t\t\t\treset();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t},\n\t\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t\t[ isVisible ]\n\t\t);\n\n\t\tconst contentStyles = {\n\t\t\ttransform: [\n\t\t\t\t{\n\t\t\t\t\ttranslateY: animationValue.interpolate( {\n\t\t\t\t\t\tinputRange: [ 0, 1 ],\n\t\t\t\t\t\toutputRange: [\n\t\t\t\t\t\t\tstyles[ 'components-autocomplete' ].height,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t],\n\t\t\t\t\t} ),\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\n\t\tif ( ! filteredItems.length > 0 || ! isVisible ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<AutocompletionItemsFill>\n\t\t\t\t<View style={ styles[ 'components-autocomplete' ] }>\n\t\t\t\t\t<Animated.View style={ contentStyles }>\n\t\t\t\t\t\t<BackgroundView>\n\t\t\t\t\t\t\t<ScrollView\n\t\t\t\t\t\t\t\ttestID=\"autocompleter\"\n\t\t\t\t\t\t\t\tref={ scrollViewRef }\n\t\t\t\t\t\t\t\thorizontal\n\t\t\t\t\t\t\t\tcontentContainerStyle={\n\t\t\t\t\t\t\t\t\tstyles[ 'components-autocomplete__content' ]\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\t\t\t\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\t\t\t\t\t\taccessibilityLabel={\n\t\t\t\t\t\t\t\t\t// translators: Slash inserter autocomplete results\n\t\t\t\t\t\t\t\t\t__( 'Slash inserter results' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ filteredItems.map( ( option, index ) => {\n\t\t\t\t\t\t\t\t\tconst isActive = index === selectedIndex;\n\t\t\t\t\t\t\t\t\tconst itemStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\tstyles[\n\t\t\t\t\t\t\t\t\t\t\t'components-autocomplete__item'\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\tisActive && activeItemStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst textStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\ttextStyles,\n\t\t\t\t\t\t\t\t\t\tisActive && activeTextStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst iconStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\ticonStyles,\n\t\t\t\t\t\t\t\t\t\tisActive && activeIconStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst iconSource =\n\t\t\t\t\t\t\t\t\t\toption?.value?.icon?.src ||\n\t\t\t\t\t\t\t\t\t\toption?.value?.icon;\n\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<TouchableOpacity\n\t\t\t\t\t\t\t\t\t\t\tactiveOpacity={ 0.5 }\n\t\t\t\t\t\t\t\t\t\t\tstyle={ itemStyle }\n\t\t\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\t\t\tonPress={ () => onSelect( option ) }\n\t\t\t\t\t\t\t\t\t\t\taccessibilityLabel={ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: Block name e.g. \"Image block\"\n\t\t\t\t\t\t\t\t\t\t\t\t__( '%s block' ),\n\t\t\t\t\t\t\t\t\t\t\t\toption?.value?.title\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<View\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'components-autocomplete__icon'\n\t\t\t\t\t\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={ iconSource }\n\t\t\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={ iconStyle }\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t\t\t\t\t<Text style={ textStyle }>\n\t\t\t\t\t\t\t\t\t\t\t\t{ option?.value?.title }\n\t\t\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t\t\t</TouchableOpacity>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t</ScrollView>\n\t\t\t\t\t\t</BackgroundView>\n\t\t\t\t\t</Animated.View>\n\t\t\t\t</View>\n\t\t\t</AutocompletionItemsFill>\n\t\t);\n\t}\n\n\treturn AutocompleterUI;\n}\n\nexport default getAutoCompleterUI;\n"],"mappings":"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"}

package/build/autocomplete/background-view.android.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _reactNative = require("react-native");
 var _compose = require("@wordpress/compose");
 var _style = _interopRequireDefault(require("./style.scss"));
@@ -25,10 +25,9 @@ const BackgroundView = ({
   children
 }) => {
   const backgroundStyles = (0, _compose.usePreferredColorSchemeStyle)(_style.default['components-autocomplete__background'], _style.default['components-autocomplete__background-dark']);
-  return (0, _element.createElement)(_reactNative.View, {
+  return (0, _react.createElement)(_reactNative.View, {
     style: backgroundStyles
   }, children);
 };
-var _default = BackgroundView;
-exports.default = _default;
+var _default = exports.default = BackgroundView;
 //# sourceMappingURL=background-view.android.js.map

package/build/autocomplete/background-view.android.js.map

@@ -1 +1 @@
-{"version":3,"names":["_reactNative","require","_compose","_style","_interopRequireDefault","BackgroundView","children","backgroundStyles","usePreferredColorSchemeStyle","styles","_element","createElement","View","style","_default","exports","default"],"sources":["@wordpress/components/src/autocomplete/background-view.android.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst BackgroundView = ( { children } ) => {\n\tconst backgroundStyles = usePreferredColorSchemeStyle(\n\t\tstyles[ 'components-autocomplete__background' ],\n\t\tstyles[ 'components-autocomplete__background-dark' ]\n\t);\n\n\treturn <View style={ backgroundStyles }>{ children }</View>;\n};\n\nexport default BackgroundView;\n"],"mappings":";;;;;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAC,sBAAA,CAAAH,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,MAAMI,cAAc,GAAGA,CAAE;EAAEC;AAAS,CAAC,KAAM;EAC1C,MAAMC,gBAAgB,GAAG,IAAAC,qCAA4B,EACpDC,cAAM,CAAE,qCAAqC,CAAE,EAC/CA,cAAM,CAAE,0CAA0C,CACnD,CAAC;EAED,OAAO,IAAAC,QAAA,CAAAC,aAAA,EAACX,YAAA,CAAAY,IAAI;IAACC,KAAK,EAAGN;EAAkB,GAAGD,QAAgB,CAAC;AAC5D,CAAC;AAAC,IAAAQ,QAAA,GAEaT,cAAc;AAAAU,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
+{"version":3,"names":["_reactNative","require","_compose","_style","_interopRequireDefault","BackgroundView","children","backgroundStyles","usePreferredColorSchemeStyle","styles","_react","createElement","View","style","_default","exports","default"],"sources":["@wordpress/components/src/autocomplete/background-view.android.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst BackgroundView = ( { children } ) => {\n\tconst backgroundStyles = usePreferredColorSchemeStyle(\n\t\tstyles[ 'components-autocomplete__background' ],\n\t\tstyles[ 'components-autocomplete__background-dark' ]\n\t);\n\n\treturn <View style={ backgroundStyles }>{ children }</View>;\n};\n\nexport default BackgroundView;\n"],"mappings":";;;;;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,MAAA,GAAAC,sBAAA,CAAAH,OAAA;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,MAAMI,cAAc,GAAGA,CAAE;EAAEC;AAAS,CAAC,KAAM;EAC1C,MAAMC,gBAAgB,GAAG,IAAAC,qCAA4B,EACpDC,cAAM,CAAE,qCAAqC,CAAE,EAC/CA,cAAM,CAAE,0CAA0C,CACnD,CAAC;EAED,OAAO,IAAAC,MAAA,CAAAC,aAAA,EAACX,YAAA,CAAAY,IAAI;IAACC,KAAK,EAAGN;EAAkB,GAAGD,QAAgB,CAAC;AAC5D,CAAC;AAAC,IAAAQ,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEaX,cAAc"}

package/build/autocomplete/background-view.ios.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _blur = require("@react-native-community/blur");
 var _style = _interopRequireDefault(require("./style.scss"));
 /**
@@ -19,12 +19,11 @@ var _style = _interopRequireDefault(require("./style.scss"));
 const BackgroundView = ({
   children
 }) => {
-  return (0, _element.createElement)(_blur.BlurView, {
+  return (0, _react.createElement)(_blur.BlurView, {
     style: _style.default['components-autocomplete__background-blur'],
     blurType: "prominent",
     blurAmount: 10
   }, children);
 };
-var _default = BackgroundView;
-exports.default = _default;
+var _default = exports.default = BackgroundView;
 //# sourceMappingURL=background-view.ios.js.map

package/build/autocomplete/background-view.ios.js.map

@@ -1 +1 @@
-{"version":3,"names":["_blur","require","_style","_interopRequireDefault","BackgroundView","children","_element","createElement","BlurView","style","styles","blurType","blurAmount","_default","exports","default"],"sources":["@wordpress/components/src/autocomplete/background-view.ios.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { BlurView } from '@react-native-community/blur';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst BackgroundView = ( { children } ) => {\n\treturn (\n\t\t<BlurView\n\t\t\tstyle={ styles[ 'components-autocomplete__background-blur' ] }\n\t\t\tblurType=\"prominent\"\n\t\t\tblurAmount={ 10 }\n\t\t>\n\t\t\t{ children }\n\t\t</BlurView>\n\t);\n};\n\nexport default BackgroundView;\n"],"mappings":";;;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AAKA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,MAAMG,cAAc,GAAGA,CAAE;EAAEC;AAAS,CAAC,KAAM;EAC1C,OACC,IAAAC,QAAA,CAAAC,aAAA,EAACP,KAAA,CAAAQ,QAAQ;IACRC,KAAK,EAAGC,cAAM,CAAE,0CAA0C,CAAI;IAC9DC,QAAQ,EAAC,WAAW;IACpBC,UAAU,EAAG;EAAI,GAEfP,QACO,CAAC;AAEb,CAAC;AAAC,IAAAQ,QAAA,GAEaT,cAAc;AAAAU,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
+{"version":3,"names":["_blur","require","_style","_interopRequireDefault","BackgroundView","children","_react","createElement","BlurView","style","styles","blurType","blurAmount","_default","exports","default"],"sources":["@wordpress/components/src/autocomplete/background-view.ios.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { BlurView } from '@react-native-community/blur';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst BackgroundView = ( { children } ) => {\n\treturn (\n\t\t<BlurView\n\t\t\tstyle={ styles[ 'components-autocomplete__background-blur' ] }\n\t\t\tblurType=\"prominent\"\n\t\t\tblurAmount={ 10 }\n\t\t>\n\t\t\t{ children }\n\t\t</BlurView>\n\t);\n};\n\nexport default BackgroundView;\n"],"mappings":";;;;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AAKA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAGA,MAAMG,cAAc,GAAGA,CAAE;EAAEC;AAAS,CAAC,KAAM;EAC1C,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACP,KAAA,CAAAQ,QAAQ;IACRC,KAAK,EAAGC,cAAM,CAAE,0CAA0C,CAAI;IAC9DC,QAAQ,EAAC,WAAW;IACpBC,UAAU,EAAG;EAAI,GAEfP,QACO,CAAC;AAEb,CAAC;AAAC,IAAAQ,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEaX,cAAc"}

package/build/autocomplete/index.js

@@ -7,10 +7,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = Autocomplete;
 exports.useAutocomplete = useAutocomplete;
 exports.useAutocompleteProps = useAutocompleteProps;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _removeAccents = _interopRequireDefault(require("remove-accents"));
+var _element = require("@wordpress/element");
 var _compose = require("@wordpress/compose");
 var _richText = require("@wordpress/rich-text");
+var _a11y = require("@wordpress/a11y");
+var _keycodes = require("@wordpress/keycodes");
 var _autocompleterUi = require("./autocompleter-ui");
 var _strings = require("../utils/strings");
 /**
@@ -25,6 +28,33 @@ var _strings = require("../utils/strings");
  * Internal dependencies
  */
 
+const getNodeText = node => {
+  if (node === null) {
+    return '';
+  }
+  switch (typeof node) {
+    case 'string':
+    case 'number':
+      return node.toString();
+      break;
+    case 'boolean':
+      return '';
+      break;
+    case 'object':
+      {
+        if (node instanceof Array) {
+          return node.map(getNodeText).join('');
+        }
+        if ('props' in node) {
+          return getNodeText(node.props.children);
+        }
+        break;
+      }
+    default:
+      return '';
+  }
+  return '';
+};
 const EMPTY_FILTERED_OPTIONS = [];
 function useAutocomplete({
   record,
@@ -117,11 +147,24 @@ function useAutocomplete({
     }
     switch (event.key) {
       case 'ArrowUp':
-        setSelectedIndex((selectedIndex === 0 ? filteredOptions.length : selectedIndex) - 1);
-        break;
+        {
+          const newIndex = (selectedIndex === 0 ? filteredOptions.length : selectedIndex) - 1;
+          setSelectedIndex(newIndex);
+          // See the related PR as to why this is necessary: https://github.com/WordPress/gutenberg/pull/54902.
+          if ((0, _keycodes.isAppleOS)()) {
+            (0, _a11y.speak)(getNodeText(filteredOptions[newIndex].label), 'assertive');
+          }
+          break;
+        }
       case 'ArrowDown':
-        setSelectedIndex((selectedIndex + 1) % filteredOptions.length);
-        break;
+        {
+          const newIndex = (selectedIndex + 1) % filteredOptions.length;
+          setSelectedIndex(newIndex);
+          if ((0, _keycodes.isAppleOS)()) {
+            (0, _a11y.speak)(getNodeText(filteredOptions[newIndex].label), 'assertive');
+          }
+          break;
+        }
       case 'Escape':
         setAutocompleter(null);
         setAutocompleterUI(null);
@@ -157,58 +200,68 @@ function useAutocomplete({
       if (autocompleter) reset();
       return;
     }
-    const completer = completers?.find(({
-      triggerPrefix,
-      allowContext
-    }) => {
-      const index = textContent.lastIndexOf(triggerPrefix);
-      if (index === -1) {
-        return false;
-      }
-      const textWithoutTrigger = textContent.slice(index + triggerPrefix.length);
-      const tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.
-      // This is a final barrier to prevent the effect from completing with
-      // an extremely long string, which causes the editor to slow-down
-      // significantly. This could happen, for example, if `matchingWhileBackspacing`
-      // is true and one of the "words" end up being too long. If that's the case,
-      // it will be caught by this guard.
-      if (tooDistantFromTrigger) return false;
-      const mismatch = filteredOptions.length === 0;
-      const wordsFromTrigger = textWithoutTrigger.split(/\s/);
-      // We need to allow the effect to run when not backspacing and if there
-      // was a mismatch. i.e when typing a trigger + the match string or when
-      // clicking in an existing trigger word on the page. We do that if we
-      // detect that we have one word from trigger in the current textual context.
-      //
-      // Ex.: "Some text @a" <-- "@a" will be detected as the trigger word and
-      // allow the effect to run. It will run until there's a mismatch.
-      const hasOneTriggerWord = wordsFromTrigger.length === 1;
-      // This is used to allow the effect to run when backspacing and if
-      // "touching" a word that "belongs" to a trigger. We consider a "trigger
-      // word" any word up to the limit of 3 from the trigger character.
-      // Anything beyond that is ignored if there's a mismatch. This allows
-      // us to "escape" a mismatch when backspacing, but still imposing some
-      // sane limits.
-      //
-      // Ex: "Some text @marcelo sekkkk" <--- "kkkk" caused a mismatch, but
-      // if the user presses backspace here, it will show the completion popup again.
-      const matchingWhileBackspacing = backspacing.current && textWithoutTrigger.split(/\s/).length <= 3;
-      if (mismatch && !(matchingWhileBackspacing || hasOneTriggerWord)) {
-        return false;
-      }
-      const textAfterSelection = (0, _richText.getTextContent)((0, _richText.slice)(record, undefined, (0, _richText.getTextContent)(record).length));
-      if (allowContext && !allowContext(textContent.slice(0, index), textAfterSelection)) {
-        return false;
-      }
-      if (/^\s/.test(textWithoutTrigger) || /\s\s+$/.test(textWithoutTrigger)) {
-        return false;
-      }
-      return /[\u0000-\uFFFF]*$/.test(textWithoutTrigger);
-    });
+
+    // Find the completer with the highest triggerPrefix index in the
+    // textContent.
+    const completer = completers.reduce((lastTrigger, currentCompleter) => {
+      const triggerIndex = textContent.lastIndexOf(currentCompleter.triggerPrefix);
+      const lastTriggerIndex = lastTrigger !== null ? textContent.lastIndexOf(lastTrigger.triggerPrefix) : -1;
+      return triggerIndex > lastTriggerIndex ? currentCompleter : lastTrigger;
+    }, null);
     if (!completer) {
       if (autocompleter) reset();
       return;
     }
+    const {
+      allowContext,
+      triggerPrefix
+    } = completer;
+    const triggerIndex = textContent.lastIndexOf(triggerPrefix);
+    const textWithoutTrigger = textContent.slice(triggerIndex + triggerPrefix.length);
+    const tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.
+    // This is a final barrier to prevent the effect from completing with
+    // an extremely long string, which causes the editor to slow-down
+    // significantly. This could happen, for example, if `matchingWhileBackspacing`
+    // is true and one of the "words" end up being too long. If that's the case,
+    // it will be caught by this guard.
+    if (tooDistantFromTrigger) return;
+    const mismatch = filteredOptions.length === 0;
+    const wordsFromTrigger = textWithoutTrigger.split(/\s/);
+    // We need to allow the effect to run when not backspacing and if there
+    // was a mismatch. i.e when typing a trigger + the match string or when
+    // clicking in an existing trigger word on the page. We do that if we
+    // detect that we have one word from trigger in the current textual context.
+    //
+    // Ex.: "Some text @a" <-- "@a" will be detected as the trigger word and
+    // allow the effect to run. It will run until there's a mismatch.
+    const hasOneTriggerWord = wordsFromTrigger.length === 1;
+    // This is used to allow the effect to run when backspacing and if
+    // "touching" a word that "belongs" to a trigger. We consider a "trigger
+    // word" any word up to the limit of 3 from the trigger character.
+    // Anything beyond that is ignored if there's a mismatch. This allows
+    // us to "escape" a mismatch when backspacing, but still imposing some
+    // sane limits.
+    //
+    // Ex: "Some text @marcelo sekkkk" <--- "kkkk" caused a mismatch, but
+    // if the user presses backspace here, it will show the completion popup again.
+    const matchingWhileBackspacing = backspacing.current && wordsFromTrigger.length <= 3;
+    if (mismatch && !(matchingWhileBackspacing || hasOneTriggerWord)) {
+      if (autocompleter) reset();
+      return;
+    }
+    const textAfterSelection = (0, _richText.getTextContent)((0, _richText.slice)(record, undefined, (0, _richText.getTextContent)(record).length));
+    if (allowContext && !allowContext(textContent.slice(0, triggerIndex), textAfterSelection)) {
+      if (autocompleter) reset();
+      return;
+    }
+    if (/^\s/.test(textWithoutTrigger) || /\s\s+$/.test(textWithoutTrigger)) {
+      if (autocompleter) reset();
+      return;
+    }
+    if (!/[\u0000-\uFFFF]*$/.test(textWithoutTrigger)) {
+      if (autocompleter) reset();
+      return;
+    }
     const safeTrigger = (0, _strings.escapeRegExp)(completer.triggerPrefix);
     const text = (0, _removeAccents.default)(textContent);
     const match = text.slice(text.lastIndexOf(completer.triggerPrefix)).match(new RegExp(`${safeTrigger}([\u0000-\uFFFF]*)$`));
@@ -234,7 +287,7 @@ function useAutocomplete({
     listBoxId,
     activeId,
     onKeyDown: handleKeyDown,
-    popover: hasSelection && AutocompleterUI && (0, _element.createElement)(AutocompleterUI, {
+    popover: hasSelection && AutocompleterUI && (0, _react.createElement)(AutocompleterUI, {
       className: className,
       filterValue: filterValue,
       instanceId: instanceId,
@@ -309,6 +362,6 @@ function Autocomplete({
     popover,
     ...props
   } = useAutocomplete(options);
-  return (0, _element.createElement)(_element.Fragment, null, children(props), isSelected && popover);
+  return (0, _react.createElement)(_react.Fragment, null, children(props), isSelected && popover);
 }
 //# sourceMappingURL=index.js.map

package/build/autocomplete/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_removeAccents","_interopRequireDefault","_compose","_richText","_autocompleterUi","_strings","EMPTY_FILTERED_OPTIONS","useAutocomplete","record","onChange","onReplace","completers","contentRef","instanceId","useInstanceId","selectedIndex","setSelectedIndex","useState","filteredOptions","setFilteredOptions","filterValue","setFilterValue","autocompleter","setAutocompleter","AutocompleterUI","setAutocompleterUI","backspacing","useRef","insertCompletion","replacement","end","start","triggerPrefix","length","toInsert","create","html","renderToString","insert","select","option","getOptionCompletion","isDisabled","completion","value","isCompletionObject","obj","action","undefined","completionObject","reset","onChangeOptions","options","handleKeyDown","event","current","key","defaultPrevented","isComposing","keyCode","preventDefault","textContent","useMemo","isCollapsed","getTextContent","slice","useEffect","completer","find","allowContext","index","lastIndexOf","textWithoutTrigger","tooDistantFromTrigger","mismatch","wordsFromTrigger","split","hasOneTriggerWord","matchingWhileBackspacing","textAfterSelection","test","safeTrigger","escapeRegExp","text","removeAccents","match","RegExp","query","getAutoCompleterUI","selectedKey","className","isExpanded","listBoxId","activeId","hasSelection","onKeyDown","popover","createElement","onSelect","useLastDifferentValue","history","Set","add","size","delete","Array","from","useAutocompleteProps","ref","onKeyDownRef","previousRecord","mergedRefs","useMergeRefs","useRefEffect","element","_onKeyDown","addEventListener","removeEventListener","didUserInput","children","Autocomplete","isSelected","props","Fragment"],"sources":["@wordpress/components/src/autocomplete/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\trenderToString,\n\tuseEffect,\n\tuseState,\n\tuseRef,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __, _n } from '@wordpress/i18n';\nimport { useInstanceId, useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport {\n\tcreate,\n\tslice,\n\tinsert,\n\tisCollapsed,\n\tgetTextContent,\n} from '@wordpress/rich-text';\n\n/**\n * Internal dependencies\n */\nimport { getAutoCompleterUI } from './autocompleter-ui';\nimport { escapeRegExp } from '../utils/strings';\nimport type {\n\tAutocompleteProps,\n\tAutocompleterUIProps,\n\tInsertOption,\n\tKeyedOption,\n\tOptionCompletion,\n\tReplaceOption,\n\tUseAutocompleteProps,\n\tWPCompleter,\n} from './types';\n\nconst EMPTY_FILTERED_OPTIONS: KeyedOption[] = [];\n\nexport function useAutocomplete( {\n\trecord,\n\tonChange,\n\tonReplace,\n\tcompleters,\n\tcontentRef,\n}: UseAutocompleteProps ) {\n\tconst instanceId = useInstanceId( useAutocomplete );\n\tconst [ selectedIndex, setSelectedIndex ] = useState( 0 );\n\n\tconst [ filteredOptions, setFilteredOptions ] = useState<\n\t\tArray< KeyedOption >\n\t>( EMPTY_FILTERED_OPTIONS );\n\tconst [ filterValue, setFilterValue ] =\n\t\tuseState< AutocompleterUIProps[ 'filterValue' ] >( '' );\n\tconst [ autocompleter, setAutocompleter ] = useState< WPCompleter | null >(\n\t\tnull\n\t);\n\tconst [ AutocompleterUI, setAutocompleterUI ] = useState<\n\t\t( ( props: AutocompleterUIProps ) => JSX.Element | null ) | null\n\t>( null );\n\n\tconst backspacing = useRef( false );\n\n\tfunction insertCompletion( replacement: React.ReactNode ) {\n\t\tif ( autocompleter === null ) {\n\t\t\treturn;\n\t\t}\n\t\tconst end = record.start;\n\t\tconst start =\n\t\t\tend - autocompleter.triggerPrefix.length - filterValue.length;\n\t\tconst toInsert = create( { html: renderToString( replacement ) } );\n\n\t\tonChange( insert( record, toInsert, start, end ) );\n\t}\n\n\tfunction select( option: KeyedOption ) {\n\t\tconst { getOptionCompletion } = autocompleter || {};\n\n\t\tif ( option.isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( getOptionCompletion ) {\n\t\t\tconst completion = getOptionCompletion( option.value, filterValue );\n\n\t\t\tconst isCompletionObject = (\n\t\t\t\tobj: OptionCompletion\n\t\t\t): obj is InsertOption | ReplaceOption => {\n\t\t\t\treturn (\n\t\t\t\t\tobj !== null &&\n\t\t\t\t\ttypeof obj === 'object' &&\n\t\t\t\t\t'action' in obj &&\n\t\t\t\t\tobj.action !== undefined &&\n\t\t\t\t\t'value' in obj &&\n\t\t\t\t\tobj.value !== undefined\n\t\t\t\t);\n\t\t\t};\n\n\t\t\tconst completionObject = isCompletionObject( completion )\n\t\t\t\t? completion\n\t\t\t\t: ( {\n\t\t\t\t\t\taction: 'insert-at-caret',\n\t\t\t\t\t\tvalue: completion,\n\t\t\t\t  } as InsertOption );\n\n\t\t\tif ( 'replace' === completionObject.action ) {\n\t\t\t\tonReplace( [ completionObject.value ] );\n\t\t\t\t// When replacing, the component will unmount, so don't reset\n\t\t\t\t// state (below) on an unmounted component.\n\t\t\t\treturn;\n\t\t\t} else if ( 'insert-at-caret' === completionObject.action ) {\n\t\t\t\tinsertCompletion( completionObject.value );\n\t\t\t}\n\t\t}\n\n\t\t// Reset autocomplete state after insertion rather than before\n\t\t// so insertion events don't cause the completion menu to redisplay.\n\t\treset();\n\t}\n\n\tfunction reset() {\n\t\tsetSelectedIndex( 0 );\n\t\tsetFilteredOptions( EMPTY_FILTERED_OPTIONS );\n\t\tsetFilterValue( '' );\n\t\tsetAutocompleter( null );\n\t\tsetAutocompleterUI( null );\n\t}\n\n\t/**\n\t * Load options for an autocompleter.\n\t *\n\t * @param {Array} options\n\t */\n\tfunction onChangeOptions( options: Array< KeyedOption > ) {\n\t\tsetSelectedIndex(\n\t\t\toptions.length === filteredOptions.length ? selectedIndex : 0\n\t\t);\n\t\tsetFilteredOptions( options );\n\t}\n\n\tfunction handleKeyDown( event: KeyboardEvent ) {\n\t\tbackspacing.current = event.key === 'Backspace';\n\n\t\tif ( ! autocompleter ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( filteredOptions.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tevent.defaultPrevented ||\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\t\tswitch ( event.key ) {\n\t\t\tcase 'ArrowUp':\n\t\t\t\tsetSelectedIndex(\n\t\t\t\t\t( selectedIndex === 0\n\t\t\t\t\t\t? filteredOptions.length\n\t\t\t\t\t\t: selectedIndex ) - 1\n\t\t\t\t);\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowDown':\n\t\t\t\tsetSelectedIndex(\n\t\t\t\t\t( selectedIndex + 1 ) % filteredOptions.length\n\t\t\t\t);\n\t\t\t\tbreak;\n\n\t\t\tcase 'Escape':\n\t\t\t\tsetAutocompleter( null );\n\t\t\t\tsetAutocompleterUI( null );\n\t\t\t\tevent.preventDefault();\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tselect( filteredOptions[ selectedIndex ] );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\t\treset();\n\t\t\t\treturn;\n\n\t\t\tdefault:\n\t\t\t\treturn;\n\t\t}\n\n\t\t// Any handled key should prevent original behavior. This relies on\n\t\t// the early return in the default case.\n\t\tevent.preventDefault();\n\t}\n\n\t// textContent is a primitive (string), memoizing is not strictly necessary\n\t// but this is a preemptive performance improvement, since the autocompleter\n\t// is a potential bottleneck for the editor type metric.\n\tconst textContent = useMemo( () => {\n\t\tif ( isCollapsed( record ) ) {\n\t\t\treturn getTextContent( slice( record, 0 ) );\n\t\t}\n\t\treturn '';\n\t}, [ record ] );\n\n\tuseEffect( () => {\n\t\tif ( ! textContent ) {\n\t\t\tif ( autocompleter ) reset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst completer = completers?.find(\n\t\t\t( { triggerPrefix, allowContext } ) => {\n\t\t\t\tconst index = textContent.lastIndexOf( triggerPrefix );\n\n\t\t\t\tif ( index === -1 ) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tconst textWithoutTrigger = textContent.slice(\n\t\t\t\t\tindex + triggerPrefix.length\n\t\t\t\t);\n\n\t\t\t\tconst tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.\n\t\t\t\t// This is a final barrier to prevent the effect from completing with\n\t\t\t\t// an extremely long string, which causes the editor to slow-down\n\t\t\t\t// significantly. This could happen, for example, if `matchingWhileBackspacing`\n\t\t\t\t// is true and one of the \"words\" end up being too long. If that's the case,\n\t\t\t\t// it will be caught by this guard.\n\t\t\t\tif ( tooDistantFromTrigger ) return false;\n\n\t\t\t\tconst mismatch = filteredOptions.length === 0;\n\t\t\t\tconst wordsFromTrigger = textWithoutTrigger.split( /\\s/ );\n\t\t\t\t// We need to allow the effect to run when not backspacing and if there\n\t\t\t\t// was a mismatch. i.e when typing a trigger + the match string or when\n\t\t\t\t// clicking in an existing trigger word on the page. We do that if we\n\t\t\t\t// detect that we have one word from trigger in the current textual context.\n\t\t\t\t//\n\t\t\t\t// Ex.: \"Some text @a\" <-- \"@a\" will be detected as the trigger word and\n\t\t\t\t// allow the effect to run. It will run until there's a mismatch.\n\t\t\t\tconst hasOneTriggerWord = wordsFromTrigger.length === 1;\n\t\t\t\t// This is used to allow the effect to run when backspacing and if\n\t\t\t\t// \"touching\" a word that \"belongs\" to a trigger. We consider a \"trigger\n\t\t\t\t// word\" any word up to the limit of 3 from the trigger character.\n\t\t\t\t// Anything beyond that is ignored if there's a mismatch. This allows\n\t\t\t\t// us to \"escape\" a mismatch when backspacing, but still imposing some\n\t\t\t\t// sane limits.\n\t\t\t\t//\n\t\t\t\t// Ex: \"Some text @marcelo sekkkk\" <--- \"kkkk\" caused a mismatch, but\n\t\t\t\t// if the user presses backspace here, it will show the completion popup again.\n\t\t\t\tconst matchingWhileBackspacing =\n\t\t\t\t\tbackspacing.current &&\n\t\t\t\t\ttextWithoutTrigger.split( /\\s/ ).length <= 3;\n\n\t\t\t\tif (\n\t\t\t\t\tmismatch &&\n\t\t\t\t\t! ( matchingWhileBackspacing || hasOneTriggerWord )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tconst textAfterSelection = getTextContent(\n\t\t\t\t\tslice( record, undefined, getTextContent( record ).length )\n\t\t\t\t);\n\n\t\t\t\tif (\n\t\t\t\t\tallowContext &&\n\t\t\t\t\t! allowContext(\n\t\t\t\t\t\ttextContent.slice( 0, index ),\n\t\t\t\t\t\ttextAfterSelection\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\t/^\\s/.test( textWithoutTrigger ) ||\n\t\t\t\t\t/\\s\\s+$/.test( textWithoutTrigger )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\treturn /[\\u0000-\\uFFFF]*$/.test( textWithoutTrigger );\n\t\t\t}\n\t\t);\n\n\t\tif ( ! completer ) {\n\t\t\tif ( autocompleter ) reset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst safeTrigger = escapeRegExp( completer.triggerPrefix );\n\t\tconst text = removeAccents( textContent );\n\t\tconst match = text\n\t\t\t.slice( text.lastIndexOf( completer.triggerPrefix ) )\n\t\t\t.match( new RegExp( `${ safeTrigger }([\\u0000-\\uFFFF]*)$` ) );\n\t\tconst query = match && match[ 1 ];\n\n\t\tsetAutocompleter( completer );\n\t\tsetAutocompleterUI( () =>\n\t\t\tcompleter !== autocompleter\n\t\t\t\t? getAutoCompleterUI( completer )\n\t\t\t\t: AutocompleterUI\n\t\t);\n\t\tsetFilterValue( query === null ? '' : query );\n\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ textContent ] );\n\n\tconst { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};\n\tconst { className } = autocompleter || {};\n\tconst isExpanded = !! autocompleter && filteredOptions.length > 0;\n\tconst listBoxId = isExpanded\n\t\t? `components-autocomplete-listbox-${ instanceId }`\n\t\t: undefined;\n\tconst activeId = isExpanded\n\t\t? `components-autocomplete-item-${ instanceId }-${ selectedKey }`\n\t\t: null;\n\tconst hasSelection = record.start !== undefined;\n\n\treturn {\n\t\tlistBoxId,\n\t\tactiveId,\n\t\tonKeyDown: handleKeyDown,\n\t\tpopover: hasSelection && AutocompleterUI && (\n\t\t\t<AutocompleterUI\n\t\t\t\tclassName={ className }\n\t\t\t\tfilterValue={ filterValue }\n\t\t\t\tinstanceId={ instanceId }\n\t\t\t\tlistBoxId={ listBoxId }\n\t\t\t\tselectedIndex={ selectedIndex }\n\t\t\t\tonChangeOptions={ onChangeOptions }\n\t\t\t\tonSelect={ select }\n\t\t\t\tvalue={ record }\n\t\t\t\tcontentRef={ contentRef }\n\t\t\t\treset={ reset }\n\t\t\t/>\n\t\t),\n\t};\n}\n\nfunction useLastDifferentValue( value: UseAutocompleteProps[ 'record' ] ) {\n\tconst history = useRef< Set< typeof value > >( new Set() );\n\n\thistory.current.add( value );\n\n\t// Keep the history size to 2.\n\tif ( history.current.size > 2 ) {\n\t\thistory.current.delete( Array.from( history.current )[ 0 ] );\n\t}\n\n\treturn Array.from( history.current )[ 0 ];\n}\n\nexport function useAutocompleteProps( options: UseAutocompleteProps ) {\n\tconst ref = useRef< HTMLElement >( null );\n\tconst onKeyDownRef = useRef< ( event: KeyboardEvent ) => void >();\n\tconst { record } = options;\n\tconst previousRecord = useLastDifferentValue( record );\n\tconst { popover, listBoxId, activeId, onKeyDown } = useAutocomplete( {\n\t\t...options,\n\t\tcontentRef: ref,\n\t} );\n\tonKeyDownRef.current = onKeyDown;\n\n\tconst mergedRefs = useMergeRefs( [\n\t\tref,\n\t\tuseRefEffect( ( element: HTMLElement ) => {\n\t\t\tfunction _onKeyDown( event: KeyboardEvent ) {\n\t\t\t\tonKeyDownRef.current?.( event );\n\t\t\t}\n\t\t\telement.addEventListener( 'keydown', _onKeyDown );\n\t\t\treturn () => {\n\t\t\t\telement.removeEventListener( 'keydown', _onKeyDown );\n\t\t\t};\n\t\t}, [] ),\n\t] );\n\n\t// We only want to show the popover if the user has typed something.\n\tconst didUserInput = record.text !== previousRecord?.text;\n\n\tif ( ! didUserInput ) {\n\t\treturn { ref: mergedRefs };\n\t}\n\n\treturn {\n\t\tref: mergedRefs,\n\t\tchildren: popover,\n\t\t'aria-autocomplete': listBoxId ? 'list' : undefined,\n\t\t'aria-owns': listBoxId,\n\t\t'aria-activedescendant': activeId,\n\t};\n}\n\nexport default function Autocomplete( {\n\tchildren,\n\tisSelected,\n\t...options\n}: AutocompleteProps ) {\n\tconst { popover, ...props } = useAutocomplete( options );\n\treturn (\n\t\t<>\n\t\t\t{ children( props ) }\n\t\t\t{ isSelected && popover }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["_removeAccents","_interopRequireDefault","require","_element","_compose","_richText","_a11y","_keycodes","_autocompleterUi","_strings","getNodeText","node","toString","Array","map","join","props","children","EMPTY_FILTERED_OPTIONS","useAutocomplete","record","onChange","onReplace","completers","contentRef","instanceId","useInstanceId","selectedIndex","setSelectedIndex","useState","filteredOptions","setFilteredOptions","filterValue","setFilterValue","autocompleter","setAutocompleter","AutocompleterUI","setAutocompleterUI","backspacing","useRef","insertCompletion","replacement","end","start","triggerPrefix","length","toInsert","create","html","renderToString","insert","select","option","getOptionCompletion","isDisabled","completion","value","isCompletionObject","obj","action","undefined","completionObject","reset","onChangeOptions","options","handleKeyDown","event","current","key","defaultPrevented","isComposing","keyCode","newIndex","isAppleOS","speak","label","preventDefault","textContent","useMemo","isCollapsed","getTextContent","slice","useEffect","completer","reduce","lastTrigger","currentCompleter","triggerIndex","lastIndexOf","lastTriggerIndex","allowContext","textWithoutTrigger","tooDistantFromTrigger","mismatch","wordsFromTrigger","split","hasOneTriggerWord","matchingWhileBackspacing","textAfterSelection","test","safeTrigger","escapeRegExp","text","removeAccents","match","RegExp","query","getAutoCompleterUI","selectedKey","className","isExpanded","listBoxId","activeId","hasSelection","onKeyDown","popover","_react","createElement","onSelect","useLastDifferentValue","history","Set","add","size","delete","from","useAutocompleteProps","ref","onKeyDownRef","previousRecord","mergedRefs","useMergeRefs","useRefEffect","element","_onKeyDown","addEventListener","removeEventListener","didUserInput","Autocomplete","isSelected","Fragment"],"sources":["@wordpress/components/src/autocomplete/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\trenderToString,\n\tuseEffect,\n\tuseState,\n\tuseRef,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __, _n } from '@wordpress/i18n';\nimport { useInstanceId, useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport {\n\tcreate,\n\tslice,\n\tinsert,\n\tisCollapsed,\n\tgetTextContent,\n} from '@wordpress/rich-text';\nimport { speak } from '@wordpress/a11y';\nimport { isAppleOS } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { getAutoCompleterUI } from './autocompleter-ui';\nimport { escapeRegExp } from '../utils/strings';\nimport type {\n\tAutocompleteProps,\n\tAutocompleterUIProps,\n\tInsertOption,\n\tKeyedOption,\n\tOptionCompletion,\n\tReplaceOption,\n\tUseAutocompleteProps,\n\tWPCompleter,\n} from './types';\n\nconst getNodeText = ( node: React.ReactNode ): string => {\n\tif ( node === null ) {\n\t\treturn '';\n\t}\n\n\tswitch ( typeof node ) {\n\t\tcase 'string':\n\t\tcase 'number':\n\t\t\treturn node.toString();\n\t\t\tbreak;\n\t\tcase 'boolean':\n\t\t\treturn '';\n\t\t\tbreak;\n\t\tcase 'object': {\n\t\t\tif ( node instanceof Array ) {\n\t\t\t\treturn node.map( getNodeText ).join( '' );\n\t\t\t}\n\t\t\tif ( 'props' in node ) {\n\t\t\t\treturn getNodeText( node.props.children );\n\t\t\t}\n\t\t\tbreak;\n\t\t}\n\t\tdefault:\n\t\t\treturn '';\n\t}\n\n\treturn '';\n};\n\nconst EMPTY_FILTERED_OPTIONS: KeyedOption[] = [];\n\nexport function useAutocomplete( {\n\trecord,\n\tonChange,\n\tonReplace,\n\tcompleters,\n\tcontentRef,\n}: UseAutocompleteProps ) {\n\tconst instanceId = useInstanceId( useAutocomplete );\n\tconst [ selectedIndex, setSelectedIndex ] = useState( 0 );\n\n\tconst [ filteredOptions, setFilteredOptions ] = useState<\n\t\tArray< KeyedOption >\n\t>( EMPTY_FILTERED_OPTIONS );\n\tconst [ filterValue, setFilterValue ] =\n\t\tuseState< AutocompleterUIProps[ 'filterValue' ] >( '' );\n\tconst [ autocompleter, setAutocompleter ] = useState< WPCompleter | null >(\n\t\tnull\n\t);\n\tconst [ AutocompleterUI, setAutocompleterUI ] = useState<\n\t\t( ( props: AutocompleterUIProps ) => JSX.Element | null ) | null\n\t>( null );\n\n\tconst backspacing = useRef( false );\n\n\tfunction insertCompletion( replacement: React.ReactNode ) {\n\t\tif ( autocompleter === null ) {\n\t\t\treturn;\n\t\t}\n\t\tconst end = record.start;\n\t\tconst start =\n\t\t\tend - autocompleter.triggerPrefix.length - filterValue.length;\n\t\tconst toInsert = create( { html: renderToString( replacement ) } );\n\n\t\tonChange( insert( record, toInsert, start, end ) );\n\t}\n\n\tfunction select( option: KeyedOption ) {\n\t\tconst { getOptionCompletion } = autocompleter || {};\n\n\t\tif ( option.isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( getOptionCompletion ) {\n\t\t\tconst completion = getOptionCompletion( option.value, filterValue );\n\n\t\t\tconst isCompletionObject = (\n\t\t\t\tobj: OptionCompletion\n\t\t\t): obj is InsertOption | ReplaceOption => {\n\t\t\t\treturn (\n\t\t\t\t\tobj !== null &&\n\t\t\t\t\ttypeof obj === 'object' &&\n\t\t\t\t\t'action' in obj &&\n\t\t\t\t\tobj.action !== undefined &&\n\t\t\t\t\t'value' in obj &&\n\t\t\t\t\tobj.value !== undefined\n\t\t\t\t);\n\t\t\t};\n\n\t\t\tconst completionObject = isCompletionObject( completion )\n\t\t\t\t? completion\n\t\t\t\t: ( {\n\t\t\t\t\t\taction: 'insert-at-caret',\n\t\t\t\t\t\tvalue: completion,\n\t\t\t\t  } as InsertOption );\n\n\t\t\tif ( 'replace' === completionObject.action ) {\n\t\t\t\tonReplace( [ completionObject.value ] );\n\t\t\t\t// When replacing, the component will unmount, so don't reset\n\t\t\t\t// state (below) on an unmounted component.\n\t\t\t\treturn;\n\t\t\t} else if ( 'insert-at-caret' === completionObject.action ) {\n\t\t\t\tinsertCompletion( completionObject.value );\n\t\t\t}\n\t\t}\n\n\t\t// Reset autocomplete state after insertion rather than before\n\t\t// so insertion events don't cause the completion menu to redisplay.\n\t\treset();\n\t}\n\n\tfunction reset() {\n\t\tsetSelectedIndex( 0 );\n\t\tsetFilteredOptions( EMPTY_FILTERED_OPTIONS );\n\t\tsetFilterValue( '' );\n\t\tsetAutocompleter( null );\n\t\tsetAutocompleterUI( null );\n\t}\n\n\t/**\n\t * Load options for an autocompleter.\n\t *\n\t * @param {Array} options\n\t */\n\tfunction onChangeOptions( options: Array< KeyedOption > ) {\n\t\tsetSelectedIndex(\n\t\t\toptions.length === filteredOptions.length ? selectedIndex : 0\n\t\t);\n\t\tsetFilteredOptions( options );\n\t}\n\n\tfunction handleKeyDown( event: KeyboardEvent ) {\n\t\tbackspacing.current = event.key === 'Backspace';\n\n\t\tif ( ! autocompleter ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( filteredOptions.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tevent.defaultPrevented ||\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.key ) {\n\t\t\tcase 'ArrowUp': {\n\t\t\t\tconst newIndex =\n\t\t\t\t\t( selectedIndex === 0\n\t\t\t\t\t\t? filteredOptions.length\n\t\t\t\t\t\t: selectedIndex ) - 1;\n\t\t\t\tsetSelectedIndex( newIndex );\n\t\t\t\t// See the related PR as to why this is necessary: https://github.com/WordPress/gutenberg/pull/54902.\n\t\t\t\tif ( isAppleOS() ) {\n\t\t\t\t\tspeak(\n\t\t\t\t\t\tgetNodeText( filteredOptions[ newIndex ].label ),\n\t\t\t\t\t\t'assertive'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase 'ArrowDown': {\n\t\t\t\tconst newIndex = ( selectedIndex + 1 ) % filteredOptions.length;\n\t\t\t\tsetSelectedIndex( newIndex );\n\t\t\t\tif ( isAppleOS() ) {\n\t\t\t\t\tspeak(\n\t\t\t\t\t\tgetNodeText( filteredOptions[ newIndex ].label ),\n\t\t\t\t\t\t'assertive'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase 'Escape':\n\t\t\t\tsetAutocompleter( null );\n\t\t\t\tsetAutocompleterUI( null );\n\t\t\t\tevent.preventDefault();\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tselect( filteredOptions[ selectedIndex ] );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\t\treset();\n\t\t\t\treturn;\n\n\t\t\tdefault:\n\t\t\t\treturn;\n\t\t}\n\n\t\t// Any handled key should prevent original behavior. This relies on\n\t\t// the early return in the default case.\n\t\tevent.preventDefault();\n\t}\n\n\t// textContent is a primitive (string), memoizing is not strictly necessary\n\t// but this is a preemptive performance improvement, since the autocompleter\n\t// is a potential bottleneck for the editor type metric.\n\tconst textContent = useMemo( () => {\n\t\tif ( isCollapsed( record ) ) {\n\t\t\treturn getTextContent( slice( record, 0 ) );\n\t\t}\n\t\treturn '';\n\t}, [ record ] );\n\n\tuseEffect( () => {\n\t\tif ( ! textContent ) {\n\t\t\tif ( autocompleter ) reset();\n\t\t\treturn;\n\t\t}\n\n\t\t// Find the completer with the highest triggerPrefix index in the\n\t\t// textContent.\n\t\tconst completer = completers.reduce< WPCompleter | null >(\n\t\t\t( lastTrigger, currentCompleter ) => {\n\t\t\t\tconst triggerIndex = textContent.lastIndexOf(\n\t\t\t\t\tcurrentCompleter.triggerPrefix\n\t\t\t\t);\n\t\t\t\tconst lastTriggerIndex =\n\t\t\t\t\tlastTrigger !== null\n\t\t\t\t\t\t? textContent.lastIndexOf( lastTrigger.triggerPrefix )\n\t\t\t\t\t\t: -1;\n\n\t\t\t\treturn triggerIndex > lastTriggerIndex\n\t\t\t\t\t? currentCompleter\n\t\t\t\t\t: lastTrigger;\n\t\t\t},\n\t\t\tnull\n\t\t);\n\n\t\tif ( ! completer ) {\n\t\t\tif ( autocompleter ) reset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst { allowContext, triggerPrefix } = completer;\n\t\tconst triggerIndex = textContent.lastIndexOf( triggerPrefix );\n\t\tconst textWithoutTrigger = textContent.slice(\n\t\t\ttriggerIndex + triggerPrefix.length\n\t\t);\n\n\t\tconst tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.\n\t\t// This is a final barrier to prevent the effect from completing with\n\t\t// an extremely long string, which causes the editor to slow-down\n\t\t// significantly. This could happen, for example, if `matchingWhileBackspacing`\n\t\t// is true and one of the \"words\" end up being too long. If that's the case,\n\t\t// it will be caught by this guard.\n\t\tif ( tooDistantFromTrigger ) return;\n\n\t\tconst mismatch = filteredOptions.length === 0;\n\t\tconst wordsFromTrigger = textWithoutTrigger.split( /\\s/ );\n\t\t// We need to allow the effect to run when not backspacing and if there\n\t\t// was a mismatch. i.e when typing a trigger + the match string or when\n\t\t// clicking in an existing trigger word on the page. We do that if we\n\t\t// detect that we have one word from trigger in the current textual context.\n\t\t//\n\t\t// Ex.: \"Some text @a\" <-- \"@a\" will be detected as the trigger word and\n\t\t// allow the effect to run. It will run until there's a mismatch.\n\t\tconst hasOneTriggerWord = wordsFromTrigger.length === 1;\n\t\t// This is used to allow the effect to run when backspacing and if\n\t\t// \"touching\" a word that \"belongs\" to a trigger. We consider a \"trigger\n\t\t// word\" any word up to the limit of 3 from the trigger character.\n\t\t// Anything beyond that is ignored if there's a mismatch. This allows\n\t\t// us to \"escape\" a mismatch when backspacing, but still imposing some\n\t\t// sane limits.\n\t\t//\n\t\t// Ex: \"Some text @marcelo sekkkk\" <--- \"kkkk\" caused a mismatch, but\n\t\t// if the user presses backspace here, it will show the completion popup again.\n\t\tconst matchingWhileBackspacing =\n\t\t\tbackspacing.current && wordsFromTrigger.length <= 3;\n\n\t\tif ( mismatch && ! ( matchingWhileBackspacing || hasOneTriggerWord ) ) {\n\t\t\tif ( autocompleter ) reset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst textAfterSelection = getTextContent(\n\t\t\tslice( record, undefined, getTextContent( record ).length )\n\t\t);\n\n\t\tif (\n\t\t\tallowContext &&\n\t\t\t! allowContext(\n\t\t\t\ttextContent.slice( 0, triggerIndex ),\n\t\t\t\ttextAfterSelection\n\t\t\t)\n\t\t) {\n\t\t\tif ( autocompleter ) reset();\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\t/^\\s/.test( textWithoutTrigger ) ||\n\t\t\t/\\s\\s+$/.test( textWithoutTrigger )\n\t\t) {\n\t\t\tif ( autocompleter ) reset();\n\t\t\treturn;\n\t\t}\n\n\t\tif ( ! /[\\u0000-\\uFFFF]*$/.test( textWithoutTrigger ) ) {\n\t\t\tif ( autocompleter ) reset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst safeTrigger = escapeRegExp( completer.triggerPrefix );\n\t\tconst text = removeAccents( textContent );\n\t\tconst match = text\n\t\t\t.slice( text.lastIndexOf( completer.triggerPrefix ) )\n\t\t\t.match( new RegExp( `${ safeTrigger }([\\u0000-\\uFFFF]*)$` ) );\n\t\tconst query = match && match[ 1 ];\n\n\t\tsetAutocompleter( completer );\n\t\tsetAutocompleterUI( () =>\n\t\t\tcompleter !== autocompleter\n\t\t\t\t? getAutoCompleterUI( completer )\n\t\t\t\t: AutocompleterUI\n\t\t);\n\t\tsetFilterValue( query === null ? '' : query );\n\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ textContent ] );\n\n\tconst { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};\n\tconst { className } = autocompleter || {};\n\tconst isExpanded = !! autocompleter && filteredOptions.length > 0;\n\tconst listBoxId = isExpanded\n\t\t? `components-autocomplete-listbox-${ instanceId }`\n\t\t: undefined;\n\tconst activeId = isExpanded\n\t\t? `components-autocomplete-item-${ instanceId }-${ selectedKey }`\n\t\t: null;\n\tconst hasSelection = record.start !== undefined;\n\n\treturn {\n\t\tlistBoxId,\n\t\tactiveId,\n\t\tonKeyDown: handleKeyDown,\n\t\tpopover: hasSelection && AutocompleterUI && (\n\t\t\t<AutocompleterUI\n\t\t\t\tclassName={ className }\n\t\t\t\tfilterValue={ filterValue }\n\t\t\t\tinstanceId={ instanceId }\n\t\t\t\tlistBoxId={ listBoxId }\n\t\t\t\tselectedIndex={ selectedIndex }\n\t\t\t\tonChangeOptions={ onChangeOptions }\n\t\t\t\tonSelect={ select }\n\t\t\t\tvalue={ record }\n\t\t\t\tcontentRef={ contentRef }\n\t\t\t\treset={ reset }\n\t\t\t/>\n\t\t),\n\t};\n}\n\nfunction useLastDifferentValue( value: UseAutocompleteProps[ 'record' ] ) {\n\tconst history = useRef< Set< typeof value > >( new Set() );\n\n\thistory.current.add( value );\n\n\t// Keep the history size to 2.\n\tif ( history.current.size > 2 ) {\n\t\thistory.current.delete( Array.from( history.current )[ 0 ] );\n\t}\n\n\treturn Array.from( history.current )[ 0 ];\n}\n\nexport function useAutocompleteProps( options: UseAutocompleteProps ) {\n\tconst ref = useRef< HTMLElement >( null );\n\tconst onKeyDownRef = useRef< ( event: KeyboardEvent ) => void >();\n\tconst { record } = options;\n\tconst previousRecord = useLastDifferentValue( record );\n\tconst { popover, listBoxId, activeId, onKeyDown } = useAutocomplete( {\n\t\t...options,\n\t\tcontentRef: ref,\n\t} );\n\tonKeyDownRef.current = onKeyDown;\n\n\tconst mergedRefs = useMergeRefs( [\n\t\tref,\n\t\tuseRefEffect( ( element: HTMLElement ) => {\n\t\t\tfunction _onKeyDown( event: KeyboardEvent ) {\n\t\t\t\tonKeyDownRef.current?.( event );\n\t\t\t}\n\t\t\telement.addEventListener( 'keydown', _onKeyDown );\n\t\t\treturn () => {\n\t\t\t\telement.removeEventListener( 'keydown', _onKeyDown );\n\t\t\t};\n\t\t}, [] ),\n\t] );\n\n\t// We only want to show the popover if the user has typed something.\n\tconst didUserInput = record.text !== previousRecord?.text;\n\n\tif ( ! didUserInput ) {\n\t\treturn { ref: mergedRefs };\n\t}\n\n\treturn {\n\t\tref: mergedRefs,\n\t\tchildren: popover,\n\t\t'aria-autocomplete': listBoxId ? 'list' : undefined,\n\t\t'aria-owns': listBoxId,\n\t\t'aria-activedescendant': activeId,\n\t};\n}\n\nexport default function Autocomplete( {\n\tchildren,\n\tisSelected,\n\t...options\n}: AutocompleteProps ) {\n\tconst { popover, ...props } = useAutocomplete( options );\n\treturn (\n\t\t<>\n\t\t\t{ children( props ) }\n\t\t\t{ isSelected && popover }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}

package/build/autocomplete/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/autocomplete/types.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport type { WPElement } from '@wordpress/element';\nimport type { RichTextValue } from '@wordpress/rich-text';\n\n/**\n * Internal dependencies\n */\nimport type { useAutocomplete } from '.';\n\n// Insert the `value` into the text.\nexport type InsertOption = {\n\taction: 'insert-at-caret';\n\tvalue: React.ReactNode;\n};\n\n// Replace the current block with the block specified in the `value` property\nexport type ReplaceOption = { action: 'replace'; value: RichTextValue };\n\nexport type OptionCompletion = React.ReactNode | InsertOption | ReplaceOption;\n\ntype OptionLabel = string | WPElement | Array< string | WPElement >;\nexport type KeyedOption = {\n\tkey: string;\n\tvalue: any;\n\tlabel: OptionLabel;\n\tkeywords: Array< string >;\n\tisDisabled: boolean;\n};\n\nexport type WPCompleter< TCompleterOption = any > = {\n\t/**\n\t * The name of the completer. Useful for identifying a specific completer to\n\t * be overridden via extensibility hooks.\n\t */\n\tname: string;\n\t/**\n\t * The string prefix that should trigger the completer. For example,\n\t * Gutenberg's block completer is triggered when the '/' character is\n\t * entered.\n\t */\n\ttriggerPrefix: string;\n\t/**\n\t * The raw options for completion. May be an array, a function that returns\n\t * an array, or a function that returns a promise for an array.\n\t * Options may be of any type or shape. The completer declares how those\n\t * options are rendered and what their completions should be when selected.\n\t */\n\toptions:\n\t\t| ( (\n\t\t\t\tquery: string\n\t\t  ) =>\n\t\t\t\t| PromiseLike< readonly TCompleterOption[] >\n\t\t\t\t| readonly TCompleterOption[] )\n\t\t| readonly TCompleterOption[];\n\t/**\n\t * A function that returns the keywords for the specified option.\n\t */\n\tgetOptionKeywords?: ( option: TCompleterOption ) => Array< string >;\n\t/**\n\t * A function that returns whether or not the specified option is disabled.\n\t * Disabled options cannot be selected.\n\t */\n\tisOptionDisabled?: ( option: TCompleterOption ) => boolean;\n\t/**\n\t * A function that returns the label for a given option. A label may be a\n\t * string or a mixed array of strings, elements, and components.\n\t */\n\tgetOptionLabel: ( option: TCompleterOption ) => OptionLabel;\n\t/**\n\t * A function that takes a Range before and a Range after the autocomplete\n\t * trigger and query text and returns a boolean indicating whether the\n\t * completer should be considered for that context.\n\t */\n\tallowContext?: ( before: string, after: string ) => boolean;\n\t/**\n\t * A function that takes an option and returns how the option should\n\t * be completed. By default, the result is a value to be inserted in the\n\t * text.\n\t * However, a completer may explicitly declare how a completion should be\n\t * treated by returning an object with `action` and `value` properties. The\n\t * `action` declares what should be done with the `value`.\n\t */\n\tgetOptionCompletion?: (\n\t\toption: TCompleterOption,\n\t\tquery: string\n\t) => OptionCompletion;\n\t/**\n\t * A function that returns an array of items to be displayed in the\n\t * Autocomplete UI. These items have uniform shape and have been filtered by\n\t * `AutocompleterUIProps.filterValue`.\n\t */\n\tuseItems?: ( filterValue: string ) => readonly [ Array< KeyedOption > ];\n\t/**\n\t * Whether or not changes to the `filterValue` should be debounced.\n\t */\n\tisDebounced?: boolean;\n\t/**\n\t * A CSS class name to be applied to the completion menu.\n\t */\n\tclassName?: string;\n};\n\ntype ContentRef = React.RefObject< HTMLElement >;\n\nexport type AutocompleterUIProps = {\n\t/**\n\t * The value to filter the options by.\n\t */\n\tfilterValue: string;\n\t/**\n\t * An id unique to each instance of the component, used in the IDs of the\n\t * buttons generated for individual options.\n\t */\n\tinstanceId: number;\n\t/**\n\t * The id of to be applied to the listbox of options.\n\t */\n\tlistBoxId: string | undefined;\n\t/**\n\t * The class to apply to the wrapper element.\n\t */\n\tclassName?: string;\n\t/**\n\t * The index of the currently selected option.\n\t */\n\tselectedIndex: number;\n\t/**\n\t * A function to be called when the filterValue changes.\n\t */\n\tonChangeOptions: ( items: Array< KeyedOption > ) => void;\n\t/**\n\t * A function to be called when an option is selected.\n\t */\n\tonSelect: ( option: KeyedOption ) => void;\n\t/**\n\t * A function to be called when the completer is reset\n\t * (e.g. when the user hits the escape key).\n\t */\n\tonReset?: () => void;\n\t/**\n\t * A function that defines the behavior of the completer when it is reset\n\t */\n\treset: ( event: Event ) => void;\n\t// This is optional because it's still needed for mobile/native.\n\t/**\n\t * The rich text value object the autocompleter is being applied to.\n\t */\n\tvalue?: RichTextValue;\n\t/**\n\t * A ref containing the editable element that will serve as the anchor for\n\t * `Autocomplete`'s `Popover`.\n\t */\n\tcontentRef: ContentRef;\n};\n\nexport type CancelablePromise< T = void > = Promise< T > & {\n\tcanceled?: boolean;\n};\n\nexport type UseAutocompleteProps = {\n\t/**\n\t * The rich text value object the autocompleter is being applied to.\n\t */\n\trecord: RichTextValue & {\n\t\tstart: NonNullable< RichTextValue[ 'start' ] >;\n\t\tend: NonNullable< RichTextValue[ 'end' ] >;\n\t};\n\t/**\n\t * A function to be called when an option is selected to insert into the\n\t * existing text.\n\t */\n\tonChange: ( value: RichTextValue ) => void;\n\t/**\n\t * A function to be called when an option is selected to replace the\n\t * existing text.\n\t */\n\tonReplace: ( values: RichTextValue[] ) => void;\n\t/**\n\t * An array of all of the completers to apply to the current element.\n\t */\n\tcompleters: Array< WPCompleter >;\n\t/**\n\t * A ref containing the editable element that will serve as the anchor for\n\t * `Autocomplete`'s `Popover`.\n\t */\n\tcontentRef: ContentRef;\n};\n\nexport type AutocompleteProps = UseAutocompleteProps & {\n\t/**\n\t * A function that returns nodes to be rendered within the Autocomplete.\n\t */\n\tchildren: (\n\t\tprops: Omit< ReturnType< typeof useAutocomplete >, 'popover' >\n\t) => React.ReactNode;\n\t/**\n\t * Whether or not the Autocomplte componenet is selected, and if its\n\t * `Popover`\n\t * should be displayed.\n\t */\n\tisSelected: boolean;\n};\n"],"mappings":""}
+{"version":3,"names":[],"sources":["@wordpress/components/src/autocomplete/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactElement } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport type { RichTextValue } from '@wordpress/rich-text';\n\n/**\n * Internal dependencies\n */\nimport type { useAutocomplete } from '.';\n\n// Insert the `value` into the text.\nexport type InsertOption = {\n\taction: 'insert-at-caret';\n\tvalue: React.ReactNode;\n};\n\n// Replace the current block with the block specified in the `value` property\nexport type ReplaceOption = { action: 'replace'; value: RichTextValue };\n\nexport type OptionCompletion = React.ReactNode | InsertOption | ReplaceOption;\n\ntype OptionLabel = string | ReactElement | Array< string | ReactElement >;\nexport type KeyedOption = {\n\tkey: string;\n\tvalue: any;\n\tlabel: OptionLabel;\n\tkeywords: Array< string >;\n\tisDisabled: boolean;\n};\n\nexport type WPCompleter< TCompleterOption = any > = {\n\t/**\n\t * The name of the completer. Useful for identifying a specific completer to\n\t * be overridden via extensibility hooks.\n\t */\n\tname: string;\n\t/**\n\t * The string prefix that should trigger the completer. For example,\n\t * Gutenberg's block completer is triggered when the '/' character is\n\t * entered.\n\t */\n\ttriggerPrefix: string;\n\t/**\n\t * The raw options for completion. May be an array, a function that returns\n\t * an array, or a function that returns a promise for an array.\n\t * Options may be of any type or shape. The completer declares how those\n\t * options are rendered and what their completions should be when selected.\n\t */\n\toptions:\n\t\t| ( (\n\t\t\t\tquery: string\n\t\t  ) =>\n\t\t\t\t| PromiseLike< readonly TCompleterOption[] >\n\t\t\t\t| readonly TCompleterOption[] )\n\t\t| readonly TCompleterOption[];\n\t/**\n\t * A function that returns the keywords for the specified option.\n\t */\n\tgetOptionKeywords?: ( option: TCompleterOption ) => Array< string >;\n\t/**\n\t * A function that returns whether or not the specified option is disabled.\n\t * Disabled options cannot be selected.\n\t */\n\tisOptionDisabled?: ( option: TCompleterOption ) => boolean;\n\t/**\n\t * A function that returns the label for a given option. A label may be a\n\t * string or a mixed array of strings, elements, and components.\n\t */\n\tgetOptionLabel: ( option: TCompleterOption ) => OptionLabel;\n\t/**\n\t * A function that takes a Range before and a Range after the autocomplete\n\t * trigger and query text and returns a boolean indicating whether the\n\t * completer should be considered for that context.\n\t */\n\tallowContext?: ( before: string, after: string ) => boolean;\n\t/**\n\t * A function that takes an option and returns how the option should\n\t * be completed. By default, the result is a value to be inserted in the\n\t * text.\n\t * However, a completer may explicitly declare how a completion should be\n\t * treated by returning an object with `action` and `value` properties. The\n\t * `action` declares what should be done with the `value`.\n\t */\n\tgetOptionCompletion?: (\n\t\toption: TCompleterOption,\n\t\tquery: string\n\t) => OptionCompletion;\n\t/**\n\t * A function that returns an array of items to be displayed in the\n\t * Autocomplete UI. These items have uniform shape and have been filtered by\n\t * `AutocompleterUIProps.filterValue`.\n\t */\n\tuseItems?: ( filterValue: string ) => readonly [ Array< KeyedOption > ];\n\t/**\n\t * Whether or not changes to the `filterValue` should be debounced.\n\t */\n\tisDebounced?: boolean;\n\t/**\n\t * A CSS class name to be applied to the completion menu.\n\t */\n\tclassName?: string;\n};\n\ntype ContentRef = React.RefObject< HTMLElement >;\n\nexport type AutocompleterUIProps = {\n\t/**\n\t * The value to filter the options by.\n\t */\n\tfilterValue: string;\n\t/**\n\t * An id unique to each instance of the component, used in the IDs of the\n\t * buttons generated for individual options.\n\t */\n\tinstanceId: number;\n\t/**\n\t * The id of to be applied to the listbox of options.\n\t */\n\tlistBoxId: string | undefined;\n\t/**\n\t * The class to apply to the wrapper element.\n\t */\n\tclassName?: string;\n\t/**\n\t * The index of the currently selected option.\n\t */\n\tselectedIndex: number;\n\t/**\n\t * A function to be called when the filterValue changes.\n\t */\n\tonChangeOptions: ( items: Array< KeyedOption > ) => void;\n\t/**\n\t * A function to be called when an option is selected.\n\t */\n\tonSelect: ( option: KeyedOption ) => void;\n\t/**\n\t * A function to be called when the completer is reset\n\t * (e.g. when the user hits the escape key).\n\t */\n\tonReset?: () => void;\n\t/**\n\t * A function that defines the behavior of the completer when it is reset\n\t */\n\treset: ( event: Event ) => void;\n\t// This is optional because it's still needed for mobile/native.\n\t/**\n\t * The rich text value object the autocompleter is being applied to.\n\t */\n\tvalue?: RichTextValue;\n\t/**\n\t * A ref containing the editable element that will serve as the anchor for\n\t * `Autocomplete`'s `Popover`.\n\t */\n\tcontentRef: ContentRef;\n};\n\nexport type CancelablePromise< T = void > = Promise< T > & {\n\tcanceled?: boolean;\n};\n\nexport type UseAutocompleteProps = {\n\t/**\n\t * The rich text value object the autocompleter is being applied to.\n\t */\n\trecord: RichTextValue & {\n\t\tstart: NonNullable< RichTextValue[ 'start' ] >;\n\t\tend: NonNullable< RichTextValue[ 'end' ] >;\n\t};\n\t/**\n\t * A function to be called when an option is selected to insert into the\n\t * existing text.\n\t */\n\tonChange: ( value: RichTextValue ) => void;\n\t/**\n\t * A function to be called when an option is selected to replace the\n\t * existing text.\n\t */\n\tonReplace: ( values: RichTextValue[] ) => void;\n\t/**\n\t * An array of all of the completers to apply to the current element.\n\t */\n\tcompleters: Array< WPCompleter >;\n\t/**\n\t * A ref containing the editable element that will serve as the anchor for\n\t * `Autocomplete`'s `Popover`.\n\t */\n\tcontentRef: ContentRef;\n};\n\nexport type AutocompleteProps = UseAutocompleteProps & {\n\t/**\n\t * A function that returns nodes to be rendered within the Autocomplete.\n\t */\n\tchildren: (\n\t\tprops: Omit< ReturnType< typeof useAutocomplete >, 'popover' >\n\t) => React.ReactNode;\n\t/**\n\t * Whether or not the Autocomplte componenet is selected, and if its\n\t * `Popover`\n\t * should be displayed.\n\t */\n\tisSelected: boolean;\n};\n"],"mappings":""}

package/build/base-control/index.js

@@ -11,10 +11,11 @@ Object.defineProperty(exports, "useBaseControlProps", {
     return _hooks.useBaseControlProps;
   }
 });
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _visuallyHidden = require("../visually-hidden");
 var _baseControlStyles = require("./styles/base-control-styles");
+var _context = require("../context");
 var _hooks = require("./hooks");
 /**
  * External dependencies
@@ -47,31 +48,32 @@ var _hooks = require("./hooks");
  * );
  * ```
  */
-const BaseControl = ({
-  __nextHasNoMarginBottom = false,
-  id,
-  label,
-  hideLabelFromVision = false,
-  help,
-  className,
-  children
-}) => {
-  return (0, _element.createElement)(_baseControlStyles.Wrapper, {
-    className: (0, _classnames.default)('components-base-control', className)
-  }, (0, _element.createElement)(_baseControlStyles.StyledField, {
+const UnconnectedBaseControl = props => {
+  const {
+    __nextHasNoMarginBottom = false,
+    id,
+    label,
+    hideLabelFromVision = false,
+    help,
+    className,
+    children
+  } = (0, _context.useContextSystem)(props, 'BaseControl');
+  return (0, _react.createElement)(_baseControlStyles.Wrapper, {
+    className: className
+  }, (0, _react.createElement)(_baseControlStyles.StyledField, {
     className: "components-base-control__field"
     // TODO: Official deprecation for this should start after all internal usages have been migrated
     ,
     __nextHasNoMarginBottom: __nextHasNoMarginBottom
-  }, label && id && (hideLabelFromVision ? (0, _element.createElement)(_visuallyHidden.VisuallyHidden, {
+  }, label && id && (hideLabelFromVision ? (0, _react.createElement)(_visuallyHidden.VisuallyHidden, {
     as: "label",
     htmlFor: id
-  }, label) : (0, _element.createElement)(_baseControlStyles.StyledLabel, {
+  }, label) : (0, _react.createElement)(_baseControlStyles.StyledLabel, {
     className: "components-base-control__label",
     htmlFor: id
-  }, label)), label && !id && (hideLabelFromVision ? (0, _element.createElement)(_visuallyHidden.VisuallyHidden, {
+  }, label)), label && !id && (hideLabelFromVision ? (0, _react.createElement)(_visuallyHidden.VisuallyHidden, {
     as: "label"
-  }, label) : (0, _element.createElement)(BaseControl.VisualLabel, null, label)), children), !!help && (0, _element.createElement)(_baseControlStyles.StyledHelp, {
+  }, label) : (0, _react.createElement)(VisualLabel, null, label)), children), !!help && (0, _react.createElement)(_baseControlStyles.StyledHelp, {
     id: id ? id + '__help' : undefined,
     className: "components-base-control__help",
     __nextHasNoMarginBottom: __nextHasNoMarginBottom
@@ -95,19 +97,19 @@ const BaseControl = ({
  * 	</BaseControl>
  * );
  */
-exports.BaseControl = BaseControl;
 const VisualLabel = ({
   className,
   children,
   ...props
 }) => {
-  return (0, _element.createElement)(_baseControlStyles.StyledVisualLabel, {
+  return (0, _react.createElement)(_baseControlStyles.StyledVisualLabel, {
     ...props,
     className: (0, _classnames.default)('components-base-control__label', className)
   }, children);
 };
 exports.VisualLabel = VisualLabel;
-BaseControl.VisualLabel = VisualLabel;
-var _default = BaseControl;
-exports.default = _default;
+const BaseControl = exports.BaseControl = Object.assign((0, _context.contextConnectWithoutRef)(UnconnectedBaseControl, 'BaseControl'), {
+  VisualLabel
+});
+var _default = exports.default = BaseControl;
 //# sourceMappingURL=index.js.map