npm - @wordpress/components - Versions diffs - 19.4.1 → 19.5.0 - Mend

@wordpress/components 19.4.1 → 19.5.0

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 (396) hide show

package/build-module/confirm-dialog/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/confirm-dialog/component.tsx"],"names":["__","useCallback","useEffect","useState","Modal","useContextSystem","contextConnect","Flex","Button","Text","VStack","styles","useCx","ConfirmDialog","props","forwardedRef","isOpen","isOpenProp","onConfirm","onCancel","children","otherProps","cx","wrapperClassName","wrapper","setIsOpen","shouldSelfClose","setShouldSelfClose","isIsOpenSet","handleEvent","callback","event","handleEnter","key","cancelLabel","confirmLabel"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport type { ~~Ref~~, KeyboardEvent } from 'react';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { useCallback, useEffect, useState } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport Modal from '../modal';\nimport type { OwnProps, DialogInputEvent } from './types';\nimport {\n\tuseContextSystem,\n\tcontextConnect,\n\tWordPressComponentProps,\n} from '../ui/context';\nimport { Flex } from '../flex';\nimport Button from '../button';\nimport { Text } from '../text';\nimport { VStack } from '../v-stack';\nimport as styles from './styles';\nimport { useCx } from '../utils/hooks/use-cx';\n\nfunction ConfirmDialog(\n\tprops: WordPressComponentProps< OwnProps, 'div', false >,\n\tforwardedRef: ~~Ref~~< any >\n) {\n\tconst {\n\t\tisOpen: isOpenProp,\n\t\tonConfirm,\n\t\tonCancel,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ConfirmDialog' );\n\n\tconst cx = useCx();\n\tconst wrapperClassName = cx( styles.wrapper );\n\n\tconst [ isOpen, setIsOpen ] = useState< boolean >();\n\tconst [ shouldSelfClose, setShouldSelfClose ] = useState< boolean >();\n\n\tuseEffect( () => {\n\t\t// We only allow the dialog to close itself if `isOpenProp` is not set.\n\t\t// If `isOpenProp` is set, then it (probably) means it's controlled by a\n\t\t// parent component. In that case, `shouldSelfClose` might do more harm than\n\t\t// good, so we disable it.\n\t\tconst isIsOpenSet = typeof isOpenProp !== 'undefined';\n\t\tsetIsOpen( isIsOpenSet ? isOpenProp : true );\n\t\tsetShouldSelfClose( ! isIsOpenSet );\n\t}, [ isOpenProp ] );\n\n\tconst handleEvent = useCallback(\n\t\t( callback?: ( event: DialogInputEvent ) => void ) => (\n\t\t\tevent: DialogInputEvent\n\t\t) => {\n\t\t\tcallback?.( event );\n\t\t\tif ( shouldSelfClose ) {\n\t\t\t\tsetIsOpen( false );\n\t\t\t}\n\t\t},\n\t\t[ shouldSelfClose, setIsOpen ]\n\t);\n\n\tconst handleEnter = useCallback(\n\t\t( event: KeyboardEvent< HTMLDivElement > ) => {\n\t\t\tif ( event.key === 'Enter' ) {\n\t\t\t\thandleEvent( onConfirm )( event );\n\t\t\t}\n\t\t},\n\t\t[ handleEvent, onConfirm ]\n\t);\n\n\tconst cancelLabel = __( 'Cancel' );\n\tconst confirmLabel = __( 'OK' );\n\n\treturn (\n\t\t<>\n\t\t\t{ isOpen && (\n\t\t\t\t<Modal\n\t\t\t\t\tonRequestClose={ handleEvent( onCancel ) }\n\t\t\t\t\tonKeyDown={ handleEnter }\n\t\t\t\t\tcloseButtonLabel={ cancelLabel }\n\t\t\t\t\tisDismissible={ true }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\toverlayClassName={ wrapperClassName }\n\t\t\t\t\t__experimentalHideHeader\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t>\n\t\t\t\t\t<VStack spacing={ 8 }>\n\t\t\t\t\t\t<Text>{ children }</Text>\n\t\t\t\t\t\t<Flex direction=\"row\" justify=\"flex-end\">\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\tonClick={ handleEvent( onCancel ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ cancelLabel }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\tonClick={ handleEvent( onConfirm ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ confirmLabel }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t</VStack>\n\t\t\t\t</Modal>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default contextConnect( ConfirmDialog, 'ConfirmDialog' );\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/confirm-dialog/component.tsx"],"names":["__","useCallback","useEffect","useState","Modal","useContextSystem","contextConnect","Flex","Button","Text","VStack","styles","useCx","ConfirmDialog","props","forwardedRef","isOpen","isOpenProp","onConfirm","onCancel","children","otherProps","cx","wrapperClassName","wrapper","setIsOpen","shouldSelfClose","setShouldSelfClose","isIsOpenSet","handleEvent","callback","event","handleEnter","key","cancelLabel","confirmLabel"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport type { ForwardedRef, KeyboardEvent } from 'react';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { useCallback, useEffect, useState } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport Modal from '../modal';\nimport type { OwnProps, DialogInputEvent } from './types';\nimport {\n\tuseContextSystem,\n\tcontextConnect,\n\tWordPressComponentProps,\n} from '../ui/context';\nimport { Flex } from '../flex';\nimport Button from '../button';\nimport { Text } from '../text';\nimport { VStack } from '../v-stack';\nimport as styles from './styles';\nimport { useCx } from '../utils/hooks/use-cx';\n\nfunction ConfirmDialog(\n\tprops: WordPressComponentProps< OwnProps, 'div', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tisOpen: isOpenProp,\n\t\tonConfirm,\n\t\tonCancel,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ConfirmDialog' );\n\n\tconst cx = useCx();\n\tconst wrapperClassName = cx( styles.wrapper );\n\n\tconst [ isOpen, setIsOpen ] = useState< boolean >();\n\tconst [ shouldSelfClose, setShouldSelfClose ] = useState< boolean >();\n\n\tuseEffect( () => {\n\t\t// We only allow the dialog to close itself if `isOpenProp` is not set.\n\t\t// If `isOpenProp` is set, then it (probably) means it's controlled by a\n\t\t// parent component. In that case, `shouldSelfClose` might do more harm than\n\t\t// good, so we disable it.\n\t\tconst isIsOpenSet = typeof isOpenProp !== 'undefined';\n\t\tsetIsOpen( isIsOpenSet ? isOpenProp : true );\n\t\tsetShouldSelfClose( ! isIsOpenSet );\n\t}, [ isOpenProp ] );\n\n\tconst handleEvent = useCallback(\n\t\t( callback?: ( event: DialogInputEvent ) => void ) => (\n\t\t\tevent: DialogInputEvent\n\t\t) => {\n\t\t\tcallback?.( event );\n\t\t\tif ( shouldSelfClose ) {\n\t\t\t\tsetIsOpen( false );\n\t\t\t}\n\t\t},\n\t\t[ shouldSelfClose, setIsOpen ]\n\t);\n\n\tconst handleEnter = useCallback(\n\t\t( event: KeyboardEvent< HTMLDivElement > ) => {\n\t\t\tif ( event.key === 'Enter' ) {\n\t\t\t\thandleEvent( onConfirm )( event );\n\t\t\t}\n\t\t},\n\t\t[ handleEvent, onConfirm ]\n\t);\n\n\tconst cancelLabel = __( 'Cancel' );\n\tconst confirmLabel = __( 'OK' );\n\n\treturn (\n\t\t<>\n\t\t\t{ isOpen && (\n\t\t\t\t<Modal\n\t\t\t\t\tonRequestClose={ handleEvent( onCancel ) }\n\t\t\t\t\tonKeyDown={ handleEnter }\n\t\t\t\t\tcloseButtonLabel={ cancelLabel }\n\t\t\t\t\tisDismissible={ true }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\toverlayClassName={ wrapperClassName }\n\t\t\t\t\t__experimentalHideHeader\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t>\n\t\t\t\t\t<VStack spacing={ 8 }>\n\t\t\t\t\t\t<Text>{ children }</Text>\n\t\t\t\t\t\t<Flex direction=\"row\" justify=\"flex-end\">\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\tonClick={ handleEvent( onCancel ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ cancelLabel }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\tonClick={ handleEvent( onConfirm ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ confirmLabel }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t</VStack>\n\t\t\t\t</Modal>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default contextConnect( ConfirmDialog, 'ConfirmDialog' );\n"]}

package/build-module/divider/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/divider/component.tsx"],"names":["Separator","contextConnect","useContextSystem","DividerView","Divider","props","forwardedRef","contextProps","ConnectedDivider"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,QAA1B;;AAGA;AACA;AACA;AACA,SACCC,cADD,EAECC,gBAFD,QAIO,eAJP;AAKA,SAASC,WAAT,QAA4B,UAA5B;;AAGA,SAASC,OAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,YAAY,GAAGL,gBAAgB,CAAEG,KAAF,EAAS,SAAT,CAArC;AAEA,SACC,cAAC,SAAD;AACC,IAAA,EAAE,EAAGF;AADN,KAEMI,YAFN;AAGC,IAAA,GAAG,EAAGD;AAHP,KADD;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,gBAAgB,GAAGP,cAAc,CAAEG,OAAF,EAAW,SAAX,CAAvC;AAEA,eAAeI,gBAAf","sourcesContent":["/*\n External dependencies\n /\n// eslint-disable-next-line no-restricted-imports\nimport { Separator } from 'reakit';\nimport type { ~~Ref~~ } from 'react';\n\n/\n Internal dependencies\n /\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../ui/context';\nimport { DividerView } from './styles';\nimport type { Props } from './types';\n\nfunction Divider(\n\tprops: WordPressComponentProps< Props, 'hr', false >,\n\tforwardedRef: ~~Ref~~< any >\n) {\n\tconst contextProps = useContextSystem( props, 'Divider' );\n\n\treturn (\n\t\t<Separator\n\t\t\tas={ DividerView }\n\t\t\t{ ...contextProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n}\n\n/\n `Divider` is a layout component that separates groups of related content.\n \n @example\n * ```js\n * import {\n * \t\t__experimentalDivider as Divider,\n * \t\t__experimentalText as Text,\n * \t\t__experimentalVStack as VStack,\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<VStack spacing={4}>\n * \t\t\t<Text>Some text here</Text>\n * \t\t\t<Divider />\n * \t\t\t<Text>Some more text here</Text>\n * \t\t</VStack>\n * \t);\n * }\n * ```\n */\nconst ConnectedDivider = contextConnect( Divider, 'Divider' );\n\nexport default ConnectedDivider;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/divider/component.tsx"],"names":["Separator","contextConnect","useContextSystem","DividerView","Divider","props","forwardedRef","contextProps","ConnectedDivider"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,QAA1B;;AAGA;AACA;AACA;AACA,SACCC,cADD,EAECC,gBAFD,QAIO,eAJP;AAKA,SAASC,WAAT,QAA4B,UAA5B;;AAGA,SAASC,OAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,YAAY,GAAGL,gBAAgB,CAAEG,KAAF,EAAS,SAAT,CAArC;AAEA,SACC,cAAC,SAAD;AACC,IAAA,EAAE,EAAGF;AADN,KAEMI,YAFN;AAGC,IAAA,GAAG,EAAGD;AAHP,KADD;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,gBAAgB,GAAGP,cAAc,CAAEG,OAAF,EAAW,SAAX,CAAvC;AAEA,eAAeI,gBAAf","sourcesContent":["/*\n External dependencies\n /\n// eslint-disable-next-line no-restricted-imports\nimport { Separator } from 'reakit';\nimport type { ForwardedRef } from 'react';\n\n/\n Internal dependencies\n /\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../ui/context';\nimport { DividerView } from './styles';\nimport type { Props } from './types';\n\nfunction Divider(\n\tprops: WordPressComponentProps< Props, 'hr', false >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst contextProps = useContextSystem( props, 'Divider' );\n\n\treturn (\n\t\t<Separator\n\t\t\tas={ DividerView }\n\t\t\t{ ...contextProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n}\n\n/\n `Divider` is a layout component that separates groups of related content.\n \n @example\n * ```js\n * import {\n * \t\t__experimentalDivider as Divider,\n * \t\t__experimentalText as Text,\n * \t\t__experimentalVStack as VStack,\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<VStack spacing={4}>\n * \t\t\t<Text>Some text here</Text>\n * \t\t\t<Divider />\n * \t\t\t<Text>Some more text here</Text>\n * \t\t</VStack>\n * \t);\n * }\n * ```\n */\nconst ConnectedDivider = contextConnect( Divider, 'Divider' );\n\nexport default ConnectedDivider;\n"]}

package/build-module/elevation/component.js CHANGED Viewed

@@ -9,7 +9,7 @@ import { View } from '../view';
 import { useElevation } from './hook';
 /**
  * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props
- * @param {import('react').Ref<any>}                                                        forwardedRef
+ * @param {import('react').ForwardedRef<any>}                                               forwardedRef
  */
 function Elevation(props, forwardedRef) {

package/build-module/elevation/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/elevation/component.js"],"names":["contextConnect","View","useElevation","Elevation","props","forwardedRef","elevationProps","ConnectedElevation"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,eAA/B;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,YAAT,QAA6B,QAA7B;AAEA;AACA;AACA;AACA;;AACA,SAASC,SAAT,CAAoBC,KAApB,EAA2BC,YAA3B,EAA0C;AACzC,QAAMC,cAAc,GAAGJ,YAAY,CAAEE,KAAF,CAAnC;AAEA,SAAO,cAAC,IAAD,eAAWE,cAAX;AAA4B,IAAA,GAAG,EAAGD;AAAlC,KAAP;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,MAAME,kBAAkB,GAAGP,cAAc,CAAEG,SAAF,EAAa,WAAb,CAAzC;AAEA,eAAeI,kBAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../ui/context';\nimport { View } from '../view';\nimport { useElevation } from './hook';\n\n/\n @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').~~Ref~~<any>} forwardedRef\n /\nfunction Elevation( props, forwardedRef ) {\n\tconst elevationProps = useElevation( props );\n\n\treturn <View { ...elevationProps } ref={ forwardedRef } />;\n}\n\n/\n `Elevation` is a core component that renders shadow, using the library's shadow system.\n \n The shadow effect is generated using the `value` prop.\n \n @example\n * ```jsx\n * import {\n \t__experimentalElevation as Elevation,\n \t__experimentalSurface as Surface,\n \t__experimentalText as Text,\n } from '@wordpress/components';\n \n function Example() {\n * \treturn (\n * \t\t<Surface>\n * \t\t\t<Text>Code is Poetry</Text>\n * \t\t\t<Elevation value={ 5 } />\n * \t\t</Surface>\n * \t);\n * }\n * ```\n */\nconst ConnectedElevation = contextConnect( Elevation, 'Elevation' );\n\nexport default ConnectedElevation;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/elevation/component.js"],"names":["contextConnect","View","useElevation","Elevation","props","forwardedRef","elevationProps","ConnectedElevation"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,eAA/B;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,YAAT,QAA6B,QAA7B;AAEA;AACA;AACA;AACA;;AACA,SAASC,SAAT,CAAoBC,KAApB,EAA2BC,YAA3B,EAA0C;AACzC,QAAMC,cAAc,GAAGJ,YAAY,CAAEE,KAAF,CAAnC;AAEA,SAAO,cAAC,IAAD,eAAWE,cAAX;AAA4B,IAAA,GAAG,EAAGD;AAAlC,KAAP;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,MAAME,kBAAkB,GAAGP,cAAc,CAAEG,SAAF,EAAa,WAAb,CAAzC;AAEA,eAAeI,kBAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../ui/context';\nimport { View } from '../view';\nimport { useElevation } from './hook';\n\n/\n @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n /\nfunction Elevation( props, forwardedRef ) {\n\tconst elevationProps = useElevation( props );\n\n\treturn <View { ...elevationProps } ref={ forwardedRef } />;\n}\n\n/\n `Elevation` is a core component that renders shadow, using the library's shadow system.\n \n The shadow effect is generated using the `value` prop.\n \n @example\n * ```jsx\n * import {\n \t__experimentalElevation as Elevation,\n \t__experimentalSurface as Surface,\n \t__experimentalText as Text,\n } from '@wordpress/components';\n \n function Example() {\n * \treturn (\n * \t\t<Surface>\n * \t\t\t<Text>Code is Poetry</Text>\n * \t\t\t<Elevation value={ 5 } />\n * \t\t</Surface>\n * \t);\n * }\n * ```\n */\nconst ConnectedElevation = contextConnect( Elevation, 'Elevation' );\n\nexport default ConnectedElevation;\n"]}

package/build-module/flex/flex/component.js CHANGED Viewed

@@ -10,7 +10,7 @@ import { FlexContext } from './../context';
 import { View } from '../../view';
 /**
  * @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexProps, 'div'>} props
- * @param {import('react').Ref<any>}                                                                forwardedRef
+ * @param {import('react').ForwardedRef<any>}                                                       forwardedRef
  */
 function Flex(props, forwardedRef) {

package/build-module/flex/flex/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/flex/flex/component.js"],"names":["contextConnect","useFlex","FlexContext","View","Flex","props","forwardedRef","children","isColumn","otherProps","flexItemDisplay","undefined","ConnectedFlex"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,kBAA/B;AACA,SAASC,OAAT,QAAwB,QAAxB;AACA,SAASC,WAAT,QAA4B,cAA5B;AACA,SAASC,IAAT,QAAqB,YAArB;AAEA;AACA;AACA;AACA;;AACA,SAASC,IAAT,CAAeC,KAAf,EAAsBC,YAAtB,EAAqC;AACpC,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,QAAZ;AAAsB,OAAGC;AAAzB,MAAwCR,OAAO,CAAEI,KAAF,CAArD;AAEA,SACC,cAAC,WAAD,CAAa,QAAb;AACC,IAAA,KAAK,EAAG;AAAEK,MAAAA,eAAe,EAAEF,QAAQ,GAAG,OAAH,GAAaG;AAAxC;AADT,KAGC,cAAC,IAAD,eAAWF,UAAX;AAAwB,IAAA,GAAG,EAAGH;AAA9B,MACGC,QADH,CAHD,CADD;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,MAAMK,aAAa,GAAGZ,cAAc,CAAEI,IAAF,EAAQ,MAAR,CAApC;AAEA,eAAeQ,aAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../../ui/context';\nimport { useFlex } from './hook';\nimport { FlexContext } from './../context';\nimport { View } from '../../view';\n\n/\n @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexProps, 'div'>} props\n * @param {import('react').~~Ref~~<any>} forwardedRef\n /\nfunction Flex( props, forwardedRef ) {\n\tconst { children, isColumn, ...otherProps } = useFlex( props );\n\n\treturn (\n\t\t<FlexContext.Provider\n\t\t\tvalue={ { flexItemDisplay: isColumn ? 'block' : undefined } }\n\t\t>\n\t\t\t<View { ...otherProps } ref={ forwardedRef }>\n\t\t\t\t{ children }\n\t\t\t</View>\n\t\t</FlexContext.Provider>\n\t);\n}\n\n/\n `Flex` is a primitive layout component that adaptively aligns child content\n * horizontally or vertically. `Flex` powers components like `HStack` and\n * `VStack`.\n \n `Flex` is used with any of it's two sub-components, `FlexItem` and `FlexBlock`.\n \n @example\n * ```jsx\n * import {\n * \t__experimentalFlex as Flex,\n * \t__experimentalFlexBlock as FlexBlock,\n * \t__experimentalFlexItem as FlexItem,\n * \t__experimentalText as Text\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<Flex>\n * \t\t\t<FlexItem>\n * \t\t\t\t<Text>Code</Text>\n * \t\t\t</FlexItem>\n * \t\t\t<FlexBlock>\n * \t\t\t\t<Text>Poetry</Text>\n * \t\t\t</FlexBlock>\n * \t\t</Flex>\n * \t);\n * }\n * ```\n \n /\nconst ConnectedFlex = contextConnect( Flex, 'Flex' );\n\nexport default ConnectedFlex;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/flex/flex/component.js"],"names":["contextConnect","useFlex","FlexContext","View","Flex","props","forwardedRef","children","isColumn","otherProps","flexItemDisplay","undefined","ConnectedFlex"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,kBAA/B;AACA,SAASC,OAAT,QAAwB,QAAxB;AACA,SAASC,WAAT,QAA4B,cAA5B;AACA,SAASC,IAAT,QAAqB,YAArB;AAEA;AACA;AACA;AACA;;AACA,SAASC,IAAT,CAAeC,KAAf,EAAsBC,YAAtB,EAAqC;AACpC,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,QAAZ;AAAsB,OAAGC;AAAzB,MAAwCR,OAAO,CAAEI,KAAF,CAArD;AAEA,SACC,cAAC,WAAD,CAAa,QAAb;AACC,IAAA,KAAK,EAAG;AAAEK,MAAAA,eAAe,EAAEF,QAAQ,GAAG,OAAH,GAAaG;AAAxC;AADT,KAGC,cAAC,IAAD,eAAWF,UAAX;AAAwB,IAAA,GAAG,EAAGH;AAA9B,MACGC,QADH,CAHD,CADD;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,MAAMK,aAAa,GAAGZ,cAAc,CAAEI,IAAF,EAAQ,MAAR,CAApC;AAEA,eAAeQ,aAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../../ui/context';\nimport { useFlex } from './hook';\nimport { FlexContext } from './../context';\nimport { View } from '../../view';\n\n/\n @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexProps, 'div'>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n /\nfunction Flex( props, forwardedRef ) {\n\tconst { children, isColumn, ...otherProps } = useFlex( props );\n\n\treturn (\n\t\t<FlexContext.Provider\n\t\t\tvalue={ { flexItemDisplay: isColumn ? 'block' : undefined } }\n\t\t>\n\t\t\t<View { ...otherProps } ref={ forwardedRef }>\n\t\t\t\t{ children }\n\t\t\t</View>\n\t\t</FlexContext.Provider>\n\t);\n}\n\n/\n `Flex` is a primitive layout component that adaptively aligns child content\n * horizontally or vertically. `Flex` powers components like `HStack` and\n * `VStack`.\n \n `Flex` is used with any of it's two sub-components, `FlexItem` and `FlexBlock`.\n \n @example\n * ```jsx\n * import {\n * \t__experimentalFlex as Flex,\n * \t__experimentalFlexBlock as FlexBlock,\n * \t__experimentalFlexItem as FlexItem,\n * \t__experimentalText as Text\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<Flex>\n * \t\t\t<FlexItem>\n * \t\t\t\t<Text>Code</Text>\n * \t\t\t</FlexItem>\n * \t\t\t<FlexBlock>\n * \t\t\t\t<Text>Poetry</Text>\n * \t\t\t</FlexBlock>\n * \t\t</Flex>\n * \t);\n * }\n * ```\n \n /\nconst ConnectedFlex = contextConnect( Flex, 'Flex' );\n\nexport default ConnectedFlex;\n"]}

package/build-module/flex/flex-block/component.js CHANGED Viewed

@@ -9,7 +9,7 @@ import { View } from '../../view';
 import { useFlexBlock } from './hook';
 /**
  * @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexBlockProps, 'div'>} props
- * @param {import('react').Ref<any>}                                                                     forwardedRef
+ * @param {import('react').ForwardedRef<any>}                                                            forwardedRef
  */
 function FlexBlock(props, forwardedRef) {

package/build-module/flex/flex-block/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/flex/flex-block/component.js"],"names":["contextConnect","View","useFlexBlock","FlexBlock","props","forwardedRef","flexBlockProps","ConnectedFlexBlock"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,kBAA/B;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,YAAT,QAA6B,QAA7B;AAEA;AACA;AACA;AACA;;AACA,SAASC,SAAT,CAAoBC,KAApB,EAA2BC,YAA3B,EAA0C;AACzC,QAAMC,cAAc,GAAGJ,YAAY,CAAEE,KAAF,CAAnC;AAEA,SAAO,cAAC,IAAD,eAAWE,cAAX;AAA4B,IAAA,GAAG,EAAGD;AAAlC,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,kBAAkB,GAAGP,cAAc,CAAEG,SAAF,EAAa,WAAb,CAAzC;AAEA,eAAeI,kBAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../../ui/context';\nimport { View } from '../../view';\nimport { useFlexBlock } from './hook';\n\n/\n @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexBlockProps, 'div'>} props\n * @param {import('react').~~Ref~~<any>} forwardedRef\n /\nfunction FlexBlock( props, forwardedRef ) {\n\tconst flexBlockProps = useFlexBlock( props );\n\n\treturn <View { ...flexBlockProps } ref={ forwardedRef } />;\n}\n\n/\n `FlexBlock` is a primitive layout component that adaptively resizes content within layout containers like `Flex`.\n \n @example\n * ```jsx\n * <Flex>\n * \t<FlexBlock>...</FlexBlock>\n * </Flex>\n * ```\n */\nconst ConnectedFlexBlock = contextConnect( FlexBlock, 'FlexBlock' );\n\nexport default ConnectedFlexBlock;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/flex/flex-block/component.js"],"names":["contextConnect","View","useFlexBlock","FlexBlock","props","forwardedRef","flexBlockProps","ConnectedFlexBlock"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,kBAA/B;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,YAAT,QAA6B,QAA7B;AAEA;AACA;AACA;AACA;;AACA,SAASC,SAAT,CAAoBC,KAApB,EAA2BC,YAA3B,EAA0C;AACzC,QAAMC,cAAc,GAAGJ,YAAY,CAAEE,KAAF,CAAnC;AAEA,SAAO,cAAC,IAAD,eAAWE,cAAX;AAA4B,IAAA,GAAG,EAAGD;AAAlC,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,kBAAkB,GAAGP,cAAc,CAAEG,SAAF,EAAa,WAAb,CAAzC;AAEA,eAAeI,kBAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../../ui/context';\nimport { View } from '../../view';\nimport { useFlexBlock } from './hook';\n\n/\n @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexBlockProps, 'div'>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n /\nfunction FlexBlock( props, forwardedRef ) {\n\tconst flexBlockProps = useFlexBlock( props );\n\n\treturn <View { ...flexBlockProps } ref={ forwardedRef } />;\n}\n\n/\n `FlexBlock` is a primitive layout component that adaptively resizes content within layout containers like `Flex`.\n \n @example\n * ```jsx\n * <Flex>\n * \t<FlexBlock>...</FlexBlock>\n * </Flex>\n * ```\n */\nconst ConnectedFlexBlock = contextConnect( FlexBlock, 'FlexBlock' );\n\nexport default ConnectedFlexBlock;\n"]}

package/build-module/flex/flex-item/component.js CHANGED Viewed

@@ -9,7 +9,7 @@ import { View } from '../../view';
 import { useFlexItem } from './hook';
 /**
  * @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexItemProps, 'div'>} props
- * @param {import('react').Ref<any>}                                                                    forwardedRef
+ * @param {import('react').ForwardedRef<any>}                                                           forwardedRef
  */
 function FlexItem(props, forwardedRef) {

package/build-module/flex/flex-item/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/flex/flex-item/component.js"],"names":["contextConnect","View","useFlexItem","FlexItem","props","forwardedRef","flexItemProps","ConnectedFlexItem"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,kBAA/B;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,WAAT,QAA4B,QAA5B;AAEA;AACA;AACA;AACA;;AACA,SAASC,QAAT,CAAmBC,KAAnB,EAA0BC,YAA1B,EAAyC;AACxC,QAAMC,aAAa,GAAGJ,WAAW,CAAEE,KAAF,CAAjC;AAEA,SAAO,cAAC,IAAD,eAAWE,aAAX;AAA2B,IAAA,GAAG,EAAGD;AAAjC,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,iBAAiB,GAAGP,cAAc,CAAEG,QAAF,EAAY,UAAZ,CAAxC;AAEA,eAAeI,iBAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../../ui/context';\nimport { View } from '../../view';\nimport { useFlexItem } from './hook';\n\n/\n @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexItemProps, 'div'>} props\n * @param {import('react').~~Ref~~<any>} forwardedRef\n /\nfunction FlexItem( props, forwardedRef ) {\n\tconst flexItemProps = useFlexItem( props );\n\n\treturn <View { ...flexItemProps } ref={ forwardedRef } />;\n}\n\n/\n `FlexItem` is a primitive layout component that aligns content within layout containers like `Flex`.\n \n @example\n * ```jsx\n * <Flex>\n * \t<FlexItem>...</FlexItem>\n * </Flex>\n * ```\n */\nconst ConnectedFlexItem = contextConnect( FlexItem, 'FlexItem' );\n\nexport default ConnectedFlexItem;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/flex/flex-item/component.js"],"names":["contextConnect","View","useFlexItem","FlexItem","props","forwardedRef","flexItemProps","ConnectedFlexItem"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,kBAA/B;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,WAAT,QAA4B,QAA5B;AAEA;AACA;AACA;AACA;;AACA,SAASC,QAAT,CAAmBC,KAAnB,EAA0BC,YAA1B,EAAyC;AACxC,QAAMC,aAAa,GAAGJ,WAAW,CAAEE,KAAF,CAAjC;AAEA,SAAO,cAAC,IAAD,eAAWE,aAAX;AAA2B,IAAA,GAAG,EAAGD;AAAjC,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,iBAAiB,GAAGP,cAAc,CAAEG,QAAF,EAAY,UAAZ,CAAxC;AAEA,eAAeI,iBAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../../ui/context';\nimport { View } from '../../view';\nimport { useFlexItem } from './hook';\n\n/\n @param {import('../../ui/context').WordPressComponentProps<import('../types').FlexItemProps, 'div'>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n /\nfunction FlexItem( props, forwardedRef ) {\n\tconst flexItemProps = useFlexItem( props );\n\n\treturn <View { ...flexItemProps } ref={ forwardedRef } />;\n}\n\n/\n `FlexItem` is a primitive layout component that aligns content within layout containers like `Flex`.\n \n @example\n * ```jsx\n * <Flex>\n * \t<FlexItem>...</FlexItem>\n * </Flex>\n * ```\n */\nconst ConnectedFlexItem = contextConnect( FlexItem, 'FlexItem' );\n\nexport default ConnectedFlexItem;\n"]}

package/build-module/flyout/flyout/component.js CHANGED Viewed

@@ -24,7 +24,7 @@ import { useFlyout } from './hook';
 /**
  *
  * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div', false>} props
- * @param {import('react').Ref<any>}                                                                   forwardedRef
+ * @param {import('react').ForwardedRef<any>}                                                          forwardedRef
  */
 function Flyout(props, forwardedRef) {

package/build-module/flyout/flyout/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/flyout/flyout/component.js"],"names":["PopoverDisclosure","Portal","useCallback","useMemo","cloneElement","contextConnect","FlyoutContext","useFlyoutResizeUpdater","FlyoutContent","useUpdateEffect","useFlyout","Flyout","props","forwardedRef","children","elevation","label","maxWidth","onVisibleChange","trigger","flyoutState","otherProps","resizeListener","onResize","unstable_update","uniqueId","baseId","labelId","contextProps","triggerContent","triggerProps","visible","ref","ConnectedFlyout"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA,SAASA,iBAAT,EAA4BC,MAA5B,QAA0C,QAA1C;AAEA;AACA;AACA;;AACA,SAASC,WAAT,EAAsBC,OAAtB,EAA+BC,YAA/B,QAAmD,oBAAnD;AAEA;AACA;AACA;;AACA,SAASC,cAAT,QAA+B,kBAA/B;AACA,SAASC,aAAT,QAA8B,YAA9B;AACA,SAASC,sBAAT,QAAuC,UAAvC;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,SAASC,eAAT,QAAgC,mBAAhC;AACA,SAASC,SAAT,QAA0B,QAA1B;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,MAAT,CAAiBC,KAAjB,EAAwBC,YAAxB,EAAuC;AACtC,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,SAFK;AAGLC,IAAAA,KAHK;AAILC,IAAAA,QAJK;AAKLC,IAAAA,eALK;AAMLC,IAAAA,OANK;AAOLC,IAAAA,WAPK;AAQL,OAAGC;AARE,MASFX,SAAS,CAAEE,KAAF,CATb;AAWA,QAAMU,cAAc,GAAGf,sBAAsB,CAAE;AAC9CgB,IAAAA,QAAQ,EAAEH,WAAW,CAACI;AADwB,GAAF,CAA7C;AAIA,QAAMC,QAAQ,GAAI,UAAUL,WAAW,CAACM,MAAQ,EAAhD;AACA,QAAMC,OAAO,GAAGX,KAAK,IAAIS,QAAzB;AAEA,QAAMG,YAAY,GAAGzB,OAAO,CAC3B,OAAQ;AACPa,IAAAA,KAAK,EAAEW,OADA;AAEPP,IAAAA;AAFO,GAAR,CAD2B,EAK3B,CAAEO,OAAF,EAAWP,WAAX,CAL2B,CAA5B;AAQA,QAAMS,cAAc,GAAG3B,WAAW,CAC/B4B,YAAF,IAAoB;AACnB,WAAO1B,YAAY,CAAEe,OAAF,EAAWW,YAAX,CAAnB;AACA,GAHgC,EAIjC,CAAEX,OAAF,CAJiC,CAAlC;AAOAV,EAAAA,eAAe,CAAE,MAAM;AACtBS,IAAAA,eAAe,SAAf,IAAAA,eAAe,WAAf,YAAAA,eAAe,CAAIE,WAAW,CAACW,OAAhB,CAAf;AACA,GAFc,EAEZ,CAAEX,WAAW,CAACW,OAAd,CAFY,CAAf;AAIA,SACC,cAAC,aAAD,CAAe,QAAf;AAAwB,IAAA,KAAK,EAAGH;AAAhC,KACGT,OAAO,IACR,cAAC,iBAAD,eACMC,WADN;AAEC,IAAA,GAAG,EAAGD,OAAO,CAACa;AAFf,KAGMb,OAAO,CAACP,KAHd,GAKGiB,cALH,CAFF,EAUC,cAAC,MAAD,QACC,cAAC,aAAD;AACC,IAAA,GAAG,EAAGhB;AADP,KAEMQ,UAFN;AAGC,IAAA,SAAS,EAAGN,SAHb;AAIC,IAAA,QAAQ,EAAGE;AAJZ,MAMGK,cANH,EAOGR,QAPH,CADD,CAVD,CADD;AAwBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMmB,eAAe,GAAG5B,cAAc,CAAEM,MAAF,EAAU,QAAV,CAAtC;AAEA,eAAesB,eAAf","sourcesContent":["/*\n External dependencies\n /\n// eslint-disable-next-line no-restricted-imports\nimport { PopoverDisclosure, Portal } from 'reakit';\n\n/\n WordPress dependencies\n /\nimport { useCallback, useMemo, cloneElement } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { contextConnect } from '../../ui/context';\nimport { FlyoutContext } from '../context';\nimport { useFlyoutResizeUpdater } from '../utils';\nimport FlyoutContent from '../flyout-content';\nimport { useUpdateEffect } from '../../utils/hooks';\nimport { useFlyout } from './hook';\n\n/\n \n * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div', false>} props\n * @param {import('react').~~Ref~~<any>} forwardedRef\n /\nfunction Flyout( props, forwardedRef ) {\n\tconst {\n\t\tchildren,\n\t\televation,\n\t\tlabel,\n\t\tmaxWidth,\n\t\tonVisibleChange,\n\t\ttrigger,\n\t\tflyoutState,\n\t\t...otherProps\n\t} = useFlyout( props );\n\n\tconst resizeListener = useFlyoutResizeUpdater( {\n\t\tonResize: flyoutState.unstable_update,\n\t} );\n\n\tconst uniqueId = `flyout-${ flyoutState.baseId }`;\n\tconst labelId = label \|\| uniqueId;\n\n\tconst contextProps = useMemo(\n\t\t() => ( {\n\t\t\tlabel: labelId,\n\t\t\tflyoutState,\n\t\t} ),\n\t\t[ labelId, flyoutState ]\n\t);\n\n\tconst triggerContent = useCallback(\n\t\t( triggerProps ) => {\n\t\t\treturn cloneElement( trigger, triggerProps );\n\t\t},\n\t\t[ trigger ]\n\t);\n\n\tuseUpdateEffect( () => {\n\t\tonVisibleChange?.( flyoutState.visible );\n\t}, [ flyoutState.visible ] );\n\n\treturn (\n\t\t<FlyoutContext.Provider value={ contextProps }>\n\t\t\t{ trigger && (\n\t\t\t\t<PopoverDisclosure\n\t\t\t\t\t{ ...flyoutState }\n\t\t\t\t\tref={ trigger.ref }\n\t\t\t\t\t{ ...trigger.props }\n\t\t\t\t>\n\t\t\t\t\t{ triggerContent }\n\t\t\t\t</PopoverDisclosure>\n\t\t\t) }\n\t\t\t<Portal>\n\t\t\t\t<FlyoutContent\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t\televation={ elevation }\n\t\t\t\t\tmaxWidth={ maxWidth }\n\t\t\t\t>\n\t\t\t\t\t{ resizeListener }\n\t\t\t\t\t{ children }\n\t\t\t\t</FlyoutContent>\n\t\t\t</Portal>\n\t\t</FlyoutContext.Provider>\n\t);\n}\n\n/\n `Flyout` is a component to render a floating content modal.\n * It is similar in purpose to a tooltip, but renders content of any sort,\n * not only simple text.\n \n @example\n * ```jsx\n * import { Button, __experimentalFlyout as Flyout, __experimentalText as } from '@wordpress/components';\n \n function Example() {\n * \treturn (\n * \t\t<Flyout trigger={ <Button>Show/Hide content</Button> }>\n \t\t\t<Text>Code is Poetry</Text>\n \t\t</Flyout>\n * \t);\n * }\n * ```\n */\nconst ConnectedFlyout = contextConnect( Flyout, 'Flyout' );\n\nexport default ConnectedFlyout;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/flyout/flyout/component.js"],"names":["PopoverDisclosure","Portal","useCallback","useMemo","cloneElement","contextConnect","FlyoutContext","useFlyoutResizeUpdater","FlyoutContent","useUpdateEffect","useFlyout","Flyout","props","forwardedRef","children","elevation","label","maxWidth","onVisibleChange","trigger","flyoutState","otherProps","resizeListener","onResize","unstable_update","uniqueId","baseId","labelId","contextProps","triggerContent","triggerProps","visible","ref","ConnectedFlyout"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA,SAASA,iBAAT,EAA4BC,MAA5B,QAA0C,QAA1C;AAEA;AACA;AACA;;AACA,SAASC,WAAT,EAAsBC,OAAtB,EAA+BC,YAA/B,QAAmD,oBAAnD;AAEA;AACA;AACA;;AACA,SAASC,cAAT,QAA+B,kBAA/B;AACA,SAASC,aAAT,QAA8B,YAA9B;AACA,SAASC,sBAAT,QAAuC,UAAvC;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,SAASC,eAAT,QAAgC,mBAAhC;AACA,SAASC,SAAT,QAA0B,QAA1B;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,MAAT,CAAiBC,KAAjB,EAAwBC,YAAxB,EAAuC;AACtC,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,SAFK;AAGLC,IAAAA,KAHK;AAILC,IAAAA,QAJK;AAKLC,IAAAA,eALK;AAMLC,IAAAA,OANK;AAOLC,IAAAA,WAPK;AAQL,OAAGC;AARE,MASFX,SAAS,CAAEE,KAAF,CATb;AAWA,QAAMU,cAAc,GAAGf,sBAAsB,CAAE;AAC9CgB,IAAAA,QAAQ,EAAEH,WAAW,CAACI;AADwB,GAAF,CAA7C;AAIA,QAAMC,QAAQ,GAAI,UAAUL,WAAW,CAACM,MAAQ,EAAhD;AACA,QAAMC,OAAO,GAAGX,KAAK,IAAIS,QAAzB;AAEA,QAAMG,YAAY,GAAGzB,OAAO,CAC3B,OAAQ;AACPa,IAAAA,KAAK,EAAEW,OADA;AAEPP,IAAAA;AAFO,GAAR,CAD2B,EAK3B,CAAEO,OAAF,EAAWP,WAAX,CAL2B,CAA5B;AAQA,QAAMS,cAAc,GAAG3B,WAAW,CAC/B4B,YAAF,IAAoB;AACnB,WAAO1B,YAAY,CAAEe,OAAF,EAAWW,YAAX,CAAnB;AACA,GAHgC,EAIjC,CAAEX,OAAF,CAJiC,CAAlC;AAOAV,EAAAA,eAAe,CAAE,MAAM;AACtBS,IAAAA,eAAe,SAAf,IAAAA,eAAe,WAAf,YAAAA,eAAe,CAAIE,WAAW,CAACW,OAAhB,CAAf;AACA,GAFc,EAEZ,CAAEX,WAAW,CAACW,OAAd,CAFY,CAAf;AAIA,SACC,cAAC,aAAD,CAAe,QAAf;AAAwB,IAAA,KAAK,EAAGH;AAAhC,KACGT,OAAO,IACR,cAAC,iBAAD,eACMC,WADN;AAEC,IAAA,GAAG,EAAGD,OAAO,CAACa;AAFf,KAGMb,OAAO,CAACP,KAHd,GAKGiB,cALH,CAFF,EAUC,cAAC,MAAD,QACC,cAAC,aAAD;AACC,IAAA,GAAG,EAAGhB;AADP,KAEMQ,UAFN;AAGC,IAAA,SAAS,EAAGN,SAHb;AAIC,IAAA,QAAQ,EAAGE;AAJZ,MAMGK,cANH,EAOGR,QAPH,CADD,CAVD,CADD;AAwBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMmB,eAAe,GAAG5B,cAAc,CAAEM,MAAF,EAAU,QAAV,CAAtC;AAEA,eAAesB,eAAf","sourcesContent":["/*\n External dependencies\n /\n// eslint-disable-next-line no-restricted-imports\nimport { PopoverDisclosure, Portal } from 'reakit';\n\n/\n WordPress dependencies\n /\nimport { useCallback, useMemo, cloneElement } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { contextConnect } from '../../ui/context';\nimport { FlyoutContext } from '../context';\nimport { useFlyoutResizeUpdater } from '../utils';\nimport FlyoutContent from '../flyout-content';\nimport { useUpdateEffect } from '../../utils/hooks';\nimport { useFlyout } from './hook';\n\n/\n \n * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div', false>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n /\nfunction Flyout( props, forwardedRef ) {\n\tconst {\n\t\tchildren,\n\t\televation,\n\t\tlabel,\n\t\tmaxWidth,\n\t\tonVisibleChange,\n\t\ttrigger,\n\t\tflyoutState,\n\t\t...otherProps\n\t} = useFlyout( props );\n\n\tconst resizeListener = useFlyoutResizeUpdater( {\n\t\tonResize: flyoutState.unstable_update,\n\t} );\n\n\tconst uniqueId = `flyout-${ flyoutState.baseId }`;\n\tconst labelId = label \|\| uniqueId;\n\n\tconst contextProps = useMemo(\n\t\t() => ( {\n\t\t\tlabel: labelId,\n\t\t\tflyoutState,\n\t\t} ),\n\t\t[ labelId, flyoutState ]\n\t);\n\n\tconst triggerContent = useCallback(\n\t\t( triggerProps ) => {\n\t\t\treturn cloneElement( trigger, triggerProps );\n\t\t},\n\t\t[ trigger ]\n\t);\n\n\tuseUpdateEffect( () => {\n\t\tonVisibleChange?.( flyoutState.visible );\n\t}, [ flyoutState.visible ] );\n\n\treturn (\n\t\t<FlyoutContext.Provider value={ contextProps }>\n\t\t\t{ trigger && (\n\t\t\t\t<PopoverDisclosure\n\t\t\t\t\t{ ...flyoutState }\n\t\t\t\t\tref={ trigger.ref }\n\t\t\t\t\t{ ...trigger.props }\n\t\t\t\t>\n\t\t\t\t\t{ triggerContent }\n\t\t\t\t</PopoverDisclosure>\n\t\t\t) }\n\t\t\t<Portal>\n\t\t\t\t<FlyoutContent\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t\televation={ elevation }\n\t\t\t\t\tmaxWidth={ maxWidth }\n\t\t\t\t>\n\t\t\t\t\t{ resizeListener }\n\t\t\t\t\t{ children }\n\t\t\t\t</FlyoutContent>\n\t\t\t</Portal>\n\t\t</FlyoutContext.Provider>\n\t);\n}\n\n/\n `Flyout` is a component to render a floating content modal.\n * It is similar in purpose to a tooltip, but renders content of any sort,\n * not only simple text.\n \n @example\n * ```jsx\n * import { Button, __experimentalFlyout as Flyout, __experimentalText as } from '@wordpress/components';\n \n function Example() {\n * \treturn (\n * \t\t<Flyout trigger={ <Button>Show/Hide content</Button> }>\n \t\t\t<Text>Code is Poetry</Text>\n \t\t</Flyout>\n * \t);\n * }\n * ```\n */\nconst ConnectedFlyout = contextConnect( Flyout, 'Flyout' );\n\nexport default ConnectedFlyout;\n"]}

package/build-module/flyout/flyout-content/component.js CHANGED Viewed

@@ -10,7 +10,7 @@ import { contextConnect, useContextSystem } from '../../ui/context';
 /**
  *
  * @param {import('../../ui/context').WordPressComponentProps<import('../types').ContentProps, 'div', false>} props
- * @param {import('react').Ref<any>}                                                                          forwardedRef
+ * @param {import('react').ForwardedRef<any>}                                                                 forwardedRef forwardedRef
  */
 function FlyoutContent(props, forwardedRef) {

package/build-module/flyout/flyout-content/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/flyout/flyout-content/component.js"],"names":["useFlyoutContext","FlyoutContentView","CardView","contextConnect","useContextSystem","FlyoutContent","props","forwardedRef","children","elevation","maxWidth","style","otherProps","label","flyoutState","Error","showContent","visible","animating","ConnectedFlyoutContent"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,gBAAT,QAAiC,YAAjC;AACA,SAASC,iBAAT,EAA4BC,QAA5B,QAA4C,WAA5C;AACA,SAASC,cAAT,EAAyBC,gBAAzB,QAAiD,kBAAjD;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,aAAT,CAAwBC,KAAxB,EAA+BC,YAA/B,EAA8C;AAC7C,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,SAFK;AAGLC,IAAAA,QAHK;AAILC,IAAAA,KAAK,GAAG,EAJH;AAKL,OAAGC;AALE,MAMFR,gBAAgB,CAAEE,KAAF,EAAS,eAAT,CANpB;AAQA,QAAM;AAAEO,IAAAA,KAAF;AAASC,IAAAA;AAAT,MAAyBd,gBAAgB,EAA/C;;AAEA,MAAK,CAAEc,WAAP,EAAqB;AACpB,UAAM,IAAIC,KAAJ,CACL,sDADK,CAAN;AAGA;;AAED,QAAMC,WAAW,GAAGF,WAAW,CAACG,OAAZ,IAAuBH,WAAW,CAACI,SAAvD;AAEA,SACC,cAAC,iBAAD;AACC,kBAAaL,KADd,CAEC;AACA;AACA;AAJD;AAKC,IAAA,KAAK,EAAG;AAAEH,MAAAA,QAAF;AAAY,SAAGC;AAAf;AALT,KAMMC,UANN,EAOME,WAPN,GASGE,WAAW,IACZ,cAAC,QAAD;AAAU,IAAA,SAAS,EAAGP,SAAtB;AAAkC,IAAA,GAAG,EAAGF;AAAxC,KACGC,QADH,CAVF,CADD;AAiBA;;AAED,MAAMW,sBAAsB,GAAGhB,cAAc,CAAEE,aAAF,EAAiB,eAAjB,CAA7C;AAEA,eAAec,sBAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { useFlyoutContext } from '../context';\nimport { FlyoutContentView, CardView } from '../styles';\nimport { contextConnect, useContextSystem } from '../../ui/context';\n\n/\n \n * @param {import('../../ui/context').WordPressComponentProps<import('../types').ContentProps, 'div', false>} props\n * @param {import('react').~~Ref~~<any>} forwardedRef\n */\nfunction FlyoutContent( props, forwardedRef ) {\n\tconst {\n\t\tchildren,\n\t\televation,\n\t\tmaxWidth,\n\t\tstyle = {},\n\t\t...otherProps\n\t} = useContextSystem( props, 'FlyoutContent' );\n\n\tconst { label, flyoutState } = useFlyoutContext();\n\n\tif ( ! flyoutState ) {\n\t\tthrow new Error(\n\t\t\t'`FlyoutContent` must only be used inside a `Flyout`.'\n\t\t);\n\t}\n\n\tconst showContent = flyoutState.visible \|\| flyoutState.animating;\n\n\treturn (\n\t\t<FlyoutContentView\n\t\t\taria-label={ label }\n\t\t\t// maxWidth is applied via inline styles in order to avoid the `React does\n\t\t\t// not recognize the maxWidth prop on a DOM element` error that comes from\n\t\t\t// passing `maxWidth` as a prop to `FlyoutContentView`\n\t\t\tstyle={ { maxWidth, ...style } }\n\t\t\t{ ...otherProps }\n\t\t\t{ ...flyoutState }\n\t\t>\n\t\t\t{ showContent && (\n\t\t\t\t<CardView elevation={ elevation } ref={ forwardedRef }>\n\t\t\t\t\t{ children }\n\t\t\t\t</CardView>\n\t\t\t) }\n\t\t</FlyoutContentView>\n\t);\n}\n\nconst ConnectedFlyoutContent = contextConnect( FlyoutContent, 'FlyoutContent' );\n\nexport default ConnectedFlyoutContent;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/flyout/flyout-content/component.js"],"names":["useFlyoutContext","FlyoutContentView","CardView","contextConnect","useContextSystem","FlyoutContent","props","forwardedRef","children","elevation","maxWidth","style","otherProps","label","flyoutState","Error","showContent","visible","animating","ConnectedFlyoutContent"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,gBAAT,QAAiC,YAAjC;AACA,SAASC,iBAAT,EAA4BC,QAA5B,QAA4C,WAA5C;AACA,SAASC,cAAT,EAAyBC,gBAAzB,QAAiD,kBAAjD;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,aAAT,CAAwBC,KAAxB,EAA+BC,YAA/B,EAA8C;AAC7C,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,SAFK;AAGLC,IAAAA,QAHK;AAILC,IAAAA,KAAK,GAAG,EAJH;AAKL,OAAGC;AALE,MAMFR,gBAAgB,CAAEE,KAAF,EAAS,eAAT,CANpB;AAQA,QAAM;AAAEO,IAAAA,KAAF;AAASC,IAAAA;AAAT,MAAyBd,gBAAgB,EAA/C;;AAEA,MAAK,CAAEc,WAAP,EAAqB;AACpB,UAAM,IAAIC,KAAJ,CACL,sDADK,CAAN;AAGA;;AAED,QAAMC,WAAW,GAAGF,WAAW,CAACG,OAAZ,IAAuBH,WAAW,CAACI,SAAvD;AAEA,SACC,cAAC,iBAAD;AACC,kBAAaL,KADd,CAEC;AACA;AACA;AAJD;AAKC,IAAA,KAAK,EAAG;AAAEH,MAAAA,QAAF;AAAY,SAAGC;AAAf;AALT,KAMMC,UANN,EAOME,WAPN,GASGE,WAAW,IACZ,cAAC,QAAD;AAAU,IAAA,SAAS,EAAGP,SAAtB;AAAkC,IAAA,GAAG,EAAGF;AAAxC,KACGC,QADH,CAVF,CADD;AAiBA;;AAED,MAAMW,sBAAsB,GAAGhB,cAAc,CAAEE,aAAF,EAAiB,eAAjB,CAA7C;AAEA,eAAec,sBAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { useFlyoutContext } from '../context';\nimport { FlyoutContentView, CardView } from '../styles';\nimport { contextConnect, useContextSystem } from '../../ui/context';\n\n/\n \n * @param {import('../../ui/context').WordPressComponentProps<import('../types').ContentProps, 'div', false>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef forwardedRef\n */\nfunction FlyoutContent( props, forwardedRef ) {\n\tconst {\n\t\tchildren,\n\t\televation,\n\t\tmaxWidth,\n\t\tstyle = {},\n\t\t...otherProps\n\t} = useContextSystem( props, 'FlyoutContent' );\n\n\tconst { label, flyoutState } = useFlyoutContext();\n\n\tif ( ! flyoutState ) {\n\t\tthrow new Error(\n\t\t\t'`FlyoutContent` must only be used inside a `Flyout`.'\n\t\t);\n\t}\n\n\tconst showContent = flyoutState.visible \|\| flyoutState.animating;\n\n\treturn (\n\t\t<FlyoutContentView\n\t\t\taria-label={ label }\n\t\t\t// maxWidth is applied via inline styles in order to avoid the `React does\n\t\t\t// not recognize the maxWidth prop on a DOM element` error that comes from\n\t\t\t// passing `maxWidth` as a prop to `FlyoutContentView`\n\t\t\tstyle={ { maxWidth, ...style } }\n\t\t\t{ ...otherProps }\n\t\t\t{ ...flyoutState }\n\t\t>\n\t\t\t{ showContent && (\n\t\t\t\t<CardView elevation={ elevation } ref={ forwardedRef }>\n\t\t\t\t\t{ children }\n\t\t\t\t</CardView>\n\t\t\t) }\n\t\t</FlyoutContentView>\n\t);\n}\n\nconst ConnectedFlyoutContent = contextConnect( FlyoutContent, 'FlyoutContent' );\n\nexport default ConnectedFlyoutContent;\n"]}

package/build-module/focal-point-picker/index.js CHANGED Viewed

@@ -46,8 +46,9 @@ export class FocalPointPicker extends Component {
     };
     this.onChangeAtControls = value => {
-      this.updateValue(value);
-      this.props.onChange(value);
+      this.updateValue(value, () => {
+        this.props.onChange(this.state.percentages);
+      });
     };
     this.updateBounds = this.updateBounds.bind(this);
@@ -141,18 +142,22 @@ export class FocalPointPicker extends Component {
   }
   updateValue() {
+    var _this$props$resolvePo, _this$props$resolvePo2, _this$props;
     let nextValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    let callback = arguments.length > 1 ? arguments[1] : undefined;
+    const resolvedValue = (_this$props$resolvePo = (_this$props$resolvePo2 = (_this$props = this.props).resolvePoint) === null || _this$props$resolvePo2 === void 0 ? void 0 : _this$props$resolvePo2.call(_this$props, nextValue)) !== null && _this$props$resolvePo !== void 0 ? _this$props$resolvePo : nextValue;
     const {
       x,
       y
-    } = nextValue;
+    } = resolvedValue;
     const nextPercentage = {
       x: parseFloat(x).toFixed(2),
       y: parseFloat(y).toFixed(2)
     };
     this.setState({
       percentages: nextPercentage
-    });
+    }, callback);
   }
   updateBounds() {
@@ -162,7 +167,7 @@ export class FocalPointPicker extends Component {
   }
   startDrag(event) {
-    var _this$props$onDragSta, _this$props;
+    var _this$props$onDragSta, _this$props2;
     event.persist();
     this.containerRef.current.focus();
@@ -179,11 +184,11 @@ export class FocalPointPicker extends Component {
       y: event.pageY
     }, event.shiftKey);
     this.updateValue(value);
-    (_this$props$onDragSta = (_this$props = this.props).onDragStart) === null || _this$props$onDragSta === void 0 ? void 0 : _this$props$onDragSta.call(_this$props, value, event);
+    (_this$props$onDragSta = (_this$props2 = this.props).onDragStart) === null || _this$props$onDragSta === void 0 ? void 0 : _this$props$onDragSta.call(_this$props2, value, event);
   }
   stopDrag(event) {
-    var _this$props$onDragEnd, _this$props2;
+    var _this$props$onDragEnd, _this$props3;
     const {
       ownerDocument
@@ -195,7 +200,7 @@ export class FocalPointPicker extends Component {
     }, () => {
       this.props.onChange(this.state.percentages);
     });
-    (_this$props$onDragEnd = (_this$props2 = this.props).onDragEnd) === null || _this$props$onDragEnd === void 0 ? void 0 : _this$props$onDragEnd.call(_this$props2, event);
+    (_this$props$onDragEnd = (_this$props3 = this.props).onDragEnd) === null || _this$props$onDragEnd === void 0 ? void 0 : _this$props$onDragEnd.call(_this$props3, event);
   }
   onKeyDown(event) {
@@ -212,12 +217,13 @@ export class FocalPointPicker extends Component {
     const axis = keyCode === UP || keyCode === DOWN ? 'y' : 'x';
     const value = parseFloat(next[axis]) + delta;
     next[axis] = roundClamp(value, 0, 1, step);
-    this.updateValue(next);
-    this.props.onChange(next);
+    this.updateValue(next, () => {
+      this.props.onChange(this.state.percentages);
+    });
   }
   doDrag(event) {
-    var _this$props$onDrag, _this$props3;
+    var _this$props$onDrag, _this$props4;
     // Prevents text-selection when dragging.
     event.preventDefault();
@@ -226,7 +232,7 @@ export class FocalPointPicker extends Component {
       y: event.pageY
     }, event.shiftKey);
     this.updateValue(value);
-    (_this$props$onDrag = (_this$props3 = this.props).onDrag) === null || _this$props$onDrag === void 0 ? void 0 : _this$props$onDrag.call(_this$props3, value, event);
+    (_this$props$onDrag = (_this$props4 = this.props).onDrag) === null || _this$props$onDrag === void 0 ? void 0 : _this$props$onDrag.call(_this$props4, value, event);
   }
   getValueFromPoint(point, byTenths) {

package/build-module/focal-point-picker/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/focal-point-picker/index.js"],"names":["classnames","__","Component","createRef","withInstanceId","UP","DOWN","LEFT","RIGHT","BaseControl","Controls","FocalPoint","Grid","Media","MediaWrapper","MediaContainer","roundClamp","INITIAL_BOUNDS","FocalPointPicker","constructor","props","arguments","state","isDragging","bounds","percentages","value","containerRef","mediaRef","onMouseDown","startDrag","bind","onMouseUp","stopDrag","onKeyDown","onMouseMove","doDrag","ifDraggingStop","onChangeAtControls","updateValue","onChange","updateBounds","componentDidMount","defaultView","current","ownerDocument","addEventListener","componentDidUpdate","prevProps","url","x","y","setState","componentWillUnmount","removeEventListener","calculateBounds","clientWidth","clientHeight","dimensions","width","height","pickerDimensions","widthRatio","heightRatio","right","top","bottom","left","nextValue","nextPercentage","parseFloat","toFixed","event","persist","focus","getValueFromPoint","pageX","pageY","shiftKey","onDragStart","onDragEnd","keyCode","includes","preventDefault","next","step","delta","axis","onDrag","point","byTenths","relativePoint","Math","max","min","nextX","nextY","containerNode","getBoundingClientRect","document","body","scrollTop","iconCoordinates","undefined","render","autoPlay","className","help","instanceId","label","classes","id","defaultProps"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { Component, createRef } from '@wordpress/element';\nimport { withInstanceId } from '@wordpress/compose';\nimport { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';\n\n/\n Internal dependencies\n /\nimport BaseControl from '../base-control';\nimport Controls from './controls';\nimport FocalPoint from './focal-point';\nimport Grid from './grid';\nimport Media from './media';\nimport {\n\tMediaWrapper,\n\tMediaContainer,\n} from './styles/focal-point-picker-style';\nimport { roundClamp } from '../utils/math';\nimport { INITIAL_BOUNDS } from './utils';\n\nexport class FocalPointPicker extends Component {\n\tconstructor( props ) {\n\t\tsuper( ...arguments );\n\n\t\tthis.state = {\n\t\t\tisDragging: false,\n\t\t\tbounds: INITIAL_BOUNDS,\n\t\t\tpercentages: props.value,\n\t\t};\n\n\t\tthis.containerRef = createRef();\n\t\tthis.mediaRef = createRef();\n\n\t\tthis.onMouseDown = this.startDrag.bind( this );\n\t\tthis.onMouseUp = this.stopDrag.bind( this );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.onMouseMove = this.doDrag.bind( this );\n\t\tthis.ifDraggingStop = () => {\n\t\t\tif ( this.state.isDragging ) {\n\t\t\t\tthis.stopDrag();\n\t\t\t}\n\t\t};\n\t\tthis.onChangeAtControls = ( value ) => {\n\t\t\tthis.updateValue( value );\n\t\t\tthis.props.onChange( value );\n\t\t};\n\n\t\tthis.updateBounds = this.updateBounds.bind( this );\n\t\tthis.updateValue = this.updateValue.bind( this );\n\t}\n\tcomponentDidMount() {\n\t\tconst { defaultView } = this.containerRef.current.ownerDocument;\n\t\tdefaultView.addEventListener( 'resize', this.updateBounds );\n\n\t\t/\n\t\t * Set initial bound values.\n\t\t \n\t\t This is necessary for Safari:\n\t\t * https://github.com/WordPress/gutenberg/issues/25814\n\t\t /\n\t\tthis.updateBounds();\n\t}\n\tcomponentDidUpdate( prevProps ) {\n\t\tif ( prevProps.url !== this.props.url ) {\n\t\t\tthis.ifDraggingStop();\n\t\t}\n\t\t/\n\t\t * Handles cases where the incoming value changes.\n\t\t * An example is the values resetting based on an UNDO action.\n\t\t /\n\t\tconst {\n\t\t\tisDragging,\n\t\t\tpercentages: { x, y },\n\t\t} = this.state;\n\t\tconst { value } = this.props;\n\t\tif ( ! isDragging && ( value.x !== x \|\| value.y !== y ) ) {\n\t\t\tthis.setState( { percentages: this.props.value } );\n\t\t}\n\t}\n\tcomponentWillUnmount() {\n\t\tconst { defaultView } = this.containerRef.current.ownerDocument;\n\t\tdefaultView.removeEventListener( 'resize', this.updateBounds );\n\t\tthis.ifDraggingStop();\n\t}\n\tcalculateBounds() {\n\t\tconst bounds = INITIAL_BOUNDS;\n\n\t\tif ( ! this.mediaRef.current ) {\n\t\t\treturn bounds;\n\t\t}\n\n\t\t// Prevent division by zero when updateBounds runs in componentDidMount\n\t\tif (\n\t\t\tthis.mediaRef.current.clientWidth === 0 \|\|\n\t\t\tthis.mediaRef.current.clientHeight === 0\n\t\t) {\n\t\t\treturn bounds;\n\t\t}\n\n\t\tconst dimensions = {\n\t\t\twidth: this.mediaRef.current.clientWidth,\n\t\t\theight: this.mediaRef.current.clientHeight,\n\t\t};\n\n\t\tconst pickerDimensions = this.pickerDimensions();\n\n\t\tconst widthRatio = pickerDimensions.width / dimensions.width;\n\t\tconst heightRatio = pickerDimensions.height / dimensions.height;\n\n\t\tif ( heightRatio >= widthRatio ) {\n\t\t\tbounds.width = bounds.right = pickerDimensions.width;\n\t\t\tbounds.height = dimensions.height widthRatio;\n\t\t\tbounds.top = ( pickerDimensions.height - bounds.height ) / 2;\n\t\t\tbounds.bottom = bounds.top + bounds.height;\n\t\t} else {\n\t\t\tbounds.height = bounds.bottom = pickerDimensions.height;\n\t\t\tbounds.width = dimensions.width * heightRatio;\n\t\t\tbounds.left = ( pickerDimensions.width - bounds.width ) / 2;\n\t\t\tbounds.right = bounds.left + bounds.width;\n\t\t}\n\t\treturn bounds;\n\t}\n\tupdateValue( nextValue = {} ) {\n\t\tconst { x, y } = nextValue;\n\n\t\tconst nextPercentage = {\n\t\t\tx: parseFloat( x ).toFixed( 2 ),\n\t\t\ty: parseFloat( y ).toFixed( 2 ),\n\t\t};\n\n\t\tthis.setState( { percentages: nextPercentage } );\n\t}\n\tupdateBounds() {\n\t\tthis.setState( {\n\t\t\tbounds: this.calculateBounds(),\n\t\t} );\n\t}\n\tstartDrag( event ) {\n\t\tevent.persist();\n\t\tthis.containerRef.current.focus();\n\t\tthis.setState( { isDragging: true } );\n\t\tconst { ownerDocument } = this.containerRef.current;\n\t\townerDocument.addEventListener( 'mouseup', this.onMouseUp );\n\t\townerDocument.addEventListener( 'mousemove', this.onMouseMove );\n\t\tconst value = this.getValueFromPoint(\n\t\t\t{ x: event.pageX, y: event.pageY },\n\t\t\tevent.shiftKey\n\t\t);\n\t\tthis.updateValue( value );\n\t\tthis.props.onDragStart?.( value, event );\n\t}\n\tstopDrag( event ) {\n\t\tconst { ownerDocument } = this.containerRef.current;\n\t\townerDocument.removeEventListener( 'mouseup', this.onMouseUp );\n\t\townerDocument.removeEventListener( 'mousemove', this.onMouseMove );\n\t\tthis.setState( { isDragging: false }, () => {\n\t\t\tthis.props.onChange( this.state.percentages );\n\t\t} );\n\t\tthis.props.onDragEnd?.( event );\n\t}\n\tonKeyDown( event ) {\n\t\tconst { keyCode, shiftKey } = event;\n\t\tif ( ! [ UP, DOWN, LEFT, RIGHT ].includes( keyCode ) ) return;\n\n\t\tevent.preventDefault();\n\n\t\tconst next = { ...this.state.percentages };\n\t\tconst step = shiftKey ? 0.1 : 0.01;\n\t\tconst delta = keyCode === UP \|\| keyCode === LEFT ? -1 * step : step;\n\t\tconst axis = keyCode === UP \|\| keyCode === DOWN ? 'y' : 'x';\n\t\tconst value = parseFloat( next[ axis ] ) + delta;\n\n\t\tnext[ axis ] = roundClamp( value, 0, 1, step );\n\n\t\tthis.updateValue( next );\n\t\tthis.props.onChange( next );\n\t}\n\tdoDrag( event ) {\n\t\t// Prevents text-selection when dragging.\n\t\tevent.preventDefault();\n\t\tconst value = this.getValueFromPoint(\n\t\t\t{ x: event.pageX, y: event.pageY },\n\t\t\tevent.shiftKey\n\t\t);\n\t\tthis.updateValue( value );\n\t\tthis.props.onDrag?.( value, event );\n\t}\n\tgetValueFromPoint( point, byTenths ) {\n\t\tconst { bounds } = this.state;\n\n\t\tconst pickerDimensions = this.pickerDimensions();\n\t\tconst relativePoint = {\n\t\t\tleft: point.x - pickerDimensions.left,\n\t\t\ttop: point.y - pickerDimensions.top,\n\t\t};\n\n\t\tconst left = Math.max(\n\t\t\tbounds.left,\n\t\t\tMath.min( relativePoint.left, bounds.right )\n\t\t);\n\t\tconst top = Math.max(\n\t\t\tbounds.top,\n\t\t\tMath.min( relativePoint.top, bounds.bottom )\n\t\t);\n\n\t\tlet nextX =\n\t\t\t( left - bounds.left ) /\n\t\t\t( pickerDimensions.width - bounds.left * 2 );\n\t\tlet nextY =\n\t\t\t( top - bounds.top ) / ( pickerDimensions.height - bounds.top * 2 );\n\n\t\t// Enables holding shift to jump values by 10%\n\t\tconst step = byTenths ? 0.1 : 0.01;\n\n\t\tnextX = roundClamp( nextX, 0, 1, step );\n\t\tnextY = roundClamp( nextY, 0, 1, step );\n\n\t\treturn { x: nextX, y: nextY };\n\t}\n\tpickerDimensions() {\n\t\tconst containerNode = this.containerRef.current;\n\n\t\tif ( ! containerNode ) {\n\t\t\treturn {\n\t\t\t\twidth: 0,\n\t\t\t\theight: 0,\n\t\t\t\tleft: 0,\n\t\t\t\ttop: 0,\n\t\t\t};\n\t\t}\n\n\t\tconst { clientHeight, clientWidth } = containerNode;\n\t\tconst { top, left } = containerNode.getBoundingClientRect();\n\n\t\treturn {\n\t\t\twidth: clientWidth,\n\t\t\theight: clientHeight,\n\t\t\ttop: top + document.body.scrollTop,\n\t\t\tleft,\n\t\t};\n\t}\n\ticonCoordinates() {\n\t\tconst {\n\t\t\tbounds,\n\t\t\tpercentages: { x, y },\n\t\t} = this.state;\n\n\t\tif ( bounds.left === undefined \|\| bounds.top === undefined ) {\n\t\t\treturn {\n\t\t\t\tleft: '50%',\n\t\t\t\ttop: '50%',\n\t\t\t};\n\t\t}\n\n\t\tconst { width, height } = this.pickerDimensions();\n\t\treturn {\n\t\t\tleft: x * ( width - bounds.left * 2 ) + bounds.left,\n\t\t\ttop: y * ( height - bounds.top * 2 ) + bounds.top,\n\t\t};\n\t}\n\trender() {\n\t\tconst {\n\t\t\tautoPlay,\n\t\t\tclassName,\n\t\t\thelp,\n\t\t\tinstanceId,\n\t\t\tlabel,\n\t\t\turl,\n\t\t} = this.props;\n\t\tconst { bounds, isDragging, percentages } = this.state;\n\t\tconst iconCoordinates = this.iconCoordinates();\n\n\t\tconst classes = classnames(\n\t\t\t'components-focal-point-picker-control',\n\t\t\tclassName\n\t\t);\n\n\t\tconst id = `inspector-focal-point-picker-control-${ instanceId }`;\n\n\t\treturn (\n\t\t\t<BaseControl\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ id }\n\t\t\t\thelp={ help }\n\t\t\t\tclassName={ classes }\n\t\t\t>\n\t\t\t\t<MediaWrapper className=\"components-focal-point-picker-wrapper\">\n\t\t\t\t\t<MediaContainer\n\t\t\t\t\t\tclassName=\"components-focal-point-picker\"\n\t\t\t\t\t\tonKeyDown={ this.onKeyDown }\n\t\t\t\t\t\tonMouseDown={ this.onMouseDown }\n\t\t\t\t\t\tonBlur={ this.ifDraggingStop }\n\t\t\t\t\t\tref={ this.containerRef }\n\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\ttabIndex=\"-1\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Grid\n\t\t\t\t\t\t\tbounds={ bounds }\n\t\t\t\t\t\t\tvalue={ percentages.x + percentages.y }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Media\n\t\t\t\t\t\t\talt={ __( 'Media preview' ) }\n\t\t\t\t\t\t\tautoPlay={ autoPlay }\n\t\t\t\t\t\t\tmediaRef={ this.mediaRef }\n\t\t\t\t\t\t\tonLoad={ this.updateBounds }\n\t\t\t\t\t\t\tsrc={ url }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<FocalPoint\n\t\t\t\t\t\t\tcoordinates={ iconCoordinates }\n\t\t\t\t\t\t\tisDragging={ isDragging }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MediaContainer>\n\t\t\t\t</MediaWrapper>\n\t\t\t\t<Controls\n\t\t\t\t\tpercentages={ percentages }\n\t\t\t\t\tonChange={ this.onChangeAtControls }\n\t\t\t\t/>\n\t\t\t</BaseControl>\n\t\t);\n\t}\n}\n\nFocalPointPicker.defaultProps = {\n\tautoPlay: true,\n\tvalue: {\n\t\tx: 0.5,\n\t\ty: 0.5,\n\t},\n\turl: null,\n};\n\nexport default withInstanceId( FocalPointPicker );\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/focal-point-picker/index.js"],"names":["classnames","__","Component","createRef","withInstanceId","UP","DOWN","LEFT","RIGHT","BaseControl","Controls","FocalPoint","Grid","Media","MediaWrapper","MediaContainer","roundClamp","INITIAL_BOUNDS","FocalPointPicker","constructor","props","arguments","state","isDragging","bounds","percentages","value","containerRef","mediaRef","onMouseDown","startDrag","bind","onMouseUp","stopDrag","onKeyDown","onMouseMove","doDrag","ifDraggingStop","onChangeAtControls","updateValue","onChange","updateBounds","componentDidMount","defaultView","current","ownerDocument","addEventListener","componentDidUpdate","prevProps","url","x","y","setState","componentWillUnmount","removeEventListener","calculateBounds","clientWidth","clientHeight","dimensions","width","height","pickerDimensions","widthRatio","heightRatio","right","top","bottom","left","nextValue","callback","resolvedValue","resolvePoint","nextPercentage","parseFloat","toFixed","event","persist","focus","getValueFromPoint","pageX","pageY","shiftKey","onDragStart","onDragEnd","keyCode","includes","preventDefault","next","step","delta","axis","onDrag","point","byTenths","relativePoint","Math","max","min","nextX","nextY","containerNode","getBoundingClientRect","document","body","scrollTop","iconCoordinates","undefined","render","autoPlay","className","help","instanceId","label","classes","id","defaultProps"],"mappings":"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","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { Component, createRef } from '@wordpress/element';\nimport { withInstanceId } from '@wordpress/compose';\nimport { UP, DOWN, LEFT, RIGHT } from '@wordpress/keycodes';\n\n/\n Internal dependencies\n /\nimport BaseControl from '../base-control';\nimport Controls from './controls';\nimport FocalPoint from './focal-point';\nimport Grid from './grid';\nimport Media from './media';\nimport {\n\tMediaWrapper,\n\tMediaContainer,\n} from './styles/focal-point-picker-style';\nimport { roundClamp } from '../utils/math';\nimport { INITIAL_BOUNDS } from './utils';\n\nexport class FocalPointPicker extends Component {\n\tconstructor( props ) {\n\t\tsuper( ...arguments );\n\n\t\tthis.state = {\n\t\t\tisDragging: false,\n\t\t\tbounds: INITIAL_BOUNDS,\n\t\t\tpercentages: props.value,\n\t\t};\n\n\t\tthis.containerRef = createRef();\n\t\tthis.mediaRef = createRef();\n\n\t\tthis.onMouseDown = this.startDrag.bind( this );\n\t\tthis.onMouseUp = this.stopDrag.bind( this );\n\t\tthis.onKeyDown = this.onKeyDown.bind( this );\n\t\tthis.onMouseMove = this.doDrag.bind( this );\n\t\tthis.ifDraggingStop = () => {\n\t\t\tif ( this.state.isDragging ) {\n\t\t\t\tthis.stopDrag();\n\t\t\t}\n\t\t};\n\t\tthis.onChangeAtControls = ( value ) => {\n\t\t\tthis.updateValue( value, () => {\n\t\t\t\tthis.props.onChange( this.state.percentages );\n\t\t\t} );\n\t\t};\n\n\t\tthis.updateBounds = this.updateBounds.bind( this );\n\t\tthis.updateValue = this.updateValue.bind( this );\n\t}\n\tcomponentDidMount() {\n\t\tconst { defaultView } = this.containerRef.current.ownerDocument;\n\t\tdefaultView.addEventListener( 'resize', this.updateBounds );\n\n\t\t/\n\t\t * Set initial bound values.\n\t\t \n\t\t This is necessary for Safari:\n\t\t * https://github.com/WordPress/gutenberg/issues/25814\n\t\t /\n\t\tthis.updateBounds();\n\t}\n\tcomponentDidUpdate( prevProps ) {\n\t\tif ( prevProps.url !== this.props.url ) {\n\t\t\tthis.ifDraggingStop();\n\t\t}\n\t\t/\n\t\t * Handles cases where the incoming value changes.\n\t\t * An example is the values resetting based on an UNDO action.\n\t\t /\n\t\tconst {\n\t\t\tisDragging,\n\t\t\tpercentages: { x, y },\n\t\t} = this.state;\n\t\tconst { value } = this.props;\n\t\tif ( ! isDragging && ( value.x !== x \|\| value.y !== y ) ) {\n\t\t\tthis.setState( { percentages: this.props.value } );\n\t\t}\n\t}\n\tcomponentWillUnmount() {\n\t\tconst { defaultView } = this.containerRef.current.ownerDocument;\n\t\tdefaultView.removeEventListener( 'resize', this.updateBounds );\n\t\tthis.ifDraggingStop();\n\t}\n\tcalculateBounds() {\n\t\tconst bounds = INITIAL_BOUNDS;\n\n\t\tif ( ! this.mediaRef.current ) {\n\t\t\treturn bounds;\n\t\t}\n\n\t\t// Prevent division by zero when updateBounds runs in componentDidMount\n\t\tif (\n\t\t\tthis.mediaRef.current.clientWidth === 0 \|\|\n\t\t\tthis.mediaRef.current.clientHeight === 0\n\t\t) {\n\t\t\treturn bounds;\n\t\t}\n\n\t\tconst dimensions = {\n\t\t\twidth: this.mediaRef.current.clientWidth,\n\t\t\theight: this.mediaRef.current.clientHeight,\n\t\t};\n\n\t\tconst pickerDimensions = this.pickerDimensions();\n\n\t\tconst widthRatio = pickerDimensions.width / dimensions.width;\n\t\tconst heightRatio = pickerDimensions.height / dimensions.height;\n\n\t\tif ( heightRatio >= widthRatio ) {\n\t\t\tbounds.width = bounds.right = pickerDimensions.width;\n\t\t\tbounds.height = dimensions.height widthRatio;\n\t\t\tbounds.top = ( pickerDimensions.height - bounds.height ) / 2;\n\t\t\tbounds.bottom = bounds.top + bounds.height;\n\t\t} else {\n\t\t\tbounds.height = bounds.bottom = pickerDimensions.height;\n\t\t\tbounds.width = dimensions.width * heightRatio;\n\t\t\tbounds.left = ( pickerDimensions.width - bounds.width ) / 2;\n\t\t\tbounds.right = bounds.left + bounds.width;\n\t\t}\n\t\treturn bounds;\n\t}\n\tupdateValue( nextValue = {}, callback ) {\n\t\tconst resolvedValue =\n\t\t\tthis.props.resolvePoint?.( nextValue ) ?? nextValue;\n\n\t\tconst { x, y } = resolvedValue;\n\n\t\tconst nextPercentage = {\n\t\t\tx: parseFloat( x ).toFixed( 2 ),\n\t\t\ty: parseFloat( y ).toFixed( 2 ),\n\t\t};\n\n\t\tthis.setState( { percentages: nextPercentage }, callback );\n\t}\n\tupdateBounds() {\n\t\tthis.setState( {\n\t\t\tbounds: this.calculateBounds(),\n\t\t} );\n\t}\n\tstartDrag( event ) {\n\t\tevent.persist();\n\t\tthis.containerRef.current.focus();\n\t\tthis.setState( { isDragging: true } );\n\t\tconst { ownerDocument } = this.containerRef.current;\n\t\townerDocument.addEventListener( 'mouseup', this.onMouseUp );\n\t\townerDocument.addEventListener( 'mousemove', this.onMouseMove );\n\t\tconst value = this.getValueFromPoint(\n\t\t\t{ x: event.pageX, y: event.pageY },\n\t\t\tevent.shiftKey\n\t\t);\n\t\tthis.updateValue( value );\n\t\tthis.props.onDragStart?.( value, event );\n\t}\n\tstopDrag( event ) {\n\t\tconst { ownerDocument } = this.containerRef.current;\n\t\townerDocument.removeEventListener( 'mouseup', this.onMouseUp );\n\t\townerDocument.removeEventListener( 'mousemove', this.onMouseMove );\n\t\tthis.setState( { isDragging: false }, () => {\n\t\t\tthis.props.onChange( this.state.percentages );\n\t\t} );\n\t\tthis.props.onDragEnd?.( event );\n\t}\n\tonKeyDown( event ) {\n\t\tconst { keyCode, shiftKey } = event;\n\t\tif ( ! [ UP, DOWN, LEFT, RIGHT ].includes( keyCode ) ) return;\n\n\t\tevent.preventDefault();\n\n\t\tconst next = { ...this.state.percentages };\n\t\tconst step = shiftKey ? 0.1 : 0.01;\n\t\tconst delta = keyCode === UP \|\| keyCode === LEFT ? -1 * step : step;\n\t\tconst axis = keyCode === UP \|\| keyCode === DOWN ? 'y' : 'x';\n\t\tconst value = parseFloat( next[ axis ] ) + delta;\n\n\t\tnext[ axis ] = roundClamp( value, 0, 1, step );\n\n\t\tthis.updateValue( next, () => {\n\t\t\tthis.props.onChange( this.state.percentages );\n\t\t} );\n\t}\n\tdoDrag( event ) {\n\t\t// Prevents text-selection when dragging.\n\t\tevent.preventDefault();\n\t\tconst value = this.getValueFromPoint(\n\t\t\t{ x: event.pageX, y: event.pageY },\n\t\t\tevent.shiftKey\n\t\t);\n\t\tthis.updateValue( value );\n\t\tthis.props.onDrag?.( value, event );\n\t}\n\tgetValueFromPoint( point, byTenths ) {\n\t\tconst { bounds } = this.state;\n\n\t\tconst pickerDimensions = this.pickerDimensions();\n\t\tconst relativePoint = {\n\t\t\tleft: point.x - pickerDimensions.left,\n\t\t\ttop: point.y - pickerDimensions.top,\n\t\t};\n\n\t\tconst left = Math.max(\n\t\t\tbounds.left,\n\t\t\tMath.min( relativePoint.left, bounds.right )\n\t\t);\n\t\tconst top = Math.max(\n\t\t\tbounds.top,\n\t\t\tMath.min( relativePoint.top, bounds.bottom )\n\t\t);\n\n\t\tlet nextX =\n\t\t\t( left - bounds.left ) /\n\t\t\t( pickerDimensions.width - bounds.left * 2 );\n\t\tlet nextY =\n\t\t\t( top - bounds.top ) / ( pickerDimensions.height - bounds.top * 2 );\n\n\t\t// Enables holding shift to jump values by 10%\n\t\tconst step = byTenths ? 0.1 : 0.01;\n\n\t\tnextX = roundClamp( nextX, 0, 1, step );\n\t\tnextY = roundClamp( nextY, 0, 1, step );\n\n\t\treturn { x: nextX, y: nextY };\n\t}\n\tpickerDimensions() {\n\t\tconst containerNode = this.containerRef.current;\n\n\t\tif ( ! containerNode ) {\n\t\t\treturn {\n\t\t\t\twidth: 0,\n\t\t\t\theight: 0,\n\t\t\t\tleft: 0,\n\t\t\t\ttop: 0,\n\t\t\t};\n\t\t}\n\n\t\tconst { clientHeight, clientWidth } = containerNode;\n\t\tconst { top, left } = containerNode.getBoundingClientRect();\n\n\t\treturn {\n\t\t\twidth: clientWidth,\n\t\t\theight: clientHeight,\n\t\t\ttop: top + document.body.scrollTop,\n\t\t\tleft,\n\t\t};\n\t}\n\ticonCoordinates() {\n\t\tconst {\n\t\t\tbounds,\n\t\t\tpercentages: { x, y },\n\t\t} = this.state;\n\n\t\tif ( bounds.left === undefined \|\| bounds.top === undefined ) {\n\t\t\treturn {\n\t\t\t\tleft: '50%',\n\t\t\t\ttop: '50%',\n\t\t\t};\n\t\t}\n\n\t\tconst { width, height } = this.pickerDimensions();\n\t\treturn {\n\t\t\tleft: x * ( width - bounds.left * 2 ) + bounds.left,\n\t\t\ttop: y * ( height - bounds.top * 2 ) + bounds.top,\n\t\t};\n\t}\n\trender() {\n\t\tconst {\n\t\t\tautoPlay,\n\t\t\tclassName,\n\t\t\thelp,\n\t\t\tinstanceId,\n\t\t\tlabel,\n\t\t\turl,\n\t\t} = this.props;\n\t\tconst { bounds, isDragging, percentages } = this.state;\n\t\tconst iconCoordinates = this.iconCoordinates();\n\n\t\tconst classes = classnames(\n\t\t\t'components-focal-point-picker-control',\n\t\t\tclassName\n\t\t);\n\n\t\tconst id = `inspector-focal-point-picker-control-${ instanceId }`;\n\n\t\treturn (\n\t\t\t<BaseControl\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ id }\n\t\t\t\thelp={ help }\n\t\t\t\tclassName={ classes }\n\t\t\t>\n\t\t\t\t<MediaWrapper className=\"components-focal-point-picker-wrapper\">\n\t\t\t\t\t<MediaContainer\n\t\t\t\t\t\tclassName=\"components-focal-point-picker\"\n\t\t\t\t\t\tonKeyDown={ this.onKeyDown }\n\t\t\t\t\t\tonMouseDown={ this.onMouseDown }\n\t\t\t\t\t\tonBlur={ this.ifDraggingStop }\n\t\t\t\t\t\tref={ this.containerRef }\n\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\ttabIndex=\"-1\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Grid\n\t\t\t\t\t\t\tbounds={ bounds }\n\t\t\t\t\t\t\tvalue={ percentages.x + percentages.y }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Media\n\t\t\t\t\t\t\talt={ __( 'Media preview' ) }\n\t\t\t\t\t\t\tautoPlay={ autoPlay }\n\t\t\t\t\t\t\tmediaRef={ this.mediaRef }\n\t\t\t\t\t\t\tonLoad={ this.updateBounds }\n\t\t\t\t\t\t\tsrc={ url }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<FocalPoint\n\t\t\t\t\t\t\tcoordinates={ iconCoordinates }\n\t\t\t\t\t\t\tisDragging={ isDragging }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MediaContainer>\n\t\t\t\t</MediaWrapper>\n\t\t\t\t<Controls\n\t\t\t\t\tpercentages={ percentages }\n\t\t\t\t\tonChange={ this.onChangeAtControls }\n\t\t\t\t/>\n\t\t\t</BaseControl>\n\t\t);\n\t}\n}\n\nFocalPointPicker.defaultProps = {\n\tautoPlay: true,\n\tvalue: {\n\t\tx: 0.5,\n\t\ty: 0.5,\n\t},\n\turl: null,\n};\n\nexport default withInstanceId( FocalPointPicker );\n"]}

package/build-module/font-size-picker/index.js CHANGED Viewed

@@ -102,7 +102,6 @@ function FontSizePicker(_ref, ref) {
     className: `${baseClassName}__header__hint`
   }, headerHint)), !disableCustomFontSizes && createElement(FlexItem, null, createElement(Button, {
     label: showCustomValueControl ? __('Use size preset') : __('Set custom size'),
-    showTooltip: false,
     icon: settings,
     onClick: () => {
       setShowCustomValueControl(!showCustomValueControl);

package/build-module/font-size-picker/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/font-size-picker/index.js"],"names":["__","sprintf","settings","useState","useMemo","forwardRef","Button","RangeControl","Flex","FlexItem","default","UnitControl","useCustomUnits","CustomSelectControl","VisuallyHidden","ToggleGroupControl","ToggleGroupControlOption","getFontSizeOptions","getSelectedOption","splitValueAndUnitFromSize","isSimpleCssValue","CUSTOM_FONT_SIZE","FontSizePicker","ref","fallbackFontSize","fontSizes","disableCustomFontSizes","onChange","value","withSlider","withReset","hasUnits","size","includes","noUnitsValue","parseInt","isPixelValue","endsWith","units","availableUnits","fontSizesContainComplexValues","some","shouldUseSelectControl","length","options","selectedOption","isCustomValue","slug","showCustomValueControl","setShowCustomValueControl","headerHint","hint","name","unit","currentFontSizeSR","baseClassName","find","option","key","selectedItem","Number","newValue","map","label","nextSize","parseFloat","undefined"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { __, sprintf } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\nimport { useState, useMemo, forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport Button from '../button';\nimport RangeControl from '../range-control';\nimport { Flex, FlexItem } from '../flex';\nimport { default as UnitControl, useCustomUnits } from '../unit-control';\nimport CustomSelectControl from '../custom-select-control';\nimport { VisuallyHidden } from '../visually-hidden';\nimport {\n\tToggleGroupControl,\n\tToggleGroupControlOption,\n} from '../toggle-group-control';\nimport {\n\tgetFontSizeOptions,\n\tgetSelectedOption,\n\tsplitValueAndUnitFromSize,\n\tisSimpleCssValue,\n\tCUSTOM_FONT_SIZE,\n} from './utils';\n\nfunction FontSizePicker(\n\t{\n\t\tfallbackFontSize,\n\t\tfontSizes = [],\n\t\tdisableCustomFontSizes = false,\n\t\tonChange,\n\t\tvalue,\n\t\twithSlider = false,\n\t\twithReset = true,\n\t},\n\tref\n) {\n\tconst hasUnits = [ typeof value, typeof fontSizes?.[ 0 ]?.size ].includes(\n\t\t'string'\n\t);\n\tconst noUnitsValue = ! hasUnits ? value : parseInt( value );\n\tconst isPixelValue = typeof value === 'number' \|\| value?.endsWith?.( 'px' );\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: [ 'px', 'em', 'rem' ],\n\t} );\n\n\t/\n\t The main font size UI displays a toggle group when the presets are less\n\t * than six and a select control when they are more.\n\t */\n\tconst fontSizesContainComplexValues = fontSizes.some(\n\t\t( { size } ) => ! isSimpleCssValue( size )\n\t);\n\tconst shouldUseSelectControl = fontSizes.length > 5;\n\tconst options = useMemo(\n\t\t() =>\n\t\t\tgetFontSizeOptions(\n\t\t\t\tshouldUseSelectControl,\n\t\t\t\tfontSizes,\n\t\t\t\tdisableCustomFontSizes,\n\t\t\t\tfontSizesContainComplexValues\n\t\t\t),\n\t\t[\n\t\t\tshouldUseSelectControl,\n\t\t\tfontSizes,\n\t\t\tdisableCustomFontSizes,\n\t\t\tfontSizesContainComplexValues,\n\t\t]\n\t);\n\tconst selectedOption = getSelectedOption( fontSizes, value );\n\tconst isCustomValue = selectedOption.slug === CUSTOM_FONT_SIZE;\n\tconst [ showCustomValueControl, setShowCustomValueControl ] = useState(\n\t\t! disableCustomFontSizes && isCustomValue\n\t);\n\tconst headerHint = useMemo( () => {\n\t\tif ( showCustomValueControl ) {\n\t\t\treturn `(${ __( 'Custom' ) })`;\n\t\t}\n\n\t\t// If we have a custom value that is not available in the font sizes,\n\t\t// show it as a hint as long as it's a simple CSS value.\n\t\tif ( isCustomValue ) {\n\t\t\treturn isSimpleCssValue( value ) && `(${ value })`;\n\t\t}\n\t\tif ( shouldUseSelectControl ) {\n\t\t\treturn (\n\t\t\t\tisSimpleCssValue( selectedOption?.size ) &&\n\t\t\t\t`(${ selectedOption?.size })`\n\t\t\t);\n\t\t}\n\t\t// Calculate the `hint` for toggle group control.\n\t\tlet hint = selectedOption.name;\n\t\tif (\n\t\t\t! fontSizesContainComplexValues &&\n\t\t\ttypeof selectedOption.size === 'string'\n\t\t) {\n\t\t\tconst [ , unit ] = splitValueAndUnitFromSize( selectedOption.size );\n\t\t\thint += `(${ unit })`;\n\t\t}\n\t\treturn hint;\n\t}, [\n\t\tshowCustomValueControl,\n\t\tselectedOption?.slug,\n\t\tvalue,\n\t\tisCustomValue,\n\t\tfontSizesContainComplexValues,\n\t] );\n\n\tif ( ! options ) {\n\t\treturn null;\n\t}\n\n\t// This is used for select control only. We need to add support\n\t// for ToggleGroupControl.\n\tconst currentFontSizeSR = sprintf(\n\t\t// translators: %s: Currently selected font size.\n\t\t__( 'Currently selected font size: %s' ),\n\t\tselectedOption.name\n\t);\n\tconst baseClassName = 'components-font-size-picker';\n\treturn (\n\t\t<fieldset className={ baseClassName } { ...( ref ? {} : { ref } ) }>\n\t\t\t<VisuallyHidden as=\"legend\">{ __( 'Font size' ) }</VisuallyHidden>\n\t\t\t<Flex\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName={ `${ baseClassName }__header` }\n\t\t\t>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t{ __( 'Size' ) }\n\t\t\t\t\t{ headerHint && (\n\t\t\t\t\t\t<span className={ `${ baseClassName }__header__hint` }>\n\t\t\t\t\t\t\t{ headerHint }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) }\n\t\t\t\t</FlexItem>\n\t\t\t\t{ ! disableCustomFontSizes && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tshowCustomValueControl\n\t\t\t\t\t\t\t\t\t? __( 'Use size preset' )\n\t\t\t\t\t\t\t\t\t: __( 'Set custom size' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tshowTooltip={ false }\n\t\t\t\t\t\t\ticon={ settings }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetShowCustomValueControl(\n\t\t\t\t\t\t\t\t\t! showCustomValueControl\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tisPressed={ showCustomValueControl }\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</Flex>\n\t\t\t<div className={ `${ baseClassName }__controls` }>\n\t\t\t\t{ !! fontSizes.length &&\n\t\t\t\t\tshouldUseSelectControl &&\n\t\t\t\t\t! showCustomValueControl && (\n\t\t\t\t\t\t<CustomSelectControl\n\t\t\t\t\t\t\tclassName={ `${ baseClassName }__select` }\n\t\t\t\t\t\t\tlabel={ __( 'Font size' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tdescribedBy={ currentFontSizeSR }\n\t\t\t\t\t\t\toptions={ options }\n\t\t\t\t\t\t\tvalue={ options.find(\n\t\t\t\t\t\t\t\t( option ) => option.key === selectedOption.slug\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonChange={ ( { selectedItem } ) => {\n\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\thasUnits\n\t\t\t\t\t\t\t\t\t\t? selectedItem.size\n\t\t\t\t\t\t\t\t\t\t: Number( selectedItem.size )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tif ( selectedItem.key === CUSTOM_FONT_SIZE ) {\n\t\t\t\t\t\t\t\t\tsetShowCustomValueControl( true );\n\t\t\t\t\t\t\t\t}\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{ ! shouldUseSelectControl && ! showCustomValueControl && (\n\t\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t\tlabel={ __( 'Font size' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\thasUnits ? newValue : Number( newValue )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisBlock\n\t\t\t\t\t>\n\t\t\t\t\t\t{ options.map( ( option ) => (\n\t\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\t\tkey={ option.key }\n\t\t\t\t\t\t\t\tvalue={ option.value }\n\t\t\t\t\t\t\t\tlabel={ option.label }\n\t\t\t\t\t\t\t\taria-label={ option.name }\n\t\t\t\t\t\t\t\tshowTooltip={ true }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</ToggleGroupControl>\n\t\t\t\t) }\n\t\t\t\t{ ! withSlider &&\n\t\t\t\t\t! disableCustomFontSizes &&\n\t\t\t\t\tshowCustomValueControl && (\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\tclassName={ `${ baseClassName }__custom-size-control` }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Custom' ) }\n\t\t\t\t\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\t\tonChange={ ( nextSize ) => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t0 === parseFloat( nextSize ) \|\|\n\t\t\t\t\t\t\t\t\t\t\t! nextSize\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tonChange( undefined );\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\thasUnits\n\t\t\t\t\t\t\t\t\t\t\t\t\t? nextSize\n\t\t\t\t\t\t\t\t\t\t\t\t\t: parseInt( nextSize, 10 )\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tunits={ hasUnits ? units : false }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t{ withReset && (\n\t\t\t\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tclassName=\"components-color-palette__clear\"\n\t\t\t\t\t\t\t\t\t\tdisabled={ value === undefined }\n\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\tonChange( undefined );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ withSlider && (\n\t\t\t\t<RangeControl\n\t\t\t\t\tclassName={ `${ baseClassName }__custom-input` }\n\t\t\t\t\tlabel={ __( 'Custom Size' ) }\n\t\t\t\t\tvalue={ ( isPixelValue && noUnitsValue ) \|\| '' }\n\t\t\t\t\tinitialPosition={ fallbackFontSize }\n\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\tonChange( hasUnits ? newValue + 'px' : newValue );\n\t\t\t\t\t} }\n\t\t\t\t\tmin={ 12 }\n\t\t\t\t\tmax={ 100 }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</fieldset>\n\t);\n}\n\nexport default forwardRef( FontSizePicker );\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/font-size-picker/index.js"],"names":["__","sprintf","settings","useState","useMemo","forwardRef","Button","RangeControl","Flex","FlexItem","default","UnitControl","useCustomUnits","CustomSelectControl","VisuallyHidden","ToggleGroupControl","ToggleGroupControlOption","getFontSizeOptions","getSelectedOption","splitValueAndUnitFromSize","isSimpleCssValue","CUSTOM_FONT_SIZE","FontSizePicker","ref","fallbackFontSize","fontSizes","disableCustomFontSizes","onChange","value","withSlider","withReset","hasUnits","size","includes","noUnitsValue","parseInt","isPixelValue","endsWith","units","availableUnits","fontSizesContainComplexValues","some","shouldUseSelectControl","length","options","selectedOption","isCustomValue","slug","showCustomValueControl","setShowCustomValueControl","headerHint","hint","name","unit","currentFontSizeSR","baseClassName","find","option","key","selectedItem","Number","newValue","map","label","nextSize","parseFloat","undefined"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { __, sprintf } from '@wordpress/i18n';\nimport { settings } from '@wordpress/icons';\nimport { useState, useMemo, forwardRef } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport Button from '../button';\nimport RangeControl from '../range-control';\nimport { Flex, FlexItem } from '../flex';\nimport { default as UnitControl, useCustomUnits } from '../unit-control';\nimport CustomSelectControl from '../custom-select-control';\nimport { VisuallyHidden } from '../visually-hidden';\nimport {\n\tToggleGroupControl,\n\tToggleGroupControlOption,\n} from '../toggle-group-control';\nimport {\n\tgetFontSizeOptions,\n\tgetSelectedOption,\n\tsplitValueAndUnitFromSize,\n\tisSimpleCssValue,\n\tCUSTOM_FONT_SIZE,\n} from './utils';\n\nfunction FontSizePicker(\n\t{\n\t\tfallbackFontSize,\n\t\tfontSizes = [],\n\t\tdisableCustomFontSizes = false,\n\t\tonChange,\n\t\tvalue,\n\t\twithSlider = false,\n\t\twithReset = true,\n\t},\n\tref\n) {\n\tconst hasUnits = [ typeof value, typeof fontSizes?.[ 0 ]?.size ].includes(\n\t\t'string'\n\t);\n\tconst noUnitsValue = ! hasUnits ? value : parseInt( value );\n\tconst isPixelValue = typeof value === 'number' \|\| value?.endsWith?.( 'px' );\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: [ 'px', 'em', 'rem' ],\n\t} );\n\n\t/\n\t The main font size UI displays a toggle group when the presets are less\n\t * than six and a select control when they are more.\n\t */\n\tconst fontSizesContainComplexValues = fontSizes.some(\n\t\t( { size } ) => ! isSimpleCssValue( size )\n\t);\n\tconst shouldUseSelectControl = fontSizes.length > 5;\n\tconst options = useMemo(\n\t\t() =>\n\t\t\tgetFontSizeOptions(\n\t\t\t\tshouldUseSelectControl,\n\t\t\t\tfontSizes,\n\t\t\t\tdisableCustomFontSizes,\n\t\t\t\tfontSizesContainComplexValues\n\t\t\t),\n\t\t[\n\t\t\tshouldUseSelectControl,\n\t\t\tfontSizes,\n\t\t\tdisableCustomFontSizes,\n\t\t\tfontSizesContainComplexValues,\n\t\t]\n\t);\n\tconst selectedOption = getSelectedOption( fontSizes, value );\n\tconst isCustomValue = selectedOption.slug === CUSTOM_FONT_SIZE;\n\tconst [ showCustomValueControl, setShowCustomValueControl ] = useState(\n\t\t! disableCustomFontSizes && isCustomValue\n\t);\n\tconst headerHint = useMemo( () => {\n\t\tif ( showCustomValueControl ) {\n\t\t\treturn `(${ __( 'Custom' ) })`;\n\t\t}\n\n\t\t// If we have a custom value that is not available in the font sizes,\n\t\t// show it as a hint as long as it's a simple CSS value.\n\t\tif ( isCustomValue ) {\n\t\t\treturn isSimpleCssValue( value ) && `(${ value })`;\n\t\t}\n\t\tif ( shouldUseSelectControl ) {\n\t\t\treturn (\n\t\t\t\tisSimpleCssValue( selectedOption?.size ) &&\n\t\t\t\t`(${ selectedOption?.size })`\n\t\t\t);\n\t\t}\n\t\t// Calculate the `hint` for toggle group control.\n\t\tlet hint = selectedOption.name;\n\t\tif (\n\t\t\t! fontSizesContainComplexValues &&\n\t\t\ttypeof selectedOption.size === 'string'\n\t\t) {\n\t\t\tconst [ , unit ] = splitValueAndUnitFromSize( selectedOption.size );\n\t\t\thint += `(${ unit })`;\n\t\t}\n\t\treturn hint;\n\t}, [\n\t\tshowCustomValueControl,\n\t\tselectedOption?.slug,\n\t\tvalue,\n\t\tisCustomValue,\n\t\tfontSizesContainComplexValues,\n\t] );\n\n\tif ( ! options ) {\n\t\treturn null;\n\t}\n\n\t// This is used for select control only. We need to add support\n\t// for ToggleGroupControl.\n\tconst currentFontSizeSR = sprintf(\n\t\t// translators: %s: Currently selected font size.\n\t\t__( 'Currently selected font size: %s' ),\n\t\tselectedOption.name\n\t);\n\tconst baseClassName = 'components-font-size-picker';\n\treturn (\n\t\t<fieldset className={ baseClassName } { ...( ref ? {} : { ref } ) }>\n\t\t\t<VisuallyHidden as=\"legend\">{ __( 'Font size' ) }</VisuallyHidden>\n\t\t\t<Flex\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName={ `${ baseClassName }__header` }\n\t\t\t>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t{ __( 'Size' ) }\n\t\t\t\t\t{ headerHint && (\n\t\t\t\t\t\t<span className={ `${ baseClassName }__header__hint` }>\n\t\t\t\t\t\t\t{ headerHint }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) }\n\t\t\t\t</FlexItem>\n\t\t\t\t{ ! disableCustomFontSizes && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tshowCustomValueControl\n\t\t\t\t\t\t\t\t\t? __( 'Use size preset' )\n\t\t\t\t\t\t\t\t\t: __( 'Set custom size' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ settings }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetShowCustomValueControl(\n\t\t\t\t\t\t\t\t\t! showCustomValueControl\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tisPressed={ showCustomValueControl }\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</Flex>\n\t\t\t<div className={ `${ baseClassName }__controls` }>\n\t\t\t\t{ !! fontSizes.length &&\n\t\t\t\t\tshouldUseSelectControl &&\n\t\t\t\t\t! showCustomValueControl && (\n\t\t\t\t\t\t<CustomSelectControl\n\t\t\t\t\t\t\tclassName={ `${ baseClassName }__select` }\n\t\t\t\t\t\t\tlabel={ __( 'Font size' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tdescribedBy={ currentFontSizeSR }\n\t\t\t\t\t\t\toptions={ options }\n\t\t\t\t\t\t\tvalue={ options.find(\n\t\t\t\t\t\t\t\t( option ) => option.key === selectedOption.slug\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonChange={ ( { selectedItem } ) => {\n\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\thasUnits\n\t\t\t\t\t\t\t\t\t\t? selectedItem.size\n\t\t\t\t\t\t\t\t\t\t: Number( selectedItem.size )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\tif ( selectedItem.key === CUSTOM_FONT_SIZE ) {\n\t\t\t\t\t\t\t\t\tsetShowCustomValueControl( true );\n\t\t\t\t\t\t\t\t}\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{ ! shouldUseSelectControl && ! showCustomValueControl && (\n\t\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t\tlabel={ __( 'Font size' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\thasUnits ? newValue : Number( newValue )\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisBlock\n\t\t\t\t\t>\n\t\t\t\t\t\t{ options.map( ( option ) => (\n\t\t\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\t\t\tkey={ option.key }\n\t\t\t\t\t\t\t\tvalue={ option.value }\n\t\t\t\t\t\t\t\tlabel={ option.label }\n\t\t\t\t\t\t\t\taria-label={ option.name }\n\t\t\t\t\t\t\t\tshowTooltip={ true }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</ToggleGroupControl>\n\t\t\t\t) }\n\t\t\t\t{ ! withSlider &&\n\t\t\t\t\t! disableCustomFontSizes &&\n\t\t\t\t\tshowCustomValueControl && (\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\tclassName={ `${ baseClassName }__custom-size-control` }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Custom' ) }\n\t\t\t\t\t\t\t\t\tlabelPosition=\"top\"\n\t\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\t\tonChange={ ( nextSize ) => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t0 === parseFloat( nextSize ) \|\|\n\t\t\t\t\t\t\t\t\t\t\t! nextSize\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tonChange( undefined );\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\thasUnits\n\t\t\t\t\t\t\t\t\t\t\t\t\t? nextSize\n\t\t\t\t\t\t\t\t\t\t\t\t\t: parseInt( nextSize, 10 )\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tunits={ hasUnits ? units : false }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t{ withReset && (\n\t\t\t\t\t\t\t\t<FlexItem isBlock>\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tclassName=\"components-color-palette__clear\"\n\t\t\t\t\t\t\t\t\t\tdisabled={ value === undefined }\n\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\tonChange( undefined );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ withSlider && (\n\t\t\t\t<RangeControl\n\t\t\t\t\tclassName={ `${ baseClassName }__custom-input` }\n\t\t\t\t\tlabel={ __( 'Custom Size' ) }\n\t\t\t\t\tvalue={ ( isPixelValue && noUnitsValue ) \|\| '' }\n\t\t\t\t\tinitialPosition={ fallbackFontSize }\n\t\t\t\t\tonChange={ ( newValue ) => {\n\t\t\t\t\t\tonChange( hasUnits ? newValue + 'px' : newValue );\n\t\t\t\t\t} }\n\t\t\t\t\tmin={ 12 }\n\t\t\t\t\tmax={ 100 }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</fieldset>\n\t);\n}\n\nexport default forwardRef( FontSizePicker );\n"]}

package/build-module/grid/component.js CHANGED Viewed

@@ -9,7 +9,7 @@ import { View } from '../view';
 import useGrid from './hook';
 /**
  * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props
- * @param {import('react').Ref<any>}                                                        forwardedRef
+ * @param {import('react').ForwardedRef<any>}                                               forwardedRef
  */
 function Grid(props, forwardedRef) {

package/build-module/grid/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/grid/component.js"],"names":["contextConnect","View","useGrid","Grid","props","forwardedRef","gridProps","ConnectedGrid"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,eAA/B;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,OAAOC,OAAP,MAAoB,QAApB;AAEA;AACA;AACA;AACA;;AACA,SAASC,IAAT,CAAeC,KAAf,EAAsBC,YAAtB,EAAqC;AACpC,QAAMC,SAAS,GAAGJ,OAAO,CAAEE,KAAF,CAAzB;AAEA,SAAO,cAAC,IAAD,eAAWE,SAAX;AAAuB,IAAA,GAAG,EAAGD;AAA7B,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,aAAa,GAAGP,cAAc,CAAEG,IAAF,EAAQ,MAAR,CAApC;AAEA,eAAeI,aAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../ui/context';\nimport { View } from '../view';\nimport useGrid from './hook';\n\n/\n @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').~~Ref~~<any>} forwardedRef\n /\nfunction Grid( props, forwardedRef ) {\n\tconst gridProps = useGrid( props );\n\n\treturn <View { ...gridProps } ref={ forwardedRef } />;\n}\n\n/\n `Grid` is a primitive layout component that can arrange content in a grid configuration.\n \n @example\n * ```jsx\n * import {\n * \t__experimentalGrid as Grid,\n * \t__experimentalText as Text\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<Grid columns={ 3 }>\n * \t\t\t<Text>Code</Text>\n * \t\t\t<Text>is</Text>\n * \t\t\t<Text>Poetry</Text>\n * \t\t</Grid>\n * \t);\n * }\n * ```\n */\nconst ConnectedGrid = contextConnect( Grid, 'Grid' );\n\nexport default ConnectedGrid;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/grid/component.js"],"names":["contextConnect","View","useGrid","Grid","props","forwardedRef","gridProps","ConnectedGrid"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,eAA/B;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,OAAOC,OAAP,MAAoB,QAApB;AAEA;AACA;AACA;AACA;;AACA,SAASC,IAAT,CAAeC,KAAf,EAAsBC,YAAtB,EAAqC;AACpC,QAAMC,SAAS,GAAGJ,OAAO,CAAEE,KAAF,CAAzB;AAEA,SAAO,cAAC,IAAD,eAAWE,SAAX;AAAuB,IAAA,GAAG,EAAGD;AAA7B,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,aAAa,GAAGP,cAAc,CAAEG,IAAF,EAAQ,MAAR,CAApC;AAEA,eAAeI,aAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../ui/context';\nimport { View } from '../view';\nimport useGrid from './hook';\n\n/\n @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n /\nfunction Grid( props, forwardedRef ) {\n\tconst gridProps = useGrid( props );\n\n\treturn <View { ...gridProps } ref={ forwardedRef } />;\n}\n\n/\n `Grid` is a primitive layout component that can arrange content in a grid configuration.\n \n @example\n * ```jsx\n * import {\n * \t__experimentalGrid as Grid,\n * \t__experimentalText as Text\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<Grid columns={ 3 }>\n * \t\t\t<Text>Code</Text>\n * \t\t\t<Text>is</Text>\n * \t\t\t<Text>Poetry</Text>\n * \t\t</Grid>\n * \t);\n * }\n * ```\n */\nconst ConnectedGrid = contextConnect( Grid, 'Grid' );\n\nexport default ConnectedGrid;\n"]}

package/build-module/h-stack/component.js CHANGED Viewed

@@ -9,7 +9,7 @@ import { View } from '../view';
 import { useHStack } from './hook';
 /**
  * @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props
- * @param {import('react').Ref<any>}                                                        forwardedRef
+ * @param {import('react').ForwardedRef<any>}                                               forwardedRef
  */
 function HStack(props, forwardedRef) {

package/build-module/h-stack/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/h-stack/component.js"],"names":["contextConnect","View","useHStack","HStack","props","forwardedRef","hStackProps","ConnectedHStack"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,eAA/B;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,SAAT,QAA0B,QAA1B;AAEA;AACA;AACA;AACA;;AACA,SAASC,MAAT,CAAiBC,KAAjB,EAAwBC,YAAxB,EAAuC;AACtC,QAAMC,WAAW,GAAGJ,SAAS,CAAEE,KAAF,CAA7B;AAEA,SAAO,cAAC,IAAD,eAAWE,WAAX;AAAyB,IAAA,GAAG,EAAGD;AAA/B,KAAP;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,MAAME,eAAe,GAAGP,cAAc,CAAEG,MAAF,EAAU,QAAV,CAAtC;AAEA,eAAeI,eAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../ui/context';\nimport { View } from '../view';\nimport { useHStack } from './hook';\n\n/\n @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').~~Ref~~<any>} forwardedRef\n /\nfunction HStack( props, forwardedRef ) {\n\tconst hStackProps = useHStack( props );\n\n\treturn <View { ...hStackProps } ref={ forwardedRef } />;\n}\n\n/\n `HStack` (Horizontal Stack) arranges child elements in a horizontal line.\n \n `HStack` can render anything inside.\n \n @example\n * ```jsx\n * import {\n * \t__experimentalHStack as HStack,\n * \t__experimentalText as Text,\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<HStack>\n * \t\t\t<Text>Code</Text>\n * \t\t\t<Text>is</Text>\n * \t\t\t<Text>Poetry</Text>\n * \t\t</HStack>\n * \t);\n * }\n * ```\n */\nconst ConnectedHStack = contextConnect( HStack, 'HStack' );\n\nexport default ConnectedHStack;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/h-stack/component.js"],"names":["contextConnect","View","useHStack","HStack","props","forwardedRef","hStackProps","ConnectedHStack"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,cAAT,QAA+B,eAA/B;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,SAAT,QAA0B,QAA1B;AAEA;AACA;AACA;AACA;;AACA,SAASC,MAAT,CAAiBC,KAAjB,EAAwBC,YAAxB,EAAuC;AACtC,QAAMC,WAAW,GAAGJ,SAAS,CAAEE,KAAF,CAA7B;AAEA,SAAO,cAAC,IAAD,eAAWE,WAAX;AAAyB,IAAA,GAAG,EAAGD;AAA/B,KAAP;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,MAAME,eAAe,GAAGP,cAAc,CAAEG,MAAF,EAAU,QAAV,CAAtC;AAEA,eAAeI,eAAf","sourcesContent":["/*\n Internal dependencies\n /\nimport { contextConnect } from '../ui/context';\nimport { View } from '../view';\nimport { useHStack } from './hook';\n\n/\n @param {import('../ui/context').WordPressComponentProps<import('./types').Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n /\nfunction HStack( props, forwardedRef ) {\n\tconst hStackProps = useHStack( props );\n\n\treturn <View { ...hStackProps } ref={ forwardedRef } />;\n}\n\n/\n `HStack` (Horizontal Stack) arranges child elements in a horizontal line.\n \n `HStack` can render anything inside.\n \n @example\n * ```jsx\n * import {\n * \t__experimentalHStack as HStack,\n * \t__experimentalText as Text,\n * } from `@wordpress/components`;\n \n function Example() {\n * \treturn (\n * \t\t<HStack>\n * \t\t\t<Text>Code</Text>\n * \t\t\t<Text>is</Text>\n * \t\t\t<Text>Poetry</Text>\n * \t\t</HStack>\n * \t);\n * }\n * ```\n */\nconst ConnectedHStack = contextConnect( HStack, 'HStack' );\n\nexport default ConnectedHStack;\n"]}

package/build-module/heading/component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/components/src/heading/component.tsx"],"names":["contextConnect","View","useHeading","Heading","props","forwardedRef","headerProps","ConnectedHeading"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,cAAT,QAAwD,eAAxD;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,UAAT,QAAyC,QAAzC;;AAEA,SAASC,OAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,WAAW,GAAGJ,UAAU,CAAEE,KAAF,CAA9B;AAEA,SAAO,cAAC,IAAD,eAAWE,WAAX;AAAyB,IAAA,GAAG,EAAGD;AAA/B,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,gBAAgB,GAAGP,cAAc,CAAEG,OAAF,EAAW,SAAX,CAAvC;AAEA,eAAeI,gBAAf","sourcesContent":["/*\n External dependencies\n /\nimport type { ~~Ref~~ } from 'react';\n\n/\n Internal dependencies\n /\nimport { contextConnect, WordPressComponentProps } from '../ui/context';\nimport { View } from '../view';\nimport { useHeading, HeadingProps } from './hook';\n\nfunction Heading(\n\tprops: WordPressComponentProps< HeadingProps, 'h1' >,\n\tforwardedRef: ~~Ref~~< any >\n) {\n\tconst headerProps = useHeading( props );\n\n\treturn <View { ...headerProps } ref={ forwardedRef } />;\n}\n\n/\n `Heading` renders headings and titles using the library's typography system.\n \n @example\n * ```jsx\n * import { Heading } from `@wordpress/components`\n \n function Example() {\n * return <Heading>Code is Poetry</Heading>;\n * }\n * ```\n */\nconst ConnectedHeading = contextConnect( Heading, 'Heading' );\n\nexport default ConnectedHeading;\n"]}
1	+ {"version":3,"sources":["@wordpress/components/src/heading/component.tsx"],"names":["contextConnect","View","useHeading","Heading","props","forwardedRef","headerProps","ConnectedHeading"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,cAAT,QAAwD,eAAxD;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,UAAT,QAAyC,QAAzC;;AAEA,SAASC,OAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,WAAW,GAAGJ,UAAU,CAAEE,KAAF,CAA9B;AAEA,SAAO,cAAC,IAAD,eAAWE,WAAX;AAAyB,IAAA,GAAG,EAAGD;AAA/B,KAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAME,gBAAgB,GAAGP,cAAc,CAAEG,OAAF,EAAW,SAAX,CAAvC;AAEA,eAAeI,gBAAf","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 { useHeading, HeadingProps } from './hook';\n\nfunction Heading(\n\tprops: WordPressComponentProps< HeadingProps, 'h1' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst headerProps = useHeading( props );\n\n\treturn <View { ...headerProps } ref={ forwardedRef } />;\n}\n\n/\n `Heading` renders headings and titles using the library's typography system.\n \n @example\n * ```jsx\n * import { Heading } from `@wordpress/components`\n \n function Example() {\n * return <Heading>Code is Poetry</Heading>;\n * }\n * ```\n */\nconst ConnectedHeading = contextConnect( Heading, 'Heading' );\n\nexport default ConnectedHeading;\n"]}

package/build-module/index.js CHANGED Viewed

@@ -66,7 +66,7 @@ export { default as __experimentalNavigationBackButton } from './navigation/back
 export { default as __experimentalNavigationGroup } from './navigation/group';
 export { default as __experimentalNavigationItem } from './navigation/item';
 export { default as __experimentalNavigationMenu } from './navigation/menu';
-export { NavigatorProvider as __experimentalNavigatorProvider, NavigatorScreen as __experimentalNavigatorScreen, useNavigator as __experimentalUseNavigator } from './navigator';
+export { NavigatorProvider as __experimentalNavigatorProvider, NavigatorScreen as __experimentalNavigatorScreen, NavigatorButton as __experimentalNavigatorButton, NavigatorBackButton as __experimentalNavigatorBackButton, useNavigator as __experimentalUseNavigator } from './navigator';
 export { default as Notice } from './notice';
 export { default as __experimentalNumberControl } from './number-control';
 export { default as NoticeList } from './notice/list';