npm - @wordpress/components - Versions diffs - 25.1.0 → 25.1.1 - Mend

@wordpress/components 25.1.0 → 25.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (993) hide show

package/build/mobile/picker/index.ios.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/mobile/picker/index.ios.js"],"names":["Picker","Component","presentPicker","options","onChange","title","destructiveButtonIndex","disabledButtonIndices","getAnchor","isBottomSheetOpened","closeBottomSheet","onHandleClosingBottomSheet","colorScheme","props","labels","map","label","fullOptions","concat","buttonTitleColor","styles","color","ActionSheetIOS","showActionSheetWithOptions","cancelButtonIndex","anchor","tintColor","buttonIndex","selected","requiresModal","value","render","PickerComponent","ref","select","isEditorSidebarOpened","closeGeneralSidebar","BottomSheetContext"],"mappings":";;;;;;;;;AASA~~;;;;~~AANA;;AAKA;;AAEA;;AACA;;AACA;;AAKA;;AAjBA;AACA;AACA;;AAGA;AACA;AACA;;AAOA;AACA;AACA;AAGA,MAAMA,MAAN,SAAqBC,kBAArB,CAA+B;AAC9BC,EAAAA,aAAa,GAAG;AACf,UAAM;AACLC,MAAAA,OADK;AAELC,MAAAA,QAFK;AAGLC,MAAAA,KAHK;AAILC,MAAAA,sBAJK;AAKLC,MAAAA,qBALK;AAMLC,MAAAA,SANK;AAOLC,MAAAA,mBAPK;AAQLC,MAAAA,gBARK;AASLC,MAAAA,0BATK;AAULC,MAAAA;AAVK,QAWF,KAAKC,KAXT;AAYA,UAAMC,MAAM,GAAGX,OAAO,CAACY,GAAR,CAAa,CAAE;AAAEC,MAAAA;AAAF,KAAF,KAAiBA,KAA9B,CAAf;AACA,UAAMC,WAAW,GAAG,CAAE,cAAI,QAAJ,CAAF,EAAmBC,MAAnB,CAA2BJ,MAA3B,CAApB;AAEA,UAAMK,gBAAgB,GACrBP,WAAW,KAAK,OAAhB,GACGQ,gBAAQ,iCAAR,EAA4CC,KAD/C,GAEGD,gBAAQ,uCAAR,EAAkDC,KAHtD;;AAKAC,gCAAeC,0BAAf,CACC;AACClB,MAAAA,KADD;AAECF,MAAAA,OAAO,EAAEc,WAFV;AAGCO,MAAAA,iBAAiB,EAAE,CAHpB;AAIClB,MAAAA,sBAJD;AAKCC,MAAAA,qBALD;AAMCkB,MAAAA,MAAM,EAAEjB,SAAS,IAAIA,SAAS,EAN/B;AAOCkB,MAAAA,SAAS,EAAEP;AAPZ,KADD,EAUGQ,WAAF,IAAmB;AAClB,UAAKA,WAAW,KAAK,CAArB,EAAyB;AACxB;AACA;;AACD,YAAMC,QAAQ,GAAGzB,OAAO,CAAEwB,WAAW,GAAG,CAAhB,CAAxB;;AAEA,UAAKC,QAAQ,CAACC,aAAT,IAA0BpB,mBAA/B,EAAqD;AACpDE,QAAAA,0BAA0B,CAAE,MAAM;AACjCP,UAAAA,QAAQ,CAAEwB,QAAQ,CAACE,KAAX,CAAR;AACA,SAFyB,CAA1B;AAGApB,QAAAA,gBAAgB;AAChB,OALD,MAKO;AACNN,QAAAA,QAAQ,CAAEwB,QAAQ,CAACE,KAAX,CAAR;AACA;AACD,KAxBF;AA0BA;;AAEDC,EAAAA,MAAM,GAAG;AACR,WAAO,IAAP;AACA;;AApD6B;;AAuD/B,MAAMC,eAAe,GAAG,yBAAY,CAAEnB,KAAF,EAASoB,GAAT,KAAkB;AACrD,QAAMxB,mBAAmB,GAAG,qBAAayB,MAAF,IACtCA,MAAM,CAAE,gBAAF,CAAN,CAA2BC,qBAA3B,EAD2B,CAA5B;AAGA,QAAM;AAAEC,IAAAA;AAAF,MAA0B,uBAAa,gBAAb,CAAhC;AACA,QAAM;AAAEzB,IAAAA;AAAF,MAAiC,yBAAY0B,8BAAZ,CAAvC;AAEA,QAAMzB,WAAW,GAAG,uCAApB;AAEA,SACC,4BAAC,MAAD;AACC,IAAA,GAAG,EAAGqB;~~AADP~~,~~KAEMpB~~,KAFN;AAGC,IAAA,mBAAmB,EAAGJ,mBAHvB;AAIC,IAAA,gBAAgB,EAAG2B,mBAJpB;AAKC,IAAA,0BAA0B,EAAGzB,0BAL9B;AAMC,IAAA,WAAW,EAAGC;AANf,~~KADD~~;AAUA,CAnBuB,CAAxB;eAqBeoB,e","sourcesContent":["/*\n External dependencies\n /\nimport { ActionSheetIOS } from 'react-native';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { Component, forwardRef, useContext } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { BottomSheetContext } from '@wordpress/components';\nimport { usePreferredColorScheme } from '@wordpress/compose';\n\n/\n Internal dependencies\n */\nimport styles from './styles.scss';\n\nclass Picker extends Component {\n\tpresentPicker() {\n\t\tconst {\n\t\t\toptions,\n\t\t\tonChange,\n\t\t\ttitle,\n\t\t\tdestructiveButtonIndex,\n\t\t\tdisabledButtonIndices,\n\t\t\tgetAnchor,\n\t\t\tisBottomSheetOpened,\n\t\t\tcloseBottomSheet,\n\t\t\tonHandleClosingBottomSheet,\n\t\t\tcolorScheme,\n\t\t} = this.props;\n\t\tconst labels = options.map( ( { label } ) => label );\n\t\tconst fullOptions = [ __( 'Cancel' ) ].concat( labels );\n\n\t\tconst buttonTitleColor =\n\t\t\tcolorScheme === 'light'\n\t\t\t\t? styles[ 'components-picker__button-title' ].color\n\t\t\t\t: styles[ 'components-picker__button-title--dark' ].color;\n\n\t\tActionSheetIOS.showActionSheetWithOptions(\n\t\t\t{\n\t\t\t\ttitle,\n\t\t\t\toptions: fullOptions,\n\t\t\t\tcancelButtonIndex: 0,\n\t\t\t\tdestructiveButtonIndex,\n\t\t\t\tdisabledButtonIndices,\n\t\t\t\tanchor: getAnchor && getAnchor(),\n\t\t\t\ttintColor: buttonTitleColor,\n\t\t\t},\n\t\t\t( buttonIndex ) => {\n\t\t\t\tif ( buttonIndex === 0 ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tconst selected = options[ buttonIndex - 1 ];\n\n\t\t\t\tif ( selected.requiresModal && isBottomSheetOpened ) {\n\t\t\t\t\tonHandleClosingBottomSheet( () => {\n\t\t\t\t\t\tonChange( selected.value );\n\t\t\t\t\t} );\n\t\t\t\t\tcloseBottomSheet();\n\t\t\t\t} else {\n\t\t\t\t\tonChange( selected.value );\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t}\n\n\trender() {\n\t\treturn null;\n\t}\n}\n\nconst PickerComponent = forwardRef( ( props, ref ) => {\n\tconst isBottomSheetOpened = useSelect( ( select ) =>\n\t\tselect( 'core/edit-post' ).isEditorSidebarOpened()\n\t);\n\tconst { closeGeneralSidebar } = useDispatch( 'core/edit-post' );\n\tconst { onHandleClosingBottomSheet } = useContext( BottomSheetContext );\n\n\tconst colorScheme = usePreferredColorScheme();\n\n\treturn (\n\t\t<Picker\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tisBottomSheetOpened={ isBottomSheetOpened }\n\t\t\tcloseBottomSheet={ closeGeneralSidebar }\n\t\t\tonHandleClosingBottomSheet={ onHandleClosingBottomSheet }\n\t\t\tcolorScheme={ colorScheme }\n\t\t/>\n\t);\n} );\n\nexport default PickerComponent;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/mobile/picker/index.ios.js"],"names":["Picker","Component","presentPicker","options","onChange","title","destructiveButtonIndex","disabledButtonIndices","getAnchor","isBottomSheetOpened","closeBottomSheet","onHandleClosingBottomSheet","colorScheme","props","labels","map","label","fullOptions","concat","buttonTitleColor","styles","color","ActionSheetIOS","showActionSheetWithOptions","cancelButtonIndex","anchor","tintColor","buttonIndex","selected","requiresModal","value","render","PickerComponent","ref","select","isEditorSidebarOpened","closeGeneralSidebar","BottomSheetContext"],"mappings":";;;;;;;;;AASA;;AANA;;AAKA;;AAEA;;AACA;;AACA;;AAKA;;AAjBA;AACA;AACA;;AAGA;AACA;AACA;;AAOA;AACA;AACA;AAGA,MAAMA,MAAN,SAAqBC,kBAArB,CAA+B;AAC9BC,EAAAA,aAAa,GAAG;AACf,UAAM;AACLC,MAAAA,OADK;AAELC,MAAAA,QAFK;AAGLC,MAAAA,KAHK;AAILC,MAAAA,sBAJK;AAKLC,MAAAA,qBALK;AAMLC,MAAAA,SANK;AAOLC,MAAAA,mBAPK;AAQLC,MAAAA,gBARK;AASLC,MAAAA,0BATK;AAULC,MAAAA;AAVK,QAWF,KAAKC,KAXT;AAYA,UAAMC,MAAM,GAAGX,OAAO,CAACY,GAAR,CAAa,CAAE;AAAEC,MAAAA;AAAF,KAAF,KAAiBA,KAA9B,CAAf;AACA,UAAMC,WAAW,GAAG,CAAE,cAAI,QAAJ,CAAF,EAAmBC,MAAnB,CAA2BJ,MAA3B,CAApB;AAEA,UAAMK,gBAAgB,GACrBP,WAAW,KAAK,OAAhB,GACGQ,gBAAQ,iCAAR,EAA4CC,KAD/C,GAEGD,gBAAQ,uCAAR,EAAkDC,KAHtD;;AAKAC,gCAAeC,0BAAf,CACC;AACClB,MAAAA,KADD;AAECF,MAAAA,OAAO,EAAEc,WAFV;AAGCO,MAAAA,iBAAiB,EAAE,CAHpB;AAIClB,MAAAA,sBAJD;AAKCC,MAAAA,qBALD;AAMCkB,MAAAA,MAAM,EAAEjB,SAAS,IAAIA,SAAS,EAN/B;AAOCkB,MAAAA,SAAS,EAAEP;AAPZ,KADD,EAUGQ,WAAF,IAAmB;AAClB,UAAKA,WAAW,KAAK,CAArB,EAAyB;AACxB;AACA;;AACD,YAAMC,QAAQ,GAAGzB,OAAO,CAAEwB,WAAW,GAAG,CAAhB,CAAxB;;AAEA,UAAKC,QAAQ,CAACC,aAAT,IAA0BpB,mBAA/B,EAAqD;AACpDE,QAAAA,0BAA0B,CAAE,MAAM;AACjCP,UAAAA,QAAQ,CAAEwB,QAAQ,CAACE,KAAX,CAAR;AACA,SAFyB,CAA1B;AAGApB,QAAAA,gBAAgB;AAChB,OALD,MAKO;AACNN,QAAAA,QAAQ,CAAEwB,QAAQ,CAACE,KAAX,CAAR;AACA;AACD,KAxBF;AA0BA;;AAEDC,EAAAA,MAAM,GAAG;AACR,WAAO,IAAP;AACA;;AApD6B;;AAuD/B,MAAMC,eAAe,GAAG,yBAAY,CAAEnB,KAAF,EAASoB,GAAT,KAAkB;AACrD,QAAMxB,mBAAmB,GAAG,qBAAayB,MAAF,IACtCA,MAAM,CAAE,gBAAF,CAAN,CAA2BC,qBAA3B,EAD2B,CAA5B;AAGA,QAAM;AAAEC,IAAAA;AAAF,MAA0B,uBAAa,gBAAb,CAAhC;AACA,QAAM;AAAEzB,IAAAA;AAAF,MAAiC,yBAAY0B,8BAAZ,CAAvC;AAEA,QAAMzB,WAAW,GAAG,uCAApB;AAEA,SACC,4BAAC,MAAD;AACC,IAAA,GAAG,EAAGqB,GADP;AAAA,OAEMpB,KAFN;AAGC,IAAA,mBAAmB,EAAGJ,mBAHvB;AAIC,IAAA,gBAAgB,EAAG2B,mBAJpB;AAKC,IAAA,0BAA0B,EAAGzB,0BAL9B;AAMC,IAAA,WAAW,EAAGC;AANf,IADD;AAUA,CAnBuB,CAAxB;eAqBeoB,e","sourcesContent":["/*\n External dependencies\n /\nimport { ActionSheetIOS } from 'react-native';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { Component, forwardRef, useContext } from '@wordpress/element';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { BottomSheetContext } from '@wordpress/components';\nimport { usePreferredColorScheme } from '@wordpress/compose';\n\n/\n Internal dependencies\n */\nimport styles from './styles.scss';\n\nclass Picker extends Component {\n\tpresentPicker() {\n\t\tconst {\n\t\t\toptions,\n\t\t\tonChange,\n\t\t\ttitle,\n\t\t\tdestructiveButtonIndex,\n\t\t\tdisabledButtonIndices,\n\t\t\tgetAnchor,\n\t\t\tisBottomSheetOpened,\n\t\t\tcloseBottomSheet,\n\t\t\tonHandleClosingBottomSheet,\n\t\t\tcolorScheme,\n\t\t} = this.props;\n\t\tconst labels = options.map( ( { label } ) => label );\n\t\tconst fullOptions = [ __( 'Cancel' ) ].concat( labels );\n\n\t\tconst buttonTitleColor =\n\t\t\tcolorScheme === 'light'\n\t\t\t\t? styles[ 'components-picker__button-title' ].color\n\t\t\t\t: styles[ 'components-picker__button-title--dark' ].color;\n\n\t\tActionSheetIOS.showActionSheetWithOptions(\n\t\t\t{\n\t\t\t\ttitle,\n\t\t\t\toptions: fullOptions,\n\t\t\t\tcancelButtonIndex: 0,\n\t\t\t\tdestructiveButtonIndex,\n\t\t\t\tdisabledButtonIndices,\n\t\t\t\tanchor: getAnchor && getAnchor(),\n\t\t\t\ttintColor: buttonTitleColor,\n\t\t\t},\n\t\t\t( buttonIndex ) => {\n\t\t\t\tif ( buttonIndex === 0 ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tconst selected = options[ buttonIndex - 1 ];\n\n\t\t\t\tif ( selected.requiresModal && isBottomSheetOpened ) {\n\t\t\t\t\tonHandleClosingBottomSheet( () => {\n\t\t\t\t\t\tonChange( selected.value );\n\t\t\t\t\t} );\n\t\t\t\t\tcloseBottomSheet();\n\t\t\t\t} else {\n\t\t\t\t\tonChange( selected.value );\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t}\n\n\trender() {\n\t\treturn null;\n\t}\n}\n\nconst PickerComponent = forwardRef( ( props, ref ) => {\n\tconst isBottomSheetOpened = useSelect( ( select ) =>\n\t\tselect( 'core/edit-post' ).isEditorSidebarOpened()\n\t);\n\tconst { closeGeneralSidebar } = useDispatch( 'core/edit-post' );\n\tconst { onHandleClosingBottomSheet } = useContext( BottomSheetContext );\n\n\tconst colorScheme = usePreferredColorScheme();\n\n\treturn (\n\t\t<Picker\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tisBottomSheetOpened={ isBottomSheetOpened }\n\t\t\tcloseBottomSheet={ closeGeneralSidebar }\n\t\t\tonHandleClosingBottomSheet={ onHandleClosingBottomSheet }\n\t\t\tcolorScheme={ colorScheme }\n\t\t/>\n\t);\n} );\n\nexport default PickerComponent;\n"]}

package/build/mobile/segmented-control/index.native.js CHANGED Viewed

@@ -9,8 +9,6 @@ exports.default = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _reactNative = require("react-native");
 var _compose = require("@wordpress/compose");
@@ -49,10 +47,11 @@ const Segment = ({
     style: isSelectedIOS && shadowStyle
   }, (0, _element.createElement)(_reactNative.TouchableWithoutFeedback, {
     onPress: onPress
-  }, (0, _element.createElement)(_reactNative.View, (0, _extends2.default)({
+  }, (0, _element.createElement)(_reactNative.View, {
     style: segmentStyle,
-    onLayout: onLayout
-  }, props), (0, _element.createElement)(_reactNative.Text, {
+    onLayout: onLayout,
+    ...props
+  }, (0, _element.createElement)(_reactNative.Text, {
     style: [textStyle, isSelected && selectedTextStyle],
     maxFontSizeMultiplier: 2
   }, title))));

package/build/mobile/segmented-control/index.native.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/mobile/segmented-control/index.native.js"],"names":["ANIMATION_DURATION","isIOS","Platform","OS","Segment","isSelected","title","onPress","onLayout","props","isSelectedIOS","segmentStyle","styles","segment","segmentIOS","textStyle","buttonTextDefault","buttonTextDefaultDark","selectedTextStyle","buttonTextSelected","buttonTextSelectedDark","shadowStyle","shadowIOS","SegmentedControls","segments","segmentHandler","selectedIndex","addonLeft","addonRight","selectedSegmentIndex","activeSegmentIndex","setActiveSegmentIndex","segmentsDimensions","setSegmentsDimensions","width","height","positionAnimationValue","Animated","Value","setValue","calculateEndValue","containerStyle","container","containerDark","performSwatchAnimation","index","timing","toValue","duration","easing","Easing","ease","useNativeDriver","start","paddingLeft","offset","containerIOS","widths","Object","values","map","dimension","widthsDistance","slice","widthsDistanceSum","reduce","sum","n","endValue","onHandlePress","segmentOnLayout","event","nativeEvent","layout","selectedStyle","selected","selectedDark","outlineStyle","outline","outlineIOS","row","flex","length","left"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport {\n\tView,\n\tTouchableWithoutFeedback,\n\tText,\n\tPlatform,\n\tAnimated,\n\tEasing,\n} from 'react-native';\n/\n WordPress dependencies\n /\nimport { useState, useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/\n Internal dependencies\n */\nimport { performLayoutAnimation } from '../layout-animation';\nimport styles from './style.scss';\n\nconst ANIMATION_DURATION = 200;\n\nconst isIOS = Platform.OS === 'ios';\n\nconst Segment = ( { isSelected, title, onPress, onLayout, ...props } ) => {\n\tconst isSelectedIOS = isIOS && isSelected;\n\n\tconst segmentStyle = [ styles.segment, isIOS && styles.segmentIOS ];\n\n\tconst textStyle = usePreferredColorSchemeStyle(\n\t\tstyles.buttonTextDefault,\n\t\tstyles.buttonTextDefaultDark\n\t);\n\tconst selectedTextStyle = usePreferredColorSchemeStyle(\n\t\tstyles.buttonTextSelected,\n\t\tstyles.buttonTextSelectedDark\n\t);\n\tconst shadowStyle = usePreferredColorSchemeStyle( styles.shadowIOS, {} );\n\n\treturn (\n\t\t<View style={ isSelectedIOS && shadowStyle }>\n\t\t\t<TouchableWithoutFeedback onPress={ onPress }>\n\t\t\t\t<View style={ segmentStyle } onLayout={ onLayout } { ...props }>\n\t\t\t\t\t<Text\n\t\t\t\t\t\tstyle={ [ textStyle, isSelected && selectedTextStyle ] }\n\t\t\t\t\t\tmaxFontSizeMultiplier={ 2 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ title }\n\t\t\t\t\t</Text>\n\t\t\t\t</View>\n\t\t\t</TouchableWithoutFeedback>\n\t\t</View>\n\t);\n};\n\nconst SegmentedControls = ( {\n\tsegments,\n\tsegmentHandler,\n\tselectedIndex,\n\taddonLeft,\n\taddonRight,\n} ) => {\n\tconst selectedSegmentIndex = selectedIndex \|\| 0;\n\tconst [ activeSegmentIndex, setActiveSegmentIndex ] =\n\t\tuseState( selectedSegmentIndex );\n\tconst [ segmentsDimensions, setSegmentsDimensions ] = useState( {\n\t\t[ activeSegmentIndex ]: { width: 0, height: 0 },\n\t} );\n\tconst [ positionAnimationValue ] = useState( new Animated.Value( 0 ) );\n\n\tuseEffect( () => {\n\t\tsetActiveSegmentIndex( selectedSegmentIndex );\n\t\tsegmentHandler( segments[ selectedSegmentIndex ] );\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tpositionAnimationValue.setValue(\n\t\t\tcalculateEndValue( activeSegmentIndex )\n\t\t);\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ segmentsDimensions ] );\n\n\tconst containerStyle = usePreferredColorSchemeStyle(\n\t\tstyles.container,\n\t\tstyles.containerDark\n\t);\n\n\tfunction performSwatchAnimation( index ) {\n\t\tAnimated.timing( positionAnimationValue, {\n\t\t\ttoValue: calculateEndValue( index ),\n\t\t\tduration: ANIMATION_DURATION,\n\t\t\teasing: Easing.ease,\n\t\t\tuseNativeDriver: false,\n\t\t} ).start();\n\t}\n\n\tfunction calculateEndValue( index ) {\n\t\tconst { paddingLeft: offset } = isIOS\n\t\t\t? styles.containerIOS\n\t\t\t: styles.container;\n\t\tconst widths = Object.values( segmentsDimensions ).map(\n\t\t\t( dimension ) => dimension.width\n\t\t);\n\t\tconst widthsDistance = widths.slice( 0, index );\n\t\tconst widthsDistanceSum = widthsDistance.reduce(\n\t\t\t( sum, n ) => sum + n,\n\t\t\t0\n\t\t);\n\n\t\tconst endValue = index === 0 ? 0 : widthsDistanceSum;\n\t\treturn endValue + offset;\n\t}\n\n\tfunction onHandlePress( segment, index ) {\n\t\tperformLayoutAnimation( ANIMATION_DURATION );\n\t\tsetActiveSegmentIndex( index );\n\t\tsegmentHandler( segment );\n\t\tperformSwatchAnimation( index );\n\t}\n\n\tfunction segmentOnLayout( event, index ) {\n\t\tconst { width, height } = event.nativeEvent.layout;\n\n\t\tsetSegmentsDimensions( {\n\t\t\t...segmentsDimensions,\n\t\t\t[ index ]: { width, height },\n\t\t} );\n\t}\n\n\tconst selectedStyle = usePreferredColorSchemeStyle(\n\t\tstyles.selected,\n\t\tstyles.selectedDark\n\t);\n\n\tconst width = segmentsDimensions[ activeSegmentIndex ]?.width;\n\tconst height = segmentsDimensions[ activeSegmentIndex ]?.height;\n\n\tconst outlineStyle = [ styles.outline, isIOS && styles.outlineIOS ];\n\n\treturn (\n\t\t<View style={ styles.row }>\n\t\t\t<View style={ styles.flex }>{ addonLeft }</View>\n\t\t\t<View style={ [ containerStyle, isIOS && styles.containerIOS ] }>\n\t\t\t\t{ segments.map( ( segment, index ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Segment\n\t\t\t\t\t\t\ttitle={ segment }\n\t\t\t\t\t\t\tonPress={ () => onHandlePress( segment, index ) }\n\t\t\t\t\t\t\tisSelected={ activeSegmentIndex === index }\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tonLayout={ ( event ) =>\n\t\t\t\t\t\t\t\tsegmentOnLayout( event, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\tselected: activeSegmentIndex === index,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\taccessibilityLabel={ segment }\n\t\t\t\t\t\t\taccessibilityHint={ `${ index + 1 } on ${\n\t\t\t\t\t\t\t\tsegments.length\n\t\t\t\t\t\t\t}` }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t<Animated.View\n\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\tleft: positionAnimationValue,\n\t\t\t\t\t\t\theight,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tselectedStyle,\n\t\t\t\t\t\toutlineStyle,\n\t\t\t\t\t] }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t\t<View style={ styles.flex }>{ addonRight }</View>\n\t\t</View>\n\t);\n};\n\nexport default SegmentedControls;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/mobile/segmented-control/index.native.js"],"names":["ANIMATION_DURATION","isIOS","Platform","OS","Segment","isSelected","title","onPress","onLayout","props","isSelectedIOS","segmentStyle","styles","segment","segmentIOS","textStyle","buttonTextDefault","buttonTextDefaultDark","selectedTextStyle","buttonTextSelected","buttonTextSelectedDark","shadowStyle","shadowIOS","SegmentedControls","segments","segmentHandler","selectedIndex","addonLeft","addonRight","selectedSegmentIndex","activeSegmentIndex","setActiveSegmentIndex","segmentsDimensions","setSegmentsDimensions","width","height","positionAnimationValue","Animated","Value","setValue","calculateEndValue","containerStyle","container","containerDark","performSwatchAnimation","index","timing","toValue","duration","easing","Easing","ease","useNativeDriver","start","paddingLeft","offset","containerIOS","widths","Object","values","map","dimension","widthsDistance","slice","widthsDistanceSum","reduce","sum","n","endValue","onHandlePress","segmentOnLayout","event","nativeEvent","layout","selectedStyle","selected","selectedDark","outlineStyle","outline","outlineIOS","row","flex","length","left"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport {\n\tView,\n\tTouchableWithoutFeedback,\n\tText,\n\tPlatform,\n\tAnimated,\n\tEasing,\n} from 'react-native';\n/\n WordPress dependencies\n /\nimport { useState, useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/\n Internal dependencies\n */\nimport { performLayoutAnimation } from '../layout-animation';\nimport styles from './style.scss';\n\nconst ANIMATION_DURATION = 200;\n\nconst isIOS = Platform.OS === 'ios';\n\nconst Segment = ( { isSelected, title, onPress, onLayout, ...props } ) => {\n\tconst isSelectedIOS = isIOS && isSelected;\n\n\tconst segmentStyle = [ styles.segment, isIOS && styles.segmentIOS ];\n\n\tconst textStyle = usePreferredColorSchemeStyle(\n\t\tstyles.buttonTextDefault,\n\t\tstyles.buttonTextDefaultDark\n\t);\n\tconst selectedTextStyle = usePreferredColorSchemeStyle(\n\t\tstyles.buttonTextSelected,\n\t\tstyles.buttonTextSelectedDark\n\t);\n\tconst shadowStyle = usePreferredColorSchemeStyle( styles.shadowIOS, {} );\n\n\treturn (\n\t\t<View style={ isSelectedIOS && shadowStyle }>\n\t\t\t<TouchableWithoutFeedback onPress={ onPress }>\n\t\t\t\t<View style={ segmentStyle } onLayout={ onLayout } { ...props }>\n\t\t\t\t\t<Text\n\t\t\t\t\t\tstyle={ [ textStyle, isSelected && selectedTextStyle ] }\n\t\t\t\t\t\tmaxFontSizeMultiplier={ 2 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ title }\n\t\t\t\t\t</Text>\n\t\t\t\t</View>\n\t\t\t</TouchableWithoutFeedback>\n\t\t</View>\n\t);\n};\n\nconst SegmentedControls = ( {\n\tsegments,\n\tsegmentHandler,\n\tselectedIndex,\n\taddonLeft,\n\taddonRight,\n} ) => {\n\tconst selectedSegmentIndex = selectedIndex \|\| 0;\n\tconst [ activeSegmentIndex, setActiveSegmentIndex ] =\n\t\tuseState( selectedSegmentIndex );\n\tconst [ segmentsDimensions, setSegmentsDimensions ] = useState( {\n\t\t[ activeSegmentIndex ]: { width: 0, height: 0 },\n\t} );\n\tconst [ positionAnimationValue ] = useState( new Animated.Value( 0 ) );\n\n\tuseEffect( () => {\n\t\tsetActiveSegmentIndex( selectedSegmentIndex );\n\t\tsegmentHandler( segments[ selectedSegmentIndex ] );\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tpositionAnimationValue.setValue(\n\t\t\tcalculateEndValue( activeSegmentIndex )\n\t\t);\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ segmentsDimensions ] );\n\n\tconst containerStyle = usePreferredColorSchemeStyle(\n\t\tstyles.container,\n\t\tstyles.containerDark\n\t);\n\n\tfunction performSwatchAnimation( index ) {\n\t\tAnimated.timing( positionAnimationValue, {\n\t\t\ttoValue: calculateEndValue( index ),\n\t\t\tduration: ANIMATION_DURATION,\n\t\t\teasing: Easing.ease,\n\t\t\tuseNativeDriver: false,\n\t\t} ).start();\n\t}\n\n\tfunction calculateEndValue( index ) {\n\t\tconst { paddingLeft: offset } = isIOS\n\t\t\t? styles.containerIOS\n\t\t\t: styles.container;\n\t\tconst widths = Object.values( segmentsDimensions ).map(\n\t\t\t( dimension ) => dimension.width\n\t\t);\n\t\tconst widthsDistance = widths.slice( 0, index );\n\t\tconst widthsDistanceSum = widthsDistance.reduce(\n\t\t\t( sum, n ) => sum + n,\n\t\t\t0\n\t\t);\n\n\t\tconst endValue = index === 0 ? 0 : widthsDistanceSum;\n\t\treturn endValue + offset;\n\t}\n\n\tfunction onHandlePress( segment, index ) {\n\t\tperformLayoutAnimation( ANIMATION_DURATION );\n\t\tsetActiveSegmentIndex( index );\n\t\tsegmentHandler( segment );\n\t\tperformSwatchAnimation( index );\n\t}\n\n\tfunction segmentOnLayout( event, index ) {\n\t\tconst { width, height } = event.nativeEvent.layout;\n\n\t\tsetSegmentsDimensions( {\n\t\t\t...segmentsDimensions,\n\t\t\t[ index ]: { width, height },\n\t\t} );\n\t}\n\n\tconst selectedStyle = usePreferredColorSchemeStyle(\n\t\tstyles.selected,\n\t\tstyles.selectedDark\n\t);\n\n\tconst width = segmentsDimensions[ activeSegmentIndex ]?.width;\n\tconst height = segmentsDimensions[ activeSegmentIndex ]?.height;\n\n\tconst outlineStyle = [ styles.outline, isIOS && styles.outlineIOS ];\n\n\treturn (\n\t\t<View style={ styles.row }>\n\t\t\t<View style={ styles.flex }>{ addonLeft }</View>\n\t\t\t<View style={ [ containerStyle, isIOS && styles.containerIOS ] }>\n\t\t\t\t{ segments.map( ( segment, index ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Segment\n\t\t\t\t\t\t\ttitle={ segment }\n\t\t\t\t\t\t\tonPress={ () => onHandlePress( segment, index ) }\n\t\t\t\t\t\t\tisSelected={ activeSegmentIndex === index }\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tonLayout={ ( event ) =>\n\t\t\t\t\t\t\t\tsegmentOnLayout( event, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\tselected: activeSegmentIndex === index,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\taccessibilityLabel={ segment }\n\t\t\t\t\t\t\taccessibilityHint={ `${ index + 1 } on ${\n\t\t\t\t\t\t\t\tsegments.length\n\t\t\t\t\t\t\t}` }\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t<Animated.View\n\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\tleft: positionAnimationValue,\n\t\t\t\t\t\t\theight,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tselectedStyle,\n\t\t\t\t\t\toutlineStyle,\n\t\t\t\t\t] }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t\t<View style={ styles.flex }>{ addonRight }</View>\n\t\t</View>\n\t);\n};\n\nexport default SegmentedControls;\n"]}

package/build/modal/index.js CHANGED Viewed

@@ -9,8 +9,6 @@ exports.default = exports.Modal = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _compose = require("@wordpress/compose");
@@ -164,7 +162,7 @@ function UnforwardedModal(props, forwardedRef) {
     onKeyDown: handleEscapeKeyDown
   }, (0, _element.createElement)(_styleProvider.default, {
     document: document
-  }, (0, _element.createElement)("div", (0, _extends2.default)({
+  }, (0, _element.createElement)("div", {
     className: (0, _classnames.default)('components-modal__frame', className, {
       'is-full-screen': isFullScreen
     }),
@@ -174,10 +172,10 @@ function UnforwardedModal(props, forwardedRef) {
     "aria-label": contentLabel,
     "aria-labelledby": contentLabel ? undefined : headingId,
     "aria-describedby": aria.describedby,
-    tabIndex: -1
-  }, shouldCloseOnClickOutside ? focusOutsideProps : {}, {
+    tabIndex: -1,
+    ...(shouldCloseOnClickOutside ? focusOutsideProps : {}),
     onKeyDown: onKeyDown
-  }), (0, _element.createElement)("div", {
+  }, (0, _element.createElement)("div", {
     className: (0, _classnames.default)('components-modal__content', {
       'hide-header': __experimentalHideHeader,
       'is-scrollable': hasScrollableContent,

package/build/modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/modal/index.tsx"],"names":["openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","focusOutsideProps","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","hasScrollableContent","setHasScrollableContent","isContentScrollable","current","closestScrollContainer","ariaHelper","hideApp","document","body","classList","add","remove","showApp","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","scrollY","currentTarget","scrollTop","close"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/\n WordPress dependencies\n /\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/\n Internal dependencies\n /\nimport as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. /\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver \|\| ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.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\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel \|\| __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\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</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<div ref={ childrenContainerRef }>{ children }</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/\n Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n \n ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyModal = () => {\n * const [ isOpen, setOpen ] = useState( false );\n * const openModal = () => setOpen( true );\n * const closeModal = () => setOpen( false );\n \n return (\n * <>\n * <Button variant=\"secondary\" onClick={ openModal }>\n * Open Modal\n * </Button>\n * { isOpen && (\n * <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n * <Button variant=\"secondary\" onClick={ closeModal }>\n * My custom close button\n * </Button>\n * </Modal>\n * ) }\n * </>\n * );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/modal/index.tsx"],"names":["openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","focusOutsideProps","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","hasScrollableContent","setHasScrollableContent","isContentScrollable","current","closestScrollContainer","ariaHelper","hideApp","document","body","classList","add","remove","showApp","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","scrollY","currentTarget","scrollTop","close"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/\n WordPress dependencies\n /\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/\n Internal dependencies\n /\nimport as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. /\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver \|\| ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.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\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel \|\| __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\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</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<div ref={ childrenContainerRef }>{ children }</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/\n Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n \n ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyModal = () => {\n * const [ isOpen, setOpen ] = useState( false );\n * const openModal = () => setOpen( true );\n * const closeModal = () => setOpen( false );\n \n return (\n * <>\n * <Button variant=\"secondary\" onClick={ openModal }>\n * Open Modal\n * </Button>\n * { isOpen && (\n * <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n * <Button variant=\"secondary\" onClick={ closeModal }>\n * My custom close button\n * </Button>\n * </Modal>\n * ) }\n * </>\n * );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"]}

package/build/navigable-container/container.js CHANGED Viewed

@@ -1,7 +1,5 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _dom = require("@wordpress/dom");
 /**
@@ -182,17 +178,18 @@ class NavigableContainer extends _element.Component {
       forwardedRef,
       ...restProps
     } = this.props;
-    return (0, _element.createElement)("div", (0, _extends2.default)({
-      ref: this.bindContainer
-    }, restProps), children);
+    return (0, _element.createElement)("div", {
+      ref: this.bindContainer,
+      ...restProps
+    }, children);
   }
 }
 const forwardedNavigableContainer = (props, ref) => {
-  return (0, _element.createElement)(NavigableContainer, (0, _extends2.default)({}, props, {
+  return (0, _element.createElement)(NavigableContainer, { ...props,
     forwardedRef: ref
-  }));
+  });
 };
 forwardedNavigableContainer.displayName = 'NavigableContainer';

package/build/navigable-container/container.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigable-container/container.tsx"],"names":["noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","Component","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","focus","tabbable","focusable","focusables","find","index","indexOf","event","cycle","eventToOffset","onNavigate","stopNavigationEvents","undefined","stopImmediatePropagation","targetRole","getAttribute","targetHasMenuItemRole","includes","preventDefault","activeElement","ownerDocument","context","nextIndex","length","code","render","children","restProps","forwardedNavigableContainer","displayName"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { Component, forwardRef } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/\n Internal dependencies\n */\nimport type { NavigableContainerProps } from './types';\n\nconst noop = () => {};\nconst MENU_ITEM_ROLES = [ 'menuitem', 'menuitemradio', 'menuitemcheckbox' ];\n\nfunction cycleValue( value: number, total: number, offset: number ) {\n\tconst nextValue = value + offset;\n\tif ( nextValue < 0 ) {\n\t\treturn total + nextValue;\n\t} else if ( nextValue >= total ) {\n\t\treturn nextValue - total;\n\t}\n\n\treturn nextValue;\n}\n\nclass NavigableContainer extends Component< NavigableContainerProps > {\n\tcontainer?: HTMLDivElement;\n\n\tconstructor( args: NavigableContainerProps ) {\n\t\tsuper( args );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.bindContainer = this.bindContainer.bind( this );\n\n\t\tthis.getFocusableContext = this.getFocusableContext.bind( this );\n\t\tthis.getFocusableIndex = this.getFocusableIndex.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We use DOM event listeners instead of React event listeners\n\t\t// because we want to catch events from the underlying DOM tree\n\t\t// The React Tree can be different from the DOM tree when using\n\t\t// portals. Block Toolbars for instance are rendered in a separate\n\t\t// React Trees.\n\t\tthis.container.addEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.container.removeEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tbindContainer( ref: HTMLDivElement ) {\n\t\tconst { forwardedRef } = this.props;\n\t\tthis.container = ref;\n\n\t\tif ( typeof forwardedRef === 'function' ) {\n\t\t\tforwardedRef( ref );\n\t\t} else if ( forwardedRef && 'current' in forwardedRef ) {\n\t\t\tforwardedRef.current = ref;\n\t\t}\n\t}\n\n\tgetFocusableContext( target: Element ) {\n\t\tif ( ! this.container ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst { onlyBrowserTabstops } = this.props;\n\t\tconst finder = onlyBrowserTabstops ? focus.tabbable : focus.focusable;\n\t\tconst focusables = finder.find( this.container ) as HTMLElement[];\n\n\t\tconst index = this.getFocusableIndex( focusables, target );\n\t\tif ( index > -1 && target ) {\n\t\t\treturn { index, target, focusables };\n\t\t}\n\t\treturn null;\n\t}\n\n\tgetFocusableIndex( focusables: Element[], target: Element ) {\n\t\treturn focusables.indexOf( target );\n\t}\n\n\tonKeyDown( event: KeyboardEvent ) {\n\t\tif ( this.props.onKeyDown ) {\n\t\t\tthis.props.onKeyDown( event );\n\t\t}\n\n\t\tconst { getFocusableContext } = this;\n\t\tconst {\n\t\t\tcycle = true,\n\t\t\teventToOffset,\n\t\t\tonNavigate = noop,\n\t\t\tstopNavigationEvents,\n\t\t} = this.props;\n\n\t\tconst offset = eventToOffset( event );\n\n\t\t// eventToOffset returns undefined if the event is not handled by the component.\n\t\tif ( offset !== undefined && stopNavigationEvents ) {\n\t\t\t// Prevents arrow key handlers bound to the document directly interfering.\n\t\t\tevent.stopImmediatePropagation();\n\n\t\t\t// When navigating a collection of items, prevent scroll containers\n\t\t\t// from scrolling. The preventDefault also prevents Voiceover from\n\t\t\t// 'handling' the event, as voiceover will try to use arrow keys\n\t\t\t// for highlighting text.\n\t\t\tconst targetRole = (\n\t\t\t\tevent.target as HTMLDivElement \| null\n\t\t\t )?.getAttribute( 'role' );\n\t\t\tconst targetHasMenuItemRole =\n\t\t\t\t!! targetRole && MENU_ITEM_ROLES.includes( targetRole );\n\n\t\t\tif ( targetHasMenuItemRole ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tif ( ! offset ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeElement = ( event.target as HTMLElement \| null )\n\t\t\t?.ownerDocument?.activeElement;\n\t\tif ( ! activeElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst context = getFocusableContext( activeElement );\n\t\tif ( ! context ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { index, focusables } = context;\n\t\tconst nextIndex = cycle\n\t\t\t? cycleValue( index, focusables.length, offset )\n\t\t\t: index + offset;\n\n\t\tif ( nextIndex >= 0 && nextIndex < focusables.length ) {\n\t\t\tfocusables[ nextIndex ].focus();\n\t\t\tonNavigate( nextIndex, focusables[ nextIndex ] );\n\n\t\t\t// `preventDefault()` on tab to avoid having the browser move the focus\n\t\t\t// after this component has already moved it.\n\t\t\tif ( event.code === 'Tab' ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tstopNavigationEvents,\n\t\t\teventToOffset,\n\t\t\tonNavigate,\n\t\t\tonKeyDown,\n\t\t\tcycle,\n\t\t\tonlyBrowserTabstops,\n\t\t\tforwardedRef,\n\t\t\t...restProps\n\t\t} = this.props;\n\t\treturn (\n\t\t\t<div ref={ this.bindContainer } { ...restProps }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nconst forwardedNavigableContainer = (\n\tprops: NavigableContainerProps,\n\tref: ForwardedRef< HTMLDivElement >\n) => {\n\treturn <NavigableContainer { ...props } forwardedRef={ ref } />;\n};\nforwardedNavigableContainer.displayName = 'NavigableContainer';\n\nexport default forwardRef( forwardedNavigableContainer );\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigable-container/container.tsx"],"names":["noop","MENU_ITEM_ROLES","cycleValue","value","total","offset","nextValue","NavigableContainer","Component","constructor","args","onKeyDown","bind","bindContainer","getFocusableContext","getFocusableIndex","componentDidMount","container","addEventListener","componentWillUnmount","removeEventListener","ref","forwardedRef","props","current","target","onlyBrowserTabstops","finder","focus","tabbable","focusable","focusables","find","index","indexOf","event","cycle","eventToOffset","onNavigate","stopNavigationEvents","undefined","stopImmediatePropagation","targetRole","getAttribute","targetHasMenuItemRole","includes","preventDefault","activeElement","ownerDocument","context","nextIndex","length","code","render","children","restProps","forwardedNavigableContainer","displayName"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { Component, forwardRef } from '@wordpress/element';\nimport { focus } from '@wordpress/dom';\n\n/\n Internal dependencies\n */\nimport type { NavigableContainerProps } from './types';\n\nconst noop = () => {};\nconst MENU_ITEM_ROLES = [ 'menuitem', 'menuitemradio', 'menuitemcheckbox' ];\n\nfunction cycleValue( value: number, total: number, offset: number ) {\n\tconst nextValue = value + offset;\n\tif ( nextValue < 0 ) {\n\t\treturn total + nextValue;\n\t} else if ( nextValue >= total ) {\n\t\treturn nextValue - total;\n\t}\n\n\treturn nextValue;\n}\n\nclass NavigableContainer extends Component< NavigableContainerProps > {\n\tcontainer?: HTMLDivElement;\n\n\tconstructor( args: NavigableContainerProps ) {\n\t\tsuper( args );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.bindContainer = this.bindContainer.bind( this );\n\n\t\tthis.getFocusableContext = this.getFocusableContext.bind( this );\n\t\tthis.getFocusableIndex = this.getFocusableIndex.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We use DOM event listeners instead of React event listeners\n\t\t// because we want to catch events from the underlying DOM tree\n\t\t// The React Tree can be different from the DOM tree when using\n\t\t// portals. Block Toolbars for instance are rendered in a separate\n\t\t// React Trees.\n\t\tthis.container.addEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tif ( ! this.container ) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.container.removeEventListener( 'keydown', this.onKeyDown );\n\t}\n\n\tbindContainer( ref: HTMLDivElement ) {\n\t\tconst { forwardedRef } = this.props;\n\t\tthis.container = ref;\n\n\t\tif ( typeof forwardedRef === 'function' ) {\n\t\t\tforwardedRef( ref );\n\t\t} else if ( forwardedRef && 'current' in forwardedRef ) {\n\t\t\tforwardedRef.current = ref;\n\t\t}\n\t}\n\n\tgetFocusableContext( target: Element ) {\n\t\tif ( ! this.container ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst { onlyBrowserTabstops } = this.props;\n\t\tconst finder = onlyBrowserTabstops ? focus.tabbable : focus.focusable;\n\t\tconst focusables = finder.find( this.container ) as HTMLElement[];\n\n\t\tconst index = this.getFocusableIndex( focusables, target );\n\t\tif ( index > -1 && target ) {\n\t\t\treturn { index, target, focusables };\n\t\t}\n\t\treturn null;\n\t}\n\n\tgetFocusableIndex( focusables: Element[], target: Element ) {\n\t\treturn focusables.indexOf( target );\n\t}\n\n\tonKeyDown( event: KeyboardEvent ) {\n\t\tif ( this.props.onKeyDown ) {\n\t\t\tthis.props.onKeyDown( event );\n\t\t}\n\n\t\tconst { getFocusableContext } = this;\n\t\tconst {\n\t\t\tcycle = true,\n\t\t\teventToOffset,\n\t\t\tonNavigate = noop,\n\t\t\tstopNavigationEvents,\n\t\t} = this.props;\n\n\t\tconst offset = eventToOffset( event );\n\n\t\t// eventToOffset returns undefined if the event is not handled by the component.\n\t\tif ( offset !== undefined && stopNavigationEvents ) {\n\t\t\t// Prevents arrow key handlers bound to the document directly interfering.\n\t\t\tevent.stopImmediatePropagation();\n\n\t\t\t// When navigating a collection of items, prevent scroll containers\n\t\t\t// from scrolling. The preventDefault also prevents Voiceover from\n\t\t\t// 'handling' the event, as voiceover will try to use arrow keys\n\t\t\t// for highlighting text.\n\t\t\tconst targetRole = (\n\t\t\t\tevent.target as HTMLDivElement \| null\n\t\t\t )?.getAttribute( 'role' );\n\t\t\tconst targetHasMenuItemRole =\n\t\t\t\t!! targetRole && MENU_ITEM_ROLES.includes( targetRole );\n\n\t\t\tif ( targetHasMenuItemRole ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\n\t\tif ( ! offset ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst activeElement = ( event.target as HTMLElement \| null )\n\t\t\t?.ownerDocument?.activeElement;\n\t\tif ( ! activeElement ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst context = getFocusableContext( activeElement );\n\t\tif ( ! context ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { index, focusables } = context;\n\t\tconst nextIndex = cycle\n\t\t\t? cycleValue( index, focusables.length, offset )\n\t\t\t: index + offset;\n\n\t\tif ( nextIndex >= 0 && nextIndex < focusables.length ) {\n\t\t\tfocusables[ nextIndex ].focus();\n\t\t\tonNavigate( nextIndex, focusables[ nextIndex ] );\n\n\t\t\t// `preventDefault()` on tab to avoid having the browser move the focus\n\t\t\t// after this component has already moved it.\n\t\t\tif ( event.code === 'Tab' ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tchildren,\n\t\t\tstopNavigationEvents,\n\t\t\teventToOffset,\n\t\t\tonNavigate,\n\t\t\tonKeyDown,\n\t\t\tcycle,\n\t\t\tonlyBrowserTabstops,\n\t\t\tforwardedRef,\n\t\t\t...restProps\n\t\t} = this.props;\n\t\treturn (\n\t\t\t<div ref={ this.bindContainer } { ...restProps }>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nconst forwardedNavigableContainer = (\n\tprops: NavigableContainerProps,\n\tref: ForwardedRef< HTMLDivElement >\n) => {\n\treturn <NavigableContainer { ...props } forwardedRef={ ref } />;\n};\nforwardedNavigableContainer.displayName = 'NavigableContainer';\n\nexport default forwardRef( forwardedNavigableContainer );\n"]}

package/build/navigable-container/menu.js CHANGED Viewed

@@ -11,8 +11,6 @@ exports.default = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _container = _interopRequireDefault(require("./container"));
 /**
@@ -62,14 +60,15 @@ function UnforwardedNavigableMenu({
     return undefined;
   };
-  return (0, _element.createElement)(_container.default, (0, _extends2.default)({
+  return (0, _element.createElement)(_container.default, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: false,
     role: role,
     "aria-orientation": role !== 'presentation' && (orientation === 'vertical' || orientation === 'horizontal') ? orientation : undefined,
-    eventToOffset: eventToOffset
-  }, rest));
+    eventToOffset: eventToOffset,
+    ...rest
+  });
 }
 /**
  * A container for a navigable menu.

package/build/navigable-container/menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigable-container/menu.tsx"],"names":["UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","NavigableMenu"],"mappings":";;;;;;;;;;;AAQA~~;;;;~~AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAIO,SAASA,wBAAT,CACN;AAAEC,EAAAA,IAAI,GAAG,MAAT;AAAiBC,EAAAA,WAAW,GAAG,UAA/B;AAA2C,KAAGC;AAA9C,CADM,EAENC,GAFM,EAGL;AACD,QAAMC,aAAa,GAAKC,GAAF,IAA0B;AAC/C,UAAM;AAAEC,MAAAA;AAAF,QAAWD,GAAjB;AAEA,QAAIE,IAAI,GAAG,CAAE,WAAF,CAAX;AACA,QAAIC,QAAQ,GAAG,CAAE,SAAF,CAAf;;AAEA,QAAKP,WAAW,KAAK,YAArB,EAAoC;AACnCM,MAAAA,IAAI,GAAG,CAAE,YAAF,CAAP;AACAC,MAAAA,QAAQ,GAAG,CAAE,WAAF,CAAX;AACA;;AAED,QAAKP,WAAW,KAAK,MAArB,EAA8B;AAC7BM,MAAAA,IAAI,GAAG,CAAE,YAAF,EAAgB,WAAhB,CAAP;AACAC,MAAAA,QAAQ,GAAG,CAAE,WAAF,EAAe,SAAf,CAAX;AACA;;AAED,QAAKD,IAAI,CAACE,QAAL,CAAeH,IAAf,CAAL,EAA6B;AAC5B,aAAO,CAAP;AACA,KAFD,MAEO,IAAKE,QAAQ,CAACC,QAAT,CAAmBH,IAAnB,CAAL,EAAiC;AACvC,aAAO,CAAC,CAAR;AACA,KAFM,MAEA,IACN,CAAE,WAAF,EAAe,SAAf,EAA0B,WAA1B,EAAuC,YAAvC,EAAsDG,QAAtD,CACCH,IADD,CADM,EAIL;AACD;AACA;AACA;AACA,aAAO,CAAP;AACA;;AAED,WAAOI,SAAP;AACA,GAhCD;;AAkCA,SACC,4BAAC,kBAAD;AACC,IAAA,GAAG,EAAGP,GADP;AAEC,IAAA,oBAAoB,MAFrB;AAGC,IAAA,mBAAmB,EAAG,KAHvB;AAIC,IAAA,IAAI,EAAGH,IAJR;AAKC,wBACCA,IAAI,KAAK,cAAT,KACEC,WAAW,KAAK,UAAhB,IAA8BA,WAAW,KAAK,YADhD,IAEGA,WAFH,GAGGS,SATL;AAWC,IAAA,aAAa,EAAGN;~~AAXjB~~,~~KAYMF~~,~~IAZN,EADD~~;AAgBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMS,aAAa,GAAG,yBAAYZ,wBAAZ,CAAtB;;eAEQY,a","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport NavigableContainer from './container';\nimport type { NavigableMenuProps } from './types';\n\nexport function UnforwardedNavigableMenu(\n\t{ role = 'menu', orientation = 'vertical', ...rest }: NavigableMenuProps,\n\tref: ForwardedRef< any >\n) {\n\tconst eventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code } = evt;\n\n\t\tlet next = [ 'ArrowDown' ];\n\t\tlet previous = [ 'ArrowUp' ];\n\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\tnext = [ 'ArrowRight' ];\n\t\t\tprevious = [ 'ArrowLeft' ];\n\t\t}\n\n\t\tif ( orientation === 'both' ) {\n\t\t\tnext = [ 'ArrowRight', 'ArrowDown' ];\n\t\t\tprevious = [ 'ArrowLeft', 'ArrowUp' ];\n\t\t}\n\n\t\tif ( next.includes( code ) ) {\n\t\t\treturn 1;\n\t\t} else if ( previous.includes( code ) ) {\n\t\t\treturn -1;\n\t\t} else if (\n\t\t\t[ 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight' ].includes(\n\t\t\t\tcode\n\t\t\t)\n\t\t) {\n\t\t\t// Key press should be handled, e.g. have event propagation and\n\t\t\t// default behavior handled by NavigableContainer but not result\n\t\t\t// in an offset.\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops={ false }\n\t\t\trole={ role }\n\t\t\taria-orientation={\n\t\t\t\trole !== 'presentation' &&\n\t\t\t\t( orientation === 'vertical' \|\| orientation === 'horizontal' )\n\t\t\t\t\t? orientation\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\teventToOffset={ eventToOffset }\n\t\t\t{ ...rest }\n\t\t/>\n\t);\n}\n\n/\n A container for a navigable menu.\n \n ```jsx\n * import {\n * NavigableMenu,\n * Button,\n * } from '@wordpress/components';\n \n function onNavigate( index, target ) {\n * console.log( `Navigates to ${ index }`, target );\n * }\n \n const MyNavigableContainer = () => (\n * <div>\n * <span>Navigable Menu:</span>\n * <NavigableMenu onNavigate={ onNavigate } orientation=\"horizontal\">\n * <Button variant=\"secondary\">Item 1</Button>\n * <Button variant=\"secondary\">Item 2</Button>\n * <Button variant=\"secondary\">Item 3</Button>\n * </NavigableMenu>\n * </div>\n * );\n * ```\n */\nexport const NavigableMenu = forwardRef( UnforwardedNavigableMenu );\n\nexport default NavigableMenu;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigable-container/menu.tsx"],"names":["UnforwardedNavigableMenu","role","orientation","rest","ref","eventToOffset","evt","code","next","previous","includes","undefined","NavigableMenu"],"mappings":";;;;;;;;;;;AAQA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAIO,SAASA,wBAAT,CACN;AAAEC,EAAAA,IAAI,GAAG,MAAT;AAAiBC,EAAAA,WAAW,GAAG,UAA/B;AAA2C,KAAGC;AAA9C,CADM,EAENC,GAFM,EAGL;AACD,QAAMC,aAAa,GAAKC,GAAF,IAA0B;AAC/C,UAAM;AAAEC,MAAAA;AAAF,QAAWD,GAAjB;AAEA,QAAIE,IAAI,GAAG,CAAE,WAAF,CAAX;AACA,QAAIC,QAAQ,GAAG,CAAE,SAAF,CAAf;;AAEA,QAAKP,WAAW,KAAK,YAArB,EAAoC;AACnCM,MAAAA,IAAI,GAAG,CAAE,YAAF,CAAP;AACAC,MAAAA,QAAQ,GAAG,CAAE,WAAF,CAAX;AACA;;AAED,QAAKP,WAAW,KAAK,MAArB,EAA8B;AAC7BM,MAAAA,IAAI,GAAG,CAAE,YAAF,EAAgB,WAAhB,CAAP;AACAC,MAAAA,QAAQ,GAAG,CAAE,WAAF,EAAe,SAAf,CAAX;AACA;;AAED,QAAKD,IAAI,CAACE,QAAL,CAAeH,IAAf,CAAL,EAA6B;AAC5B,aAAO,CAAP;AACA,KAFD,MAEO,IAAKE,QAAQ,CAACC,QAAT,CAAmBH,IAAnB,CAAL,EAAiC;AACvC,aAAO,CAAC,CAAR;AACA,KAFM,MAEA,IACN,CAAE,WAAF,EAAe,SAAf,EAA0B,WAA1B,EAAuC,YAAvC,EAAsDG,QAAtD,CACCH,IADD,CADM,EAIL;AACD;AACA;AACA;AACA,aAAO,CAAP;AACA;;AAED,WAAOI,SAAP;AACA,GAhCD;;AAkCA,SACC,4BAAC,kBAAD;AACC,IAAA,GAAG,EAAGP,GADP;AAEC,IAAA,oBAAoB,MAFrB;AAGC,IAAA,mBAAmB,EAAG,KAHvB;AAIC,IAAA,IAAI,EAAGH,IAJR;AAKC,wBACCA,IAAI,KAAK,cAAT,KACEC,WAAW,KAAK,UAAhB,IAA8BA,WAAW,KAAK,YADhD,IAEGA,WAFH,GAGGS,SATL;AAWC,IAAA,aAAa,EAAGN,aAXjB;AAAA,OAYMF;AAZN,IADD;AAgBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMS,aAAa,GAAG,yBAAYZ,wBAAZ,CAAtB;;eAEQY,a","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport NavigableContainer from './container';\nimport type { NavigableMenuProps } from './types';\n\nexport function UnforwardedNavigableMenu(\n\t{ role = 'menu', orientation = 'vertical', ...rest }: NavigableMenuProps,\n\tref: ForwardedRef< any >\n) {\n\tconst eventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code } = evt;\n\n\t\tlet next = [ 'ArrowDown' ];\n\t\tlet previous = [ 'ArrowUp' ];\n\n\t\tif ( orientation === 'horizontal' ) {\n\t\t\tnext = [ 'ArrowRight' ];\n\t\t\tprevious = [ 'ArrowLeft' ];\n\t\t}\n\n\t\tif ( orientation === 'both' ) {\n\t\t\tnext = [ 'ArrowRight', 'ArrowDown' ];\n\t\t\tprevious = [ 'ArrowLeft', 'ArrowUp' ];\n\t\t}\n\n\t\tif ( next.includes( code ) ) {\n\t\t\treturn 1;\n\t\t} else if ( previous.includes( code ) ) {\n\t\t\treturn -1;\n\t\t} else if (\n\t\t\t[ 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight' ].includes(\n\t\t\t\tcode\n\t\t\t)\n\t\t) {\n\t\t\t// Key press should be handled, e.g. have event propagation and\n\t\t\t// default behavior handled by NavigableContainer but not result\n\t\t\t// in an offset.\n\t\t\treturn 0;\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops={ false }\n\t\t\trole={ role }\n\t\t\taria-orientation={\n\t\t\t\trole !== 'presentation' &&\n\t\t\t\t( orientation === 'vertical' \|\| orientation === 'horizontal' )\n\t\t\t\t\t? orientation\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\teventToOffset={ eventToOffset }\n\t\t\t{ ...rest }\n\t\t/>\n\t);\n}\n\n/\n A container for a navigable menu.\n \n ```jsx\n * import {\n * NavigableMenu,\n * Button,\n * } from '@wordpress/components';\n \n function onNavigate( index, target ) {\n * console.log( `Navigates to ${ index }`, target );\n * }\n \n const MyNavigableContainer = () => (\n * <div>\n * <span>Navigable Menu:</span>\n * <NavigableMenu onNavigate={ onNavigate } orientation=\"horizontal\">\n * <Button variant=\"secondary\">Item 1</Button>\n * <Button variant=\"secondary\">Item 2</Button>\n * <Button variant=\"secondary\">Item 3</Button>\n * </NavigableMenu>\n * </div>\n * );\n * ```\n */\nexport const NavigableMenu = forwardRef( UnforwardedNavigableMenu );\n\nexport default NavigableMenu;\n"]}

package/build/navigable-container/tabbable.js CHANGED Viewed

@@ -11,8 +11,6 @@ exports.default = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _container = _interopRequireDefault(require("./container"));
 /**
@@ -58,12 +56,13 @@ function UnforwardedTabbableContainer({
     return undefined;
   };
-  return (0, _element.createElement)(_container.default, (0, _extends2.default)({
+  return (0, _element.createElement)(_container.default, {
     ref: ref,
     stopNavigationEvents: true,
     onlyBrowserTabstops: true,
-    eventToOffset: innerEventToOffset
-  }, props));
+    eventToOffset: innerEventToOffset,
+    ...props
+  });
 }
 /**
  * A container for tabbable elements.

package/build/navigable-container/tabbable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigable-container/tabbable.tsx"],"names":["UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","TabbableContainer"],"mappings":";;;;;;;;;;;AAQA~~;;;;~~AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAIO,SAASA,4BAAT,CACN;AAAEC,EAAAA,aAAF;AAAiB,KAAGC;AAApB,CADM,EAENC,GAFM,EAGL;AACD,QAAMC,kBAAkB,GAAKC,GAAF,IAA0B;AACpD,UAAM;AAAEC,MAAAA,IAAF;AAAQC,MAAAA;AAAR,QAAqBF,GAA3B;;AACA,QAAK,UAAUC,IAAf,EAAsB;AACrB,aAAOC,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAAvB;AACA,KAJmD,CAMpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,QAAKN,aAAL,EAAqB;AACpB,aAAOA,aAAa,CAAEI,GAAF,CAApB;AACA;;AAED,WAAOG,SAAP;AACA,GAtBD;;AAwBA,SACC,4BAAC,kBAAD;AACC,IAAA,GAAG,EAAGL,GADP;AAEC,IAAA,oBAAoB,MAFrB;AAGC,IAAA,mBAAmB,MAHpB;AAIC,IAAA,aAAa,EAAGC;~~AAJjB~~,~~KAKMF~~,~~KALN,EADD~~;AASA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMO,iBAAiB,GAAG,yBAAYT,4BAAZ,CAA1B;;eAEQS,iB","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport NavigableContainer from './container';\nimport type { TabbableContainerProps } from './types';\n\nexport function UnforwardedTabbableContainer(\n\t{ eventToOffset, ...props }: TabbableContainerProps,\n\tref: ForwardedRef< any >\n) {\n\tconst innerEventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code, shiftKey } = evt;\n\t\tif ( 'Tab' === code ) {\n\t\t\treturn shiftKey ? -1 : 1;\n\t\t}\n\n\t\t// Allow custom handling of keys besides Tab.\n\t\t//\n\t\t// By default, TabbableContainer will move focus forward on Tab and\n\t\t// backward on Shift+Tab. The handler below will be used for all other\n\t\t// events. The semantics for `eventToOffset`'s return\n\t\t// values are the following:\n\t\t//\n\t\t// - +1: move focus forward\n\t\t// - -1: move focus backward\n\t\t// - 0: don't move focus, but acknowledge event and thus stop it\n\t\t// - undefined: do nothing, let the event propagate.\n\t\tif ( eventToOffset ) {\n\t\t\treturn eventToOffset( evt );\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops\n\t\t\teventToOffset={ innerEventToOffset }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\n/\n A container for tabbable elements.\n \n ```jsx\n * import {\n * TabbableContainer,\n * Button,\n * } from '@wordpress/components';\n \n function onNavigate( index, target ) {\n * console.log( `Navigates to ${ index }`, target );\n * }\n \n const MyTabbableContainer = () => (\n * <div>\n * <span>Tabbable Container:</span>\n * <TabbableContainer onNavigate={ onNavigate }>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 1\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 2\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 3\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 4\n * </Button>\n * </TabbableContainer>\n * </div>\n * );\n * ```\n */\nexport const TabbableContainer = forwardRef( UnforwardedTabbableContainer );\n\nexport default TabbableContainer;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigable-container/tabbable.tsx"],"names":["UnforwardedTabbableContainer","eventToOffset","props","ref","innerEventToOffset","evt","code","shiftKey","undefined","TabbableContainer"],"mappings":";;;;;;;;;;;AAQA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAIO,SAASA,4BAAT,CACN;AAAEC,EAAAA,aAAF;AAAiB,KAAGC;AAApB,CADM,EAENC,GAFM,EAGL;AACD,QAAMC,kBAAkB,GAAKC,GAAF,IAA0B;AACpD,UAAM;AAAEC,MAAAA,IAAF;AAAQC,MAAAA;AAAR,QAAqBF,GAA3B;;AACA,QAAK,UAAUC,IAAf,EAAsB;AACrB,aAAOC,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAAvB;AACA,KAJmD,CAMpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,QAAKN,aAAL,EAAqB;AACpB,aAAOA,aAAa,CAAEI,GAAF,CAApB;AACA;;AAED,WAAOG,SAAP;AACA,GAtBD;;AAwBA,SACC,4BAAC,kBAAD;AACC,IAAA,GAAG,EAAGL,GADP;AAEC,IAAA,oBAAoB,MAFrB;AAGC,IAAA,mBAAmB,MAHpB;AAIC,IAAA,aAAa,EAAGC,kBAJjB;AAAA,OAKMF;AALN,IADD;AASA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMO,iBAAiB,GAAG,yBAAYT,4BAAZ,CAA1B;;eAEQS,iB","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n WordPress dependencies\n /\nimport { forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport NavigableContainer from './container';\nimport type { TabbableContainerProps } from './types';\n\nexport function UnforwardedTabbableContainer(\n\t{ eventToOffset, ...props }: TabbableContainerProps,\n\tref: ForwardedRef< any >\n) {\n\tconst innerEventToOffset = ( evt: KeyboardEvent ) => {\n\t\tconst { code, shiftKey } = evt;\n\t\tif ( 'Tab' === code ) {\n\t\t\treturn shiftKey ? -1 : 1;\n\t\t}\n\n\t\t// Allow custom handling of keys besides Tab.\n\t\t//\n\t\t// By default, TabbableContainer will move focus forward on Tab and\n\t\t// backward on Shift+Tab. The handler below will be used for all other\n\t\t// events. The semantics for `eventToOffset`'s return\n\t\t// values are the following:\n\t\t//\n\t\t// - +1: move focus forward\n\t\t// - -1: move focus backward\n\t\t// - 0: don't move focus, but acknowledge event and thus stop it\n\t\t// - undefined: do nothing, let the event propagate.\n\t\tif ( eventToOffset ) {\n\t\t\treturn eventToOffset( evt );\n\t\t}\n\n\t\treturn undefined;\n\t};\n\n\treturn (\n\t\t<NavigableContainer\n\t\t\tref={ ref }\n\t\t\tstopNavigationEvents\n\t\t\tonlyBrowserTabstops\n\t\t\teventToOffset={ innerEventToOffset }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\n/\n A container for tabbable elements.\n \n ```jsx\n * import {\n * TabbableContainer,\n * Button,\n * } from '@wordpress/components';\n \n function onNavigate( index, target ) {\n * console.log( `Navigates to ${ index }`, target );\n * }\n \n const MyTabbableContainer = () => (\n * <div>\n * <span>Tabbable Container:</span>\n * <TabbableContainer onNavigate={ onNavigate }>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 1\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 2\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 3\n * </Button>\n * <Button variant=\"secondary\" tabIndex=\"0\">\n * Section 4\n * </Button>\n * </TabbableContainer>\n * </div>\n * );\n * ```\n */\nexport const TabbableContainer = forwardRef( UnforwardedTabbableContainer );\n\nexport default TabbableContainer;\n"]}

package/build/navigation/item/base.js CHANGED Viewed

@@ -9,8 +9,6 @@ exports.default = NavigationItemBase;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _context = require("../context");
@@ -52,8 +50,9 @@ function NavigationItemBase(props) {
   }
   const classes = (0, _classnames.default)('components-navigation__item', className);
-  return (0, _element.createElement)(_navigationStyles.ItemBaseUI, (0, _extends2.default)({
-    className: classes
-  }, restProps), children);
+  return (0, _element.createElement)(_navigationStyles.ItemBaseUI, {
+    className: classes,
+    ...restProps
+  }, children);
 }
 //# sourceMappingURL=base.js.map

package/build/navigation/item/base.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigation/item/base.tsx"],"names":["uniqueId","NavigationItemBase","props","children","className","title","href","restProps","itemId","navigationTree","getItem","_isVisible","classes"],"mappings":";;;;;;;;;AAQA~~;;;;~~AALA;;AAUA;;AACA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAOA,IAAIA,QAAQ,GAAG,CAAf;;AAEe,SAASC,kBAAT,CAA6BC,KAA7B,EAA8D;AAC5E;AACA,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,SAAZ;AAAuBC,IAAAA,KAAvB;AAA8BC,IAAAA,IAA9B;AAAoC,OAAGC;AAAvC,MAAqDL,KAA3D;AAEA,QAAM,CAAEM,MAAF,IAAa,uBAAW,QAAQ,EAAER,QAAU,EAA/B,CAAnB;AAEA,oDAAuBQ,MAAvB,EAA+BN,KAA/B;AACA,QAAM;AAAEO,IAAAA;AAAF,MAAqB,oCAA3B;;AAEA,MAAK,CAAEA,cAAc,CAACC,OAAf,CAAwBF,MAAxB,GAAkCG,UAAzC,EAAsD;AACrD,WAAO,IAAP;AACA;;AAED,QAAMC,OAAO,GAAG,yBAAY,6BAAZ,EAA2CR,SAA3C,CAAhB;AAEA,SACC,4BAAC,4BAAD;AAAY,IAAA,SAAS,EAAGQ;~~AAAxB~~,~~KAAuCL~~,~~SAAvC~~,~~GACGJ,~~QADH,CADD;AAKA","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useState } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport { useNavigationContext } from '../context';\nimport { useNavigationTreeItem } from './use-navigation-tree-item';\nimport { ItemBaseUI } from '../styles/navigation-styles';\n\nimport type { NavigationItemBaseProps } from '../types';\n\nlet uniqueId = 0;\n\nexport default function NavigationItemBase( props: NavigationItemBaseProps ) {\n\t// Also avoid to pass the `title` and `href` props to the ItemBaseUI styled component.\n\tconst { children, className, title, href, ...restProps } = props;\n\n\tconst [ itemId ] = useState( `item-${ ++uniqueId }` );\n\n\tuseNavigationTreeItem( itemId, props );\n\tconst { navigationTree } = useNavigationContext();\n\n\tif ( ! navigationTree.getItem( itemId )?._isVisible ) {\n\t\treturn null;\n\t}\n\n\tconst classes = classnames( 'components-navigation__item', className );\n\n\treturn (\n\t\t<ItemBaseUI className={ classes } { ...restProps }>\n\t\t\t{ children }\n\t\t</ItemBaseUI>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigation/item/base.tsx"],"names":["uniqueId","NavigationItemBase","props","children","className","title","href","restProps","itemId","navigationTree","getItem","_isVisible","classes"],"mappings":";;;;;;;;;AAQA;;AALA;;AAUA;;AACA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAOA,IAAIA,QAAQ,GAAG,CAAf;;AAEe,SAASC,kBAAT,CAA6BC,KAA7B,EAA8D;AAC5E;AACA,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,SAAZ;AAAuBC,IAAAA,KAAvB;AAA8BC,IAAAA,IAA9B;AAAoC,OAAGC;AAAvC,MAAqDL,KAA3D;AAEA,QAAM,CAAEM,MAAF,IAAa,uBAAW,QAAQ,EAAER,QAAU,EAA/B,CAAnB;AAEA,oDAAuBQ,MAAvB,EAA+BN,KAA/B;AACA,QAAM;AAAEO,IAAAA;AAAF,MAAqB,oCAA3B;;AAEA,MAAK,CAAEA,cAAc,CAACC,OAAf,CAAwBF,MAAxB,GAAkCG,UAAzC,EAAsD;AACrD,WAAO,IAAP;AACA;;AAED,QAAMC,OAAO,GAAG,yBAAY,6BAAZ,EAA2CR,SAA3C,CAAhB;AAEA,SACC,4BAAC,4BAAD;AAAY,IAAA,SAAS,EAAGQ,OAAxB;AAAA,OAAuCL;AAAvC,KACGJ,QADH,CADD;AAKA","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useState } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport { useNavigationContext } from '../context';\nimport { useNavigationTreeItem } from './use-navigation-tree-item';\nimport { ItemBaseUI } from '../styles/navigation-styles';\n\nimport type { NavigationItemBaseProps } from '../types';\n\nlet uniqueId = 0;\n\nexport default function NavigationItemBase( props: NavigationItemBaseProps ) {\n\t// Also avoid to pass the `title` and `href` props to the ItemBaseUI styled component.\n\tconst { children, className, title, href, ...restProps } = props;\n\n\tconst [ itemId ] = useState( `item-${ ++uniqueId }` );\n\n\tuseNavigationTreeItem( itemId, props );\n\tconst { navigationTree } = useNavigationContext();\n\n\tif ( ! navigationTree.getItem( itemId )?._isVisible ) {\n\t\treturn null;\n\t}\n\n\tconst classes = classnames( 'components-navigation__item', className );\n\n\treturn (\n\t\t<ItemBaseUI className={ classes } { ...restProps }>\n\t\t\t{ children }\n\t\t</ItemBaseUI>\n\t);\n}\n"]}

package/build/navigation/item/index.js CHANGED Viewed

@@ -10,8 +10,6 @@ exports.default = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _icons = require("@wordpress/icons");
@@ -94,9 +92,10 @@ function NavigationItem(props) {
     'aria-current': isActive ? 'page' : undefined,
     ...restProps
   };
-  return (0, _element.createElement)(_base.default, (0, _extends2.default)({}, baseProps, {
+  return (0, _element.createElement)(_base.default, { ...baseProps,
     className: classes
-  }), children || (0, _element.createElement)(_navigationStyles.ItemUI, itemProps, icon && (0, _element.createElement)(_navigationStyles.ItemIconUI, null, (0, _element.createElement)(_icons.Icon, {
+  }, children || (0, _element.createElement)(_navigationStyles.ItemUI, { ...itemProps
+  }, icon && (0, _element.createElement)(_navigationStyles.ItemIconUI, null, (0, _element.createElement)(_icons.Icon, {
     icon: icon
   })), (0, _element.createElement)(_baseContent.default, {
     title: title,

package/build/navigation/item/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigation/item/index.tsx"],"names":["noop","NavigationItem","props","badge","children","className","href","item","navigateToMenu","onClick","title","icon","hideIfTargetMenuEmpty","isText","restProps","activeItem","setActiveMenu","navigationTree","isMenuEmpty","isActive","classes","onItemClick","event","navigationIcon","chevronLeft","chevronRight","baseProps","undefined","itemProps","as","Button"],"mappings":"~~;;;;;;;;;;;;;;~~AAGA;;AAKA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAlBA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AASA,MAAMA,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEO,SAASC,cAAT,CAAyBC,KAAzB,EAAsD;AAC5D,QAAM;AACLC,IAAAA,KADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAILC,IAAAA,IAJK;AAKLC,IAAAA,IALK;AAMLC,IAAAA,cANK;AAOLC,IAAAA,OAAO,GAAGT,IAPL;AAQLU,IAAAA,KARK;AASLC,IAAAA,IATK;AAULC,IAAAA,qBAVK;AAWLC,IAAAA,MAXK;AAYL,OAAGC;AAZE,MAaFZ,KAbJ;AAeA,QAAM;AACLa,IAAAA,UADK;AAELC,IAAAA,aAFK;AAGLC,IAAAA,cAAc,EAAE;AAAEC,MAAAA;AAAF;AAHX,MAIF,oCAJJ,CAhB4D,CAsB5D;AACA;AACA;;AACA,MACCN,qBAAqB,IACrBJ,cADA,IAEAU,WAAW,CAAEV,cAAF,CAHZ,EAIE;AACD,WAAO,IAAP;AACA;;AAED,QAAMW,QAAQ,GAAGZ,IAAI,IAAIQ,UAAU,KAAKR,IAAxC;AAEA,QAAMa,OAAO,GAAG,yBAAYf,SAAZ,EAAuB;AACtC,iBAAac;AADyB,GAAvB,CAAhB;;AAIA,QAAME,WAEL,GAAKC,KAAF,IAAa;AAChB,QAAKd,cAAL,EAAsB;AACrBQ,MAAAA,aAAa,CAAER,cAAF,CAAb;AACA;;AAEDC,IAAAA,OAAO,CAAEa,KAAF,CAAP;AACA,GARD;;AASA,QAAMC,cAAc,GAAG,qBAAUC,kBAAV,GAAwBC,mBAA/C;AACA,QAAMC,SAAS,GAAGtB,QAAQ,GAAGF,KAAH,GAAW,EAAE,GAAGA,KAAL;AAAYO,IAAAA,OAAO,EAAEkB;AAArB,GAArC;AACA,QAAMC,SAAS,GAAGf,MAAM,GACrBC,SADqB,GAErB;AACAe,IAAAA,EAAE,EAAEC,eADJ;AAEAxB,IAAAA,IAFA;AAGAG,IAAAA,OAAO,EAAEY,WAHT;AAIA,oBAAgBF,QAAQ,GAAG,MAAH,GAAYQ,SAJpC;AAKA,OAAGb;AALH,GAFH;AAUA,SACC,4BAAC,aAAD,~~6BAAyBY~~,SAAzB;AAAqC,IAAA,SAAS,EAAGN;AAAjD,~~MACGhB~~,QAAQ,IACT,4BAAC,wBAAD,~~EAAawB~~,~~SAAb~~,~~EACGjB,~~IAAI,IACL,4BAAC,4BAAD,QACC,4BAAC,WAAD;AAAM,IAAA,IAAI,EAAGA;AAAb,IADD,CAFF,EAOC,4BAAC,oBAAD;AACC,IAAA,KAAK,EAAGD,KADT;AAEC,IAAA,KAAK,EAAGP;AAFT,IAPD,EAYGK,cAAc,IAAI,4BAAC,WAAD;AAAM,IAAA,IAAI,EAAGe;AAAb,IAZrB,CAFF,CADD;AAoBA;;eAEctB,c","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\nimport { isRTL } from '@wordpress/i18n';\n\n/\n Internal dependencies\n */\nimport Button from '../../button';\nimport { useNavigationContext } from '../context';\nimport { ItemUI, ItemIconUI } from '../styles/navigation-styles';\nimport NavigationItemBaseContent from './base-content';\nimport NavigationItemBase from './base';\n\nimport type { NavigationItemProps } from '../types';\n\nconst noop = () => {};\n\nexport function NavigationItem( props: NavigationItemProps ) {\n\tconst {\n\t\tbadge,\n\t\tchildren,\n\t\tclassName,\n\t\thref,\n\t\titem,\n\t\tnavigateToMenu,\n\t\tonClick = noop,\n\t\ttitle,\n\t\ticon,\n\t\thideIfTargetMenuEmpty,\n\t\tisText,\n\t\t...restProps\n\t} = props;\n\n\tconst {\n\t\tactiveItem,\n\t\tsetActiveMenu,\n\t\tnavigationTree: { isMenuEmpty },\n\t} = useNavigationContext();\n\n\t// If hideIfTargetMenuEmpty prop is true\n\t// And the menu we are supposed to navigate to\n\t// Is marked as empty, then we skip rendering the item.\n\tif (\n\t\thideIfTargetMenuEmpty &&\n\t\tnavigateToMenu &&\n\t\tisMenuEmpty( navigateToMenu )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isActive = item && activeItem === item;\n\n\tconst classes = classnames( className, {\n\t\t'is-active': isActive,\n\t} );\n\n\tconst onItemClick: React.MouseEventHandler<\n\t\tHTMLButtonElement \| HTMLAnchorElement\n\t> = ( event ) => {\n\t\tif ( navigateToMenu ) {\n\t\t\tsetActiveMenu( navigateToMenu );\n\t\t}\n\n\t\tonClick( event );\n\t};\n\tconst navigationIcon = isRTL() ? chevronLeft : chevronRight;\n\tconst baseProps = children ? props : { ...props, onClick: undefined };\n\tconst itemProps = isText\n\t\t? restProps\n\t\t: {\n\t\t\t\tas: Button,\n\t\t\t\thref,\n\t\t\t\tonClick: onItemClick,\n\t\t\t\t'aria-current': isActive ? 'page' : undefined,\n\t\t\t\t...restProps,\n\t\t };\n\n\treturn (\n\t\t<NavigationItemBase { ...baseProps } className={ classes }>\n\t\t\t{ children \|\| (\n\t\t\t\t<ItemUI { ...itemProps }>\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<ItemIconUI>\n\t\t\t\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t\t\t</ItemIconUI>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<NavigationItemBaseContent\n\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\tbadge={ badge }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ navigateToMenu && <Icon icon={ navigationIcon } /> }\n\t\t\t\t</ItemUI>\n\t\t\t) }\n\t\t</NavigationItemBase>\n\t);\n}\n\nexport default NavigationItem;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigation/item/index.tsx"],"names":["noop","NavigationItem","props","badge","children","className","href","item","navigateToMenu","onClick","title","icon","hideIfTargetMenuEmpty","isText","restProps","activeItem","setActiveMenu","navigationTree","isMenuEmpty","isActive","classes","onItemClick","event","navigationIcon","chevronLeft","chevronRight","baseProps","undefined","itemProps","as","Button"],"mappings":";;;;;;;;;;;;AAGA;;AAKA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAlBA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AASA,MAAMA,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEO,SAASC,cAAT,CAAyBC,KAAzB,EAAsD;AAC5D,QAAM;AACLC,IAAAA,KADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,SAHK;AAILC,IAAAA,IAJK;AAKLC,IAAAA,IALK;AAMLC,IAAAA,cANK;AAOLC,IAAAA,OAAO,GAAGT,IAPL;AAQLU,IAAAA,KARK;AASLC,IAAAA,IATK;AAULC,IAAAA,qBAVK;AAWLC,IAAAA,MAXK;AAYL,OAAGC;AAZE,MAaFZ,KAbJ;AAeA,QAAM;AACLa,IAAAA,UADK;AAELC,IAAAA,aAFK;AAGLC,IAAAA,cAAc,EAAE;AAAEC,MAAAA;AAAF;AAHX,MAIF,oCAJJ,CAhB4D,CAsB5D;AACA;AACA;;AACA,MACCN,qBAAqB,IACrBJ,cADA,IAEAU,WAAW,CAAEV,cAAF,CAHZ,EAIE;AACD,WAAO,IAAP;AACA;;AAED,QAAMW,QAAQ,GAAGZ,IAAI,IAAIQ,UAAU,KAAKR,IAAxC;AAEA,QAAMa,OAAO,GAAG,yBAAYf,SAAZ,EAAuB;AACtC,iBAAac;AADyB,GAAvB,CAAhB;;AAIA,QAAME,WAEL,GAAKC,KAAF,IAAa;AAChB,QAAKd,cAAL,EAAsB;AACrBQ,MAAAA,aAAa,CAAER,cAAF,CAAb;AACA;;AAEDC,IAAAA,OAAO,CAAEa,KAAF,CAAP;AACA,GARD;;AASA,QAAMC,cAAc,GAAG,qBAAUC,kBAAV,GAAwBC,mBAA/C;AACA,QAAMC,SAAS,GAAGtB,QAAQ,GAAGF,KAAH,GAAW,EAAE,GAAGA,KAAL;AAAYO,IAAAA,OAAO,EAAEkB;AAArB,GAArC;AACA,QAAMC,SAAS,GAAGf,MAAM,GACrBC,SADqB,GAErB;AACAe,IAAAA,EAAE,EAAEC,eADJ;AAEAxB,IAAAA,IAFA;AAGAG,IAAAA,OAAO,EAAEY,WAHT;AAIA,oBAAgBF,QAAQ,GAAG,MAAH,GAAYQ,SAJpC;AAKA,OAAGb;AALH,GAFH;AAUA,SACC,4BAAC,aAAD,OAAyBY,SAAzB;AAAqC,IAAA,SAAS,EAAGN;AAAjD,KACGhB,QAAQ,IACT,4BAAC,wBAAD,OAAawB;AAAb,KACGjB,IAAI,IACL,4BAAC,4BAAD,QACC,4BAAC,WAAD;AAAM,IAAA,IAAI,EAAGA;AAAb,IADD,CAFF,EAOC,4BAAC,oBAAD;AACC,IAAA,KAAK,EAAGD,KADT;AAEC,IAAA,KAAK,EAAGP;AAFT,IAPD,EAYGK,cAAc,IAAI,4BAAC,WAAD;AAAM,IAAA,IAAI,EAAGe;AAAb,IAZrB,CAFF,CADD;AAoBA;;eAEctB,c","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Icon, chevronLeft, chevronRight } from '@wordpress/icons';\nimport { isRTL } from '@wordpress/i18n';\n\n/\n Internal dependencies\n */\nimport Button from '../../button';\nimport { useNavigationContext } from '../context';\nimport { ItemUI, ItemIconUI } from '../styles/navigation-styles';\nimport NavigationItemBaseContent from './base-content';\nimport NavigationItemBase from './base';\n\nimport type { NavigationItemProps } from '../types';\n\nconst noop = () => {};\n\nexport function NavigationItem( props: NavigationItemProps ) {\n\tconst {\n\t\tbadge,\n\t\tchildren,\n\t\tclassName,\n\t\thref,\n\t\titem,\n\t\tnavigateToMenu,\n\t\tonClick = noop,\n\t\ttitle,\n\t\ticon,\n\t\thideIfTargetMenuEmpty,\n\t\tisText,\n\t\t...restProps\n\t} = props;\n\n\tconst {\n\t\tactiveItem,\n\t\tsetActiveMenu,\n\t\tnavigationTree: { isMenuEmpty },\n\t} = useNavigationContext();\n\n\t// If hideIfTargetMenuEmpty prop is true\n\t// And the menu we are supposed to navigate to\n\t// Is marked as empty, then we skip rendering the item.\n\tif (\n\t\thideIfTargetMenuEmpty &&\n\t\tnavigateToMenu &&\n\t\tisMenuEmpty( navigateToMenu )\n\t) {\n\t\treturn null;\n\t}\n\n\tconst isActive = item && activeItem === item;\n\n\tconst classes = classnames( className, {\n\t\t'is-active': isActive,\n\t} );\n\n\tconst onItemClick: React.MouseEventHandler<\n\t\tHTMLButtonElement \| HTMLAnchorElement\n\t> = ( event ) => {\n\t\tif ( navigateToMenu ) {\n\t\t\tsetActiveMenu( navigateToMenu );\n\t\t}\n\n\t\tonClick( event );\n\t};\n\tconst navigationIcon = isRTL() ? chevronLeft : chevronRight;\n\tconst baseProps = children ? props : { ...props, onClick: undefined };\n\tconst itemProps = isText\n\t\t? restProps\n\t\t: {\n\t\t\t\tas: Button,\n\t\t\t\thref,\n\t\t\t\tonClick: onItemClick,\n\t\t\t\t'aria-current': isActive ? 'page' : undefined,\n\t\t\t\t...restProps,\n\t\t };\n\n\treturn (\n\t\t<NavigationItemBase { ...baseProps } className={ classes }>\n\t\t\t{ children \|\| (\n\t\t\t\t<ItemUI { ...itemProps }>\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<ItemIconUI>\n\t\t\t\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t\t\t</ItemIconUI>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<NavigationItemBaseContent\n\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\tbadge={ badge }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ navigateToMenu && <Icon icon={ navigationIcon } /> }\n\t\t\t\t</ItemUI>\n\t\t\t) }\n\t\t</NavigationItemBase>\n\t);\n}\n\nexport default NavigationItem;\n"]}

package/build/navigator/navigator-back-button/component.js CHANGED Viewed

@@ -1,7 +1,5 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = exports.NavigatorBackButton = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _context = require("../../ui/context");
 var _view = require("../../view");
@@ -26,9 +22,10 @@ var _hook = require("./hook");
  */
 function UnconnectedNavigatorBackButton(props, forwardedRef) {
   const navigatorBackButtonProps = (0, _hook.useNavigatorBackButton)(props);
-  return (0, _element.createElement)(_view.View, (0, _extends2.default)({
-    ref: forwardedRef
-  }, navigatorBackButtonProps));
+  return (0, _element.createElement)(_view.View, {
+    ref: forwardedRef,
+    ...navigatorBackButtonProps
+  });
 }
 /**
  * The `NavigatorBackButton` component can be used to navigate to a screen and

package/build/navigator/navigator-back-button/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/component.tsx"],"names":["UnconnectedNavigatorBackButton","props","forwardedRef","navigatorBackButtonProps","NavigatorBackButton"],"mappings":"~~;;;;;;;;;;;;;~~AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA,SAASA,8BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,wBAAwB,GAAG,kCAAwBF,KAAxB,CAAjC;AAEA,SAAO,4BAAC,UAAD;AAAM,IAAA,GAAG,EAAGC;~~AAAZ~~,~~KAAgCC~~,~~wBAAhC,EAAP~~;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMC,mBAAmB,GAAG,6BAClCJ,8BADkC,EAElC,qBAFkC,CAA5B;;eAKQI,mB","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorBackButton } from './hook';\nimport type { NavigatorBackButtonProps } from '../types';\n\nfunction UnconnectedNavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorBackButtonProps = useNavigatorBackButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorBackButtonProps } />;\n}\n\n/\n The `NavigatorBackButton` component can be used to navigate to a screen and\n * should be used in combination with the `NavigatorProvider`, the\n * `NavigatorScreen` and the `NavigatorButton` components (or the `useNavigator`\n * hook).\n \n @example\n * ```jsx\n * import {\n * __experimentalNavigatorProvider as NavigatorProvider,\n * __experimentalNavigatorScreen as NavigatorScreen,\n * __experimentalNavigatorButton as NavigatorButton,\n * __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n \n const MyNavigation = () => (\n * <NavigatorProvider initialPath=\"/\">\n * <NavigatorScreen path=\"/\">\n * <p>This is the home screen.</p>\n * <NavigatorButton path=\"/child\">\n * Navigate to child screen.\n * </NavigatorButton>\n * </NavigatorScreen>\n \n <NavigatorScreen path=\"/child\">\n * <p>This is the child screen.</p>\n * <NavigatorBackButton>\n * Go back\n * </NavigatorBackButton>\n * </NavigatorScreen>\n * </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorBackButton = contextConnect(\n\tUnconnectedNavigatorBackButton,\n\t'NavigatorBackButton'\n);\n\nexport default NavigatorBackButton;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigator/navigator-back-button/component.tsx"],"names":["UnconnectedNavigatorBackButton","props","forwardedRef","navigatorBackButtonProps","NavigatorBackButton"],"mappings":";;;;;;;;;AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA,SAASA,8BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,wBAAwB,GAAG,kCAAwBF,KAAxB,CAAjC;AAEA,SAAO,4BAAC,UAAD;AAAM,IAAA,GAAG,EAAGC,YAAZ;AAAA,OAAgCC;AAAhC,IAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMC,mBAAmB,GAAG,6BAClCJ,8BADkC,EAElC,qBAFkC,CAA5B;;eAKQI,mB","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorBackButton } from './hook';\nimport type { NavigatorBackButtonProps } from '../types';\n\nfunction UnconnectedNavigatorBackButton(\n\tprops: WordPressComponentProps< NavigatorBackButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorBackButtonProps = useNavigatorBackButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorBackButtonProps } />;\n}\n\n/\n The `NavigatorBackButton` component can be used to navigate to a screen and\n * should be used in combination with the `NavigatorProvider`, the\n * `NavigatorScreen` and the `NavigatorButton` components (or the `useNavigator`\n * hook).\n \n @example\n * ```jsx\n * import {\n * __experimentalNavigatorProvider as NavigatorProvider,\n * __experimentalNavigatorScreen as NavigatorScreen,\n * __experimentalNavigatorButton as NavigatorButton,\n * __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n \n const MyNavigation = () => (\n * <NavigatorProvider initialPath=\"/\">\n * <NavigatorScreen path=\"/\">\n * <p>This is the home screen.</p>\n * <NavigatorButton path=\"/child\">\n * Navigate to child screen.\n * </NavigatorButton>\n * </NavigatorScreen>\n \n <NavigatorScreen path=\"/child\">\n * <p>This is the child screen.</p>\n * <NavigatorBackButton>\n * Go back\n * </NavigatorBackButton>\n * </NavigatorScreen>\n * </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorBackButton = contextConnect(\n\tUnconnectedNavigatorBackButton,\n\t'NavigatorBackButton'\n);\n\nexport default NavigatorBackButton;\n"]}

package/build/navigator/navigator-button/component.js CHANGED Viewed

@@ -1,7 +1,5 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = exports.NavigatorButton = void 0;
 var _element = require("@wordpress/element");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _context = require("../../ui/context");
 var _view = require("../../view");
@@ -26,9 +22,10 @@ var _hook = require("./hook");
  */
 function UnconnectedNavigatorButton(props, forwardedRef) {
   const navigatorButtonProps = (0, _hook.useNavigatorButton)(props);
-  return (0, _element.createElement)(_view.View, (0, _extends2.default)({
-    ref: forwardedRef
-  }, navigatorButtonProps));
+  return (0, _element.createElement)(_view.View, {
+    ref: forwardedRef,
+    ...navigatorButtonProps
+  });
 }
 /**
  * The `NavigatorButton` component can be used to navigate to a screen and should

package/build/navigator/navigator-button/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/navigator/navigator-button/component.tsx"],"names":["UnconnectedNavigatorButton","props","forwardedRef","navigatorButtonProps","NavigatorButton"],"mappings":"~~;;;;;;;;;;;;;~~AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA,SAASA,0BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,oBAAoB,GAAG,8BAAoBF,KAApB,CAA7B;AAEA,SAAO,4BAAC,UAAD;AAAM,IAAA,GAAG,EAAGC;~~AAAZ~~,~~KAAgCC~~,~~oBAAhC,EAAP~~;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMC,eAAe,GAAG,6BAC9BJ,0BAD8B,EAE9B,iBAF8B,CAAxB;;eAKQI,e","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorButton } from './hook';\nimport type { NavigatorButtonProps } from '../types';\n\nfunction UnconnectedNavigatorButton(\n\tprops: WordPressComponentProps< NavigatorButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorButtonProps = useNavigatorButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorButtonProps } />;\n}\n\n/\n The `NavigatorButton` component can be used to navigate to a screen and should\n * be used in combination with the `NavigatorProvider`, the `NavigatorScreen`\n * and the `NavigatorBackButton` components (or the `useNavigator` hook).\n \n @example\n * ```jsx\n * import {\n * __experimentalNavigatorProvider as NavigatorProvider,\n * __experimentalNavigatorScreen as NavigatorScreen,\n * __experimentalNavigatorButton as NavigatorButton,\n * __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n \n const MyNavigation = () => (\n * <NavigatorProvider initialPath=\"/\">\n * <NavigatorScreen path=\"/\">\n * <p>This is the home screen.</p>\n * <NavigatorButton path=\"/child\">\n * Navigate to child screen.\n * </NavigatorButton>\n * </NavigatorScreen>\n \n <NavigatorScreen path=\"/child\">\n * <p>This is the child screen.</p>\n * <NavigatorBackButton>\n * Go back\n * </NavigatorBackButton>\n * </NavigatorScreen>\n * </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorButton = contextConnect(\n\tUnconnectedNavigatorButton,\n\t'NavigatorButton'\n);\n\nexport default NavigatorButton;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/navigator/navigator-button/component.tsx"],"names":["UnconnectedNavigatorButton","props","forwardedRef","navigatorButtonProps","NavigatorButton"],"mappings":";;;;;;;;;AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAMA,SAASA,0BAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,oBAAoB,GAAG,8BAAoBF,KAApB,CAA7B;AAEA,SAAO,4BAAC,UAAD;AAAM,IAAA,GAAG,EAAGC,YAAZ;AAAA,OAAgCC;AAAhC,IAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,MAAMC,eAAe,GAAG,6BAC9BJ,0BAD8B,EAE9B,iBAF8B,CAAxB;;eAKQI,e","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { View } from '../../view';\nimport { useNavigatorButton } from './hook';\nimport type { NavigatorButtonProps } from '../types';\n\nfunction UnconnectedNavigatorButton(\n\tprops: WordPressComponentProps< NavigatorButtonProps, 'button' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst navigatorButtonProps = useNavigatorButton( props );\n\n\treturn <View ref={ forwardedRef } { ...navigatorButtonProps } />;\n}\n\n/\n The `NavigatorButton` component can be used to navigate to a screen and should\n * be used in combination with the `NavigatorProvider`, the `NavigatorScreen`\n * and the `NavigatorBackButton` components (or the `useNavigator` hook).\n \n @example\n * ```jsx\n * import {\n * __experimentalNavigatorProvider as NavigatorProvider,\n * __experimentalNavigatorScreen as NavigatorScreen,\n * __experimentalNavigatorButton as NavigatorButton,\n * __experimentalNavigatorBackButton as NavigatorBackButton,\n * } from '@wordpress/components';\n \n const MyNavigation = () => (\n * <NavigatorProvider initialPath=\"/\">\n * <NavigatorScreen path=\"/\">\n * <p>This is the home screen.</p>\n * <NavigatorButton path=\"/child\">\n * Navigate to child screen.\n * </NavigatorButton>\n * </NavigatorScreen>\n \n <NavigatorScreen path=\"/child\">\n * <p>This is the child screen.</p>\n * <NavigatorBackButton>\n * Go back\n * </NavigatorBackButton>\n * </NavigatorScreen>\n * </NavigatorProvider>\n * );\n * ```\n */\nexport const NavigatorButton = contextConnect(\n\tUnconnectedNavigatorButton,\n\t'NavigatorButton'\n);\n\nexport default NavigatorButton;\n"]}