@wordpress/components 21.0.1 → 21.0.3
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.
- package/CHANGELOG.md +1 -0
- package/build/popover/index.js +29 -32
- package/build/popover/index.js.map +1 -1
- package/build/popover/limit-shift.js +145 -0
- package/build/popover/limit-shift.js.map +1 -0
- package/build/tree-grid/index.js +13 -8
- package/build/tree-grid/index.js.map +1 -1
- package/build-module/popover/index.js +31 -35
- package/build-module/popover/index.js.map +1 -1
- package/build-module/popover/limit-shift.js +136 -0
- package/build-module/popover/limit-shift.js.map +1 -0
- package/build-module/tree-grid/index.js +13 -8
- package/build-module/tree-grid/index.js.map +1 -1
- package/build-types/popover/index.d.ts.map +1 -1
- package/build-types/popover/limit-shift.d.ts +87 -0
- package/build-types/popover/limit-shift.d.ts.map +1 -0
- package/package.json +17 -17
- package/src/popover/index.tsx +26 -42
- package/src/popover/limit-shift.ts +205 -0
- package/src/tree-grid/index.js +23 -14
- package/src/tree-grid/test/__snapshots__/cell.js.snap +21 -17
- package/src/tree-grid/test/__snapshots__/index.js.snap +1 -1
- package/tsconfig.tsbuildinfo +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
### Bug Fix
|
|
6
6
|
|
|
7
7
|
- The `LinkedButton` to unlink sides in `BoxControl`, `BorderBoxControl` and `BorderRadiusControl` have changed from a rectangular primary button to an icon-only button, with a sentence case tooltip, and default-size icon for better legibility. The `Button` component has been fixed so when `isSmall` and `icon` props are set, and no text is present, the button shape is square rather than rectangular.
|
|
8
|
+
- `Popover`: fix limitShift logic by adding iframe offset correctly [#42950](https://github.com/WordPress/gutenberg/pull/42950)).
|
|
8
9
|
|
|
9
10
|
### New Features
|
|
10
11
|
|
package/build/popover/index.js
CHANGED
|
@@ -33,6 +33,8 @@ var _slotFill = require("../slot-fill");
|
|
|
33
33
|
|
|
34
34
|
var _utils = require("./utils");
|
|
35
35
|
|
|
36
|
+
var _limitShift = require("./limit-shift");
|
|
37
|
+
|
|
36
38
|
/**
|
|
37
39
|
* External dependencies
|
|
38
40
|
*/
|
|
@@ -213,36 +215,35 @@ const UnforwardedPopover = (props, forwardedRef) => {
|
|
|
213
215
|
*/
|
|
214
216
|
|
|
215
217
|
const frameOffsetRef = (0, _element.useRef)((0, _utils.getFrameOffset)(referenceOwnerDocument));
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
218
|
+
const middleware = [// Custom middleware which adjusts the popover's position by taking into
|
|
219
|
+
// account the offset of the anchor's iframe (if any) compared to the page.
|
|
220
|
+
{
|
|
221
|
+
name: 'frameOffset',
|
|
222
|
+
|
|
223
|
+
fn(_ref2) {
|
|
224
|
+
let {
|
|
225
|
+
x,
|
|
226
|
+
y
|
|
227
|
+
} = _ref2;
|
|
228
|
+
|
|
229
|
+
if (!frameOffsetRef.current) {
|
|
230
|
+
return {
|
|
231
|
+
x,
|
|
232
|
+
y
|
|
233
|
+
};
|
|
234
|
+
}
|
|
226
235
|
|
|
227
|
-
|
|
228
|
-
|
|
236
|
+
return {
|
|
237
|
+
x: x + frameOffsetRef.current.x,
|
|
238
|
+
y: y + frameOffsetRef.current.y,
|
|
239
|
+
data: {
|
|
240
|
+
// This will be used in the customLimitShift() function.
|
|
241
|
+
amount: frameOffsetRef.current
|
|
242
|
+
}
|
|
243
|
+
};
|
|
229
244
|
}
|
|
230
245
|
|
|
231
|
-
|
|
232
|
-
// floating element and the reference element. The cross
|
|
233
|
-
// axis is always perpendicular to the main axis.
|
|
234
|
-
|
|
235
|
-
const mainAxis = isTopBottomPlacement ? 'y' : 'x';
|
|
236
|
-
const crossAxis = mainAxis === 'x' ? 'y' : 'x'; // When the popover is before the reference, subtract the offset,
|
|
237
|
-
// of the main axis else add it.
|
|
238
|
-
|
|
239
|
-
const hasBeforePlacement = currentPlacement.includes('top') || currentPlacement.includes('left');
|
|
240
|
-
const mainAxisModifier = hasBeforePlacement ? -1 : 1;
|
|
241
|
-
return {
|
|
242
|
-
mainAxis: offsetRef.current + frameOffsetRef.current[mainAxis] * mainAxisModifier,
|
|
243
|
-
crossAxis: frameOffsetRef.current[crossAxis]
|
|
244
|
-
};
|
|
245
|
-
}), computedFlipProp ? (0, _reactDom.flip)() : undefined, computedResizeProp ? (0, _reactDom.size)({
|
|
246
|
+
}, (0, _reactDom.offset)(offsetProp), computedFlipProp ? (0, _reactDom.flip)() : undefined, computedResizeProp ? (0, _reactDom.size)({
|
|
246
247
|
apply(sizeProps) {
|
|
247
248
|
var _refs$floating$curren;
|
|
248
249
|
|
|
@@ -260,7 +261,7 @@ const UnforwardedPopover = (props, forwardedRef) => {
|
|
|
260
261
|
|
|
261
262
|
}) : undefined, shouldShift ? (0, _reactDom.shift)({
|
|
262
263
|
crossAxis: true,
|
|
263
|
-
limiter: (0,
|
|
264
|
+
limiter: (0, _limitShift.limitShift)(),
|
|
264
265
|
padding: 1 // Necessary to avoid flickering at the edge of the viewport.
|
|
265
266
|
|
|
266
267
|
}) : undefined, (0, _reactDom.arrow)({
|
|
@@ -314,10 +315,6 @@ const UnforwardedPopover = (props, forwardedRef) => {
|
|
|
314
315
|
animationFrame: true
|
|
315
316
|
})
|
|
316
317
|
});
|
|
317
|
-
(0, _element.useEffect)(() => {
|
|
318
|
-
offsetRef.current = offsetProp;
|
|
319
|
-
update();
|
|
320
|
-
}, [offsetProp, update]);
|
|
321
318
|
const arrowCallbackRef = (0, _element.useCallback)(node => {
|
|
322
319
|
arrowRef.current = node;
|
|
323
320
|
update();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/popover/index.tsx"],"names":["SLOT_NAME","ArrowTriangle","AnimatedWrapper","forwardedRef","style","receivedInlineStyles","placement","shouldAnimate","props","hasAnimatedOnce","setHasAnimatedOnce","shouldReduceMotion","motionInlineStyles","otherMotionProps","onAnimationComplete","computedAnimationProps","animate","slotNameContext","undefined","UnforwardedPopover","headerTitle","onClose","children","className","noArrow","isAlternate","position","placementProp","offset","offsetProp","focusOnMount","anchor","expandOnMobile","onFocusOutside","__unstableSlotName","flip","resize","shift","__unstableForcePosition","__unstableShift","anchorRef","anchorRect","getAnchorRect","range","contentProps","since","version","computedFlipProp","computedResizeProp","alternative","shouldShift","arrowRef","fallbackReferenceElement","setFallbackReferenceElement","referenceOwnerDocument","setReferenceOwnerDocument","anchorRefFallback","node","isMobileViewport","isExpanded","hasArrow","normalizedPlacementFromProps","frameOffsetRef","offsetRef","middleware","currentPlacement","current","isTopBottomPlacement","includes","mainAxis","crossAxis","hasBeforePlacement","mainAxisModifier","apply","sizeProps","firstElementChild","refs","floating","HTMLElement","Object","assign","maxHeight","availableHeight","overflow","limiter","padding","element","filter","m","slotName","slot","onDialogClose","type","event","dialogRef","dialogProps","__unstableOnClose","x","y","reference","referenceCallbackRef","strategy","update","computedPlacement","middlewareData","arrow","arrowData","whileElementsMounted","referenceParam","floatingParam","updateParam","animationFrame","arrowCallbackRef","resultingReferenceOwnerDoc","fallbackDocument","document","resultingReferenceElement","top","bottom","startContainer","ownerDocument","defaultView","frameElement","updateFrameOffset","addEventListener","removeEventListener","mergedFloatingRef","content","left","Number","isNaN","close","split","join","isFinite","ref","Popover","PopoverSlot","name","Slot","__unstableSlotNameProvider","Provider"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, SyntheticEvent, RefCallback } from 'react';\nimport classnames from 'classnames';\nimport {\n\tuseFloating,\n\tflip as flipMiddleware,\n\tshift as shiftMiddleware,\n\tautoUpdate,\n\tarrow,\n\toffset as offsetMiddleware,\n\tlimitShift,\n\tsize,\n\tMiddleware,\n} from '@floating-ui/react-dom';\n// eslint-disable-next-line no-restricted-imports\nimport {\n\tmotion,\n\tuseReducedMotion,\n\tHTMLMotionProps,\n\tMotionProps,\n} from 'framer-motion';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseRef,\n\tuseLayoutEffect,\n\tforwardRef,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n\tuseEffect,\n} from '@wordpress/element';\nimport {\n\tuseViewportMatch,\n\tuseMergeRefs,\n\t__experimentalUseDialog as useDialog,\n} from '@wordpress/compose';\nimport { close } from '@wordpress/icons';\nimport deprecated from '@wordpress/deprecated';\nimport { Path, SVG } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport ScrollLock from '../scroll-lock';\nimport { Slot, Fill, useSlot } from '../slot-fill';\nimport {\n\tgetFrameOffset,\n\tpositionToPlacement,\n\tplacementToMotionAnimationProps,\n\tgetReferenceOwnerDocument,\n\tgetReferenceElement,\n} from './utils';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type {\n\tPopoverProps,\n\tAnimatedWrapperProps,\n\tPopoverAnchorRefReference,\n\tPopoverAnchorRefTopBottom,\n} from './types';\n\n/**\n * Name of slot in which popover should fill.\n *\n * @type {string}\n */\nconst SLOT_NAME = 'Popover';\n\n// An SVG displaying a triangle facing down, filled with a solid\n// color and bordered in such a way to create an arrow-like effect.\n// Keeping the SVG's viewbox squared simplify the arrow positioning\n// calculations.\nconst ArrowTriangle = () => (\n\t<SVG\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox={ `0 0 100 100` }\n\t\tclassName=\"components-popover__triangle\"\n\t\trole=\"presentation\"\n\t>\n\t\t<Path\n\t\t\tclassName=\"components-popover__triangle-bg\"\n\t\t\td=\"M 0 0 L 50 50 L 100 0\"\n\t\t/>\n\t\t<Path\n\t\t\tclassName=\"components-popover__triangle-border\"\n\t\t\td=\"M 0 0 L 50 50 L 100 0\"\n\t\t\tvectorEffect=\"non-scaling-stroke\"\n\t\t/>\n\t</SVG>\n);\n\nconst AnimatedWrapper = forwardRef(\n\t(\n\t\t{\n\t\t\tstyle: receivedInlineStyles,\n\t\t\tplacement,\n\t\t\tshouldAnimate = false,\n\t\t\t...props\n\t\t}: HTMLMotionProps< 'div' > & AnimatedWrapperProps,\n\t\tforwardedRef: ForwardedRef< any >\n\t) => {\n\t\t// When animating, animate only once (i.e. when the popover is opened), and\n\t\t// do not animate on subsequent prop changes (as it conflicts with\n\t\t// floating-ui's positioning updates).\n\t\tconst [ hasAnimatedOnce, setHasAnimatedOnce ] = useState( false );\n\t\tconst shouldReduceMotion = useReducedMotion();\n\n\t\tconst { style: motionInlineStyles, ...otherMotionProps } = useMemo(\n\t\t\t() => placementToMotionAnimationProps( placement ),\n\t\t\t[ placement ]\n\t\t);\n\n\t\tconst onAnimationComplete = useCallback(\n\t\t\t() => setHasAnimatedOnce( true ),\n\t\t\t[]\n\t\t);\n\n\t\tconst computedAnimationProps: HTMLMotionProps< 'div' > =\n\t\t\tshouldAnimate && ! shouldReduceMotion\n\t\t\t\t? {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t...motionInlineStyles,\n\t\t\t\t\t\t\t...receivedInlineStyles,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t...otherMotionProps,\n\t\t\t\t\t\tonAnimationComplete,\n\t\t\t\t\t\tanimate: hasAnimatedOnce\n\t\t\t\t\t\t\t? false\n\t\t\t\t\t\t\t: otherMotionProps.animate,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\tanimate: false,\n\t\t\t\t\t\tstyle: receivedInlineStyles,\n\t\t\t\t };\n\n\t\treturn (\n\t\t\t<motion.div\n\t\t\t\t{ ...computedAnimationProps }\n\t\t\t\t{ ...props }\n\t\t\t\tref={ forwardedRef }\n\t\t\t/>\n\t\t);\n\t}\n);\n\nconst slotNameContext = createContext< string | undefined >( undefined );\n\nconst UnforwardedPopover = (\n\tprops: Omit<\n\t\tWordPressComponentProps< PopoverProps, 'div', false >,\n\t\t// To avoid overlaps between the standard HTML attributes and the props\n\t\t// expected by `framer-motion`, omit all framer motion props from popover\n\t\t// props (except for `animate`, which is re-defined in `PopoverProps`).\n\t\tkeyof Omit< MotionProps, 'animate' >\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tanimate = true,\n\t\theaderTitle,\n\t\tonClose,\n\t\tchildren,\n\t\tclassName,\n\t\tnoArrow = true,\n\t\tisAlternate,\n\t\tposition,\n\t\tplacement: placementProp = 'bottom-start',\n\t\toffset: offsetProp = 0,\n\t\tfocusOnMount = 'firstElement',\n\t\tanchor,\n\t\texpandOnMobile,\n\t\tonFocusOutside,\n\t\t__unstableSlotName = SLOT_NAME,\n\t\tflip = true,\n\t\tresize = true,\n\t\tshift = false,\n\n\t\t// Deprecated props\n\t\t__unstableForcePosition,\n\t\t__unstableShift,\n\t\tanchorRef,\n\t\tanchorRect,\n\t\tgetAnchorRect,\n\t\trange,\n\n\t\t// Rest\n\t\t...contentProps\n\t} = props;\n\n\tif ( range ) {\n\t\tdeprecated( '`range` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t} );\n\t}\n\n\tlet computedFlipProp = flip;\n\tlet computedResizeProp = resize;\n\tif ( __unstableForcePosition !== undefined ) {\n\t\tdeprecated( '`__unstableForcePosition` prop wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`flip={ false }` and `resize={ false }`',\n\t\t} );\n\n\t\t// Back-compat, set the `flip` and `resize` props\n\t\t// to `false` to replicate `__unstableForcePosition`.\n\t\tcomputedFlipProp = ! __unstableForcePosition;\n\t\tcomputedResizeProp = ! __unstableForcePosition;\n\t}\n\n\tlet shouldShift = shift;\n\tif ( __unstableShift !== undefined ) {\n\t\tdeprecated( '`__unstableShift` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`shift` prop`',\n\t\t} );\n\n\t\t// Back-compat.\n\t\tshouldShift = __unstableShift;\n\t}\n\n\tif ( anchorRef !== undefined ) {\n\t\tdeprecated( '`anchorRef` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tif ( anchorRect !== undefined ) {\n\t\tdeprecated( '`anchorRect` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tif ( getAnchorRect !== undefined ) {\n\t\tdeprecated( '`getAnchorRect` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tconst arrowRef = useRef( null );\n\n\tconst [ fallbackReferenceElement, setFallbackReferenceElement ] =\n\t\tuseState< HTMLSpanElement | null >( null );\n\tconst [ referenceOwnerDocument, setReferenceOwnerDocument ] = useState<\n\t\tDocument | undefined\n\t>();\n\n\tconst anchorRefFallback: RefCallback< HTMLSpanElement > = useCallback(\n\t\t( node ) => {\n\t\t\tsetFallbackReferenceElement( node );\n\t\t},\n\t\t[]\n\t);\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst isExpanded = expandOnMobile && isMobileViewport;\n\tconst hasArrow = ! isExpanded && ! noArrow;\n\tconst normalizedPlacementFromProps = position\n\t\t? positionToPlacement( position )\n\t\t: placementProp;\n\n\t/**\n\t * Offsets the position of the popover when the anchor is inside an iframe.\n\t *\n\t * Store the offset in a ref, due to constraints with floating-ui:\n\t * https://floating-ui.com/docs/react-dom#variables-inside-middleware-functions.\n\t */\n\tconst frameOffsetRef = useRef( getFrameOffset( referenceOwnerDocument ) );\n\t/**\n\t * Store the offset prop in a ref, due to constraints with floating-ui:\n\t * https://floating-ui.com/docs/react-dom#variables-inside-middleware-functions.\n\t */\n\tconst offsetRef = useRef( offsetProp );\n\n\tconst middleware = [\n\t\toffsetMiddleware( ( { placement: currentPlacement } ) => {\n\t\t\tif ( ! frameOffsetRef.current ) {\n\t\t\t\treturn offsetRef.current;\n\t\t\t}\n\n\t\t\tconst isTopBottomPlacement =\n\t\t\t\tcurrentPlacement.includes( 'top' ) ||\n\t\t\t\tcurrentPlacement.includes( 'bottom' );\n\n\t\t\t// The main axis should represent the gap between the\n\t\t\t// floating element and the reference element. The cross\n\t\t\t// axis is always perpendicular to the main axis.\n\t\t\tconst mainAxis = isTopBottomPlacement ? 'y' : 'x';\n\t\t\tconst crossAxis = mainAxis === 'x' ? 'y' : 'x';\n\n\t\t\t// When the popover is before the reference, subtract the offset,\n\t\t\t// of the main axis else add it.\n\t\t\tconst hasBeforePlacement =\n\t\t\t\tcurrentPlacement.includes( 'top' ) ||\n\t\t\t\tcurrentPlacement.includes( 'left' );\n\t\t\tconst mainAxisModifier = hasBeforePlacement ? -1 : 1;\n\n\t\t\treturn {\n\t\t\t\tmainAxis:\n\t\t\t\t\toffsetRef.current +\n\t\t\t\t\tframeOffsetRef.current[ mainAxis ] * mainAxisModifier,\n\t\t\t\tcrossAxis: frameOffsetRef.current[ crossAxis ],\n\t\t\t};\n\t\t} ),\n\t\tcomputedFlipProp ? flipMiddleware() : undefined,\n\t\tcomputedResizeProp\n\t\t\t? size( {\n\t\t\t\t\tapply( sizeProps ) {\n\t\t\t\t\t\tconst { firstElementChild } =\n\t\t\t\t\t\t\trefs.floating.current ?? {};\n\n\t\t\t\t\t\t// Only HTMLElement instances have the `style` property.\n\t\t\t\t\t\tif ( ! ( firstElementChild instanceof HTMLElement ) )\n\t\t\t\t\t\t\treturn;\n\n\t\t\t\t\t\t// Reduce the height of the popover to the available space.\n\t\t\t\t\t\tObject.assign( firstElementChild.style, {\n\t\t\t\t\t\t\tmaxHeight: `${ sizeProps.availableHeight }px`,\n\t\t\t\t\t\t\toverflow: 'auto',\n\t\t\t\t\t\t} );\n\t\t\t\t\t},\n\t\t\t } )\n\t\t\t: undefined,\n\t\tshouldShift\n\t\t\t? shiftMiddleware( {\n\t\t\t\t\tcrossAxis: true,\n\t\t\t\t\tlimiter: limitShift(),\n\t\t\t\t\tpadding: 1, // Necessary to avoid flickering at the edge of the viewport.\n\t\t\t } )\n\t\t\t: undefined,\n\t\tarrow( { element: arrowRef } ),\n\t].filter(\n\t\t( m: Middleware | undefined ): m is Middleware => m !== undefined\n\t);\n\tconst slotName = useContext( slotNameContext ) || __unstableSlotName;\n\tconst slot = useSlot( slotName );\n\n\tlet onDialogClose;\n\n\tif ( onClose || onFocusOutside ) {\n\t\tonDialogClose = ( type: string | undefined, event: SyntheticEvent ) => {\n\t\t\t// Ideally the popover should have just a single onClose prop and\n\t\t\t// not three props that potentially do the same thing.\n\t\t\tif ( type === 'focus-outside' && onFocusOutside ) {\n\t\t\t\tonFocusOutside( event );\n\t\t\t} else if ( onClose ) {\n\t\t\t\tonClose();\n\t\t\t}\n\t\t};\n\t}\n\n\tconst [ dialogRef, dialogProps ] = useDialog( {\n\t\tfocusOnMount,\n\t\t__unstableOnClose: onDialogClose,\n\t\t// @ts-expect-error The __unstableOnClose property needs to be deprecated first (see https://github.com/WordPress/gutenberg/pull/27675)\n\t\tonClose: onDialogClose,\n\t} );\n\n\tconst {\n\t\t// Positioning coordinates\n\t\tx,\n\t\ty,\n\t\t// Callback refs (not regular refs). This allows the position to be updated.\n\t\t// when either elements change.\n\t\treference: referenceCallbackRef,\n\t\tfloating,\n\t\t// Object with \"regular\" refs to both \"reference\" and \"floating\"\n\t\trefs,\n\t\t// Type of CSS position property to use (absolute or fixed)\n\t\tstrategy,\n\t\tupdate,\n\t\tplacement: computedPlacement,\n\t\tmiddlewareData: { arrow: arrowData },\n\t} = useFloating( {\n\t\tplacement: normalizedPlacementFromProps,\n\t\tmiddleware,\n\t\twhileElementsMounted: ( referenceParam, floatingParam, updateParam ) =>\n\t\t\tautoUpdate( referenceParam, floatingParam, updateParam, {\n\t\t\t\tanimationFrame: true,\n\t\t\t} ),\n\t} );\n\n\tuseEffect( () => {\n\t\toffsetRef.current = offsetProp;\n\t\tupdate();\n\t}, [ offsetProp, update ] );\n\n\tconst arrowCallbackRef = useCallback(\n\t\t( node ) => {\n\t\t\tarrowRef.current = node;\n\t\t\tupdate();\n\t\t},\n\t\t[ update ]\n\t);\n\n\t// When any of the possible anchor \"sources\" change,\n\t// recompute the reference element (real or virtual) and its owner document.\n\tuseLayoutEffect( () => {\n\t\tconst resultingReferenceOwnerDoc = getReferenceOwnerDocument( {\n\t\t\tanchor,\n\t\t\tanchorRef,\n\t\t\tanchorRect,\n\t\t\tgetAnchorRect,\n\t\t\tfallbackReferenceElement,\n\t\t\tfallbackDocument: document,\n\t\t} );\n\t\tconst resultingReferenceElement = getReferenceElement( {\n\t\t\tanchor,\n\t\t\tanchorRef,\n\t\t\tanchorRect,\n\t\t\tgetAnchorRect,\n\t\t\tfallbackReferenceElement,\n\t\t} );\n\n\t\treferenceCallbackRef( resultingReferenceElement );\n\n\t\tsetReferenceOwnerDocument( resultingReferenceOwnerDoc );\n\t}, [\n\t\tanchor,\n\t\tanchorRef as Element | undefined,\n\t\t( anchorRef as PopoverAnchorRefTopBottom | undefined )?.top,\n\t\t( anchorRef as PopoverAnchorRefTopBottom | undefined )?.bottom,\n\t\t( anchorRef as Range | undefined )?.startContainer,\n\t\t( anchorRef as PopoverAnchorRefReference )?.current,\n\t\tanchorRect,\n\t\tgetAnchorRect,\n\t\tfallbackReferenceElement,\n\t\treferenceCallbackRef,\n\t] );\n\n\t// If the reference element is in a different ownerDocument (e.g. iFrame),\n\t// we need to manually update the floating's position as the reference's owner\n\t// document scrolls. Also update the frame offset if the view resizes.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\t// Reference and root documents are the same.\n\t\t\treferenceOwnerDocument === document ||\n\t\t\t// Reference and floating are in the same document.\n\t\t\treferenceOwnerDocument === refs?.floating?.current?.ownerDocument ||\n\t\t\t// The reference's document has no view (i.e. window)\n\t\t\t// or frame element (ie. it's not an iframe).\n\t\t\t! referenceOwnerDocument?.defaultView?.frameElement\n\t\t) {\n\t\t\tframeOffsetRef.current = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\tconst { defaultView } = referenceOwnerDocument;\n\n\t\tconst updateFrameOffset = () => {\n\t\t\tframeOffsetRef.current = getFrameOffset( referenceOwnerDocument );\n\t\t\tupdate();\n\t\t};\n\t\tdefaultView.addEventListener( 'resize', updateFrameOffset );\n\n\t\tupdateFrameOffset();\n\n\t\treturn () => {\n\t\t\tdefaultView.removeEventListener( 'resize', updateFrameOffset );\n\t\t};\n\t}, [ referenceOwnerDocument, update ] );\n\n\tconst mergedFloatingRef = useMergeRefs( [\n\t\tfloating,\n\t\tdialogRef,\n\t\tforwardedRef,\n\t] );\n\n\t// Disable reason: We care to capture the _bubbled_ events from inputs\n\t// within popover as inferring close intent.\n\n\tlet content = (\n\t\t// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<AnimatedWrapper\n\t\t\tshouldAnimate={ animate && ! isExpanded }\n\t\t\tplacement={ computedPlacement }\n\t\t\tclassName={ classnames( 'components-popover', className, {\n\t\t\t\t'is-expanded': isExpanded,\n\t\t\t\t'is-alternate': isAlternate,\n\t\t\t} ) }\n\t\t\t{ ...contentProps }\n\t\t\tref={ mergedFloatingRef }\n\t\t\t{ ...dialogProps }\n\t\t\ttabIndex={ -1 }\n\t\t\tstyle={\n\t\t\t\tisExpanded\n\t\t\t\t\t? undefined\n\t\t\t\t\t: {\n\t\t\t\t\t\t\tposition: strategy,\n\t\t\t\t\t\t\tleft: Number.isNaN( x ) ? 0 : x ?? undefined,\n\t\t\t\t\t\t\ttop: Number.isNaN( y ) ? 0 : y ?? undefined,\n\t\t\t\t\t }\n\t\t\t}\n\t\t>\n\t\t\t{ /* Prevents scroll on the document */ }\n\t\t\t{ isExpanded && <ScrollLock /> }\n\t\t\t{ isExpanded && (\n\t\t\t\t<div className=\"components-popover__header\">\n\t\t\t\t\t<span className=\"components-popover__header-title\">\n\t\t\t\t\t\t{ headerTitle }\n\t\t\t\t\t</span>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"components-popover__close\"\n\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-popover__content\">{ children }</div>\n\t\t\t{ hasArrow && (\n\t\t\t\t<div\n\t\t\t\t\tref={ arrowCallbackRef }\n\t\t\t\t\tclassName={ [\n\t\t\t\t\t\t'components-popover__arrow',\n\t\t\t\t\t\t`is-${ computedPlacement.split( '-' )[ 0 ] }`,\n\t\t\t\t\t].join( ' ' ) }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tleft:\n\t\t\t\t\t\t\ttypeof arrowData?.x !== 'undefined' &&\n\t\t\t\t\t\t\tNumber.isFinite( arrowData.x )\n\t\t\t\t\t\t\t\t? `${\n\t\t\t\t\t\t\t\t\t\tarrowData.x +\n\t\t\t\t\t\t\t\t\t\t( frameOffsetRef.current?.x ?? 0 )\n\t\t\t\t\t\t\t\t }px`\n\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t\ttop:\n\t\t\t\t\t\t\ttypeof arrowData?.y !== 'undefined' &&\n\t\t\t\t\t\t\tNumber.isFinite( arrowData.y )\n\t\t\t\t\t\t\t\t? `${\n\t\t\t\t\t\t\t\t\t\tarrowData.y +\n\t\t\t\t\t\t\t\t\t\t( frameOffsetRef.current?.y ?? 0 )\n\t\t\t\t\t\t\t\t }px`\n\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<ArrowTriangle />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</AnimatedWrapper>\n\t);\n\n\tif ( slot.ref ) {\n\t\tcontent = <Fill name={ slotName }>{ content }</Fill>;\n\t}\n\n\tif ( anchorRef || anchorRect || anchor ) {\n\t\treturn content;\n\t}\n\n\treturn <span ref={ anchorRefFallback }>{ content }</span>;\n};\n\n/**\n * `Popover` renders its content in a floating modal. If no explicit anchor is passed via props, it anchors to its parent element by default.\n *\n * ```jsx\n * import { Button, Popover } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyPopover = () => {\n * \tconst [ isVisible, setIsVisible ] = useState( false );\n * \tconst toggleVisible = () => {\n * \t\tsetIsVisible( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<Button variant=\"secondary\" onClick={ toggleVisible }>\n * \t\t\tToggle Popover!\n * \t\t\t{ isVisible && <Popover>Popover is toggled!</Popover> }\n * \t\t</Button>\n * \t);\n * };\n * ```\n *\n */\nexport const Popover = forwardRef( UnforwardedPopover );\n\nfunction PopoverSlot(\n\t{ name = SLOT_NAME }: { name?: string },\n\tref: ForwardedRef< any >\n) {\n\treturn (\n\t\t<Slot\n\t\t\t// @ts-expect-error Need to type `SlotFill`\n\t\t\tbubblesVirtually\n\t\t\tname={ name }\n\t\t\tclassName=\"popover-slot\"\n\t\t\tref={ ref }\n\t\t/>\n\t);\n}\n\n// @ts-expect-error For Legacy Reasons\nPopover.Slot = forwardRef( PopoverSlot );\n// @ts-expect-error For Legacy Reasons\nPopover.__unstableSlotNameProvider = slotNameContext.Provider;\n\nexport default Popover;\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/popover/index.tsx"],"names":["SLOT_NAME","ArrowTriangle","AnimatedWrapper","forwardedRef","style","receivedInlineStyles","placement","shouldAnimate","props","hasAnimatedOnce","setHasAnimatedOnce","shouldReduceMotion","motionInlineStyles","otherMotionProps","onAnimationComplete","computedAnimationProps","animate","slotNameContext","undefined","UnforwardedPopover","headerTitle","onClose","children","className","noArrow","isAlternate","position","placementProp","offset","offsetProp","focusOnMount","anchor","expandOnMobile","onFocusOutside","__unstableSlotName","flip","resize","shift","__unstableForcePosition","__unstableShift","anchorRef","anchorRect","getAnchorRect","range","contentProps","since","version","computedFlipProp","computedResizeProp","alternative","shouldShift","arrowRef","fallbackReferenceElement","setFallbackReferenceElement","referenceOwnerDocument","setReferenceOwnerDocument","anchorRefFallback","node","isMobileViewport","isExpanded","hasArrow","normalizedPlacementFromProps","frameOffsetRef","middleware","name","fn","x","y","current","data","amount","apply","sizeProps","firstElementChild","refs","floating","HTMLElement","Object","assign","maxHeight","availableHeight","overflow","crossAxis","limiter","padding","element","filter","m","slotName","slot","onDialogClose","type","event","dialogRef","dialogProps","__unstableOnClose","reference","referenceCallbackRef","strategy","update","computedPlacement","middlewareData","arrow","arrowData","whileElementsMounted","referenceParam","floatingParam","updateParam","animationFrame","arrowCallbackRef","resultingReferenceOwnerDoc","fallbackDocument","document","resultingReferenceElement","top","bottom","startContainer","ownerDocument","defaultView","frameElement","updateFrameOffset","addEventListener","removeEventListener","mergedFloatingRef","content","left","Number","isNaN","close","split","join","isFinite","ref","Popover","PopoverSlot","Slot","__unstableSlotNameProvider","Provider"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, SyntheticEvent, RefCallback } from 'react';\nimport classnames from 'classnames';\nimport {\n\tuseFloating,\n\tflip as flipMiddleware,\n\tshift as shiftMiddleware,\n\tautoUpdate,\n\tarrow,\n\toffset as offsetMiddleware,\n\tsize,\n\tMiddleware,\n\tMiddlewareArguments,\n} from '@floating-ui/react-dom';\n// eslint-disable-next-line no-restricted-imports\nimport {\n\tmotion,\n\tuseReducedMotion,\n\tHTMLMotionProps,\n\tMotionProps,\n} from 'framer-motion';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseRef,\n\tuseLayoutEffect,\n\tforwardRef,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n} from '@wordpress/element';\nimport {\n\tuseViewportMatch,\n\tuseMergeRefs,\n\t__experimentalUseDialog as useDialog,\n} from '@wordpress/compose';\nimport { close } from '@wordpress/icons';\nimport deprecated from '@wordpress/deprecated';\nimport { Path, SVG } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport ScrollLock from '../scroll-lock';\nimport { Slot, Fill, useSlot } from '../slot-fill';\nimport {\n\tgetFrameOffset,\n\tpositionToPlacement,\n\tplacementToMotionAnimationProps,\n\tgetReferenceOwnerDocument,\n\tgetReferenceElement,\n} from './utils';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type {\n\tPopoverProps,\n\tAnimatedWrapperProps,\n\tPopoverAnchorRefReference,\n\tPopoverAnchorRefTopBottom,\n} from './types';\nimport { limitShift as customLimitShift } from './limit-shift';\n\n/**\n * Name of slot in which popover should fill.\n *\n * @type {string}\n */\nconst SLOT_NAME = 'Popover';\n\n// An SVG displaying a triangle facing down, filled with a solid\n// color and bordered in such a way to create an arrow-like effect.\n// Keeping the SVG's viewbox squared simplify the arrow positioning\n// calculations.\nconst ArrowTriangle = () => (\n\t<SVG\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox={ `0 0 100 100` }\n\t\tclassName=\"components-popover__triangle\"\n\t\trole=\"presentation\"\n\t>\n\t\t<Path\n\t\t\tclassName=\"components-popover__triangle-bg\"\n\t\t\td=\"M 0 0 L 50 50 L 100 0\"\n\t\t/>\n\t\t<Path\n\t\t\tclassName=\"components-popover__triangle-border\"\n\t\t\td=\"M 0 0 L 50 50 L 100 0\"\n\t\t\tvectorEffect=\"non-scaling-stroke\"\n\t\t/>\n\t</SVG>\n);\n\nconst AnimatedWrapper = forwardRef(\n\t(\n\t\t{\n\t\t\tstyle: receivedInlineStyles,\n\t\t\tplacement,\n\t\t\tshouldAnimate = false,\n\t\t\t...props\n\t\t}: HTMLMotionProps< 'div' > & AnimatedWrapperProps,\n\t\tforwardedRef: ForwardedRef< any >\n\t) => {\n\t\t// When animating, animate only once (i.e. when the popover is opened), and\n\t\t// do not animate on subsequent prop changes (as it conflicts with\n\t\t// floating-ui's positioning updates).\n\t\tconst [ hasAnimatedOnce, setHasAnimatedOnce ] = useState( false );\n\t\tconst shouldReduceMotion = useReducedMotion();\n\n\t\tconst { style: motionInlineStyles, ...otherMotionProps } = useMemo(\n\t\t\t() => placementToMotionAnimationProps( placement ),\n\t\t\t[ placement ]\n\t\t);\n\n\t\tconst onAnimationComplete = useCallback(\n\t\t\t() => setHasAnimatedOnce( true ),\n\t\t\t[]\n\t\t);\n\n\t\tconst computedAnimationProps: HTMLMotionProps< 'div' > =\n\t\t\tshouldAnimate && ! shouldReduceMotion\n\t\t\t\t? {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t...motionInlineStyles,\n\t\t\t\t\t\t\t...receivedInlineStyles,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t...otherMotionProps,\n\t\t\t\t\t\tonAnimationComplete,\n\t\t\t\t\t\tanimate: hasAnimatedOnce\n\t\t\t\t\t\t\t? false\n\t\t\t\t\t\t\t: otherMotionProps.animate,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\tanimate: false,\n\t\t\t\t\t\tstyle: receivedInlineStyles,\n\t\t\t\t };\n\n\t\treturn (\n\t\t\t<motion.div\n\t\t\t\t{ ...computedAnimationProps }\n\t\t\t\t{ ...props }\n\t\t\t\tref={ forwardedRef }\n\t\t\t/>\n\t\t);\n\t}\n);\n\nconst slotNameContext = createContext< string | undefined >( undefined );\n\nconst UnforwardedPopover = (\n\tprops: Omit<\n\t\tWordPressComponentProps< PopoverProps, 'div', false >,\n\t\t// To avoid overlaps between the standard HTML attributes and the props\n\t\t// expected by `framer-motion`, omit all framer motion props from popover\n\t\t// props (except for `animate`, which is re-defined in `PopoverProps`).\n\t\tkeyof Omit< MotionProps, 'animate' >\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tanimate = true,\n\t\theaderTitle,\n\t\tonClose,\n\t\tchildren,\n\t\tclassName,\n\t\tnoArrow = true,\n\t\tisAlternate,\n\t\tposition,\n\t\tplacement: placementProp = 'bottom-start',\n\t\toffset: offsetProp = 0,\n\t\tfocusOnMount = 'firstElement',\n\t\tanchor,\n\t\texpandOnMobile,\n\t\tonFocusOutside,\n\t\t__unstableSlotName = SLOT_NAME,\n\t\tflip = true,\n\t\tresize = true,\n\t\tshift = false,\n\n\t\t// Deprecated props\n\t\t__unstableForcePosition,\n\t\t__unstableShift,\n\t\tanchorRef,\n\t\tanchorRect,\n\t\tgetAnchorRect,\n\t\trange,\n\n\t\t// Rest\n\t\t...contentProps\n\t} = props;\n\n\tif ( range ) {\n\t\tdeprecated( '`range` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t} );\n\t}\n\n\tlet computedFlipProp = flip;\n\tlet computedResizeProp = resize;\n\tif ( __unstableForcePosition !== undefined ) {\n\t\tdeprecated( '`__unstableForcePosition` prop wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`flip={ false }` and `resize={ false }`',\n\t\t} );\n\n\t\t// Back-compat, set the `flip` and `resize` props\n\t\t// to `false` to replicate `__unstableForcePosition`.\n\t\tcomputedFlipProp = ! __unstableForcePosition;\n\t\tcomputedResizeProp = ! __unstableForcePosition;\n\t}\n\n\tlet shouldShift = shift;\n\tif ( __unstableShift !== undefined ) {\n\t\tdeprecated( '`__unstableShift` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`shift` prop`',\n\t\t} );\n\n\t\t// Back-compat.\n\t\tshouldShift = __unstableShift;\n\t}\n\n\tif ( anchorRef !== undefined ) {\n\t\tdeprecated( '`anchorRef` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tif ( anchorRect !== undefined ) {\n\t\tdeprecated( '`anchorRect` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tif ( getAnchorRect !== undefined ) {\n\t\tdeprecated( '`getAnchorRect` prop in wp.components.Popover', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.3',\n\t\t\talternative: '`anchor` prop',\n\t\t} );\n\t}\n\n\tconst arrowRef = useRef( null );\n\n\tconst [ fallbackReferenceElement, setFallbackReferenceElement ] =\n\t\tuseState< HTMLSpanElement | null >( null );\n\tconst [ referenceOwnerDocument, setReferenceOwnerDocument ] = useState<\n\t\tDocument | undefined\n\t>();\n\n\tconst anchorRefFallback: RefCallback< HTMLSpanElement > = useCallback(\n\t\t( node ) => {\n\t\t\tsetFallbackReferenceElement( node );\n\t\t},\n\t\t[]\n\t);\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst isExpanded = expandOnMobile && isMobileViewport;\n\tconst hasArrow = ! isExpanded && ! noArrow;\n\tconst normalizedPlacementFromProps = position\n\t\t? positionToPlacement( position )\n\t\t: placementProp;\n\n\t/**\n\t * Offsets the position of the popover when the anchor is inside an iframe.\n\t *\n\t * Store the offset in a ref, due to constraints with floating-ui:\n\t * https://floating-ui.com/docs/react-dom#variables-inside-middleware-functions.\n\t */\n\tconst frameOffsetRef = useRef( getFrameOffset( referenceOwnerDocument ) );\n\n\tconst middleware = [\n\t\t// Custom middleware which adjusts the popover's position by taking into\n\t\t// account the offset of the anchor's iframe (if any) compared to the page.\n\t\t{\n\t\t\tname: 'frameOffset',\n\t\t\tfn( { x, y }: MiddlewareArguments ) {\n\t\t\t\tif ( ! frameOffsetRef.current ) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tx,\n\t\t\t\t\t\ty,\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\treturn {\n\t\t\t\t\tx: x + frameOffsetRef.current.x,\n\t\t\t\t\ty: y + frameOffsetRef.current.y,\n\t\t\t\t\tdata: {\n\t\t\t\t\t\t// This will be used in the customLimitShift() function.\n\t\t\t\t\t\tamount: frameOffsetRef.current,\n\t\t\t\t\t},\n\t\t\t\t};\n\t\t\t},\n\t\t},\n\t\toffsetMiddleware( offsetProp ),\n\t\tcomputedFlipProp ? flipMiddleware() : undefined,\n\t\tcomputedResizeProp\n\t\t\t? size( {\n\t\t\t\t\tapply( sizeProps ) {\n\t\t\t\t\t\tconst { firstElementChild } =\n\t\t\t\t\t\t\trefs.floating.current ?? {};\n\n\t\t\t\t\t\t// Only HTMLElement instances have the `style` property.\n\t\t\t\t\t\tif ( ! ( firstElementChild instanceof HTMLElement ) )\n\t\t\t\t\t\t\treturn;\n\n\t\t\t\t\t\t// Reduce the height of the popover to the available space.\n\t\t\t\t\t\tObject.assign( firstElementChild.style, {\n\t\t\t\t\t\t\tmaxHeight: `${ sizeProps.availableHeight }px`,\n\t\t\t\t\t\t\toverflow: 'auto',\n\t\t\t\t\t\t} );\n\t\t\t\t\t},\n\t\t\t } )\n\t\t\t: undefined,\n\t\tshouldShift\n\t\t\t? shiftMiddleware( {\n\t\t\t\t\tcrossAxis: true,\n\t\t\t\t\tlimiter: customLimitShift(),\n\t\t\t\t\tpadding: 1, // Necessary to avoid flickering at the edge of the viewport.\n\t\t\t } )\n\t\t\t: undefined,\n\t\tarrow( { element: arrowRef } ),\n\t].filter(\n\t\t( m: Middleware | undefined ): m is Middleware => m !== undefined\n\t);\n\tconst slotName = useContext( slotNameContext ) || __unstableSlotName;\n\tconst slot = useSlot( slotName );\n\n\tlet onDialogClose;\n\n\tif ( onClose || onFocusOutside ) {\n\t\tonDialogClose = ( type: string | undefined, event: SyntheticEvent ) => {\n\t\t\t// Ideally the popover should have just a single onClose prop and\n\t\t\t// not three props that potentially do the same thing.\n\t\t\tif ( type === 'focus-outside' && onFocusOutside ) {\n\t\t\t\tonFocusOutside( event );\n\t\t\t} else if ( onClose ) {\n\t\t\t\tonClose();\n\t\t\t}\n\t\t};\n\t}\n\n\tconst [ dialogRef, dialogProps ] = useDialog( {\n\t\tfocusOnMount,\n\t\t__unstableOnClose: onDialogClose,\n\t\t// @ts-expect-error The __unstableOnClose property needs to be deprecated first (see https://github.com/WordPress/gutenberg/pull/27675)\n\t\tonClose: onDialogClose,\n\t} );\n\n\tconst {\n\t\t// Positioning coordinates\n\t\tx,\n\t\ty,\n\t\t// Callback refs (not regular refs). This allows the position to be updated.\n\t\t// when either elements change.\n\t\treference: referenceCallbackRef,\n\t\tfloating,\n\t\t// Object with \"regular\" refs to both \"reference\" and \"floating\"\n\t\trefs,\n\t\t// Type of CSS position property to use (absolute or fixed)\n\t\tstrategy,\n\t\tupdate,\n\t\tplacement: computedPlacement,\n\t\tmiddlewareData: { arrow: arrowData },\n\t} = useFloating( {\n\t\tplacement: normalizedPlacementFromProps,\n\t\tmiddleware,\n\t\twhileElementsMounted: ( referenceParam, floatingParam, updateParam ) =>\n\t\t\tautoUpdate( referenceParam, floatingParam, updateParam, {\n\t\t\t\tanimationFrame: true,\n\t\t\t} ),\n\t} );\n\n\tconst arrowCallbackRef = useCallback(\n\t\t( node ) => {\n\t\t\tarrowRef.current = node;\n\t\t\tupdate();\n\t\t},\n\t\t[ update ]\n\t);\n\n\t// When any of the possible anchor \"sources\" change,\n\t// recompute the reference element (real or virtual) and its owner document.\n\tuseLayoutEffect( () => {\n\t\tconst resultingReferenceOwnerDoc = getReferenceOwnerDocument( {\n\t\t\tanchor,\n\t\t\tanchorRef,\n\t\t\tanchorRect,\n\t\t\tgetAnchorRect,\n\t\t\tfallbackReferenceElement,\n\t\t\tfallbackDocument: document,\n\t\t} );\n\t\tconst resultingReferenceElement = getReferenceElement( {\n\t\t\tanchor,\n\t\t\tanchorRef,\n\t\t\tanchorRect,\n\t\t\tgetAnchorRect,\n\t\t\tfallbackReferenceElement,\n\t\t} );\n\n\t\treferenceCallbackRef( resultingReferenceElement );\n\n\t\tsetReferenceOwnerDocument( resultingReferenceOwnerDoc );\n\t}, [\n\t\tanchor,\n\t\tanchorRef as Element | undefined,\n\t\t( anchorRef as PopoverAnchorRefTopBottom | undefined )?.top,\n\t\t( anchorRef as PopoverAnchorRefTopBottom | undefined )?.bottom,\n\t\t( anchorRef as Range | undefined )?.startContainer,\n\t\t( anchorRef as PopoverAnchorRefReference )?.current,\n\t\tanchorRect,\n\t\tgetAnchorRect,\n\t\tfallbackReferenceElement,\n\t\treferenceCallbackRef,\n\t] );\n\n\t// If the reference element is in a different ownerDocument (e.g. iFrame),\n\t// we need to manually update the floating's position as the reference's owner\n\t// document scrolls. Also update the frame offset if the view resizes.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\t// Reference and root documents are the same.\n\t\t\treferenceOwnerDocument === document ||\n\t\t\t// Reference and floating are in the same document.\n\t\t\treferenceOwnerDocument === refs?.floating?.current?.ownerDocument ||\n\t\t\t// The reference's document has no view (i.e. window)\n\t\t\t// or frame element (ie. it's not an iframe).\n\t\t\t! referenceOwnerDocument?.defaultView?.frameElement\n\t\t) {\n\t\t\tframeOffsetRef.current = undefined;\n\t\t\treturn;\n\t\t}\n\n\t\tconst { defaultView } = referenceOwnerDocument;\n\n\t\tconst updateFrameOffset = () => {\n\t\t\tframeOffsetRef.current = getFrameOffset( referenceOwnerDocument );\n\t\t\tupdate();\n\t\t};\n\t\tdefaultView.addEventListener( 'resize', updateFrameOffset );\n\n\t\tupdateFrameOffset();\n\n\t\treturn () => {\n\t\t\tdefaultView.removeEventListener( 'resize', updateFrameOffset );\n\t\t};\n\t}, [ referenceOwnerDocument, update ] );\n\n\tconst mergedFloatingRef = useMergeRefs( [\n\t\tfloating,\n\t\tdialogRef,\n\t\tforwardedRef,\n\t] );\n\n\t// Disable reason: We care to capture the _bubbled_ events from inputs\n\t// within popover as inferring close intent.\n\n\tlet content = (\n\t\t// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<AnimatedWrapper\n\t\t\tshouldAnimate={ animate && ! isExpanded }\n\t\t\tplacement={ computedPlacement }\n\t\t\tclassName={ classnames( 'components-popover', className, {\n\t\t\t\t'is-expanded': isExpanded,\n\t\t\t\t'is-alternate': isAlternate,\n\t\t\t} ) }\n\t\t\t{ ...contentProps }\n\t\t\tref={ mergedFloatingRef }\n\t\t\t{ ...dialogProps }\n\t\t\ttabIndex={ -1 }\n\t\t\tstyle={\n\t\t\t\tisExpanded\n\t\t\t\t\t? undefined\n\t\t\t\t\t: {\n\t\t\t\t\t\t\tposition: strategy,\n\t\t\t\t\t\t\tleft: Number.isNaN( x ) ? 0 : x ?? undefined,\n\t\t\t\t\t\t\ttop: Number.isNaN( y ) ? 0 : y ?? undefined,\n\t\t\t\t\t }\n\t\t\t}\n\t\t>\n\t\t\t{ /* Prevents scroll on the document */ }\n\t\t\t{ isExpanded && <ScrollLock /> }\n\t\t\t{ isExpanded && (\n\t\t\t\t<div className=\"components-popover__header\">\n\t\t\t\t\t<span className=\"components-popover__header-title\">\n\t\t\t\t\t\t{ headerTitle }\n\t\t\t\t\t</span>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"components-popover__close\"\n\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-popover__content\">{ children }</div>\n\t\t\t{ hasArrow && (\n\t\t\t\t<div\n\t\t\t\t\tref={ arrowCallbackRef }\n\t\t\t\t\tclassName={ [\n\t\t\t\t\t\t'components-popover__arrow',\n\t\t\t\t\t\t`is-${ computedPlacement.split( '-' )[ 0 ] }`,\n\t\t\t\t\t].join( ' ' ) }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\tleft:\n\t\t\t\t\t\t\ttypeof arrowData?.x !== 'undefined' &&\n\t\t\t\t\t\t\tNumber.isFinite( arrowData.x )\n\t\t\t\t\t\t\t\t? `${\n\t\t\t\t\t\t\t\t\t\tarrowData.x +\n\t\t\t\t\t\t\t\t\t\t( frameOffsetRef.current?.x ?? 0 )\n\t\t\t\t\t\t\t\t }px`\n\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t\ttop:\n\t\t\t\t\t\t\ttypeof arrowData?.y !== 'undefined' &&\n\t\t\t\t\t\t\tNumber.isFinite( arrowData.y )\n\t\t\t\t\t\t\t\t? `${\n\t\t\t\t\t\t\t\t\t\tarrowData.y +\n\t\t\t\t\t\t\t\t\t\t( frameOffsetRef.current?.y ?? 0 )\n\t\t\t\t\t\t\t\t }px`\n\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<ArrowTriangle />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</AnimatedWrapper>\n\t);\n\n\tif ( slot.ref ) {\n\t\tcontent = <Fill name={ slotName }>{ content }</Fill>;\n\t}\n\n\tif ( anchorRef || anchorRect || anchor ) {\n\t\treturn content;\n\t}\n\n\treturn <span ref={ anchorRefFallback }>{ content }</span>;\n};\n\n/**\n * `Popover` renders its content in a floating modal. If no explicit anchor is passed via props, it anchors to its parent element by default.\n *\n * ```jsx\n * import { Button, Popover } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyPopover = () => {\n * \tconst [ isVisible, setIsVisible ] = useState( false );\n * \tconst toggleVisible = () => {\n * \t\tsetIsVisible( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<Button variant=\"secondary\" onClick={ toggleVisible }>\n * \t\t\tToggle Popover!\n * \t\t\t{ isVisible && <Popover>Popover is toggled!</Popover> }\n * \t\t</Button>\n * \t);\n * };\n * ```\n *\n */\nexport const Popover = forwardRef( UnforwardedPopover );\n\nfunction PopoverSlot(\n\t{ name = SLOT_NAME }: { name?: string },\n\tref: ForwardedRef< any >\n) {\n\treturn (\n\t\t<Slot\n\t\t\t// @ts-expect-error Need to type `SlotFill`\n\t\t\tbubblesVirtually\n\t\t\tname={ name }\n\t\t\tclassName=\"popover-slot\"\n\t\t\tref={ ref }\n\t\t/>\n\t);\n}\n\n// @ts-expect-error For Legacy Reasons\nPopover.Slot = forwardRef( PopoverSlot );\n// @ts-expect-error For Legacy Reasons\nPopover.__unstableSlotNameProvider = slotNameContext.Provider;\n\nexport default Popover;\n"]}
|
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.limitShift = void 0;
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* External dependencies
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* Parts of this source were derived and modified from `floating-ui`,
|
|
14
|
+
* released under the MIT license.
|
|
15
|
+
*
|
|
16
|
+
* https://github.com/floating-ui/floating-ui
|
|
17
|
+
*
|
|
18
|
+
* Copyright (c) 2021 Floating UI contributors
|
|
19
|
+
*
|
|
20
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
21
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
22
|
+
* in the Software without restriction, including without limitation the rights
|
|
23
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
24
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
25
|
+
* furnished to do so, subject to the following conditions:
|
|
26
|
+
*
|
|
27
|
+
* The above copyright notice and this permission notice shall be included in all
|
|
28
|
+
* copies or substantial portions of the Software.
|
|
29
|
+
*
|
|
30
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
31
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
32
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
33
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
34
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
35
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
36
|
+
* SOFTWARE.
|
|
37
|
+
*/
|
|
38
|
+
|
|
39
|
+
/**
|
|
40
|
+
* Custom limiter function for the `shift` middleware.
|
|
41
|
+
* This function is mostly identical default `limitShift` from ``@floating-ui`;
|
|
42
|
+
* the only difference is that, when computing the min/max shift limits, it
|
|
43
|
+
* also takes into account the iframe offset that is added by the
|
|
44
|
+
* custom "frameOffset" middleware.
|
|
45
|
+
*
|
|
46
|
+
* All unexported types and functions are also from the `@floating-ui` library,
|
|
47
|
+
* and have been copied to this file for convenience.
|
|
48
|
+
*/
|
|
49
|
+
function getSide(placement) {
|
|
50
|
+
return placement.split('-')[0];
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
function getMainAxisFromPlacement(placement) {
|
|
54
|
+
return ['top', 'bottom'].includes(getSide(placement)) ? 'x' : 'y';
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
function getCrossAxis(axis) {
|
|
58
|
+
return axis === 'x' ? 'y' : 'x';
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
const limitShift = function () {
|
|
62
|
+
let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
63
|
+
return {
|
|
64
|
+
options,
|
|
65
|
+
|
|
66
|
+
fn(middlewareArguments) {
|
|
67
|
+
var _middlewareData$frame;
|
|
68
|
+
|
|
69
|
+
const {
|
|
70
|
+
x,
|
|
71
|
+
y,
|
|
72
|
+
placement,
|
|
73
|
+
rects,
|
|
74
|
+
middlewareData
|
|
75
|
+
} = middlewareArguments;
|
|
76
|
+
const {
|
|
77
|
+
offset = 0,
|
|
78
|
+
mainAxis: checkMainAxis = true,
|
|
79
|
+
crossAxis: checkCrossAxis = true
|
|
80
|
+
} = options;
|
|
81
|
+
const coords = {
|
|
82
|
+
x,
|
|
83
|
+
y
|
|
84
|
+
};
|
|
85
|
+
const mainAxis = getMainAxisFromPlacement(placement);
|
|
86
|
+
const crossAxis = getCrossAxis(mainAxis);
|
|
87
|
+
let mainAxisCoord = coords[mainAxis];
|
|
88
|
+
let crossAxisCoord = coords[crossAxis];
|
|
89
|
+
const rawOffset = typeof offset === 'function' ? offset(middlewareArguments) : offset;
|
|
90
|
+
const computedOffset = typeof rawOffset === 'number' ? {
|
|
91
|
+
mainAxis: rawOffset,
|
|
92
|
+
crossAxis: 0
|
|
93
|
+
} : {
|
|
94
|
+
mainAxis: 0,
|
|
95
|
+
crossAxis: 0,
|
|
96
|
+
...rawOffset
|
|
97
|
+
}; // At the moment of writing, this is the only difference
|
|
98
|
+
// with the `limitShift` function from `@floating-ui`.
|
|
99
|
+
// This offset needs to be added to all min/max limits
|
|
100
|
+
// in order to make the shift-limiting work as expected.
|
|
101
|
+
|
|
102
|
+
const additionalFrameOffset = {
|
|
103
|
+
x: 0,
|
|
104
|
+
y: 0,
|
|
105
|
+
...((_middlewareData$frame = middlewareData.frameOffset) === null || _middlewareData$frame === void 0 ? void 0 : _middlewareData$frame.amount)
|
|
106
|
+
};
|
|
107
|
+
|
|
108
|
+
if (checkMainAxis) {
|
|
109
|
+
const len = mainAxis === 'y' ? 'height' : 'width';
|
|
110
|
+
const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis + additionalFrameOffset[mainAxis];
|
|
111
|
+
const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis + additionalFrameOffset[mainAxis];
|
|
112
|
+
|
|
113
|
+
if (mainAxisCoord < limitMin) {
|
|
114
|
+
mainAxisCoord = limitMin;
|
|
115
|
+
} else if (mainAxisCoord > limitMax) {
|
|
116
|
+
mainAxisCoord = limitMax;
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
if (checkCrossAxis) {
|
|
121
|
+
var _middlewareData$offse, _middlewareData$offse2, _middlewareData$offse3, _middlewareData$offse4;
|
|
122
|
+
|
|
123
|
+
const len = mainAxis === 'y' ? 'width' : 'height';
|
|
124
|
+
const isOriginSide = ['top', 'left'].includes(getSide(placement));
|
|
125
|
+
const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? (_middlewareData$offse = (_middlewareData$offse2 = middlewareData.offset) === null || _middlewareData$offse2 === void 0 ? void 0 : _middlewareData$offse2[crossAxis]) !== null && _middlewareData$offse !== void 0 ? _middlewareData$offse : 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis) + additionalFrameOffset[crossAxis];
|
|
126
|
+
const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : (_middlewareData$offse3 = (_middlewareData$offse4 = middlewareData.offset) === null || _middlewareData$offse4 === void 0 ? void 0 : _middlewareData$offse4[crossAxis]) !== null && _middlewareData$offse3 !== void 0 ? _middlewareData$offse3 : 0) - (isOriginSide ? computedOffset.crossAxis : 0) + additionalFrameOffset[crossAxis];
|
|
127
|
+
|
|
128
|
+
if (crossAxisCoord < limitMin) {
|
|
129
|
+
crossAxisCoord = limitMin;
|
|
130
|
+
} else if (crossAxisCoord > limitMax) {
|
|
131
|
+
crossAxisCoord = limitMax;
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
return {
|
|
136
|
+
[mainAxis]: mainAxisCoord,
|
|
137
|
+
[crossAxis]: crossAxisCoord
|
|
138
|
+
};
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
};
|
|
142
|
+
};
|
|
143
|
+
|
|
144
|
+
exports.limitShift = limitShift;
|
|
145
|
+
//# sourceMappingURL=limit-shift.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/popover/limit-shift.ts"],"names":["getSide","placement","split","getMainAxisFromPlacement","includes","getCrossAxis","axis","limitShift","options","fn","middlewareArguments","x","y","rects","middlewareData","offset","mainAxis","checkMainAxis","crossAxis","checkCrossAxis","coords","mainAxisCoord","crossAxisCoord","rawOffset","computedOffset","additionalFrameOffset","frameOffset","amount","len","limitMin","reference","floating","limitMax","isOriginSide"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tAxis,\n\tCoords,\n\tPlacement,\n\tSide,\n\tMiddlewareArguments,\n} from '@floating-ui/react-dom';\n\n/**\n * Parts of this source were derived and modified from `floating-ui`,\n * released under the MIT license.\n *\n * https://github.com/floating-ui/floating-ui\n *\n * Copyright (c) 2021 Floating UI contributors\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\n/**\n * Custom limiter function for the `shift` middleware.\n * This function is mostly identical default `limitShift` from ``@floating-ui`;\n * the only difference is that, when computing the min/max shift limits, it\n * also takes into account the iframe offset that is added by the\n * custom \"frameOffset\" middleware.\n *\n * All unexported types and functions are also from the `@floating-ui` library,\n * and have been copied to this file for convenience.\n */\n\ntype LimitShiftOffset =\n\t| ( ( args: MiddlewareArguments ) =>\n\t\t\t| number\n\t\t\t| {\n\t\t\t\t\t/**\n\t\t\t\t\t * Offset the limiting of the axis that runs along the alignment of the\n\t\t\t\t\t * floating element.\n\t\t\t\t\t */\n\t\t\t\t\tmainAxis?: number;\n\t\t\t\t\t/**\n\t\t\t\t\t * Offset the limiting of the axis that runs along the side of the\n\t\t\t\t\t * floating element.\n\t\t\t\t\t */\n\t\t\t\t\tcrossAxis?: number;\n\t\t\t } )\n\t| number\n\t| {\n\t\t\t/**\n\t\t\t * Offset the limiting of the axis that runs along the alignment of the\n\t\t\t * floating element.\n\t\t\t */\n\t\t\tmainAxis?: number;\n\t\t\t/**\n\t\t\t * Offset the limiting of the axis that runs along the side of the\n\t\t\t * floating element.\n\t\t\t */\n\t\t\tcrossAxis?: number;\n\t };\n\ntype LimitShiftOptions = {\n\t/**\n\t * Offset when limiting starts. `0` will limit when the opposite edges of the\n\t * reference and floating elements are aligned.\n\t * - positive = start limiting earlier\n\t * - negative = start limiting later\n\t */\n\toffset: LimitShiftOffset;\n\t/**\n\t * Whether to limit the axis that runs along the alignment of the floating\n\t * element.\n\t */\n\tmainAxis: boolean;\n\t/**\n\t * Whether to limit the axis that runs along the side of the floating element.\n\t */\n\tcrossAxis: boolean;\n};\n\nfunction getSide( placement: Placement ): Side {\n\treturn placement.split( '-' )[ 0 ] as Side;\n}\n\nfunction getMainAxisFromPlacement( placement: Placement ): Axis {\n\treturn [ 'top', 'bottom' ].includes( getSide( placement ) ) ? 'x' : 'y';\n}\n\nfunction getCrossAxis( axis: Axis ): Axis {\n\treturn axis === 'x' ? 'y' : 'x';\n}\n\nexport const limitShift = (\n\toptions: Partial< LimitShiftOptions > = {}\n): {\n\toptions: Partial< LimitShiftOffset >;\n\tfn: ( middlewareArguments: MiddlewareArguments ) => Coords;\n} => ( {\n\toptions,\n\tfn( middlewareArguments ) {\n\t\tconst { x, y, placement, rects, middlewareData } = middlewareArguments;\n\t\tconst {\n\t\t\toffset = 0,\n\t\t\tmainAxis: checkMainAxis = true,\n\t\t\tcrossAxis: checkCrossAxis = true,\n\t\t} = options;\n\n\t\tconst coords = { x, y };\n\t\tconst mainAxis = getMainAxisFromPlacement( placement );\n\t\tconst crossAxis = getCrossAxis( mainAxis );\n\n\t\tlet mainAxisCoord = coords[ mainAxis ];\n\t\tlet crossAxisCoord = coords[ crossAxis ];\n\n\t\tconst rawOffset =\n\t\t\ttypeof offset === 'function'\n\t\t\t\t? offset( middlewareArguments )\n\t\t\t\t: offset;\n\t\tconst computedOffset =\n\t\t\ttypeof rawOffset === 'number'\n\t\t\t\t? { mainAxis: rawOffset, crossAxis: 0 }\n\t\t\t\t: { mainAxis: 0, crossAxis: 0, ...rawOffset };\n\n\t\t// At the moment of writing, this is the only difference\n\t\t// with the `limitShift` function from `@floating-ui`.\n\t\t// This offset needs to be added to all min/max limits\n\t\t// in order to make the shift-limiting work as expected.\n\t\tconst additionalFrameOffset = {\n\t\t\tx: 0,\n\t\t\ty: 0,\n\t\t\t...middlewareData.frameOffset?.amount,\n\t\t};\n\n\t\tif ( checkMainAxis ) {\n\t\t\tconst len = mainAxis === 'y' ? 'height' : 'width';\n\t\t\tconst limitMin =\n\t\t\t\trects.reference[ mainAxis ] -\n\t\t\t\trects.floating[ len ] +\n\t\t\t\tcomputedOffset.mainAxis +\n\t\t\t\tadditionalFrameOffset[ mainAxis ];\n\t\t\tconst limitMax =\n\t\t\t\trects.reference[ mainAxis ] +\n\t\t\t\trects.reference[ len ] -\n\t\t\t\tcomputedOffset.mainAxis +\n\t\t\t\tadditionalFrameOffset[ mainAxis ];\n\n\t\t\tif ( mainAxisCoord < limitMin ) {\n\t\t\t\tmainAxisCoord = limitMin;\n\t\t\t} else if ( mainAxisCoord > limitMax ) {\n\t\t\t\tmainAxisCoord = limitMax;\n\t\t\t}\n\t\t}\n\n\t\tif ( checkCrossAxis ) {\n\t\t\tconst len = mainAxis === 'y' ? 'width' : 'height';\n\t\t\tconst isOriginSide = [ 'top', 'left' ].includes(\n\t\t\t\tgetSide( placement )\n\t\t\t);\n\t\t\tconst limitMin =\n\t\t\t\trects.reference[ crossAxis ] -\n\t\t\t\trects.floating[ len ] +\n\t\t\t\t( isOriginSide\n\t\t\t\t\t? middlewareData.offset?.[ crossAxis ] ?? 0\n\t\t\t\t\t: 0 ) +\n\t\t\t\t( isOriginSide ? 0 : computedOffset.crossAxis ) +\n\t\t\t\tadditionalFrameOffset[ crossAxis ];\n\t\t\tconst limitMax =\n\t\t\t\trects.reference[ crossAxis ] +\n\t\t\t\trects.reference[ len ] +\n\t\t\t\t( isOriginSide\n\t\t\t\t\t? 0\n\t\t\t\t\t: middlewareData.offset?.[ crossAxis ] ?? 0 ) -\n\t\t\t\t( isOriginSide ? computedOffset.crossAxis : 0 ) +\n\t\t\t\tadditionalFrameOffset[ crossAxis ];\n\n\t\t\tif ( crossAxisCoord < limitMin ) {\n\t\t\t\tcrossAxisCoord = limitMin;\n\t\t\t} else if ( crossAxisCoord > limitMax ) {\n\t\t\t\tcrossAxisCoord = limitMax;\n\t\t\t}\n\t\t}\n\n\t\treturn {\n\t\t\t[ mainAxis ]: mainAxisCoord,\n\t\t\t[ crossAxis ]: crossAxisCoord,\n\t\t} as Coords;\n\t},\n} );\n"]}
|
package/build/tree-grid/index.js
CHANGED
|
@@ -74,12 +74,13 @@ function getRowFocusables(rowElement) {
|
|
|
74
74
|
* Renders both a table and tbody element, used to create a tree hierarchy.
|
|
75
75
|
*
|
|
76
76
|
* @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md
|
|
77
|
-
* @param {Object} props
|
|
78
|
-
* @param {WPElement} props.children
|
|
79
|
-
* @param {Function} props.onExpandRow
|
|
80
|
-
* @param {Function} props.onCollapseRow
|
|
81
|
-
* @param {Function} props.onFocusRow
|
|
82
|
-
* @param {
|
|
77
|
+
* @param {Object} props Component props.
|
|
78
|
+
* @param {WPElement} props.children Children to be rendered.
|
|
79
|
+
* @param {Function} props.onExpandRow Callback to fire when row is expanded.
|
|
80
|
+
* @param {Function} props.onCollapseRow Callback to fire when row is collapsed.
|
|
81
|
+
* @param {Function} props.onFocusRow Callback to fire when moving focus to a different row.
|
|
82
|
+
* @param {string} props.applicationAriaLabel Label to use for the application role.
|
|
83
|
+
* @param {Object} ref A ref to the underlying DOM table element.
|
|
83
84
|
*/
|
|
84
85
|
|
|
85
86
|
|
|
@@ -89,6 +90,7 @@ function TreeGrid(_ref, ref) {
|
|
|
89
90
|
onExpandRow = () => {},
|
|
90
91
|
onCollapseRow = () => {},
|
|
91
92
|
onFocusRow = () => {},
|
|
93
|
+
applicationAriaLabel,
|
|
92
94
|
...props
|
|
93
95
|
} = _ref;
|
|
94
96
|
const onKeyDown = (0, _element.useCallback)(event => {
|
|
@@ -289,11 +291,14 @@ function TreeGrid(_ref, ref) {
|
|
|
289
291
|
|
|
290
292
|
/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */
|
|
291
293
|
|
|
292
|
-
return (0, _element.createElement)(_rovingTabIndex.default, null, (0, _element.createElement)("
|
|
294
|
+
return (0, _element.createElement)(_rovingTabIndex.default, null, (0, _element.createElement)("div", {
|
|
295
|
+
role: "application",
|
|
296
|
+
"aria-label": applicationAriaLabel
|
|
297
|
+
}, (0, _element.createElement)("table", (0, _extends2.default)({}, props, {
|
|
293
298
|
role: "treegrid",
|
|
294
299
|
onKeyDown: onKeyDown,
|
|
295
300
|
ref: ref
|
|
296
|
-
}), (0, _element.createElement)("tbody", null, children)));
|
|
301
|
+
}), (0, _element.createElement)("tbody", null, children))));
|
|
297
302
|
/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */
|
|
298
303
|
}
|
|
299
304
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["@wordpress/components/src/tree-grid/index.js"],"names":["getRowFocusables","rowElement","focusablesInRow","focus","focusable","find","sequential","length","filter","closest","TreeGrid","ref","children","onExpandRow","onCollapseRow","onFocusRow","props","onKeyDown","event","keyCode","metaKey","ctrlKey","altKey","hasModifierKeyPressed","UP","DOWN","LEFT","RIGHT","HOME","END","includes","stopPropagation","activeElement","document","currentTarget","treeGridElement","contains","activeRow","currentColumnIndex","indexOf","canExpandCollapse","cannotFocusNextColumn","getAttribute","nextIndex","Math","max","min","preventDefault","level","parseInt","rows","Array","from","querySelectorAll","parentRow","currentRowIndex","i","focusableItems","nextRowIndex","focusablesInNextRow"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\nimport { forwardRef, useCallback } from '@wordpress/element';\nimport { UP, DOWN, LEFT, RIGHT, HOME, END } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexContainer from './roving-tab-index';\n\n/**\n * Return focusables in a row element, excluding those from other branches\n * nested within the row.\n *\n * @param {Element} rowElement The DOM element representing the row.\n *\n * @return {?Array} The array of focusables in the row.\n */\nfunction getRowFocusables( rowElement ) {\n\tconst focusablesInRow = focus.focusable.find( rowElement, {\n\t\tsequential: true,\n\t} );\n\n\tif ( ! focusablesInRow || ! focusablesInRow.length ) {\n\t\treturn;\n\t}\n\n\treturn focusablesInRow.filter( ( focusable ) => {\n\t\treturn focusable.closest( '[role=\"row\"]' ) === rowElement;\n\t} );\n}\n\n/**\n * Renders both a table and tbody element, used to create a tree hierarchy.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n * @param {Object} props Component props.\n * @param {WPElement} props.children Children to be rendered.\n * @param {Function} props.onExpandRow Callback to fire when row is expanded.\n * @param {Function} props.onCollapseRow Callback to fire when row is collapsed.\n * @param {Function} props.onFocusRow Callback to fire when moving focus to a different row.\n * @param {Object} ref A ref to the underlying DOM table element.\n */\nfunction TreeGrid(\n\t{\n\t\tchildren,\n\t\tonExpandRow = () => {},\n\t\tonCollapseRow = () => {},\n\t\tonFocusRow = () => {},\n\t\t...props\n\t},\n\tref\n) {\n\tconst onKeyDown = useCallback(\n\t\t( event ) => {\n\t\t\tconst { keyCode, metaKey, ctrlKey, altKey } = event;\n\n\t\t\t// The shift key is intentionally absent from the following list,\n\t\t\t// to enable shift + up/down to select items from the list.\n\t\t\tconst hasModifierKeyPressed = metaKey || ctrlKey || altKey;\n\n\t\t\tif (\n\t\t\t\thasModifierKeyPressed ||\n\t\t\t\t! [ UP, DOWN, LEFT, RIGHT, HOME, END ].includes( keyCode )\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The event will be handled, stop propagation.\n\t\t\tevent.stopPropagation();\n\n\t\t\tconst { activeElement } = document;\n\t\t\tconst { currentTarget: treeGridElement } = event;\n\t\t\tif ( ! treeGridElement.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Calculate the columnIndex of the active element.\n\t\t\tconst activeRow = activeElement.closest( '[role=\"row\"]' );\n\t\t\tconst focusablesInRow = getRowFocusables( activeRow );\n\t\t\tconst currentColumnIndex = focusablesInRow.indexOf( activeElement );\n\t\t\tconst canExpandCollapse = 0 === currentColumnIndex;\n\t\t\tconst cannotFocusNextColumn =\n\t\t\t\tcanExpandCollapse &&\n\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'false' &&\n\t\t\t\tkeyCode === RIGHT;\n\n\t\t\tif ( [ LEFT, RIGHT ].includes( keyCode ) ) {\n\t\t\t\t// Calculate to the next element.\n\t\t\t\tlet nextIndex;\n\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\tnextIndex = Math.max( 0, currentColumnIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextIndex = Math.min(\n\t\t\t\t\t\tcurrentColumnIndex + 1,\n\t\t\t\t\t\tfocusablesInRow.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is at the left most column.\n\t\t\t\tif ( canExpandCollapse ) {\n\t\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\t\t// Left:\n\t\t\t\t\t\t// If a row is focused, and it is expanded, collapses the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'true'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonCollapseRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, moves to the parent row (if there is one).\n\t\t\t\t\t\tconst level = Math.max(\n\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\tactiveRow?.getAttribute( 'aria-level' ) ?? 1,\n\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t) - 1,\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst rows = Array.from(\n\t\t\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t\t\t);\n\t\t\t\t\t\tlet parentRow = activeRow;\n\t\t\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\t\t\tfor ( let i = currentRowIndex; i >= 0; i-- ) {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\t\trows[ i ].getAttribute( 'aria-level' ),\n\t\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t\t) === level\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tparentRow = rows[ i ];\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tgetRowFocusables( parentRow )?.[ 0 ]?.focus();\n\t\t\t\t\t}\n\t\t\t\t\tif ( keyCode === RIGHT ) {\n\t\t\t\t\t\t// Right:\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, expands the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) ===\n\t\t\t\t\t\t\t'false'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonExpandRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is expanded, focuses the rightmost cell in the row.\n\t\t\t\t\t\tconst focusableItems = getRowFocusables( activeRow );\n\t\t\t\t\t\tif ( focusableItems.length > 0 ) {\n\t\t\t\t\t\t\tfocusableItems[\n\t\t\t\t\t\t\t\tfocusableItems.length - 1\n\t\t\t\t\t\t\t]?.focus();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start reading text on continued use of left/right arrow\n\t\t\t\t\t// keys.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.\n\t\t\t\tif ( cannotFocusNextColumn ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tfocusablesInRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ UP, DOWN ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === UP ) {\n\t\t\t\t\tnextRowIndex = Math.max( 0, currentRowIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = Math.min(\n\t\t\t\t\t\tcurrentRowIndex + 1,\n\t\t\t\t\t\trows.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ HOME, END ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === HOME ) {\n\t\t\t\t\tnextRowIndex = 0;\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = rows.length - 1;\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ onExpandRow, onCollapseRow, onFocusRow ]\n\t);\n\n\t/* Disable reason: A treegrid is implemented using a table element. */\n\t/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n\treturn (\n\t\t<RovingTabIndexContainer>\n\t\t\t<table\n\t\t\t\t{ ...props }\n\t\t\t\trole=\"treegrid\"\n\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\tref={ ref }\n\t\t\t>\n\t\t\t\t<tbody>{ children }</tbody>\n\t\t\t</table>\n\t\t</RovingTabIndexContainer>\n\t);\n\t/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */\n}\n\nexport default forwardRef( TreeGrid );\nexport { default as TreeGridRow } from './row';\nexport { default as TreeGridCell } from './cell';\nexport { default as TreeGridItem } from './item';\n"]}
|
|
1
|
+
{"version":3,"sources":["@wordpress/components/src/tree-grid/index.js"],"names":["getRowFocusables","rowElement","focusablesInRow","focus","focusable","find","sequential","length","filter","closest","TreeGrid","ref","children","onExpandRow","onCollapseRow","onFocusRow","applicationAriaLabel","props","onKeyDown","event","keyCode","metaKey","ctrlKey","altKey","hasModifierKeyPressed","UP","DOWN","LEFT","RIGHT","HOME","END","includes","stopPropagation","activeElement","document","currentTarget","treeGridElement","contains","activeRow","currentColumnIndex","indexOf","canExpandCollapse","cannotFocusNextColumn","getAttribute","nextIndex","Math","max","min","preventDefault","level","parseInt","rows","Array","from","querySelectorAll","parentRow","currentRowIndex","i","focusableItems","nextRowIndex","focusablesInNextRow"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { focus } from '@wordpress/dom';\nimport { forwardRef, useCallback } from '@wordpress/element';\nimport { UP, DOWN, LEFT, RIGHT, HOME, END } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport RovingTabIndexContainer from './roving-tab-index';\n\n/**\n * Return focusables in a row element, excluding those from other branches\n * nested within the row.\n *\n * @param {Element} rowElement The DOM element representing the row.\n *\n * @return {?Array} The array of focusables in the row.\n */\nfunction getRowFocusables( rowElement ) {\n\tconst focusablesInRow = focus.focusable.find( rowElement, {\n\t\tsequential: true,\n\t} );\n\n\tif ( ! focusablesInRow || ! focusablesInRow.length ) {\n\t\treturn;\n\t}\n\n\treturn focusablesInRow.filter( ( focusable ) => {\n\t\treturn focusable.closest( '[role=\"row\"]' ) === rowElement;\n\t} );\n}\n\n/**\n * Renders both a table and tbody element, used to create a tree hierarchy.\n *\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/components/src/tree-grid/README.md\n * @param {Object} props Component props.\n * @param {WPElement} props.children Children to be rendered.\n * @param {Function} props.onExpandRow Callback to fire when row is expanded.\n * @param {Function} props.onCollapseRow Callback to fire when row is collapsed.\n * @param {Function} props.onFocusRow Callback to fire when moving focus to a different row.\n * @param {string} props.applicationAriaLabel Label to use for the application role.\n * @param {Object} ref A ref to the underlying DOM table element.\n */\nfunction TreeGrid(\n\t{\n\t\tchildren,\n\t\tonExpandRow = () => {},\n\t\tonCollapseRow = () => {},\n\t\tonFocusRow = () => {},\n\t\tapplicationAriaLabel,\n\t\t...props\n\t},\n\tref\n) {\n\tconst onKeyDown = useCallback(\n\t\t( event ) => {\n\t\t\tconst { keyCode, metaKey, ctrlKey, altKey } = event;\n\n\t\t\t// The shift key is intentionally absent from the following list,\n\t\t\t// to enable shift + up/down to select items from the list.\n\t\t\tconst hasModifierKeyPressed = metaKey || ctrlKey || altKey;\n\n\t\t\tif (\n\t\t\t\thasModifierKeyPressed ||\n\t\t\t\t! [ UP, DOWN, LEFT, RIGHT, HOME, END ].includes( keyCode )\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// The event will be handled, stop propagation.\n\t\t\tevent.stopPropagation();\n\n\t\t\tconst { activeElement } = document;\n\t\t\tconst { currentTarget: treeGridElement } = event;\n\t\t\tif ( ! treeGridElement.contains( activeElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Calculate the columnIndex of the active element.\n\t\t\tconst activeRow = activeElement.closest( '[role=\"row\"]' );\n\t\t\tconst focusablesInRow = getRowFocusables( activeRow );\n\t\t\tconst currentColumnIndex = focusablesInRow.indexOf( activeElement );\n\t\t\tconst canExpandCollapse = 0 === currentColumnIndex;\n\t\t\tconst cannotFocusNextColumn =\n\t\t\t\tcanExpandCollapse &&\n\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'false' &&\n\t\t\t\tkeyCode === RIGHT;\n\n\t\t\tif ( [ LEFT, RIGHT ].includes( keyCode ) ) {\n\t\t\t\t// Calculate to the next element.\n\t\t\t\tlet nextIndex;\n\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\tnextIndex = Math.max( 0, currentColumnIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextIndex = Math.min(\n\t\t\t\t\t\tcurrentColumnIndex + 1,\n\t\t\t\t\t\tfocusablesInRow.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is at the left most column.\n\t\t\t\tif ( canExpandCollapse ) {\n\t\t\t\t\tif ( keyCode === LEFT ) {\n\t\t\t\t\t\t// Left:\n\t\t\t\t\t\t// If a row is focused, and it is expanded, collapses the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) === 'true'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonCollapseRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, moves to the parent row (if there is one).\n\t\t\t\t\t\tconst level = Math.max(\n\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\tactiveRow?.getAttribute( 'aria-level' ) ?? 1,\n\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t) - 1,\n\t\t\t\t\t\t\t1\n\t\t\t\t\t\t);\n\t\t\t\t\t\tconst rows = Array.from(\n\t\t\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t\t\t);\n\t\t\t\t\t\tlet parentRow = activeRow;\n\t\t\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\t\t\tfor ( let i = currentRowIndex; i >= 0; i-- ) {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tparseInt(\n\t\t\t\t\t\t\t\t\trows[ i ].getAttribute( 'aria-level' ),\n\t\t\t\t\t\t\t\t\t10\n\t\t\t\t\t\t\t\t) === level\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tparentRow = rows[ i ];\n\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tgetRowFocusables( parentRow )?.[ 0 ]?.focus();\n\t\t\t\t\t}\n\t\t\t\t\tif ( keyCode === RIGHT ) {\n\t\t\t\t\t\t// Right:\n\t\t\t\t\t\t// If a row is focused, and it is collapsed, expands the current row.\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tactiveRow.getAttribute( 'aria-expanded' ) ===\n\t\t\t\t\t\t\t'false'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonExpandRow( activeRow );\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If a row is focused, and it is expanded, focuses the rightmost cell in the row.\n\t\t\t\t\t\tconst focusableItems = getRowFocusables( activeRow );\n\t\t\t\t\t\tif ( focusableItems.length > 0 ) {\n\t\t\t\t\t\t\tfocusableItems[\n\t\t\t\t\t\t\t\tfocusableItems.length - 1\n\t\t\t\t\t\t\t]?.focus();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start reading text on continued use of left/right arrow\n\t\t\t\t\t// keys.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Focus the next element. If at most left column and row is collapsed, moving right is not allowed as this will expand. However, if row is collapsed, moving left is allowed.\n\t\t\t\tif ( cannotFocusNextColumn ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tfocusablesInRow[ nextIndex ].focus();\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ UP, DOWN ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === UP ) {\n\t\t\t\t\tnextRowIndex = Math.max( 0, currentRowIndex - 1 );\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = Math.min(\n\t\t\t\t\t\tcurrentRowIndex + 1,\n\t\t\t\t\t\trows.length - 1\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t} else if ( [ HOME, END ].includes( keyCode ) ) {\n\t\t\t\t// Calculate the rowIndex of the next row.\n\t\t\t\tconst rows = Array.from(\n\t\t\t\t\ttreeGridElement.querySelectorAll( '[role=\"row\"]' )\n\t\t\t\t);\n\t\t\t\tconst currentRowIndex = rows.indexOf( activeRow );\n\t\t\t\tlet nextRowIndex;\n\n\t\t\t\tif ( keyCode === HOME ) {\n\t\t\t\t\tnextRowIndex = 0;\n\t\t\t\t} else {\n\t\t\t\t\tnextRowIndex = rows.length - 1;\n\t\t\t\t}\n\n\t\t\t\t// Focus is either at the top or bottom edge of the grid. Do nothing.\n\t\t\t\tif ( nextRowIndex === currentRowIndex ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will start navigating horizontally when reaching the vertical\n\t\t\t\t\t// bounds of a table.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Get the focusables in the next row.\n\t\t\t\tconst focusablesInNextRow = getRowFocusables(\n\t\t\t\t\trows[ nextRowIndex ]\n\t\t\t\t);\n\n\t\t\t\t// If for some reason there are no focusables in the next row, do nothing.\n\t\t\t\tif ( ! focusablesInNextRow || ! focusablesInNextRow.length ) {\n\t\t\t\t\t// Prevent key use for anything else. For example, Voiceover\n\t\t\t\t\t// will still focus text when using arrow keys, while this\n\t\t\t\t\t// component should limit navigation to focusables.\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Try to focus the element in the next row that's at a similar column to the activeElement.\n\t\t\t\tconst nextIndex = Math.min(\n\t\t\t\t\tcurrentColumnIndex,\n\t\t\t\t\tfocusablesInNextRow.length - 1\n\t\t\t\t);\n\t\t\t\tfocusablesInNextRow[ nextIndex ].focus();\n\n\t\t\t\t// Let consumers know the row that was originally focused,\n\t\t\t\t// and the row that is now in focus.\n\t\t\t\tonFocusRow( event, activeRow, rows[ nextRowIndex ] );\n\n\t\t\t\t// Prevent key use for anything else. This ensures Voiceover\n\t\t\t\t// doesn't try to handle key navigation.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t[ onExpandRow, onCollapseRow, onFocusRow ]\n\t);\n\n\t/* Disable reason: A treegrid is implemented using a table element. */\n\t/* eslint-disable jsx-a11y/no-noninteractive-element-to-interactive-role */\n\treturn (\n\t\t<RovingTabIndexContainer>\n\t\t\t{\n\t\t\t\t// Prevent browser mode from triggering in NVDA by wrapping List View\n\t\t\t\t// in a role=application wrapper.\n\t\t\t\t// see: https://github.com/WordPress/gutenberg/issues/43729\n\t\t\t }\n\t\t\t<div role=\"application\" aria-label={ applicationAriaLabel }>\n\t\t\t\t<table\n\t\t\t\t\t{ ...props }\n\t\t\t\t\trole=\"treegrid\"\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t\tref={ ref }\n\t\t\t\t>\n\t\t\t\t\t<tbody>{ children }</tbody>\n\t\t\t\t</table>\n\t\t\t</div>\n\t\t</RovingTabIndexContainer>\n\t);\n\t/* eslint-enable jsx-a11y/no-noninteractive-element-to-interactive-role */\n}\n\nexport default forwardRef( TreeGrid );\nexport { default as TreeGridRow } from './row';\nexport { default as TreeGridCell } from './cell';\nexport { default as TreeGridItem } from './item';\n"]}
|