@wordpress/components 20.0.2-next.957ca95e4c.0 → 21.0.0

package/build/number-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/number-control/index.js"],"names":["NumberControl","ref","__unstableStateReducer","stateReducerProp","className","dragDirection","hideHTMLArrows","isDragEnabled","isShiftStepEnabled","label","max","Infinity","min","required","shiftStep","step","type","typeProp","value","valueProp","props","isStepAny","baseStep","parseFloat","baseValue","constrainValue","stepOverride","Math","autoComplete","classes","numberControlStateReducer","state","action","nextState","payload","event","currentValue","inputControlActionTypes","PRESS_UP","PRESS_DOWN","enableShift","shiftKey","incrementalValue","nextValue","preventDefault","DRAG","x","y","delta","modifier","directionModifier","ceil","abs","sign","distance","PRESS_ENTER","COMMIT","applyEmptyValue","baseState"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { Input } from './styles/number-control-styles';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { add, subtract, roundClamp } from '../utils/math';\nimport { isValueEmpty } from '../utils/values';\n\nexport function NumberControl(\n\t{\n\t\t__unstableStateReducer: stateReducerProp,\n\t\tclassName,\n\t\tdragDirection = 'n',\n\t\thideHTMLArrows = false,\n\t\tisDragEnabled = true,\n\t\tisShiftStepEnabled = true,\n\t\tlabel,\n\t\tmax = Infinity,\n\t\tmin = -Infinity,\n\t\trequired = false,\n\t\tshiftStep = 10,\n\t\tstep = 1,\n\t\ttype: typeProp = 'number',\n\t\tvalue: valueProp,\n\t\t...props\n\t},\n\tref\n) {\n\tconst isStepAny = step === 'any';\n\tconst baseStep = isStepAny ? 1 : parseFloat( step );\n\tconst baseValue = roundClamp( 0, min, max, baseStep );\n\tconst constrainValue = ( value, stepOverride ) => {\n\t\t// When step is \"any\" clamp the value, otherwise round and clamp it.\n\t\treturn isStepAny\n\t\t\t? Math.min( max, Math.max( min, value ) )\n\t\t\t: roundClamp( value, min, max, stepOverride ?? baseStep );\n\t};\n\n\tconst autoComplete = typeProp === 'number' ? 'off' : null;\n\tconst classes = classNames( 'components-number-control', className );\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param {Object} state  State from InputControl\n\t * @param {Object} action Action triggering state change\n\t * @return {Object} The updated state to apply to InputControl\n\t */\n\tconst numberControlStateReducer = ( state, action ) => {\n\t\tconst nextState = { ...state };\n\n\t\tconst { type, payload } = action;\n\t\tconst event = payload?.event;\n\t\tconst currentValue = nextState.value;\n\n\t\t/**\n\t\t * Handles custom UP and DOWN Keyboard events\n\t\t */\n\t\tif (\n\t\t\ttype === inputControlActionTypes.PRESS_UP ||\n\t\t\ttype === inputControlActionTypes.PRESS_DOWN\n\t\t) {\n\t\t\tconst enableShift = event.shiftKey && isShiftStepEnabled;\n\n\t\t\tconst incrementalValue = enableShift\n\t\t\t\t? parseFloat( shiftStep ) * baseStep\n\t\t\t\t: baseStep;\n\t\t\tlet nextValue = isValueEmpty( currentValue )\n\t\t\t\t? baseValue\n\t\t\t\t: currentValue;\n\n\t\t\tif ( event?.preventDefault ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\n\t\t\tif ( type === inputControlActionTypes.PRESS_UP ) {\n\t\t\t\tnextValue = add( nextValue, incrementalValue );\n\t\t\t}\n\n\t\t\tif ( type === inputControlActionTypes.PRESS_DOWN ) {\n\t\t\t\tnextValue = subtract( nextValue, incrementalValue );\n\t\t\t}\n\n\t\t\tnextState.value = constrainValue(\n\t\t\t\tnextValue,\n\t\t\t\tenableShift ? incrementalValue : null\n\t\t\t);\n\t\t}\n\n\t\t/**\n\t\t * Handles drag to update events\n\t\t */\n\t\tif ( type === inputControlActionTypes.DRAG && isDragEnabled ) {\n\t\t\tconst [ x, y ] = payload.delta;\n\t\t\tconst enableShift = payload.shiftKey && isShiftStepEnabled;\n\t\t\tconst modifier = enableShift\n\t\t\t\t? parseFloat( shiftStep ) * baseStep\n\t\t\t\t: baseStep;\n\n\t\t\tlet directionModifier;\n\t\t\tlet delta;\n\n\t\t\tswitch ( dragDirection ) {\n\t\t\t\tcase 'n':\n\t\t\t\t\tdelta = y;\n\t\t\t\t\tdirectionModifier = -1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'e':\n\t\t\t\t\tdelta = x;\n\t\t\t\t\tdirectionModifier = isRTL() ? -1 : 1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 's':\n\t\t\t\t\tdelta = y;\n\t\t\t\t\tdirectionModifier = 1;\n\t\t\t\t\tbreak;\n\n\t\t\t\tcase 'w':\n\t\t\t\t\tdelta = x;\n\t\t\t\t\tdirectionModifier = isRTL() ? 1 : -1;\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tif ( delta !== 0 ) {\n\t\t\t\tdelta = Math.ceil( Math.abs( delta ) ) * Math.sign( delta );\n\t\t\t\tconst distance = delta * modifier * directionModifier;\n\n\t\t\t\tnextState.value = constrainValue(\n\t\t\t\t\tadd( currentValue, distance ),\n\t\t\t\t\tenableShift ? modifier : null\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\n\t\t/**\n\t\t * Handles commit (ENTER key press or blur)\n\t\t */\n\t\tif (\n\t\t\ttype === inputControlActionTypes.PRESS_ENTER ||\n\t\t\ttype === inputControlActionTypes.COMMIT\n\t\t) {\n\t\t\tconst applyEmptyValue = required === false && currentValue === '';\n\n\t\t\tnextState.value = applyEmptyValue\n\t\t\t\t? currentValue\n\t\t\t\t: constrainValue( currentValue );\n\t\t}\n\n\t\treturn nextState;\n\t};\n\n\treturn (\n\t\t<Input\n\t\t\tautoComplete={ autoComplete }\n\t\t\tinputMode=\"numeric\"\n\t\t\t{ ...props }\n\t\t\tclassName={ classes }\n\t\t\tdragDirection={ dragDirection }\n\t\t\thideHTMLArrows={ hideHTMLArrows }\n\t\t\tisDragEnabled={ isDragEnabled }\n\t\t\tlabel={ label }\n\t\t\tmax={ max }\n\t\t\tmin={ min }\n\t\t\tref={ ref }\n\t\t\trequired={ required }\n\t\t\tstep={ step }\n\t\t\ttype={ typeProp }\n\t\t\tvalue={ valueProp }\n\t\t\t__unstableStateReducer={ ( state, action ) => {\n\t\t\t\tconst baseState = numberControlStateReducer( state, action );\n\t\t\t\treturn stateReducerProp?.( baseState, action ) ?? baseState;\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nexport default forwardRef( NumberControl );\n"]}
+{"version":3,"sources":["@wordpress/components/src/number-control/index.tsx"],"names":["UnforwardedNumberControl","ref","__unstableStateReducer","stateReducerProp","className","dragDirection","hideHTMLArrows","isDragEnabled","isShiftStepEnabled","label","max","Infinity","min","required","shiftStep","step","type","typeProp","value","valueProp","props","isStepAny","baseStep","baseValue","constrainValue","stepOverride","Math","autoComplete","undefined","classes","numberControlStateReducer","state","action","nextState","payload","event","currentValue","inputControlActionTypes","PRESS_UP","PRESS_DOWN","enableShift","shiftKey","incrementalValue","nextValue","preventDefault","DRAG","x","y","delta","modifier","directionModifier","ceil","abs","sign","distance","PRESS_ENTER","COMMIT","applyEmptyValue","baseState","NumberControl"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { Input } from './styles/number-control-styles';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { add, subtract, roundClamp } from '../utils/math';\nimport { ensureNumber, isValueEmpty } from '../utils/values';\nimport type { WordPressComponentProps } from '../ui/context/wordpress-component';\nimport type { NumberControlProps } from './types';\n\nfunction UnforwardedNumberControl(\n\t{\n\t\t__unstableStateReducer: stateReducerProp,\n\t\tclassName,\n\t\tdragDirection = 'n',\n\t\thideHTMLArrows = false,\n\t\tisDragEnabled = true,\n\t\tisShiftStepEnabled = true,\n\t\tlabel,\n\t\tmax = Infinity,\n\t\tmin = -Infinity,\n\t\trequired = false,\n\t\tshiftStep = 10,\n\t\tstep = 1,\n\t\ttype: typeProp = 'number',\n\t\tvalue: valueProp,\n\t\t...props\n\t}: WordPressComponentProps< NumberControlProps, 'input', false >,\n\tref: ForwardedRef< any >\n) {\n\tconst isStepAny = step === 'any';\n\tconst baseStep = isStepAny ? 1 : ensureNumber( step );\n\tconst baseValue = roundClamp( 0, min, max, baseStep );\n\tconst constrainValue = (\n\t\tvalue: number | string,\n\t\tstepOverride?: number\n\t) => {\n\t\t// When step is \"any\" clamp the value, otherwise round and clamp it.\n\t\treturn isStepAny\n\t\t\t? Math.min( max, Math.max( min, ensureNumber( value ) ) )\n\t\t\t: roundClamp( value, min, max, stepOverride ?? baseStep );\n\t};\n\n\tconst autoComplete = typeProp === 'number' ? 'off' : undefined;\n\tconst classes = classNames( 'components-number-control', className );\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @return The updated state to apply to InputControl\n\t */\n\tconst numberControlStateReducer: NumberControlProps[ '__unstableStateReducer' ] =\n\t\t( state, action ) => {\n\t\t\tconst nextState = { ...state };\n\n\t\t\tconst { type, payload } = action;\n\t\t\tconst event = payload.event;\n\t\t\tconst currentValue = nextState.value;\n\n\t\t\t/**\n\t\t\t * Handles custom UP and DOWN Keyboard events\n\t\t\t */\n\t\t\tif (\n\t\t\t\ttype === inputControlActionTypes.PRESS_UP ||\n\t\t\t\ttype === inputControlActionTypes.PRESS_DOWN\n\t\t\t) {\n\t\t\t\tconst enableShift =\n\t\t\t\t\t( event as KeyboardEvent | undefined )?.shiftKey &&\n\t\t\t\t\tisShiftStepEnabled;\n\n\t\t\t\tconst incrementalValue = enableShift\n\t\t\t\t\t? ensureNumber( shiftStep ) * baseStep\n\t\t\t\t\t: baseStep;\n\t\t\t\tlet nextValue = isValueEmpty( currentValue )\n\t\t\t\t\t? baseValue\n\t\t\t\t\t: currentValue;\n\n\t\t\t\tif ( event?.preventDefault ) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\n\t\t\t\tif ( type === inputControlActionTypes.PRESS_UP ) {\n\t\t\t\t\tnextValue = add( nextValue, incrementalValue );\n\t\t\t\t}\n\n\t\t\t\tif ( type === inputControlActionTypes.PRESS_DOWN ) {\n\t\t\t\t\tnextValue = subtract( nextValue, incrementalValue );\n\t\t\t\t}\n\n\t\t\t\t// @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components\n\t\t\t\tnextState.value = constrainValue(\n\t\t\t\t\tnextValue,\n\t\t\t\t\tenableShift ? incrementalValue : undefined\n\t\t\t\t);\n\t\t\t}\n\n\t\t\t/**\n\t\t\t * Handles drag to update events\n\t\t\t */\n\t\t\tif ( type === inputControlActionTypes.DRAG && isDragEnabled ) {\n\t\t\t\t// @ts-expect-error TODO: See if reducer actions can be typed better\n\t\t\t\tconst [ x, y ] = payload.delta;\n\t\t\t\t// @ts-expect-error TODO: See if reducer actions can be typed better\n\t\t\t\tconst enableShift = payload.shiftKey && isShiftStepEnabled;\n\t\t\t\tconst modifier = enableShift\n\t\t\t\t\t? ensureNumber( shiftStep ) * baseStep\n\t\t\t\t\t: baseStep;\n\n\t\t\t\tlet directionModifier;\n\t\t\t\tlet delta;\n\n\t\t\t\tswitch ( dragDirection ) {\n\t\t\t\t\tcase 'n':\n\t\t\t\t\t\tdelta = y;\n\t\t\t\t\t\tdirectionModifier = -1;\n\t\t\t\t\t\tbreak;\n\n\t\t\t\t\tcase 'e':\n\t\t\t\t\t\tdelta = x;\n\t\t\t\t\t\tdirectionModifier = isRTL() ? -1 : 1;\n\t\t\t\t\t\tbreak;\n\n\t\t\t\t\tcase 's':\n\t\t\t\t\t\tdelta = y;\n\t\t\t\t\t\tdirectionModifier = 1;\n\t\t\t\t\t\tbreak;\n\n\t\t\t\t\tcase 'w':\n\t\t\t\t\t\tdelta = x;\n\t\t\t\t\t\tdirectionModifier = isRTL() ? 1 : -1;\n\t\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tif ( delta !== 0 ) {\n\t\t\t\t\tdelta = Math.ceil( Math.abs( delta ) ) * Math.sign( delta );\n\t\t\t\t\tconst distance = delta * modifier * directionModifier;\n\n\t\t\t\t\t// @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components\n\t\t\t\t\tnextState.value = constrainValue(\n\t\t\t\t\t\t// @ts-expect-error TODO: Investigate if it's ok for currentValue to be undefined\n\t\t\t\t\t\tadd( currentValue, distance ),\n\t\t\t\t\t\tenableShift ? modifier : undefined\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t/**\n\t\t\t * Handles commit (ENTER key press or blur)\n\t\t\t */\n\t\t\tif (\n\t\t\t\ttype === inputControlActionTypes.PRESS_ENTER ||\n\t\t\t\ttype === inputControlActionTypes.COMMIT\n\t\t\t) {\n\t\t\t\tconst applyEmptyValue =\n\t\t\t\t\trequired === false && currentValue === '';\n\n\t\t\t\t// @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components\n\t\t\t\tnextState.value = applyEmptyValue\n\t\t\t\t\t? currentValue\n\t\t\t\t\t: // @ts-expect-error TODO: Investigate if it's ok for currentValue to be undefined\n\t\t\t\t\t  constrainValue( currentValue );\n\t\t\t}\n\n\t\t\treturn nextState;\n\t\t};\n\n\treturn (\n\t\t<Input\n\t\t\tautoComplete={ autoComplete }\n\t\t\tinputMode=\"numeric\"\n\t\t\t{ ...props }\n\t\t\tclassName={ classes }\n\t\t\tdragDirection={ dragDirection }\n\t\t\thideHTMLArrows={ hideHTMLArrows }\n\t\t\tisDragEnabled={ isDragEnabled }\n\t\t\tlabel={ label }\n\t\t\tmax={ max }\n\t\t\tmin={ min }\n\t\t\tref={ ref }\n\t\t\trequired={ required }\n\t\t\tstep={ step }\n\t\t\ttype={ typeProp }\n\t\t\t// @ts-expect-error TODO: Resolve discrepancy between `value` types in InputControl based components\n\t\t\tvalue={ valueProp }\n\t\t\t__unstableStateReducer={ ( state, action ) => {\n\t\t\t\tconst baseState = numberControlStateReducer( state, action );\n\t\t\t\treturn stateReducerProp?.( baseState, action ) ?? baseState;\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nexport const NumberControl = forwardRef( UnforwardedNumberControl );\n\nexport default NumberControl;\n"]}

package/build/number-control/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/build/number-control/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/build/placeholder/index.js

@@ -52,9 +52,7 @@ const PlaceholderIllustration = (0, _element.createElement)(_primitives.SVG, {
  * ```
  */
 
-function Placeholder( // ref is omitted until we have `WordPressComponentPropsWithoutRef` or add
-// ref forwarding to Placeholder.
-props) {
+function Placeholder(props) {
   const {
     icon,
     children,

package/build/placeholder/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/placeholder/index.tsx"],"names":["PlaceholderIllustration","Placeholder","props","icon","children","label","instructions","className","notices","preview","isColumnLayout","withIllustration","additionalProps","resizeListener","width","modifierClassNames","classes","fieldsetClasses"],"mappings":";;;;;;;;;;;;;;AAGA;;AAKA;;AACA;;AAKA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAKA,MAAMA,uBAAuB,GAC5B,4BAAC,eAAD;AACC,EAAA,SAAS,EAAC,sCADX;AAEC,EAAA,IAAI,EAAC,MAFN;AAGC,EAAA,KAAK,EAAC,4BAHP;AAIC,EAAA,OAAO,EAAC,WAJT;AAKC,EAAA,mBAAmB,EAAC;AALrB,GAOC,4BAAC,gBAAD;AAAM,EAAA,YAAY,EAAC,oBAAnB;AAAwC,EAAA,CAAC,EAAC;AAA1C,EAPD,CADD;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,WAAT,EACN;AACA;AACAC,KAHM,EAOL;AACD,QAAM;AACLC,IAAAA,IADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,KAHK;AAILC,IAAAA,YAJK;AAKLC,IAAAA,SALK;AAMLC,IAAAA,OANK;AAOLC,IAAAA,OAPK;AAQLC,IAAAA,cARK;AASLC,IAAAA,gBATK;AAUL,OAAGC;AAVE,MAWFV,KAXJ;AAYA,QAAM,CAAEW,cAAF,EAAkB;AAAEC,IAAAA;AAAF,GAAlB,IAAgC,iCAAtC,CAbC,CAeD;AACA;;AACA,MAAIC,kBAAJ;;AACA,MAAK,OAAOD,KAAP,KAAiB,QAAtB,EAAiC;AAChCC,IAAAA,kBAAkB,GAAG;AACpB,kBAAYD,KAAK,IAAI,GADD;AAEpB,mBAAaA,KAAK,IAAI,GAAT,IAAgBA,KAAK,GAAG,GAFjB;AAGpB,kBAAYA,KAAK,GAAG;AAHA,KAArB;AAKA;;AAED,QAAME,OAAO,GAAG,yBACf,wBADe,EAEfT,SAFe,EAGfQ,kBAHe,EAIfJ,gBAAgB,GAAG,kBAAH,GAAwB,IAJzB,CAAhB;AAMA,QAAMM,eAAe,GAAG,yBAAY,kCAAZ,EAAgD;AACvE,wBAAoBP;AADmD,GAAhD,CAAxB;AAGA,SACC,8DAAUE,eAAV;AAA4B,IAAA,SAAS,EAAGI;AAAxC,MACGL,gBAAgB,GAAGX,uBAAH,GAA6B,IADhD,EAEGa,cAFH,EAGGL,OAHH,EAIGC,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CALF,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGN;AAAb,IADD,EAEGE,KAFH,CATD,EAaC;AAAU,IAAA,SAAS,EAAGY;AAAtB,KACG,CAAC,CAAEX,YAAH,IACD;AAAQ,IAAA,SAAS,EAAC;AAAlB,KACGA,YADH,CAFF,EAMGF,QANH,CAbD,CADD;AAwBA;;eAEcH,W","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useResizeObserver } from '@wordpress/compose';\nimport { SVG, Path } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport type { PlaceholderProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst PlaceholderIllustration = (\n\t<SVG\n\t\tclassName=\"components-placeholder__illustration\"\n\t\tfill=\"none\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t>\n\t\t<Path vectorEffect=\"non-scaling-stroke\" d=\"M60 60 0 0\" />\n\t</SVG>\n);\n\n/**\n * Renders a placeholder. Normally used by blocks to render their empty state.\n *\n * ```jsx\n * import { Placeholder } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPlaceholder = () => <Placeholder icon={ more } label=\"Placeholder\" />;\n * ```\n */\nexport function Placeholder< IconProps = unknown >(\n\t// ref is omitted until we have `WordPressComponentPropsWithoutRef` or add\n\t// ref forwarding to Placeholder.\n\tprops: Omit<\n\t\tWordPressComponentProps< PlaceholderProps< IconProps >, 'div', false >,\n\t\t'ref'\n\t>\n) {\n\tconst {\n\t\ticon,\n\t\tchildren,\n\t\tlabel,\n\t\tinstructions,\n\t\tclassName,\n\t\tnotices,\n\t\tpreview,\n\t\tisColumnLayout,\n\t\twithIllustration,\n\t\t...additionalProps\n\t} = props;\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames,\n\t\twithIllustration ? 'has-illustration' : null\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ withIllustration ? PlaceholderIllustration : null }\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t<fieldset className={ fieldsetClasses }>\n\t\t\t\t{ !! instructions && (\n\t\t\t\t\t<legend className=\"components-placeholder__instructions\">\n\t\t\t\t\t\t{ instructions }\n\t\t\t\t\t</legend>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t</fieldset>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"]}
+{"version":3,"sources":["@wordpress/components/src/placeholder/index.tsx"],"names":["PlaceholderIllustration","Placeholder","props","icon","children","label","instructions","className","notices","preview","isColumnLayout","withIllustration","additionalProps","resizeListener","width","modifierClassNames","classes","fieldsetClasses"],"mappings":";;;;;;;;;;;;;;AAGA;;AAKA;;AACA;;AAKA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AAKA,MAAMA,uBAAuB,GAC5B,4BAAC,eAAD;AACC,EAAA,SAAS,EAAC,sCADX;AAEC,EAAA,IAAI,EAAC,MAFN;AAGC,EAAA,KAAK,EAAC,4BAHP;AAIC,EAAA,OAAO,EAAC,WAJT;AAKC,EAAA,mBAAmB,EAAC;AALrB,GAOC,4BAAC,gBAAD;AAAM,EAAA,YAAY,EAAC,oBAAnB;AAAwC,EAAA,CAAC,EAAC;AAA1C,EAPD,CADD;AAYA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,WAAT,CACNC,KADM,EAML;AACD,QAAM;AACLC,IAAAA,IADK;AAELC,IAAAA,QAFK;AAGLC,IAAAA,KAHK;AAILC,IAAAA,YAJK;AAKLC,IAAAA,SALK;AAMLC,IAAAA,OANK;AAOLC,IAAAA,OAPK;AAQLC,IAAAA,cARK;AASLC,IAAAA,gBATK;AAUL,OAAGC;AAVE,MAWFV,KAXJ;AAYA,QAAM,CAAEW,cAAF,EAAkB;AAAEC,IAAAA;AAAF,GAAlB,IAAgC,iCAAtC,CAbC,CAeD;AACA;;AACA,MAAIC,kBAAJ;;AACA,MAAK,OAAOD,KAAP,KAAiB,QAAtB,EAAiC;AAChCC,IAAAA,kBAAkB,GAAG;AACpB,kBAAYD,KAAK,IAAI,GADD;AAEpB,mBAAaA,KAAK,IAAI,GAAT,IAAgBA,KAAK,GAAG,GAFjB;AAGpB,kBAAYA,KAAK,GAAG;AAHA,KAArB;AAKA;;AAED,QAAME,OAAO,GAAG,yBACf,wBADe,EAEfT,SAFe,EAGfQ,kBAHe,EAIfJ,gBAAgB,GAAG,kBAAH,GAAwB,IAJzB,CAAhB;AAMA,QAAMM,eAAe,GAAG,yBAAY,kCAAZ,EAAgD;AACvE,wBAAoBP;AADmD,GAAhD,CAAxB;AAGA,SACC,8DAAUE,eAAV;AAA4B,IAAA,SAAS,EAAGI;AAAxC,MACGL,gBAAgB,GAAGX,uBAAH,GAA6B,IADhD,EAEGa,cAFH,EAGGL,OAHH,EAIGC,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CALF,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGN;AAAb,IADD,EAEGE,KAFH,CATD,EAaC;AAAU,IAAA,SAAS,EAAGY;AAAtB,KACG,CAAC,CAAEX,YAAH,IACD;AAAQ,IAAA,SAAS,EAAC;AAAlB,KACGA,YADH,CAFF,EAMGF,QANH,CAbD,CADD;AAwBA;;eAEcH,W","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useResizeObserver } from '@wordpress/compose';\nimport { SVG, Path } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport type { PlaceholderProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst PlaceholderIllustration = (\n\t<SVG\n\t\tclassName=\"components-placeholder__illustration\"\n\t\tfill=\"none\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t>\n\t\t<Path vectorEffect=\"non-scaling-stroke\" d=\"M60 60 0 0\" />\n\t</SVG>\n);\n\n/**\n * Renders a placeholder. Normally used by blocks to render their empty state.\n *\n * ```jsx\n * import { Placeholder } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n *\n * const MyPlaceholder = () => <Placeholder icon={ more } label=\"Placeholder\" />;\n * ```\n */\nexport function Placeholder< IconProps = unknown >(\n\tprops: WordPressComponentProps<\n\t\tPlaceholderProps< IconProps >,\n\t\t'div',\n\t\tfalse\n\t>\n) {\n\tconst {\n\t\ticon,\n\t\tchildren,\n\t\tlabel,\n\t\tinstructions,\n\t\tclassName,\n\t\tnotices,\n\t\tpreview,\n\t\tisColumnLayout,\n\t\twithIllustration,\n\t\t...additionalProps\n\t} = props;\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames,\n\t\twithIllustration ? 'has-illustration' : null\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ withIllustration ? PlaceholderIllustration : null }\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t<fieldset className={ fieldsetClasses }>\n\t\t\t\t{ !! instructions && (\n\t\t\t\t\t<legend className=\"components-placeholder__instructions\">\n\t\t\t\t\t\t{ instructions }\n\t\t\t\t\t</legend>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t</fieldset>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"]}

package/build/popover/index.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.default = exports.Popover = void 0;
 
 var _element = require("@wordpress/element");
 
@@ -33,8 +33,6 @@ var _slotFill = require("../slot-fill");
 
 var _utils = require("./utils");
 
-// @ts-nocheck
-
 /**
  * External dependencies
  */
@@ -58,12 +56,12 @@ const SLOT_NAME = 'Popover'; // An SVG displaying a triangle facing down, filled
 // Keeping the SVG's viewbox squared simplify the arrow positioning
 // calculations.
 
-const ArrowTriangle = props => (0, _element.createElement)(_primitives.SVG, (0, _extends2.default)({}, props, {
+const ArrowTriangle = () => (0, _element.createElement)(_primitives.SVG, {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: `0 0 100 100`,
   className: "components-popover__triangle",
   role: "presentation"
-}), (0, _element.createElement)(_primitives.Path, {
+}, (0, _element.createElement)(_primitives.Path, {
   className: "components-popover__triangle-bg",
   d: "M 0 0 L 50 50 L 100 0"
 }), (0, _element.createElement)(_primitives.Path, {
@@ -72,39 +70,44 @@ const ArrowTriangle = props => (0, _element.createElement)(_primitives.SVG, (0,
   vectorEffect: "non-scaling-stroke"
 }));
 
-const MaybeAnimatedWrapper = (0, _element.forwardRef)((_ref, forwardedRef) => {
+const AnimatedWrapper = (0, _element.forwardRef)((_ref, forwardedRef) => {
   let {
     style: receivedInlineStyles,
     placement,
     shouldAnimate = false,
     ...props
   } = _ref;
+  // When animating, animate only once (i.e. when the popover is opened), and
+  // do not animate on subsequent prop changes (as it conflicts with
+  // floating-ui's positioning updates).
+  const [hasAnimatedOnce, setHasAnimatedOnce] = (0, _element.useState)(false);
   const shouldReduceMotion = (0, _framerMotion.useReducedMotion)();
   const {
     style: motionInlineStyles,
     ...otherMotionProps
   } = (0, _element.useMemo)(() => (0, _utils.placementToMotionAnimationProps)(placement), [placement]);
-
-  if (shouldAnimate && !shouldReduceMotion) {
-    return (0, _element.createElement)(_framerMotion.motion.div, (0, _extends2.default)({
-      style: { ...motionInlineStyles,
-        ...receivedInlineStyles
-      }
-    }, otherMotionProps, props, {
-      ref: forwardedRef
-    }));
-  }
-
-  return (0, _element.createElement)("div", (0, _extends2.default)({
+  const onAnimationComplete = (0, _element.useCallback)(() => setHasAnimatedOnce(true), []);
+  const computedAnimationProps = shouldAnimate && !shouldReduceMotion ? {
+    style: { ...motionInlineStyles,
+      ...receivedInlineStyles
+    },
+    ...otherMotionProps,
+    onAnimationComplete,
+    animate: hasAnimatedOnce ? false : otherMotionProps.animate
+  } : {
+    animate: false,
     style: receivedInlineStyles
-  }, props, {
+  };
+  return (0, _element.createElement)(_framerMotion.motion.div, (0, _extends2.default)({}, computedAnimationProps, props, {
     ref: forwardedRef
   }));
 });
-const slotNameContext = (0, _element.createContext)();
+const slotNameContext = (0, _element.createContext)(undefined);
 
-const Popover = (_ref2, forwardedRef) => {
-  let {
+const UnforwardedPopover = (props, forwardedRef) => {
+  var _frameOffsetRef$curre, _frameOffsetRef$curre2, _frameOffsetRef$curre3, _frameOffsetRef$curre4;
+
+  const {
     range,
     animate = true,
     headerTitle,
@@ -123,10 +126,13 @@ const Popover = (_ref2, forwardedRef) => {
     expandOnMobile,
     onFocusOutside,
     __unstableSlotName = SLOT_NAME,
-    __unstableForcePosition = false,
-    __unstableShift = false,
+    flip = true,
+    resize = true,
+    shift = false,
+    __unstableShift,
+    __unstableForcePosition,
     ...contentProps
-  } = _ref2;
+  } = props;
 
   if (range) {
     (0, _deprecated.default)('range prop in Popover component', {
@@ -135,36 +141,43 @@ const Popover = (_ref2, forwardedRef) => {
     });
   }
 
+  let computedFlipProp = flip;
+  let computedResizeProp = resize;
+
+  if (__unstableForcePosition !== undefined) {
+    (0, _deprecated.default)('__unstableForcePosition prop in Popover component', {
+      since: '6.1',
+      version: '6.3',
+      alternative: '`flip={ false }` and  `resize={ false }`'
+    }); // Back-compat, set the `flip` and `resize` props
+    // to `false` to replicate `__unstableForcePosition`.
+
+    computedFlipProp = !__unstableForcePosition;
+    computedResizeProp = !__unstableForcePosition;
+  }
+
+  let shouldShift = shift;
+
+  if (__unstableShift !== undefined) {
+    (0, _deprecated.default)('`__unstableShift` prop in Popover component', {
+      since: '6.1',
+      version: '6.3',
+      alternative: '`shift` prop`'
+    }); // Back-compat.
+
+    shouldShift = __unstableShift;
+  }
+
   const arrowRef = (0, _element.useRef)(null);
-  const anchorRefFallback = (0, _element.useRef)(null);
+  const [fallbackReferenceElement, setFallbackReferenceElement] = (0, _element.useState)(null);
+  const [referenceOwnerDocument, setReferenceOwnerDocument] = (0, _element.useState)();
+  const anchorRefFallback = (0, _element.useCallback)(node => {
+    setFallbackReferenceElement(node);
+  }, []);
   const isMobileViewport = (0, _compose.useViewportMatch)('medium', '<');
   const isExpanded = expandOnMobile && isMobileViewport;
   const hasArrow = !isExpanded && !noArrow;
   const normalizedPlacementFromProps = position ? (0, _utils.positionToPlacement)(position) : placementProp;
-  const referenceOwnerDocument = (0, _element.useMemo)(() => {
-    var _documentToReturn;
-
-    let documentToReturn;
-
-    if (anchorRef !== null && anchorRef !== void 0 && anchorRef.top) {
-      documentToReturn = anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.top.ownerDocument;
-    } else if (anchorRef !== null && anchorRef !== void 0 && anchorRef.startContainer) {
-      documentToReturn = anchorRef.startContainer.ownerDocument;
-    } else if (anchorRef !== null && anchorRef !== void 0 && anchorRef.current) {
-      documentToReturn = anchorRef.current.ownerDocument;
-    } else if (anchorRef) {
-      // This one should be deprecated.
-      documentToReturn = anchorRef.ownerDocument;
-    } else if (anchorRect && anchorRect !== null && anchorRect !== void 0 && anchorRect.ownerDocument) {
-      documentToReturn = anchorRect.ownerDocument;
-    } else if (getAnchorRect) {
-      var _getAnchorRect;
-
-      documentToReturn = (_getAnchorRect = getAnchorRect(anchorRefFallback.current)) === null || _getAnchorRect === void 0 ? void 0 : _getAnchorRect.ownerDocument;
-    }
-
-    return (_documentToReturn = documentToReturn) !== null && _documentToReturn !== void 0 ? _documentToReturn : document;
-  }, [anchorRef, anchorRect, getAnchorRect]);
   /**
    * Offsets the position of the popover when the anchor is inside an iframe.
    *
@@ -179,10 +192,10 @@ const Popover = (_ref2, forwardedRef) => {
    */
 
   const offsetRef = (0, _element.useRef)(offsetProp);
-  const middleware = [(0, _reactDom.offset)(_ref3 => {
+  const middleware = [(0, _reactDom.offset)(_ref2 => {
     let {
       placement: currentPlacement
-    } = _ref3;
+    } = _ref2;
 
     if (!frameOffsetRef.current) {
       return offsetRef.current;
@@ -202,27 +215,30 @@ const Popover = (_ref2, forwardedRef) => {
       mainAxis: offsetRef.current + frameOffsetRef.current[mainAxis] * mainAxisModifier,
       crossAxis: frameOffsetRef.current[crossAxis]
     };
-  }), __unstableForcePosition ? undefined : (0, _reactDom.flip)(), __unstableForcePosition ? undefined : (0, _reactDom.size)({
+  }), computedFlipProp ? (0, _reactDom.flip)() : undefined, computedResizeProp ? (0, _reactDom.size)({
     apply(sizeProps) {
+      var _refs$floating$curren;
+
       const {
-        availableHeight
-      } = sizeProps;
-      if (!refs.floating.current) return; // Reduce the height of the popover to the available space.
+        firstElementChild
+      } = (_refs$floating$curren = refs.floating.current) !== null && _refs$floating$curren !== void 0 ? _refs$floating$curren : {}; // Only HTMLElement instances have the `style` property.
+
+      if (!(firstElementChild instanceof HTMLElement)) return; // Reduce the height of the popover to the available space.
 
-      Object.assign(refs.floating.current.firstChild.style, {
-        maxHeight: `${availableHeight}px`,
+      Object.assign(firstElementChild.style, {
+        maxHeight: `${sizeProps.availableHeight}px`,
         overflow: 'auto'
       });
     }
 
-  }), __unstableShift ? (0, _reactDom.shift)({
+  }) : undefined, shouldShift ? (0, _reactDom.shift)({
     crossAxis: true,
     limiter: (0, _reactDom.limitShift)(),
     padding: 1 // Necessary to avoid flickering at the edge of the viewport.
 
-  }) : undefined, hasArrow ? (0, _reactDom.arrow)({
+  }) : undefined, (0, _reactDom.arrow)({
     element: arrowRef
-  }) : undefined].filter(m => !!m);
+  })].filter(m => m !== undefined);
 
   const slotName = (0, _element.useContext)(slotNameContext) || __unstableSlotName;
 
@@ -244,6 +260,7 @@ const Popover = (_ref2, forwardedRef) => {
   const [dialogRef, dialogProps] = (0, _compose.__experimentalUseDialog)({
     focusOnMount,
     __unstableOnClose: onDialogClose,
+    // @ts-expect-error The __unstableOnClose property needs to be deprecated first (see https://github.com/WordPress/gutenberg/pull/27675)
     onClose: onDialogClose
   });
   const {
@@ -252,7 +269,7 @@ const Popover = (_ref2, forwardedRef) => {
     y,
     // Callback refs (not regular refs). This allows the position to be updated.
     // when either elements change.
-    reference,
+    reference: referenceCallbackRef,
     floating,
     // Object with "regular" refs to both "reference" and "floating"
     refs,
@@ -261,97 +278,53 @@ const Popover = (_ref2, forwardedRef) => {
     update,
     placement: computedPlacement,
     middlewareData: {
-      arrow: arrowData = {}
+      arrow: arrowData
     }
   } = (0, _reactDom.useFloating)({
     placement: normalizedPlacementFromProps,
-    middleware
+    middleware,
+    whileElementsMounted: (referenceParam, floatingParam, updateParam) => (0, _reactDom.autoUpdate)(referenceParam, floatingParam, updateParam, {
+      animationFrame: true
+    })
   });
   (0, _element.useEffect)(() => {
     offsetRef.current = offsetProp;
     update();
-  }, [offsetProp, update]); // Update the `reference`'s ref.
-  //
-  // In floating-ui's terms:
-  // - "reference" refers to the popover's anchor element.
-  // - "floating" refers the floating popover's element.
-  // A floating element can also be positioned relative to a virtual element,
-  // instead of a real one. A virtual element is represented by an object
-  // with the `getBoundingClientRect()` function (like real elements).
-  // See https://floating-ui.com/docs/virtual-elements for more info.
+  }, [offsetProp, update]);
+  const arrowCallbackRef = (0, _element.useCallback)(node => {
+    arrowRef.current = node;
+    update();
+  }, [update]); // When any of the possible anchor "sources" change,
+  // recompute the reference element (real or virtual) and its owner document.
 
   (0, _element.useLayoutEffect)(() => {
-    let resultingReferenceRef;
-
-    if (anchorRef !== null && anchorRef !== void 0 && anchorRef.top) {
-      // Create a virtual element for the ref. The expectation is that
-      // if anchorRef.top is defined, then anchorRef.bottom is defined too.
-      resultingReferenceRef = {
-        getBoundingClientRect() {
-          const topRect = anchorRef.top.getBoundingClientRect();
-          const bottomRect = anchorRef.bottom.getBoundingClientRect();
-          return new window.DOMRect(topRect.x, topRect.y, topRect.width, bottomRect.bottom - topRect.top);
-        }
-
-      };
-    } else if (anchorRef !== null && anchorRef !== void 0 && anchorRef.current) {
-      // Standard React ref.
-      resultingReferenceRef = anchorRef.current;
-    } else if (anchorRef) {
-      // If `anchorRef` holds directly the element's value (no `current` key)
-      // This is a weird scenario and should be deprecated.
-      resultingReferenceRef = anchorRef;
-    } else if (anchorRect) {
-      // Create a virtual element for the ref.
-      resultingReferenceRef = {
-        getBoundingClientRect() {
-          return anchorRect;
-        }
-
-      };
-    } else if (getAnchorRect) {
-      // Create a virtual element for the ref.
-      resultingReferenceRef = {
-        getBoundingClientRect() {
-          var _rect$x, _rect$y, _rect$width, _rect$height;
-
-          const rect = getAnchorRect(anchorRefFallback.current);
-          return new window.DOMRect((_rect$x = rect.x) !== null && _rect$x !== void 0 ? _rect$x : rect.left, (_rect$y = rect.y) !== null && _rect$y !== void 0 ? _rect$y : rect.top, (_rect$width = rect.width) !== null && _rect$width !== void 0 ? _rect$width : rect.right - rect.left, (_rect$height = rect.height) !== null && _rect$height !== void 0 ? _rect$height : rect.bottom - rect.top);
-        }
-
-      };
-    } else if (anchorRefFallback.current) {
-      // If no explicit ref is passed via props, fall back to
-      // anchoring to the popover's parent node.
-      resultingReferenceRef = anchorRefFallback.current.parentNode;
-    }
-
-    if (!resultingReferenceRef) {
-      return;
-    }
-
-    reference(resultingReferenceRef);
-
-    if (!refs.floating.current) {
-      return;
-    }
-
-    return (0, _reactDom.autoUpdate)(resultingReferenceRef, refs.floating.current, update, {
-      animationFrame: true
-    }); // 'reference' and 'refs.floating' are refs and don't need to be listed
-    // as dependencies (see https://github.com/WordPress/gutenberg/pull/41612)
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [anchorRef, anchorRect, getAnchorRect, update]); // If the reference element is in a different ownerDocument (e.g. iFrame),
+    const resultingReferenceOwnerDoc = (0, _utils.getReferenceOwnerDocument)({
+      anchorRef,
+      anchorRect,
+      getAnchorRect,
+      fallbackReferenceElement,
+      fallbackDocument: document
+    });
+    const resultingReferenceElement = (0, _utils.getReferenceElement)({
+      anchorRef,
+      anchorRect,
+      getAnchorRect,
+      fallbackReferenceElement
+    });
+    referenceCallbackRef(resultingReferenceElement);
+    setReferenceOwnerDocument(resultingReferenceOwnerDoc);
+  }, [anchorRef, anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.top, anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.bottom, anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.startContainer, anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current, anchorRect, getAnchorRect, fallbackReferenceElement, referenceCallbackRef]); // If the reference element is in a different ownerDocument (e.g. iFrame),
   // we need to manually update the floating's position as the reference's owner
   // document scrolls. Also update the frame offset if the view resizes.
 
   (0, _element.useLayoutEffect)(() => {
-    var _referenceOwnerDocume;
-
-    const referenceAndFloatingHaveSameDocument = referenceOwnerDocument === document;
-    const hasFrameElement = !!(referenceOwnerDocument !== null && referenceOwnerDocument !== void 0 && (_referenceOwnerDocume = referenceOwnerDocument.defaultView) !== null && _referenceOwnerDocume !== void 0 && _referenceOwnerDocume.frameElement);
+    var _refs$floating, _refs$floating$curren2, _referenceOwnerDocume;
 
-    if (referenceAndFloatingHaveSameDocument || !hasFrameElement) {
+    if ( // Reference and root documents are the same.
+    referenceOwnerDocument === document || // Reference and floating are in the same document.
+    referenceOwnerDocument === (refs === null || refs === void 0 ? void 0 : (_refs$floating = refs.floating) === null || _refs$floating === void 0 ? void 0 : (_refs$floating$curren2 = _refs$floating.current) === null || _refs$floating$curren2 === void 0 ? void 0 : _refs$floating$curren2.ownerDocument) || // The reference's document has no view (i.e. window)
+    // or frame element (ie. it's not an iframe).
+    !(referenceOwnerDocument !== null && referenceOwnerDocument !== void 0 && (_referenceOwnerDocume = referenceOwnerDocument.defaultView) !== null && _referenceOwnerDocume !== void 0 && _referenceOwnerDocume.frameElement)) {
       frameOffsetRef.current = undefined;
       return;
     }
@@ -376,7 +349,7 @@ const Popover = (_ref2, forwardedRef) => {
 
   let content = // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
   // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-  (0, _element.createElement)(MaybeAnimatedWrapper, (0, _extends2.default)({
+  (0, _element.createElement)(AnimatedWrapper, (0, _extends2.default)({
     shouldAnimate: animate && !isExpanded,
     placement: computedPlacement,
     className: (0, _classnames.default)('components-popover', className, {
@@ -386,11 +359,11 @@ const Popover = (_ref2, forwardedRef) => {
   }, contentProps, {
     ref: mergedFloatingRef
   }, dialogProps, {
-    tabIndex: "-1",
+    tabIndex: -1,
     style: isExpanded ? undefined : {
       position: strategy,
-      left: Number.isNaN(x) ? 0 : x,
-      top: Number.isNaN(y) ? 0 : y
+      left: Number.isNaN(x) ? 0 : x !== null && x !== void 0 ? x : undefined,
+      top: Number.isNaN(y) ? 0 : y !== null && y !== void 0 ? y : undefined
     }
   }), isExpanded && (0, _element.createElement)(_scrollLock.default, null), isExpanded && (0, _element.createElement)("div", {
     className: "components-popover__header"
@@ -403,11 +376,11 @@ const Popover = (_ref2, forwardedRef) => {
   })), (0, _element.createElement)("div", {
     className: "components-popover__content"
   }, children), hasArrow && (0, _element.createElement)("div", {
-    ref: arrowRef,
+    ref: arrowCallbackRef,
     className: ['components-popover__arrow', `is-${computedPlacement.split('-')[0]}`].join(' '),
     style: {
-      left: Number.isFinite(arrowData === null || arrowData === void 0 ? void 0 : arrowData.x) ? `${arrowData.x}px` : '',
-      top: Number.isFinite(arrowData === null || arrowData === void 0 ? void 0 : arrowData.y) ? `${arrowData.y}px` : ''
+      left: typeof (arrowData === null || arrowData === void 0 ? void 0 : arrowData.x) !== 'undefined' && Number.isFinite(arrowData.x) ? `${arrowData.x + ((_frameOffsetRef$curre = (_frameOffsetRef$curre2 = frameOffsetRef.current) === null || _frameOffsetRef$curre2 === void 0 ? void 0 : _frameOffsetRef$curre2.x) !== null && _frameOffsetRef$curre !== void 0 ? _frameOffsetRef$curre : 0)}px` : '',
+      top: typeof (arrowData === null || arrowData === void 0 ? void 0 : arrowData.y) !== 'undefined' && Number.isFinite(arrowData.y) ? `${arrowData.y + ((_frameOffsetRef$curre3 = (_frameOffsetRef$curre4 = frameOffsetRef.current) === null || _frameOffsetRef$curre4 === void 0 ? void 0 : _frameOffsetRef$curre4.y) !== null && _frameOffsetRef$curre3 !== void 0 ? _frameOffsetRef$curre3 : 0)}px` : ''
     }
   }, (0, _element.createElement)(ArrowTriangle, null)));
 
@@ -425,23 +398,51 @@ const Popover = (_ref2, forwardedRef) => {
     ref: anchorRefFallback
   }, content);
 };
+/**
+ * `Popover` renders its content in a floating modal. If no explicit anchor is passed via props, it anchors to its parent element by default.
+ *
+ * ```jsx
+ * import { Button, Popover } from '@wordpress/components';
+ * import { useState } from '@wordpress/element';
+ *
+ * const MyPopover = () => {
+ * 	const [ isVisible, setIsVisible ] = useState( false );
+ * 	const toggleVisible = () => {
+ * 		setIsVisible( ( state ) => ! state );
+ * 	};
+ *
+ * 	return (
+ * 		<Button variant="secondary" onClick={ toggleVisible }>
+ * 			Toggle Popover!
+ * 			{ isVisible && <Popover>Popover is toggled!</Popover> }
+ * 		</Button>
+ * 	);
+ * };
+ * ```
+ *
+ */
 
-const PopoverContainer = (0, _element.forwardRef)(Popover);
 
-function PopoverSlot(_ref4, ref) {
+const Popover = (0, _element.forwardRef)(UnforwardedPopover);
+exports.Popover = Popover;
+
+function PopoverSlot(_ref3, ref) {
   let {
     name = SLOT_NAME
-  } = _ref4;
-  return (0, _element.createElement)(_slotFill.Slot, {
+  } = _ref3;
+  return (0, _element.createElement)(_slotFill.Slot // @ts-expect-error Need to type `SlotFill`
+  , {
     bubblesVirtually: true,
     name: name,
     className: "popover-slot",
     ref: ref
   });
-}
+} // @ts-expect-error For Legacy Reasons
+
+
+Popover.Slot = (0, _element.forwardRef)(PopoverSlot); // @ts-expect-error For Legacy Reasons
 
-PopoverContainer.Slot = (0, _element.forwardRef)(PopoverSlot);
-PopoverContainer.__unstableSlotNameProvider = slotNameContext.Provider;
-var _default = PopoverContainer;
+Popover.__unstableSlotNameProvider = slotNameContext.Provider;
+var _default = Popover;
 exports.default = _default;
 //# sourceMappingURL=index.js.map