PHPXRef 0.7.1 : WordPress Trunk (Updated Daily) : Detail view of components.js

Create a `motion` component.

This function accepts a Component argument, which can be either a string (ie "div"
for `motion.div`), or an actual React component.

Alongside this is a config option which provides a way of rendering the provided
component "offline", or outside the React render cycle.

MotionComponent(props, externalRef) X-Ref

No description

useLayoutId({ layoutId }) X-Ref

No description

createMotionProxy(createConfig) X-Ref

Convert any React component into a `motion` component. The provided component
**must** use `React.forwardRef` to the underlying DOM component you want to animate.

```jsx
const Component = React.forwardRef((props, ref) => {
return <div ref={ref} />
})

const MotionComponent = motion(Component)
```

custom(Component, customMotionComponentConfig = {}) X-Ref

No description

isSVGComponent(Component) X-Ref

No description

addScaleCorrector(correctors) X-Ref

No description

isForcedMotionValue(key, { layout, layoutId }) X-Ref

No description

buildTransform(transform, { enableHardwareAcceleration = true, allowTransformNone = true, }, transformIsDefault, transformTemplate) X-Ref

Build a CSS transform style from individual x/y/scale etc properties.

This outputs with a default order of transforms/scales/rotations, this can be customised by
providing a transformTemplate function.

isString(v) X-Ref

No description

buildHTMLStyles(state, latestValues, options, transformTemplate) X-Ref

No description

copyRawValuesOnly(target, source, props) X-Ref

No description

useInitialMotionValues({ transformTemplate }, visualState, isStatic) X-Ref

No description

useStyle(props, visualState, isStatic) X-Ref

No description

useHTMLProps(props, visualState, isStatic) X-Ref

No description

isValidMotionProp(key) X-Ref

Check whether a prop name is a valid `MotionProp` key.

param: key - Name of the property to check
returns: `true` is key is a valid `MotionProp`.

loadExternalIsValidProp(isValidProp) X-Ref

No description

filterProps(props, isDom, forwardMotionProps) X-Ref

No description

calcOrigin(origin, offset, size) X-Ref

No description

calcSVGTransformOrigin(dimensions, originX, originY) X-Ref

The SVG transform origin defaults are different to CSS and is less intuitive,
so we use the measured dimensions of the SVG to reconcile these.

buildSVGPath(attrs, length, spacing = 1, offset = 0, useDashCase = true) X-Ref

Build SVG path properties. Uses the path's measured length to convert
our custom pathLength, pathSpacing and pathOffset into stroke-dashoffset
and stroke-dasharray attributes.

This function is mutative to reduce per-frame GC.

buildSVGAttrs(state, { attrX, attrY, attrScale, originX, originY, pathLength, pathSpacing = 1, pathOffset = 0, ...latest }, options, isSVGTag, transformTemplate) X-Ref

Build SVG visual attrbutes, like cx and style.transform

useSVGProps(props, visualState, _isStatic, Component) X-Ref

No description

createUseRender(forwardMotionProps = false) X-Ref

No description

renderHTML(element, { style, vars }, styleProp, projection) X-Ref

No description

renderSVG(element, renderState, _styleProp, projection) X-Ref

No description

scrapeMotionValuesFromProps(props, prevProps, visualElement) X-Ref

No description

scrape_motion_values_scrapeMotionValuesFromProps(props, prevProps, visualElement) X-Ref

No description

getValueState(visualElement) X-Ref

No description

resolveVariantFromProps(props, definition, custom, visualElement) X-Ref

No description

useConstant(init) X-Ref

Creates a constant value over the lifecycle of a component.

Even if `useMemo` is provided an empty array as its final argument, it doesn't offer
a guarantee that it won't re-run for performance reasons later on. By using `useConstant`
you can ensure that initialisers don't execute twice or more.

resolveMotionValue(value) X-Ref

If the provided value is a MotionValue, this returns the actual value, otherwise just the value itself

TODO: Remove and move to library

makeState({ scrapeMotionValuesFromProps, createRenderState, onMount, }, props, context, presenceContext) X-Ref

No description

makeLatestValues(props, context, presenceContext, scrapeMotionValues) X-Ref

No description

create_config_createDomMotionConfig(Component, { forwardMotionProps = false }, preloadedFeatures, createVisualElement) X-Ref

No description

addDomEvent(target, eventName, handler, options = { passive: true }) X-Ref

No description

extractEventInfo(event, pointType = "page") X-Ref

No description

addPointerEvent(target, eventName, handler, options) X-Ref

No description

createLock(name) X-Ref

No description

getGlobalLock(drag) X-Ref

No description

isDragActive() X-Ref

No description

Class: Feature - X-Ref

addHoverEvent(node, isActive) X-Ref

No description

Class: HoverGesture - X-Ref

Class: FocusGesture - X-Ref

fireSyntheticPointerEvent(name, handler) X-Ref

No description

Class: PressGesture - X-Ref

initIntersectionObserver({ root, ...options }) X-Ref

No description

observeIntersection(element, options, callback) X-Ref

No description

Class: InViewFeature - X-Ref

hasViewportOptionChanged({ viewport = {} }, { viewport: prevViewport = {} } = {}) X-Ref

No description

shallowCompare(next, prev) X-Ref

No description

resolveVariant(visualElement, definition, custom) X-Ref

No description

isTransitionDefined({ when, delay: _delay, delayChildren, staggerChildren, staggerDirection, repeat, repeatType, repeatDelay, from, elapsed, ...transition }) X-Ref

Decide whether a transition is defined on a given Transition.
This filters out orchestration options and returns true
if any options are left.

getValueTransition(transition, key) X-Ref

No description

getFinalKeyframe(keyframes, { repeat, repeatType = "loop" }, finalKeyframe) X-Ref

No description

clearTime() X-Ref

No description

isNone(value) X-Ref

No description

parseCSSVariable(current) X-Ref

No description

getVariableValue(current, element, depth = 1) X-Ref

No description

removeNonTranslationalTransform(visualElement) X-Ref

No description

measureAllKeyframes() X-Ref

No description

readAllKeyframes() X-Ref

No description

flushKeyframeResolvers() X-Ref

No description

Class: KeyframeResolver - X-Ref

parseHex(v) X-Ref

No description

test(v) X-Ref

No description

analyseComplexValue(value) X-Ref

No description

parseComplexValue(v) X-Ref

No description

createTransformer(source) X-Ref

No description

getAnimatableNone(v) X-Ref

No description

applyDefaultFilter(v) X-Ref

Properties that should default to 1 or 100%

animatable_none_getAnimatableNone(key, value) X-Ref

No description

makeNoneKeyframesAnimatable(unresolvedKeyframes, noneKeyframeIndexes, name) X-Ref

If we encounter keyframes like "none" or "0" and we also have keyframes like
"#fff" or "200px 200px" we want to find a keyframe to serve as a template for
the "none" keyframes. In this case "#fff" or "200px 200px" - then these get turned into
zero equivalents, i.e. "#fff0" or "0px 0px".

Class: DOMKeyframesResolver - X-Ref

memo(callback) X-Ref

No description

hasKeyframesChanged(keyframes) X-Ref

No description

canAnimate(keyframes, name, type, velocity) X-Ref

No description

Class: BaseAnimation - X-Ref

velocityPerSecond(velocity, frameDuration) X-Ref

No description

calcGeneratorVelocity(resolveValue, t, current) X-Ref

No description

findSpring({ duration = 800, bounce = 0.25, velocity = 0, mass = 1, }) X-Ref

No description

approximateRoot(envelope, derivative, initialGuess) X-Ref

No description

calcAngularFreq(undampedFreq, dampingRatio) X-Ref

No description

isSpringType(options, keys) X-Ref

No description

getSpringOptions(options) X-Ref

No description

spring({ keyframes, restDelta, restSpeed, ...options }) X-Ref

No description

inertia({ keyframes, velocity = 0.0, power = 0.8, timeConstant = 325, bounceDamping = 10, bounceStiffness = 500, modifyTarget, min, max, restDelta = 0.5, restSpeed, }) X-Ref

No description

binarySubdivide(x, lowerBound, upperBound, mX1, mX2) X-Ref

No description

cubicBezier(mX1, mY1, mX2, mY2) X-Ref

No description

hueToRgb(p, q, t) X-Ref

No description

hslaToRgba({ hue, saturation, lightness, alpha }) X-Ref

No description

asRGBA(color) X-Ref

No description

mixVisibility(origin, target) X-Ref

Returns a function that, when provided a progress value between 0 and 1,
will return the "none" or "hidden" string only when the progress is that of
the origin or target.

mixImmediate(a, b) X-Ref

No description

complex_mixNumber(a, b) X-Ref

No description

getMixer(a) X-Ref

No description

mixArray(a, b) X-Ref

No description

mixObject(a, b) X-Ref

No description

matchOrder(origin, target) X-Ref

No description

mix(from, to, p) X-Ref

No description

createMixers(output, ease, customMixer) X-Ref

No description

interpolate(input, output, { clamp: isClamp = true, ease, mixer } = {}) X-Ref

Create a function that maps from a numerical input array to a generic output array.

Accepts:
- Numbers
- Colors (hex, hsl, hsla, rgb, rgba)
- Complex (combinations of one or more numbers or strings)

```jsx
const mixColor = interpolate([0, 1], ['#fff', '#000'])

mixColor(0.5) // 'rgba(128, 128, 128, 1)'
```

TODO Revist this approach once we've moved to data models for values,
probably not needed to pregenerate mixer functions.

fillOffset(offset, remaining) X-Ref

No description

defaultOffset(arr) X-Ref

No description

convertOffsetToTimes(offset, duration) X-Ref

No description

defaultEasing(values, easing) X-Ref

No description

keyframes_keyframes({ duration = 300, keyframes: keyframeValues, times, ease = "easeInOut", }) X-Ref

No description

calcGeneratorDuration(generator) X-Ref

Implement a practical max duration for keyframe generation
to prevent infinite loops

Class: MainThreadAnimation - X-Ref

Animation that runs on the main thread. Designed to be WAAPI-spec in the subset of
features we expose publically. Mostly the compatibility is to ensure visual identity
between both WAAPI and main thread animations.

animateValue(options) X-Ref

No description

isWaapiSupportedEasing(easing) X-Ref

No description

mapEasingToNativeEasingWithDefault(easing) X-Ref

No description

mapEasingToNativeEasing(easing) X-Ref

No description

animateStyle(element, valueName, keyframes, { delay = 0, duration = 300, repeat = 0, repeatType = "loop", ease, times, } = {}) X-Ref

No description

requiresPregeneratedKeyframes(options) X-Ref

Check if an animation can run natively via WAAPI or requires pregenerated keyframes.
WAAPI doesn't support spring or function easings so we run these as JS animation before
handing off.

pregenerateKeyframes(keyframes, options) X-Ref

No description

Class: AcceleratedAnimation - X-Ref

isWillChangeMotionValue(value) X-Ref

No description

addUniqueItem(arr, item) X-Ref

No description

removeItem(arr, item) X-Ref

No description

moveItem([...arr], fromIndex, toIndex) X-Ref

No description

Class: SubscriptionManager - X-Ref

Class: MotionValue - X-Ref

`MotionValue` is used to track the state and velocity of motion values.

motionValue(init, options) X-Ref

No description

setMotionValue(visualElement, key, value) X-Ref

Set VisualElement's MotionValue, creating a new MotionValue for it if
it doesn't exist.

setTarget(visualElement, definition) X-Ref

No description

shouldBlockAnimation({ protectedKeys, needsAnimating }, key) X-Ref

Decide whether we should block this animation. Previously, we achieved this
just by checking whether the key was listed in protectedKeys, but this
posed problems if an animation was triggered by afterChildren and protectedKeys
had been set to true in the meantime.

animateTarget(visualElement, targetAndTransition, { delay = 0, transitionOverride, type } = {}) X-Ref

No description

animateVariant(visualElement, variant, options = {}) X-Ref

No description

animateChildren(visualElement, variant, delayChildren = 0, staggerChildren = 0, staggerDirection = 1, options) X-Ref

No description

sortByTreeOrder(a, b) X-Ref

No description

animateVisualElement(visualElement, definition, options = {}) X-Ref

No description

animateList(visualElement) X-Ref

No description

createAnimationState(visualElement) X-Ref

No description

setAnimateFunction(makeAnimator) X-Ref

This just allows us to inject mocked animation functions

animateChanges(changedActiveType) X-Ref

When we receive new props, we need to:
1. Create a list of protected keys for each type. This is a directory of
value keys that are currently being "handled" by types of a higher priority
so that whenever an animation is played of a given type, these values are
protected from being animated.
2. Determine if an animation type needs animating.
3. Determine if any values have been removed from a type and figure out
what to animate those to.

setActive(type, isActive) X-Ref

Change whether a certain animation type is active.

checkVariantsDidChange(prev, next) X-Ref

No description

createTypeState(isActive = false) X-Ref

No description

createState() X-Ref

No description

Class: AnimationFeature - X-Ref

Class: ExitAnimationFeature - X-Ref

distance2D(a, b) X-Ref

No description

Class: PanSession - X-Ref

transformPoint(info, transformPagePoint) X-Ref

subtractPoint(a, b) X-Ref

No description

getPanInfo({ point }, history) X-Ref

No description

startDevicePoint(history) X-Ref

No description

lastDevicePoint(history) X-Ref

No description

getVelocity(history, timeDelta) X-Ref

No description

calcLength(axis) X-Ref

No description

isNear(value, target = 0, maxDistance = 0.01) X-Ref

No description

calcAxisDelta(delta, source, target, origin = 0.5) X-Ref

No description

calcBoxDelta(delta, source, target, origin) X-Ref

No description

calcRelativeAxis(target, relative, parent) X-Ref

No description

calcRelativeBox(target, relative, parent) X-Ref

No description

calcRelativeAxisPosition(target, layout, parent) X-Ref

No description

calcRelativePosition(target, layout, parent) X-Ref

No description

applyConstraints(point, { min, max }, elastic) X-Ref

Apply constraints to a point. These constraints are both physical along an
axis, and an elastic factor that determines how much to constrain the point
by if it does lie outside the defined parameters.

calcRelativeAxisConstraints(axis, min, max) X-Ref

Calculate constraints in terms of the viewport when defined relatively to the
measured axis. This is measured from the nearest edge, so a max constraint of 200
on an axis with a max value of 300 would return a constraint of 500 - axis length

calcRelativeConstraints(layoutBox, { top, left, bottom, right }) X-Ref

Calculate constraints in terms of the viewport when
defined relatively to the measured bounding box.

calcViewportAxisConstraints(layoutAxis, constraintsAxis) X-Ref

Calculate viewport constraints when defined as another viewport-relative axis

calcViewportConstraints(layoutBox, constraintsBox) X-Ref

Calculate viewport constraints when defined as another viewport-relative box

constraints_calcOrigin(source, target) X-Ref

Calculate a transform origin relative to the source axis, between 0-1, that results
in an asthetically pleasing scale/transform needed to project from source to target.

rebaseAxisConstraints(layout, constraints) X-Ref

Rebase the calculated viewport constraints relative to the layout.min point.

resolveDragElastic(dragElastic = defaultElastic) X-Ref

Accepts a dragElastic prop and returns resolved elastic values for each axis.

resolveAxisElastic(dragElastic, minLabel, maxLabel) X-Ref

No description

resolvePointElastic(dragElastic, label) X-Ref

No description

eachAxis(callback) X-Ref

No description

convertBoundingBoxToBox({ top, left, right, bottom, }) X-Ref

Bounding boxes tend to be defined as top, left, right, bottom. For various operations
it's easier to consider each axis individually. This function returns a bounding box
as a map of single-axis min/max values.

convertBoxToBoundingBox({ x, y }) X-Ref

No description

transformBoxPoints(point, transformPoint) X-Ref

Applies a TransformPoint function to a bounding box. TransformPoint is usually a function
provided by Framer to allow measured points to be corrected for device scaling. This is used
when measuring DOM elements and DOM event points.

isIdentityScale(scale) X-Ref

No description

hasScale({ scale, scaleX, scaleY }) X-Ref

No description

hasTransform(values) X-Ref

No description

has2DTranslate(values) X-Ref

No description

is2DTranslate(value) X-Ref

No description

scalePoint(point, scale, originPoint) X-Ref

Scales a point based on a factor and an originPoint

applyPointDelta(point, translate, scale, originPoint, boxScale) X-Ref

Applies a translate/scale delta to a point

applyAxisDelta(axis, translate = 0, scale = 1, originPoint, boxScale) X-Ref

Applies a translate/scale delta to an axis

applyBoxDelta(box, { x, y }) X-Ref

Applies a translate/scale delta to a box

applyTreeDeltas(box, treeScale, treePath, isSharedTransition = false) X-Ref

Apply a tree of deltas to a box. We do this to calculate the effect of all the transforms
in a tree upon our box before then calculating how to project it into our desired viewport-relative box

This is the final nested loop within updateLayoutDelta for future refactoring

snapToDefault(scale) X-Ref

No description

translateAxis(axis, distance) X-Ref

No description

transformAxis(axis, transforms, [key, scaleKey, originKey]) X-Ref

Apply a transform to an axis from the latest resolved motion values.
This function basically acts as a bridge between a flat motion value map
and applyAxisDelta

transformBox(box, transform) X-Ref

Apply a transform to a box from the latest resolved motion values.

measureViewportBox(instance, transformPoint) X-Ref

No description

measurePageBox(element, rootProjectionNode, transformPagePoint) X-Ref

No description

Class: VisualElementDragControls - X-Ref

shouldDrag(direction, drag, currentDirection) X-Ref

No description

getCurrentDirection(offset, lockThreshold = 10) X-Ref

Based on an x/y offset determine the current drag direction. If both axis' offsets are lower
than the provided threshold, return `null`.

param: offset - The x/y offset from origin.
param: lockThreshold - (Optional) - the minimum absolute offset before we can determine a drag direction.

Class: DragGesture - X-Ref

Class: PanGesture - X-Ref

usePresence() X-Ref

When a component is the child of `AnimatePresence`, it can use `usePresence`
to access information about whether it's still present in the React tree.

```jsx
import { usePresence } from "framer-motion"

export const Component = () => {
const [isPresent, safeToRemove] = usePresence()

useEffect(() => {
!isPresent && setTimeout(safeToRemove, 1000)
}, [isPresent])

return <div />
}
```

If `isPresent` is `false`, it means that a component has been removed the tree, but
`AnimatePresence` won't really remove it until `safeToRemove` has been called.

useIsPresent() X-Ref

Similar to `usePresence`, except `useIsPresent` simply returns whether or not the component is present.
There is no `safeToRemove` function.

```jsx
import { useIsPresent } from "framer-motion"

export const Component = () => {
const isPresent = useIsPresent()

useEffect(() => {
!isPresent && console.log("I've been removed!")
}, [isPresent])

return <div />
}
```

isPresent(context) X-Ref

No description

pixelsToPercent(pixels, axis) X-Ref

No description

Class: MeasureLayoutWithContext - X-Ref

MeasureLayout(props) X-Ref

No description

mixValues(target, follow, lead, progress, shouldCrossfadeOpacity, isOnlyMember) X-Ref

No description

getRadius(values, radiusName) X-Ref

No description

compress(min, max, easing) X-Ref

No description

copyAxisInto(axis, originAxis) X-Ref

Reset an axis to the provided origin box.

This is a mutative operation.

copyBoxInto(box, originBox) X-Ref

Reset a box to the provided origin box.

This is a mutative operation.

removePointDelta(point, translate, scale, originPoint, boxScale) X-Ref

Remove a delta from a point. This is essentially the steps of applyPointDelta in reverse

removeAxisDelta(axis, translate = 0, scale = 1, origin = 0.5, boxScale, originAxis = axis, sourceAxis = axis) X-Ref

Remove a delta from an axis. This is essentially the steps of applyAxisDelta in reverse

removeAxisTransforms(axis, transforms, [key, scaleKey, originKey], origin, sourceAxis) X-Ref

Remove a transforms from an axis. This is essentially the steps of applyAxisTransforms in reverse
and acts as a bridge between motion values and removeAxisDelta

removeBoxTransforms(box, transforms, originBox, sourceBox) X-Ref

Remove a transforms from an box. This is essentially the steps of applyAxisBox in reverse
and acts as a bridge between motion values and removeAxisDelta

isAxisDeltaZero(delta) X-Ref

No description

isDeltaZero(delta) X-Ref

No description

boxEquals(a, b) X-Ref

No description

boxEqualsRounded(a, b) X-Ref

No description

aspectRatio(box) X-Ref

No description

Class: NodeStack - X-Ref

buildProjectionTransform(delta, treeScale, latestTransform) X-Ref

No description

Class: FlatTree - X-Ref

delay(callback, timeout) X-Ref

Timeout defined in ms

record(data) X-Ref

No description

isSVGElement(element) X-Ref

No description

animateSingleValue(value, keyframes, options) X-Ref

No description

resetDistortingTransform(key, visualElement, values, sharedAnimationValues) X-Ref

No description

createProjectionNode({ attachResizeListener, defaultParent, measureScroll, checkIsScrollRoot, resetTransform, }) X-Ref

No description

updateLayout(node) X-Ref

No description

notifyLayoutUpdate(node) X-Ref

No description

propagateDirtyNodes(node) X-Ref

Clearing transition
TODO: Investigate why this transition is being passed in as {type: false } from Framer
and why we need it at all

cleanDirtyNodes(node) X-Ref

No description

clearSnapshot(node) X-Ref

No description

clearMeasurements(node) X-Ref

No description

clearIsLayoutDirty(node) X-Ref

No description

resetTransformStyle(node) X-Ref

No description

finishAnimation(node) X-Ref

No description

resolveTargetDelta(node) X-Ref

No description

calcProjection(node) X-Ref

No description

resetSkewAndRotation(node) X-Ref

No description

removeLeadSnapshots(stack) X-Ref

No description

mixAxisDelta(output, delta, p) X-Ref

No description

mixAxis(output, from, to, p) X-Ref

No description

mixBox(output, from, to, p) X-Ref

No description

hasOpacityCrossfade(node) X-Ref

No description

roundAxis(axis) X-Ref

No description

roundBox(box) X-Ref

No description

shouldAnimatePositionOnly(animationType, snapshot, layout) X-Ref

No description

initPrefersReducedMotion() X-Ref

No description

updateMotionValuesFromProps(element, next, prev) X-Ref

No description

getClosestProjectingNode(visualElement) X-Ref

No description

Class: VisualElement - X-Ref

A VisualElement is an imperative abstraction around UI elements such as
HTMLElement, SVGElement, Three.Object3D etc.

Class: DOMVisualElement - X-Ref

HTMLVisualElement_getComputedStyle(element) X-Ref

No description

Class: HTMLVisualElement - X-Ref

Class: SVGVisualElement - X-Ref

createDomMotionComponent(key) X-Ref

Create a DOM `motion` component with the provided string. This is primarily intended
as a full alternative to `motion` for consumers who have to support environments that don't
support `Proxy`.

```javascript
import { createDomMotionComponent } from "framer-motion"

const motion = {
div: createDomMotionComponent('div')
}
```

useIsMounted() X-Ref

No description

use_force_update_useForceUpdate() X-Ref

No description

Class: PopChildMeasure - X-Ref

Measurement functionality has to be within a separate component
to leverage snapshot lifecycle.

PopChild({ children, isPresent }) X-Ref

No description

newChildrenMap() X-Ref

No description

useUnmountEffect(callback) X-Ref

No description

updateChildLookup(children, allChildren) X-Ref

No description

onlyElements(children) X-Ref

No description

useResponsiveValue(values, options = {}) X-Ref

No description

styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

useDeprecatedProps(props) X-Ref

No description

useFlex(props) X-Ref

No description

UnconnectedFlex(props, forwardedRef) X-Ref

No description

useFlexItem(props) X-Ref

No description

useFlexBlock(props) X-Ref

No description

UnconnectedFlexBlock(props, forwardedRef) X-Ref

No description

getConvertedKey(key) X-Ref

Flips a CSS property from left <-> right.

param: {string} key The CSS property name.
return: {string} The flipped CSS property name, if applicable.

rtl(ltrStyles = {}, rtlStyles) X-Ref

A higher-order function that create an incredibly basic ltr -> rtl style converter for CSS objects.

param: {import('react').CSSProperties} ltrStyles Ltr styles. Converts and renders from ltr -> rtl styles, if applicable.
param: {import('react').CSSProperties} [rtlStyles] Rtl styles. Renders if provided.
return: {() => import('@emotion/react').SerializedStyles} A function to output CSS styles for Emotion's renderer

useSpacer(props) X-Ref

No description

UnconnectedSpacer(props, forwardedRef) X-Ref

No description

UnconnectedFlexItem(props, forwardedRef) X-Ref

No description

truncate_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

isValueDefined(value) X-Ref

Determines if a value is null or undefined.

param: {T} value The value to check.
return: {value is Exclude<T, null | undefined>} Whether value is not null or undefined.

isValueEmpty(value) X-Ref

Determines if a value is empty, null, or undefined.

param: {string | number | null | undefined} value The value to check.
return: {value is ("" | null | undefined)} Whether value is empty.

getDefinedValue(values = [], fallbackValue) X-Ref

Get the first defined/non-null value from an array.

param: {Array<T | null | undefined>} values Values to derive from.
param: {T} fallbackValue Fallback value if there are no defined values.
return: {T} A defined value or the fallback value.

truncateMiddle(word, headLength, tailLength, ellipsis) X-Ref

No description

truncateContent(words = '', props) X-Ref

No description

useTruncate(props) X-Ref

No description

names(e,f) X-Ref

No description

colors_rgba(hexValue = '', alpha = 1) X-Ref

Generating a CSS compliant rgba() color value.

param: {string} hexValue The hex value to convert to rgba().
param: {number} alpha The alpha value for opacity.
return: {string} The converted rgba() color value.

getColorComputationNode() X-Ref

return: {HTMLDivElement | undefined} The HTML element for color computation.

isColor(value) X-Ref

param: {string | unknown} value
return: {boolean} Whether the value is a valid color.

_getComputedBackgroundColor(backgroundColor) X-Ref

Retrieves the computed background color. This is useful for getting the
value of a CSS variable color.

param: {string | unknown} backgroundColor The background color to compute.
return: {string} The computed background color.

getOptimalTextColor(backgroundColor) X-Ref

Get the text shade optimized for readability, based on a background color.

param: {string | unknown} backgroundColor The background color.
return: {string} The optimized text color (black or white).

getOptimalTextShade(backgroundColor) X-Ref

text_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

createHighlighterText({activeClassName = '',activeIndex = -1,activeStyle,autoEscape,caseSensitive = false,children,findChunks,highlightClassName = '',highlightStyle = {},highlightTag = 'mark',sanitize,searchWords = [],unhighlightClassName = '',unhighlightStyle}) X-Ref

param: options
param: options.activeClassName
param: options.activeIndex
param: options.activeStyle
param: options.autoEscape
param: options.caseSensitive
param: options.children
param: options.findChunks
param: options.highlightClassName
param: options.highlightStyle
param: options.highlightTag
param: options.sanitize
param: options.searchWords
param: options.unhighlightClassName
param: options.unhighlightStyle

getFontSize(size = BASE_FONT_SIZE) X-Ref

No description

getHeadingFontSize(size = 3) X-Ref

No description

getLineHeight(adjustLineHeightForInnerControls, lineHeight) X-Ref

No description

hook_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

useText(props) X-Ref

param: {import('../context').WordPressComponentProps<import('./types').Props, 'span'>} props

UnconnectedText(props, forwardedRef) X-Ref

param: props
param: forwardedRef

base_label_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

input_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

Backdrop({disabled = false,isBorderless = false}) X-Ref

Internal dependencies

label_Label({children,hideLabelFromVision,htmlFor,...props}) X-Ref

No description

useDeprecated36pxDefaultSizeProp(props) X-Ref

No description

useUniqueId(idProp) X-Ref

No description

getUIFlexProps(labelPosition) X-Ref

No description

InputBase(props, ref) X-Ref

No description

maths_0ab39ae9_esm_clamp(v, min, max) X-Ref

No description

rubberband(distance, dimension, constant) X-Ref

No description

rubberbandIfOutOfBounds(position, min, max, constant = 0.15) X-Ref

No description

computeRubberband(bounds, [Vx, Vy], [Rx, Ry]) X-Ref

No description

_toPrimitive(input, hint) X-Ref

No description

_toPropertyKey(arg) X-Ref

No description

_defineProperty(obj, key, value) X-Ref

No description

ownKeys(e, r) X-Ref

No description

_objectSpread2(e) X-Ref

No description

capitalize(string) X-Ref

No description

hasCapture(capture = false, actionKey) X-Ref

No description

toHandlerProp(device, action = '', capture = false) X-Ref

No description

parseProp(prop) X-Ref

No description

toDomEventType(device, action = '') X-Ref

No description

isTouch(event) X-Ref

No description

getPointerType(event) X-Ref

No description

getCurrentTargetTouchList(event) X-Ref

No description

getTouchList(event) X-Ref

No description

getValueEvent(event) X-Ref

No description

distanceAngle(P1, P2) X-Ref

No description

touchIds(event) X-Ref

No description

touchDistanceAngle(event, ids) X-Ref

No description

pointerId(event) X-Ref

No description

pointerValues(event) X-Ref

No description

wheelValues(event) X-Ref

No description

scrollValues(event) X-Ref

No description

getEventDetails(event) X-Ref

No description

call(v, ...args) X-Ref

No description

actions_fe213e88_esm_noop() X-Ref

No description

actions_fe213e88_esm_chain(...fns) X-Ref

No description

assignDefault(value, fallback) X-Ref

No description

Class: Engine - X-Ref

selectAxis([dx, dy], threshold) X-Ref

No description

Class: CoordinatesEngine - X-Ref

Class: DragEngine - X-Ref

persistEvent(event) X-Ref

No description

supportsTouchEvents() X-Ref

No description

isTouchScreen() X-Ref

No description

supportsPointerEvents() X-Ref

No description

supportsPointerLock() X-Ref

No description

supportsGestureEvents() X-Ref

No description

clampStateInternalMovementToBounds(state) X-Ref

No description

Class: PinchEngine - X-Ref

Class: MoveEngine - X-Ref

Class: ScrollEngine - X-Ref

Class: WheelEngine - X-Ref

Class: HoverEngine - X-Ref

actions_fe213e88_esm_registerAction(action) X-Ref

No description

_objectWithoutPropertiesLoose(source, excluded) X-Ref

No description

_objectWithoutProperties(source, excluded) X-Ref

No description

resolveWith(config = {}, resolvers) X-Ref

No description

use_gesture_core_esm_parse(newConfig, gestureKey, _config = {}) X-Ref

No description

Class: EventStore - X-Ref

Class: TimeoutStore - X-Ref

Class: Controller - X-Ref

setupGesture(ctrl, gestureKey) X-Ref

No description

resolveGestures(ctrl, internalHandlers) X-Ref

No description

sortHandlers(_handlers) X-Ref

No description

registerGesture(actions, handlers, handlerKey, key, internalHandlers, config) X-Ref

No description

use_gesture_core_esm_parseMergedHandlers(mergedHandlers, mergedConfig) X-Ref

No description

useRecognizers(handlers, config = {}, gestureKey, nativeHandlers) X-Ref

No description

useDrag(handler, config) X-Ref

No description

usePinch(handler, config) X-Ref

No description

useWheel(handler, config) X-Ref

No description

useScroll(handler, config) X-Ref

No description

useMove(handler, config) X-Ref

No description

useHover(handler, config) X-Ref

No description

createUseGesture(actions) X-Ref

No description

useGesture(handlers, config) X-Ref

No description

getDragCursor(dragDirection) X-Ref

Gets a CSS cursor value based on a drag direction.

param: dragDirection The drag direction.
return: The CSS cursor value.

useDragCursor(isDragging, dragDirection) X-Ref

Custom hook that renders a drag cursor when dragging.

param: {boolean} isDragging The dragging state.
param: {string} dragDirection The drag direction.
return: {string} The CSS cursor value.

useDraft(props) X-Ref

No description

mergeInitialState(initialState = initialInputControlState) X-Ref

Prepares initialState for the reducer.

param: initialState The initial state.
return: Prepared initialState for the reducer

inputControlStateReducer(composedStateReducers) X-Ref

Creates the base reducer which may be coupled to a specializing reducer.
As its final step, for all actions other than CONTROL, the base reducer
passes the state and action on through the specializing reducer. The
exception for CONTROL actions is because they represent controlled updates
from props and no case has yet presented for their specialization.

param: composedStateReducers A reducer to specialize state changes.
return: The reducer.

useInputControlStateReducer(stateReducer = initialStateReducer, initialState = initialInputControlState, onChangeHandler) X-Ref

A custom hook that connects and external stateReducer with an internal
reducer. This hook manages the internal state of InputControl.
However, by connecting an external stateReducer function, other
components can react to actions as well as modify state before it is
applied.

This technique uses the "stateReducer" design pattern:
https://kentcdodds.com/blog/the-state-reducer-pattern/

param: stateReducer An external state reducer.
param: initialState The initial state for the reducer.
param: onChangeHandler A handler for the onChange event.
return: State, dispatch, and a collection of actions.

withIgnoreIMEEvents(keydownHandler) X-Ref

A higher-order function that wraps a keydown event handler to ensure it is not an IME event.

In CJK languages, an IME (Input Method Editor) is used to input complex characters.
During an IME composition, keydown events (e.g. Enter or Escape) can be fired
which are intended to control the IME and not the application.
These events should be ignored by any application logic.

param: keydownHandler The keydown event handler to execute after ensuring it was not an IME event.
return: A wrapped version of the given event handler that ignores IME events.

InputField({disabled = false,dragDirection = 'n',dragThreshold = 10,id,isDragEnabled = false,isPressEnterToChange = false,onBlur = input_field_noop,onChange = input_field_noop,onDrag = input_field_noop,onDragEnd = input_field_noop,onDragStart = input_field_noop,onKeyDown = input_field_noop,onValidate = input_field_noop,size = 'default',stateReducer = state => state,value: valueProp,type,...props}, ref) X-Ref

No description

font(value) X-Ref

param: {keyof FONT} value Path of value from `FONT`
return: {string} Font rule value

box_sizing_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

base_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

input_control_useUniqueId(idProp) X-Ref

No description

UnforwardedInputControl(props, ref) X-Ref

No description

Dashicon({icon,className,size = 20,style = {},...extraProps}) X-Ref

Internal dependencies

Icon({icon = null,size = 'string' === typeof icon ? 20 : 24,...additionalProps}) X-Ref

Internal dependencies

button_useDeprecatedProps({__experimentalIsFocusable,isDefault,isPrimary,isSecondary,isTertiary,isLink,isPressed,isSmall,size,variant,describedBy,...otherProps}) X-Ref

No description

UnforwardedButton(props, ref) X-Ref

No description

number_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

getNumber(value) X-Ref

Parses and retrieves a number value.

param: {unknown} value The incoming value.
return: {number} The parsed number value.

add(...args) X-Ref

Safely adds 2 values.

param: {Array<number|string>} args Values to add together.
return: {number} The sum of values.

subtract(...args) X-Ref

Safely subtracts 2 values.

param: {Array<number|string>} args Values to subtract together.
return: {number} The difference of the values.

getPrecision(value) X-Ref

Determines the decimal position of a number value.

param: {number} value The number to evaluate.
return: {number} The number of decimal places.

math_clamp(value, min, max) X-Ref

Clamps a value based on a min/max range.

param: {number} value The value.
param: {number} min The minimum range.
param: {number} max The maximum range.
return: {number} The clamped value.

roundClamp(value = 0, min = Infinity, max = Infinity, step = 1) X-Ref

Clamps a value based on a min/max range with rounding

param: {number | string} value The value.
param: {number}          min   The minimum range.
param: {number}          max   The maximum range.
param: {number}          step  A multiplier for the value.
return: {number} The rounded and clamped value.

getAlignmentProps(alignment, direction = 'row') X-Ref

No description

getValidChildren(children) X-Ref

Gets a collection of available children elements from a React component's children prop.

param: children
return: An array of available children.

useHStack(props) X-Ref

No description

UnconnectedHStack(props, forwardedRef) X-Ref

No description

UnforwardedNumberControl(props, forwardedRef) X-Ref

No description

angle_picker_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

AngleCircle({value,onChange,...props}) X-Ref

Internal dependencies

getAngle(centerX, centerY, pointX, pointY) X-Ref

No description

UnforwardedAnglePickerControl(props, ref) X-Ref

No description

kebabCase(str) X-Ref

Converts any string to kebab case.
Backwards compatible with Lodash's `_.kebabCase()`.
Backwards compatible with `_wp_to_kebab_case()`.

param: str String to convert.
return: Kebab-cased string

escapeRegExp(string) X-Ref

Escapes the RegExp special characters.

param: string Input string.
return: Regex-escaped string.

filterOptions(search, options = [], maxResults = 10) X-Ref

Internal dependencies

getDefaultUseItems(autocompleter) X-Ref

No description

isRef(value) X-Ref

Provides data to position an inner element of the floating element so that it
appears centered to the reference element.
This wraps the core `arrow` middleware to allow React refs as the element.

deepEqual(a, b) X-Ref

No description

getDPR(element) X-Ref

No description

floating_ui_react_dom_roundByDPR(element, value) X-Ref

No description

useLatestRef(value) X-Ref

No description

useFloating(options) X-Ref

Provides data to position a floating element.

setLocked(locked) X-Ref

No description

ScrollLock() X-Ref

ScrollLock is a content-free React component for declaratively preventing
scroll bleed from modal UI to the page body. This component applies a
`lockscroll` class to the `document.documentElement` and
`document.scrollingElement` elements to stop the body from scrolling. When it
is present, the lock is applied.

```jsx
import { ScrollLock, Button } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyScrollLock = () => {
const [ isScrollLocked, setIsScrollLocked ] = useState( false );

const toggleLock = () => {
setIsScrollLocked( ( locked ) => ! locked ) );
};

return (
<div>
<Button variant="secondary" onClick={ toggleLock }>
Toggle scroll lock
</Button>
{ isScrollLocked && <ScrollLock /> }
<p>
Scroll locked:
<strong>{ isScrollLocked ? 'Yes' : 'No' }</strong>
</p>
</div>
);
};
```

useSlot(name) X-Ref

Internal dependencies

Fill({name,children}) X-Ref

Internal dependencies

isFunction(maybeFunc) X-Ref

Whether the argument is a function.

param: maybeFunc The argument to check.
return: True if the argument is a function, false otherwise.

Class: SlotComponent - X-Ref

rng() X-Ref

No description

unsafeStringify(arr, offset = 0) X-Ref

No description

stringify_stringify(arr, offset = 0) X-Ref

No description

v4(options, buf, offset) X-Ref

No description

StyleProvider(props) X-Ref

No description

fill_useForceUpdate() X-Ref

No description

fill_Fill(props) X-Ref

No description

slot_Slot(props, forwardedRef) X-Ref

No description

createSlotRegistry() X-Ref

Internal dependencies

SlotFillProvider({children}) X-Ref

No description

provider_createSlotRegistry() X-Ref

Internal dependencies

registerSlot(name, slot) X-Ref

No description

registerFill(name, instance) X-Ref

No description

unregisterSlot(name, instance) X-Ref

No description

unregisterFill(name, instance) X-Ref

No description

getSlot(name) X-Ref

No description

getFills(name, slotInstance) X-Ref

No description

forceUpdateSlot(name) X-Ref

No description

triggerListeners() X-Ref

No description

subscribe(listener) X-Ref

No description

provider_SlotFillProvider({children}) X-Ref

No description

slot_fill_Fill(props) X-Ref

No description

UnforwardedSlot(props, ref) X-Ref

No description

Provider({children,passthrough = false}) X-Ref

No description

createSlotFill(key) X-Ref

No description

overlayMiddlewares() X-Ref

External dependencies

PopoverSlot({name = SLOT_NAME}, ref) X-Ref

`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>
);
};
```

ListBox({items,onSelect,selectedIndex,instanceId,listBoxId,className,Component = 'div'}) X-Ref

No description

getAutoCompleterUI(autocompleter) X-Ref

No description

AutocompleterUI({filterValue,instanceId,listBoxId,className,selectedIndex,onChangeOptions,onSelect,onReset,reset,contentRef}) X-Ref

No description

announce(options) X-Ref

No description

useOnClickOutside(ref, handler) X-Ref

No description

useAutocomplete({record,onChange,onReplace,completers,contentRef}) X-Ref

No description

insertCompletion(replacement) X-Ref

No description

select(option) X-Ref

No description

reset() X-Ref

No description

onChangeOptions(options) X-Ref

Load options for an autocompleter.

param: {Array} options

handleKeyDown(event) X-Ref

No description

useLastDifferentValue(value) X-Ref

No description

useAutocompleteProps(options) X-Ref

No description

_onKeyDown(event) X-Ref

No description

Autocomplete({children,isSelected,...options}) X-Ref

No description

useBaseControlProps(props) X-Ref

Generate props for the `BaseControl` and the inner control itself.

Namely, it takes care of generating a unique `id`, properly associating it with the `label` and `help` elements.

param: props

border_box_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

useBorderBoxControlLinkedButton(props) X-Ref

No description

useBorderBoxControlVisualizer(props) X-Ref

No description

nodeGroup() X-Ref

No description

toggle_group_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

createRadioStore(_a = {}) X-Ref

No description

useRadioStoreProps(store, update, props) X-Ref

No description

useRadioStore(props = {}) X-Ref

No description

useRadioGroup2(_a) X-Ref

No description

useComputeControlledOrUncontrolledValue(valueProp) X-Ref

Used to determine, via an internal heuristics, whether an `undefined` value
received for the `value` prop should be interpreted as the component being
used in uncontrolled mode, or as an "empty" value for controlled mode.

param: valueProp The received `value`

UnforwardedToggleGroupControlAsRadioGroup({children,isAdaptiveWidth,label,onChange: onChangeProp,size,value: valueProp,id: idProp,...otherProps}, forwardedRef) X-Ref

No description

useControlledValue({defaultValue,onChange,value: valueProp}) X-Ref

Simplified and improved implementation of useControlledState.

param: props
param: props.defaultValue
param: props.value
param: props.onChange
return: The controlled value and the value setter.

UnforwardedToggleGroupControlAsButtonGroup({children,isAdaptiveWidth,label,onChange,size,value: valueProp,id: idProp,...otherProps}, forwardedRef) X-Ref

No description

UnconnectedToggleGroupControl(props, forwardedRef) X-Ref

No description

getIsChecked(value, storeValue) X-Ref

No description

isNativeRadio(tagName, type) X-Ref

No description

toggle_group_control_option_base_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

ToggleGroupControlOptionBase(props, forwardedRef) X-Ref

No description

UnforwardedToggleGroupControlOptionIcon(props, ref) X-Ref

No description

UnconnectedBorderControlStylePicker({onChange,...restProps}, forwardedRef) X-Ref

No description

UnforwardedColorIndicator(props, forwardedRef) X-Ref

Internal dependencies

closeIfFocusOutside() X-Ref

Closes the popover when focus leaves it unless the toggle was pressed or
focus has moved to a separate dialog. The former is to let the toggle
handle closing the popover and the latter is to preserve presence in
case a dialog has opened, allowing focus to return when it's dismissed.

close() X-Ref

No description

UnconnectedInputControlSuffixWrapper(props, forwardedRef) X-Ref

No description

select_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

icon_Icon({icon,size = 24,...props}, ref) X-Ref

Return an SVG icon.

param: {IconProps}                                 props icon is the SVG component to render
param: {import('react').ForwardedRef<HTMLElement>} ref   The forwarded ref to the SVG element.
return: {JSX.Element}  Icon component

select_control_useUniqueId(idProp) X-Ref

No description

SelectOptions({options}) X-Ref

No description

UnforwardedSelectControl(props, ref) X-Ref

No description

useControlledState(currentState, options = defaultOptions) X-Ref

Custom hooks for "controlled" components to track and consolidate internal
state and incoming values. This is useful for components that render
`input`, `textarea`, or `select` HTML elements.

https://reactjs.org/docs/forms.html#controlled-components

At first, a component using useControlledState receives an initial prop
value, which is used as initial internal state.

This internal state can be maintained and updated without
relying on new incoming prop values.

Unlike the basic useState hook, useControlledState's state can
be updated if a new incoming prop value is changed.

param: {T | undefined} currentState The current value.
param: {Options<T>} [options=defaultOptions] Additional options for the hook.
return: {[T | "", (nextState: T) => void]} The controlled value and the value setter.

floatClamp(value, min, max) X-Ref

A float supported clamp function for a specific value.

param: value The value to clamp.
param: min The minimum value.
param: max The maximum value.
return: A (float) number

useControlledRangeValue(settings) X-Ref

Hook to store a clamped value, derived from props.

param: settings
return: The controlled value and the value setter.

range_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

input_range_InputRange(props, ref) X-Ref

Internal dependencies

RangeMark(props) X-Ref

No description

RangeRail(props) X-Ref

No description

Marks(props) X-Ref

No description

useMarks({marks,min = 0,max = 100,step = 1,value = 0}) X-Ref

No description

SimpleTooltip(props) X-Ref

Internal dependencies

useTooltipPosition({inputRef,tooltipPosition}) X-Ref

No description

computeResetValue({resetFallbackValue,initialPosition}) X-Ref

Computes the value that `RangeControl` should reset to when pressing
the reset button.

UnforwardedRangeControl(props, forwardedRef) X-Ref

No description

UnconnectedInputControlPrefixWrapper(props, forwardedRef) X-Ref

No description

dist_u() X-Ref

No description

isLegacyProps(props) X-Ref

Internal dependencies

getColorFromLegacyProps(color) X-Ref

No description

use_deprecated_props_useDeprecatedProps(props) X-Ref

No description

UnforwardedOptionAsButton(props, forwardedRef) X-Ref

No description

UnforwardedOptionAsOption(props, forwardedRef) X-Ref

No description

Option({className,isSelected,selectedIconProps = {},tooltipText,...additionalProps}) X-Ref

No description

OptionGroup({className,options,...additionalProps}) X-Ref

Internal dependencies

DropdownLinkAction({buttonProps,className,dropdownProps,linkText}) X-Ref

No description

ButtonAction({className,children,...additionalProps}) X-Ref

No description

ListboxCircularOptionPicker(props) X-Ref

`CircularOptionPicker` is a component that displays a set of options as circular buttons.

```jsx
import { CircularOptionPicker } from '../circular-option-picker';
import { useState } from '@wordpress/element';

const Example = () => {
const [ currentColor, setCurrentColor ] = useState();
const colors = [
{ color: '#f00', name: 'Red' },
{ color: '#0f0', name: 'Green' },
{ color: '#00f', name: 'Blue' },
];
const colorOptions = (
<>
{ colors.map( ( { color, name }, index ) => {
return (
<CircularOptionPicker.Option
key={ `${ color }-${ index }` }
tooltipText={ name }
style={ { backgroundColor: color, color } }
isSelected={ index === currentColor }
onClick={ () => setCurrentColor( index ) }
aria-label={ name }
/>
);
} ) }
</>
);
return (
<CircularOptionPicker
options={ colorOptions }
actions={
<CircularOptionPicker.ButtonAction
onClick={ () => setCurrentColor( undefined ) }
>
{ 'Clear' }
</CircularOptionPicker.ButtonAction>
}
/>
);
};
```

ButtonsCircularOptionPicker(props) X-Ref

No description

CircularOptionPicker(props) X-Ref

No description

useVStack(props) X-Ref

No description

UnconnectedVStack(props, forwardedRef) X-Ref

No description

UnconnectedTruncate(props, forwardedRef) X-Ref

No description

useHeading(props) X-Ref

No description

UnconnectedHeading(props, forwardedRef) X-Ref

No description

color_palette_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

UnconnectedDropdownContentWrapper(props, forwardedRef) X-Ref

No description

SinglePalette({className,clearColor,colors,onChange,value,...additionalProps}) X-Ref

No description

MultiplePalettes({className,clearColor,colors,onChange,value,headingLevel}) X-Ref

No description

CustomColorPickerDropdown({isRenderedInSidebar,popoverProps: receivedPopoverProps,...props}) X-Ref

No description

UnforwardedColorPalette(props, forwardedRef) X-Ref

No description

getParsedQuantityAndUnit(rawValue, fallbackUnit, allowedUnits) X-Ref

Handles legacy value + unit handling.
This component use to manage both incoming value and units separately.

Moving forward, ideally the value should be a string that contains both
the value and unit, example: '10px'

param: rawValue The raw value as a string (may or may not contain the unit)
param: fallbackUnit The unit used as a fallback, if not unit is detected in the `value`
param: allowedUnits Units to derive from.
return: The extracted quantity and unit. The quantity can be `undefined` in case the raw value

hasUnits(units) X-Ref

Checks if units are defined.

param: units List of units.
return: Whether the list actually contains any units.

parseQuantityAndUnitFromRawValue(rawValue, allowedUnits = ALL_CSS_UNITS) X-Ref

Parses a quantity and unit from a raw string value, given a list of allowed
units and otherwise falling back to the default unit.

param: rawValue The raw value as a string (may or may not contain the unit)
param: allowedUnits Units to derive from.
return: The extracted quantity and unit. The quantity can be `undefined` in case the raw value

getValidParsedQuantityAndUnit(rawValue, allowedUnits, fallbackQuantity, fallbackUnit) X-Ref

Parses quantity and unit from a raw value. Validates parsed value, using fallback
value if invalid.

param: rawValue         The next value.
param: allowedUnits     Units to derive from.
param: fallbackQuantity The fallback quantity, used in case it's not possible to parse a valid quantity from the raw value.
param: fallbackUnit     The fallback unit, used in case it's not possible to parse a valid unit from the raw value.
return: The extracted quantity and unit. The quantity can be `undefined` in case the raw value

getAccessibleLabelForUnit(unit) X-Ref

Takes a unit value and finds the matching accessibility label for the
unit abbreviation.

param: unit Unit value (example: `px`)
return: a11y label for the unit abbreviation

filterUnitsWithSettings(allowedUnitValues = [], availableUnits) X-Ref

Filters available units based on values defined a list of allowed unit values.

param: allowedUnitValues Collection of allowed unit value strings.
param: availableUnits Collection of available unit objects.
return: Filtered units.

getUnitsWithCurrentUnit(rawValue, legacyUnit, units = ALL_CSS_UNITS) X-Ref

Get available units with the unit for the currently selected value
prepended if it is not available in the list of units.

This is useful to ensure that the current value's unit is always
accurately displayed in the UI, even if the intention is to hide
the availability of that unit.

param: rawValue Selected value to parse.
param: legacyUnit Legacy unit value, if rawValue needs it appended.
param: units List of available units.
return: A collection of units containing the unit for the current value.

useBorderControlDropdown(props) X-Ref

No description

UnitSelectControl({className,isUnitSelectTabbable: isTabbable = true,onChange,size = 'default',unit = 'px',units = CSS_UNITS,...props}, ref) X-Ref

No description

UnforwardedUnitControl(unitControlProps, forwardedRef) X-Ref

No description

useBorderControl(props) X-Ref

No description

utils_getAlignmentProps(alignment) X-Ref

No description

useGrid(props) X-Ref

No description

UnconnectedGrid(props, forwardedRef) X-Ref

No description

useBorderBoxControlSplitControls(props) X-Ref

No description

parseCSSUnitValue(toParse) X-Ref

Parses a number and unit from a value.

param: toParse Value to parse
return: The extracted number and unit.

createCSSUnitValue(value, unit) X-Ref

Combines a value and a unit into a unit value.

param: value
param: unit
return: The unit value.

mode(values) X-Ref

Finds the mode value out of the array passed favouring the first value
as a tiebreaker.

param: values Values to determine the mode from.
return: The mode value.

useBorderBoxControl(props) X-Ref

No description

box_control_icon_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

BoxControlIcon({size = 24,side = 'all',sides,...props}) X-Ref

No description

box_control_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

utils_mode(arr) X-Ref

Gets an items with the most occurrence within an array
https://stackoverflow.com/a/20762713

param: arr Array of items to check.
return: The item with the most occurrences.

getAllValue(values = {}, selectedUnits, availableSides = ALL_SIDES) X-Ref

Gets the 'all' input value and unit from values data.

param: values Box values.
param: selectedUnits Box units.
param: availableSides Available box sides to evaluate.
return: A value + unit for the 'all' input.

getAllUnitFallback(selectedUnits) X-Ref

Determine the most common unit selection to use as a fallback option.

param: selectedUnits Current unit selections for individual sides.
return: Most common unit selection.

isValuesMixed(values = {}, selectedUnits, sides = ALL_SIDES) X-Ref

Checks to determine if values are mixed.

param: values Box values.
param: selectedUnits Box units.
param: sides Available box sides to evaluate.
return: Whether values are mixed.

isValuesDefined(values) X-Ref

Checks to determine if values are defined.

param: values Box values.
return: Whether values are mixed.

getInitialSide(isLinked, splitOnAxis) X-Ref

Get initial selected side, factoring in whether the sides are linked,
and whether the vertical / horizontal directions are grouped via splitOnAxis.

param: isLinked Whether the box control's fields are linked.
param: splitOnAxis Whether splitting by horizontal or vertical axis.
return: The initial side.

normalizeSides(sides) X-Ref

Normalizes provided sides configuration to an array containing only top,
right, bottom and left. This essentially just maps `horizontal` or `vertical`
to their appropriate sides to facilitate correctly determining value for
all input control.

param: sides Available sides for box control.
return: Normalized sides configuration.

applyValueToSides(currentValues, newValue, sides) X-Ref

Applies a value to an object representing top, right, bottom and left sides
while taking into account any custom side configuration.

param: currentValues The current values for each side.
param: newValue The value to apply to the sides object.
param: sides Array defining valid sides.
return: Object containing the updated values for each side.

AllInputControl({__next40pxDefaultSize,onChange = all_input_control_noop,onFocus = all_input_control_noop,values,sides,selectedUnits,setSelectedUnits,...props}) X-Ref

No description

BoxInputControls({__next40pxDefaultSize,onChange = input_controls_noop,onFocus = input_controls_noop,values,selectedUnits,setSelectedUnits,sides,...props}) X-Ref

No description

AxialInputControls({__next40pxDefaultSize,onChange,onFocus,values,selectedUnits,setSelectedUnits,sides,...props}) X-Ref

No description

LinkedButton({isLinked,...props}) X-Ref

No description

box_control_useUniqueId(idProp) X-Ref

No description

BoxControl({__next40pxDefaultSize = false,id: idProp,inputProps = defaultInputProps,onChange = box_control_noop,label = (0,external_wp_i18n_namespaceObject.__) X-Ref

BoxControl components let users set values for Top, Right, Bottom, and Left.
This can be used as an input control for values like `padding` or `margin`.

```jsx
import { __experimentalBoxControl as BoxControl } from '@wordpress/components';
import { useState } from '@wordpress/element';

const Example = () => {
const [ values, setValues ] = useState( {
top: '50px',
left: '10%',
right: '10%',
bottom: '50px',
} );

return (
<BoxControl
values={ values }
onChange={ ( nextValues ) => setValues( nextValues ) }
/>
);
};
```

UnforwardedButtonGroup(props, ref) X-Ref

Internal dependencies

elevation_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

getBoxShadow(value) X-Ref

No description

useElevation(props) X-Ref

No description

UnconnectedElevation(props, forwardedRef) X-Ref

No description

card_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

getBorders({borderBottom,borderLeft,borderRight,borderTop}) X-Ref

No description

useSurface(props) X-Ref

No description

hook_useDeprecatedProps({elevation,isElevated,...otherProps}) X-Ref

No description

useCard(props) X-Ref

No description

UnconnectedCard(props, forwardedRef) X-Ref

No description

scrollable_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

useScrollable(props) X-Ref

No description

UnconnectedScrollable(props, forwardedRef) X-Ref

No description

useCardBody(props) X-Ref

No description

UnconnectedCardBody(props, forwardedRef) X-Ref

No description

useSeparator2(_a) X-Ref

No description

divider_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

UnconnectedDivider(props, forwardedRef) X-Ref

No description

useCardDivider(props) X-Ref

No description

UnconnectedCardDivider(props, forwardedRef) X-Ref

No description

useCardFooter(props) X-Ref

No description

UnconnectedCardFooter(props, forwardedRef) X-Ref

No description

useCardHeader(props) X-Ref

No description

UnconnectedCardHeader(props, forwardedRef) X-Ref

No description

useCardMedia(props) X-Ref

No description

UnconnectedCardMedia(props, forwardedRef) X-Ref

No description

CheckboxControl(props) X-Ref

Checkboxes allow the user to select one or more items from a set.

```jsx
import { CheckboxControl } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyCheckboxControl = () => {
const [ isChecked, setChecked ] = useState( true );
return (
<CheckboxControl
__nextHasNoMarginBottom
label="Is author"
help="Is the user a author or not?"
checked={ isChecked }
onChange={ setChecked }
/>
);
};
```

ClipboardButton({className,children,onCopy,onFinishCopy,text,...buttonProps}) X-Ref

No description

item_group_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

useItemGroup(props) X-Ref

Internal dependencies

UnconnectedItemGroup(props, forwardedRef) X-Ref

No description

clampPercent(value) X-Ref

Clamps a number between 0 and 100.

param: value Value to clamp.
return: Value clamped between 0 and 100.

isOverlapping(value, initialIndex, newPosition, minDistance = MINIMUM_DISTANCE_BETWEEN_POINTS) X-Ref

Check if a control point is overlapping with another.

param: value        Array of control points.
param: initialIndex Index of the position to test.
param: newPosition  New position of the control point.
param: minDistance  Distance considered to be overlapping.
return: True if the point is overlapping.

addControlPoint(points, position, color) X-Ref

Adds a control point from an array and returns the new array.

param: points Array of control points.
param: position Position to insert the new point.
param: color Color to update the control point at index.
return: New array of control points.

removeControlPoint(points, index) X-Ref

Removes a control point from an array and returns the new array.

param: points Array of control points.
param: index Index to remove.
return: New array of control points.

updateControlPoint(points, index, newPoint) X-Ref

Updates a control point from an array and returns the new array.

param: points Array of control points.
param: index Index to update.
param: newPoint New control point to replace the index.
return: New array of control points.

updateControlPointPosition(points, index, newPosition) X-Ref

Updates the position of a control point from an array and returns the new array.

param: points Array of control points.
param: index Index to update.
param: newPosition Position to move the control point at index.
return: New array of control points.

updateControlPointColor(points, index, newColor) X-Ref

Updates the position of a control point from an array and returns the new array.

param: points Array of control points.
param: index Index to update.
param: newColor Color to update the control point at index.
return: New array of control points.

updateControlPointColorByPosition(points, position, newColor) X-Ref

Updates the position of a control point from an array and returns the new array.

param: points Array of control points.
param: position Position of the color stop.
param: newColor Color to update the control point at index.
return: New array of control points.

getHorizontalRelativeGradientPosition(mouseXCoordinate, containerElement) X-Ref

Gets the horizontal coordinate when dragging a control point with the mouse.

param: mouseXcoordinate Horizontal coordinate of the mouse position.
param: containerElement Container for the gradient picker.
return: Whole number percentage from the left.

ControlPointButton({isOpen,position,color,...additionalProps}) X-Ref

No description

GradientColorPickerDropdown({isRenderedInSidebar,className,...props}) X-Ref

No description

ControlPoints({disableRemove,disableAlpha,gradientPickerDomRef,ignoreMarkerPosition,value: controlPoints,onChange,onStartControlPointChange,onStopControlPointChange,__experimentalIsRenderedInSidebar}) X-Ref

No description

InsertPoint({value: controlPoints,onChange,onOpenInserter,onCloseInserter,insertPosition,disableAlpha,__experimentalIsRenderedInSidebar}) X-Ref

No description

CustomGradientBar({background,hasGradient,value: controlPoints,onChange,disableInserter = false,disableAlpha = false,__experimentalIsRenderedInSidebar = false}) X-Ref

No description

serializeGradientColor({type,value}) X-Ref

External dependencies

serializeGradientPosition(position) X-Ref

No description

serializeGradientColorStop({type,value,length}) X-Ref

No description

serializeGradientOrientation(orientation) X-Ref

No description

serializeGradient({type,orientation,colorStops}) X-Ref

No description

getLinearGradientRepresentation(gradientAST) X-Ref

No description

hasUnsupportedLength(item) X-Ref

No description

getGradientAstWithDefault(value) X-Ref

No description

getGradientAstWithControlPoints(gradientAST, newControlPoints) X-Ref

No description

getStopCssColor(colorStop) X-Ref

No description

custom_gradient_picker_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

CustomGradientPicker({value,onChange,__experimentalIsRenderedInSidebar = false}) X-Ref

CustomGradientPicker is a React component that renders a UI for specifying
linear or radial gradients. Radial gradients are displayed in the picker as
a slice of the gradient from the center to the outside.

```jsx
import { CustomGradientPicker } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyCustomGradientPicker = () => {
const [ gradient, setGradient ] = useState();

return (
<CustomGradientPicker
value={ gradient }
onChange={ setGradient }
/>
);
};
```

SingleOrigin({className,clearGradient,gradients,onChange,value,...additionalProps}) X-Ref

No description

MultipleOrigin({className,clearGradient,gradients,onChange,value,headingLevel}) X-Ref

No description

Component(props) X-Ref

No description

GradientPicker({className,gradients = [],onChange,value,clearable = true,disableCustomGradients = false,__experimentalIsRenderedInSidebar,headingLevel = 2,...additionalProps}) X-Ref

GradientPicker is a React component that renders a color gradient picker to
define a multi step gradient. There's either a _linear_ or a _radial_ type
available.

```jsx
import { GradientPicker } from '@wordpress/components';
import { useState } from '@wordpress/element';

const myGradientPicker = () => {
const [ gradient, setGradient ] = useState( null );

return (
<GradientPicker
value={ gradient }
onChange={ ( currentGradient ) => setGradient( currentGradient ) }
gradients={ [
{
name: 'JShine',
gradient:
'linear-gradient(135deg,#12c2e9 0%,#c471ed 50%,#f64f59 100%)',
slug: 'jshine',
},
{
name: 'Moonlit Asteroid',
gradient:
'linear-gradient(135deg,#0F2027 0%, #203A43 0%, #2c5364 100%)',
slug: 'moonlit-asteroid',
},
{
name: 'Rastafarie',
gradient:
'linear-gradient(135deg,#1E9600 0%, #FFF200 0%, #FF0000 100%)',
slug: 'rastafari',
},
] }
/>
);
};
```

cycleValue(value, total, offset) X-Ref

No description

Class: NavigableContainer - X-Ref

UnforwardedNavigableMenu({role = 'menu',orientation = 'vertical',...rest}, ref) X-Ref

Internal dependencies

dropdown_menu_mergeProps(defaultProps = {}, props = {}) X-Ref

No description

dropdown_menu_isFunction(maybeFunc) X-Ref

No description

UnconnectedDropdownMenu(dropdownMenuProps) X-Ref

No description

palette_edit_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

NameInput({value,onChange,label}) X-Ref

No description

deduplicateElementSlugs(elements) X-Ref

No description

getNameAndSlugForPosition(elements, slugPrefix) X-Ref

Returns a name and slug for a palette item. The name takes the format "Color + id".
To ensure there are no duplicate ids, this function checks all slugs.
It expects slugs to be in the format: slugPrefix + color- + number.
It then sets the id component of the new name based on the incremented id of the highest existing slug id.

param: elements An array of color palette items.
param: slugPrefix The slug prefix used to match the element slug.
return: A name and slug for the new palette item.

ColorPickerPopover({isGradient,element,onChange,popoverProps: receivedPopoverProps,onClose = () X-Ref

No description

palette_edit_Option({canOnlyChangeValues,element,onChange,onRemove,popoverProps: receivedPopoverProps,slugPrefix,isGradient}) X-Ref

No description

PaletteEditListView({elements,onChange,canOnlyChangeValues,slugPrefix,isGradient,popoverProps,addColorRef}) X-Ref

No description

PaletteEdit({gradients,colors = EMPTY_ARRAY,onChange,paletteLabel,paletteLabelHeadingLevel = 2,emptyMessage,canOnlyChangeValues,canReset,slugPrefix = '',popoverProps}) X-Ref

Allows editing a palette of colors or gradients.

```jsx
import { PaletteEdit } from '@wordpress/components';
const MyPaletteEdit = () => {
const [ controlledColors, setControlledColors ] = useState( colors );

return (
<PaletteEdit
colors={ controlledColors }
onChange={ ( newColors?: Color[] ) => {
setControlledColors( newColors );
} }
paletteLabel="Here is a label"
/>
);
};
```

UnForwardedTokenInput(props, ref) X-Ref

Internal dependencies

SuggestionsList({selectedIndex,scrollIntoView,match,onHover,onSelect,suggestions = [],displayTransform,instanceId,__experimentalRenderItem}) X-Ref

No description

ComboboxControl(props) X-Ref

`ComboboxControl` is an enhanced version of a [`SelectControl`](../select-control/README.md) with the addition of
being able to search for options using a search input.

```jsx
import { ComboboxControl } from '@wordpress/components';
import { useState } from '@wordpress/element';

const options = [
{
value: 'small',
label: 'Small',
},
{
value: 'normal',
label: 'Normal',
disabled: true,
},
{
value: 'large',
label: 'Large',
disabled: false,
},
];

function MyComboboxControl() {
const [ fontSize, setFontSize ] = useState();
const [ filteredOptions, setFilteredOptions ] = useState( options );
return (
<ComboboxControl
__nextHasNoMarginBottom
label="Font Size"
value={ fontSize }
onChange={ setFontSize }
options={ filteredOptions }
onFilterValueChange={ ( inputValue ) =>
setFilteredOptions(
options.filter( ( option ) =>
option.label
.toLowerCase()
.startsWith( inputValue.toLowerCase() )
)
)
}
/>
);
}
```

mapLegacyStatePropsToComponentProps(legacyProps) X-Ref

No description

proxyComposite(ProxiedComponent, propMap = {}) X-Ref

No description

useCompositeState(legacyStateOptions = {}) X-Ref

_Note: please use the `Composite` component instead._

modalize(modalElement) X-Ref

Hides all elements in the body element from screen-readers except
the provided element and elements that should not be hidden from
screen-readers.

The reason we do this is because `aria-modal="true"` currently is bugged
in Safari, and support is spotty in other browsers overall. In the future
we should consider removing these helper functions in favor of
`aria-modal="true"`.

param: modalElement The element that should not be hidden.

elementShouldBeHidden(element) X-Ref

Determines if the passed element should not be hidden from screen readers.

param: element The element that should be checked.
return: Whether the element should not be hidden from screen-readers.

unmodalize() X-Ref

Accessibly reveals the elements hidden by the latest modal.

useModalExitAnimation() X-Ref

No description

UnforwardedModal(props, forwardedRef) X-Ref

No description

handleEscapeKeyDown(event) X-Ref

No description

confirm_dialog_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

createSelectStore(_a = {}) X-Ref

No description

useSelectStoreProps(store, update, props) X-Ref

No description

useSelectStore(props = {}) X-Ref

No description

useSelectLabel2(_a) X-Ref

No description

useButton2(props) X-Ref

No description

useDisclosure2(_a) X-Ref

No description

useDialogDisclosure2(_a) X-Ref

No description

usePopoverAnchor2(_a) X-Ref

No description

PopoverDisclosureArrow2(props) X-Ref

No description

useSelectArrow2(_a) X-Ref

No description

clearChars() X-Ref

No description

isValidTypeaheadEvent(event) X-Ref

No description

isSelfTargetOrItem(event, items) X-Ref

No description

DS36B3MQ_getEnabledItems(items) X-Ref

No description

itemTextStartsWith(item, text) X-Ref

No description

getSameInitialItems(items, char, activeId) X-Ref

No description

getSelectedValues(select) X-Ref

No description

nextWithValue(store, next) X-Ref

No description

useSelectList2(_a) X-Ref

No description

useSelectPopover2(_a) X-Ref

No description

getMouseDestination(event) X-Ref

No description

hoveringInside(event) X-Ref

No description

movingToAnotherItem(event) X-Ref

No description

useCompositeHover2(_a) X-Ref

No description

isSelected(storeValue, itemValue) X-Ref

No description

useSelectItem2(_a) X-Ref

No description

getChildren(props) X-Ref

No description

useCheckboxCheck2(_a) X-Ref

No description

useSelectItemCheck2(_a) X-Ref

No description

custom_select_control_v2_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

defaultRenderSelectedValue(value) X-Ref

No description

_CustomSelect(props) X-Ref

No description

CustomSelectItem({children,...props}) X-Ref

No description

custom_select_control_useDeprecatedProps({__experimentalShowSelectedHint,...otherProps}) X-Ref

No description

applyOptionDeprecations({__experimentalHint,...rest}) X-Ref

No description

getDescribedBy(currentValue, describedBy) X-Ref

No description

CustomSelectControl(props) X-Ref

No description

toDate(argument) X-Ref

param: argument - The value to convert
returns: The parsed date in the local time zone

startOfDay(date) X-Ref

param: date - The original date
returns: The start of a day

constructFrom(date, value) X-Ref

param: date - The reference date to take constructor from
param: value - The value to create the date
returns: Date initialized using the given date and value

addMonths(date, amount) X-Ref

param: date - The date to be changed
param: amount - The amount of months to be added.
returns: The new date with the months added

subMonths(date, amount) X-Ref

param: date - The date to be changed
param: amount - The amount of months to be subtracted.
returns: The new date with the months subtracted

buildFormatLongFn(args) X-Ref

No description

buildLocalizeFn(args) X-Ref

The tuple of localized month values. The first element represents January.

buildMatchFn(args) X-Ref

No description

findKey(object, predicate) X-Ref

No description

findIndex(array, predicate) X-Ref

No description

buildMatchPatternFn(args) X-Ref

No description

getDefaultOptions() X-Ref

author: Sasha Koss [@kossnocorp](https://github.com/kossnocorp)
author: Lesha Koss [@leshakoss](https://github.com/leshakoss)

setDefaultOptions(newOptions) X-Ref

No description

getTimezoneOffsetInMilliseconds(date) X-Ref

Google Chrome as of 67.0.3396.87 introduced timezones with offset that includes seconds.
They usually appear for dates that denote time before the timezones were introduced
(e.g. for 'Europe/Prague' timezone the offset is GMT+00:57:44 before 1 October 1891
and GMT+01:00:00 after that date)

Date#getTimezoneOffset returns the offset in minutes and would return 57 for the example above,
which would lead to incorrect calculations.

This function returns the timezone offset in milliseconds that takes seconds in account.

differenceInCalendarDays(dateLeft, dateRight) X-Ref

param: dateLeft - The later date
param: dateRight - The earlier date
returns: The number of calendar days

startOfYear(date) X-Ref

param: date - The original date
returns: The start of a year

getDayOfYear(date) X-Ref

param: date - The given date
returns: The day of year

startOfWeek(date, options) X-Ref

param: date - The original date
param: options - An object with options
returns: The start of a week

startOfISOWeek(date) X-Ref

param: date - The original date
returns: The start of an ISO week

getISOWeekYear(date) X-Ref

param: date - The given date
returns: The ISO week-numbering year

startOfISOWeekYear(date) X-Ref

param: date - The original date
returns: The start of an ISO week-numbering year

getISOWeek(date) X-Ref

param: date - The given date
returns: The ISO week

getWeekYear(date, options) X-Ref

param: date - The given date
param: options - An object with options.
returns: The local week-numbering year

startOfWeekYear(date, options) X-Ref

param: date - The original date
param: options - An object with options
returns: The start of a week-numbering year

getWeek(date, options) X-Ref

param: date - The given date
param: options - An object with options
returns: The week

addLeadingZeros(number, targetLength) X-Ref

No description

formatTimezoneShort(offset, delimiter = "") X-Ref

No description

formatTimezoneWithOptionalMinutes(offset, delimiter) X-Ref

No description

formatTimezone(offset, delimiter = "") X-Ref

No description

isProtectedDayOfYearToken(token) X-Ref

No description

isProtectedWeekYearToken(token) X-Ref

No description

warnOrThrowProtectedError(token, format, input) X-Ref

No description

message(token, format, input) X-Ref

No description

isDate(value) X-Ref

param: value - The value to check
returns: True if the given value is a date

isValid(date) X-Ref

param: date - The date to check
returns: The date is valid

format(date, formatStr, options) X-Ref

param: date - The original date
param: format - The string of tokens
param: options - An object with options
returns: The formatted date string

cleanEscapedString(input) X-Ref

No description

isSameMonth(dateLeft, dateRight) X-Ref

param: dateLeft - The first date to check
param: dateRight - The second date to check
returns: The dates are in the same month (and year)

isEqual(leftDate, rightDate) X-Ref

param: dateLeft - The first date to compare
param: dateRight - The second date to compare
returns: The dates are equal

isSameDay(dateLeft, dateRight) X-Ref

param: dateLeft - The first date to check
param: dateRight - The second date to check
returns: The dates are in the same day (and year and month)

addDays(date, amount) X-Ref

param: date - The date to be changed
param: amount - The amount of days to be added.
returns: The new date with the days added

addWeeks(date, amount) X-Ref

param: date - The date to be changed
param: amount - The amount of weeks to be added.
returns: The new date with the weeks added

subWeeks(date, amount) X-Ref

param: date - The date to be changed
param: amount - The amount of weeks to be subtracted.
returns: The new date with the weeks subtracted

endOfWeek(date, options) X-Ref

param: date - The original date
param: options - An object with options
returns: The end of a week

isAfter(date, dateToCompare) X-Ref

param: date - The date that should be after the other one to return true
param: dateToCompare - The date to compare with
returns: The first date is after the second date

isBefore(date, dateToCompare) X-Ref

param: date - The date that should be before the other one to return true
param: dateToCompare - The date to compare with
returns: The first date is before the second date

getDaysInMonth(date) X-Ref

param: date - The given date
returns: The number of days in a month

setMonth(date, month) X-Ref

param: date - The date to be changed
param: month - The month index to set (0-11)
returns: The new date with the month set

set(date, values) X-Ref

param: date - The date to be changed
param: values - The date values to be set
returns: The new date with options set

startOfToday() X-Ref

returns: The start of today

setYear(date, year) X-Ref

param: date - The date to be changed
param: year - The year of the new date
returns: The new date with the year set

addYears(date, amount) X-Ref

param: date - The date to be changed
param: amount - The amount of years to be added.
returns: The new date with the years added

subYears(date, amount) X-Ref

param: date - The date to be changed
param: amount - The amount of years to be subtracted.
returns: The new date with the years subtracted

eachDayOfInterval(interval, options) X-Ref

param: interval - The interval.
param: options - An object with options.
returns: The array with starts of days from the day of the interval start to the day of the interval end

eachMonthOfInterval(interval, options) X-Ref

param: interval - The interval
returns: The array with starts of months from the month of the interval start to the month of the interval end

startOfMonth(date) X-Ref

param: date - The original date
returns: The start of a month

endOfMonth(date) X-Ref

param: date - The original date
returns: The end of a month

eachWeekOfInterval(interval, options) X-Ref

param: interval - The interval.
param: options - An object with options.
returns: The array with starts of weeks from the week of the interval start to the week of the interval end

inputToDate(input) X-Ref

Like date-fn's toDate, but tries to guess the format when a string is
given.

param: input Value to turn into a date.

from12hTo24h(hours, isPm) X-Ref

Converts a 12-hour time to a 24-hour time.

param: hours
param: isPm

from24hTo12h(hours) X-Ref

Converts a 24-hour time to a 12-hour time.

param: hours

buildPadInputStateReducer(pad) X-Ref

Creates an InputControl reducer used to pad an input so that it is always a
given width. For example, the hours and minutes inputs are padded to 2 so
that '4' appears as '04'.

param: pad How many digits the value should be.

validateInputElementTarget(event) X-Ref

Validates the target of a React event to ensure it is an input element and
that the input is valid.

param: event

DatePicker({currentDate,onChange,events = [],isInvalidDate,onMonthPreviewed,startOfWeek: weekStartsOn = 0}) X-Ref

DatePicker is a React component that renders a calendar for date selection.

```jsx
import { DatePicker } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyDatePicker = () => {
const [ date, setDate ] = useState( new Date() );

return (
<DatePicker
currentDate={ date }
onChange={ ( newDate ) => setDate( newDate ) }
/>
);
};
```

date_Day({day,column,isSelected,isFocusable,isFocusAllowed,isToday,isInvalid,numEvents,onClick,onKeyDown}) X-Ref

No description

getDayLabel(date, isSelected, numEvents) X-Ref

No description

startOfMinute(date) X-Ref

param: date - The original date
returns: The start of a minute

time_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

UnforwardedToggleGroupControlOption(props, ref) X-Ref

No description

TimeInput({value: valueProp,defaultValue,is12Hour,label,minutesProps,onChange}) X-Ref

No description

parseDayPeriod(_hours) X-Ref

No description

TimePicker({is12Hour,currentTime,onChange,dateOrder: dateOrderProp,hideLabelFromVision = false}) X-Ref

TimePicker is a React component that renders a clock for time selection.

```jsx
import { TimePicker } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyTimePicker = () => {
const [ time, setTime ] = useState( new Date() );

return (
<TimePicker
currentTime={ date }
onChange={ ( newTime ) => setTime( newTime ) }
is12Hour
/>
);
};
```

date_time_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

UnforwardedDateTimePicker({currentDate,is12Hour,dateOrder,isInvalidDate,onMonthPreviewed = date_time_noop,onChange,events,startOfWeek}, ref) X-Ref

No description

DimensionControl(props) X-Ref

`DimensionControl` is a component designed to provide a UI to control spacing and/or dimensions.

disabled_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

Disabled({className,children,isDisabled = true,...props}) X-Ref

`Disabled` is a component which disables descendant tabbable elements and
prevents pointer interaction.

_Note: this component may not behave as expected in browsers that don't
support the `inert` HTML attribute. We recommend adding the official WICG
polyfill when using this component in your project._

Draggable({children,onDragStart,onDragOver,onDragEnd,appendToOwnerDocument = false,cloneClassname,elementId,transferData,__experimentalTransferDataType: transferDataType = 'text',__experimentalDragComponent: dragComponent}) X-Ref

`Draggable` is a Component that provides a way to set up a cross-browser
(including IE) customizable drag image and the transfer data for the drag
event. It decouples the drag handle and the element to drag: use it by
wrapping the component that will become the drag handle and providing the DOM
ID of the element to drag.

Note that the drag handle needs to declare the `draggable="true"` property
and bind the `Draggable`s `onDraggableStart` and `onDraggableEnd` event
handlers to its own `onDragStart` and `onDragEnd` respectively. `Draggable`
takes care of the logic to setup the drag image and the transfer data, but is
not concerned with creating an actual DOM element that is draggable.

```jsx
import { Draggable, Panel, PanelBody } from '@wordpress/components';
import { Icon, more } from '@wordpress/icons';

const MyDraggable = () => (
<div id="draggable-panel">
<Panel header="Draggable panel">
<PanelBody>
<Draggable elementId="draggable-panel" transferData={ {} }>
{ ( { onDraggableStart, onDraggableEnd } ) => (
<div
className="example-drag-handle"
draggable
onDragStart={ onDraggableStart }
onDragEnd={ onDraggableEnd }
>
<Icon icon={ more } />
</div>
) }
</Draggable>
</PanelBody>
</Panel>
</div>
);
```

end(event) X-Ref

Removes the element clone, resets cursor, and removes drag listener.

param: event The non-custom DragEvent.

start(event) X-Ref

This method does a couple of things:

- Clones the current element and spawns clone over original element.
- Adds a fake temporary drag image to avoid browser defaults.
- Sets transfer data.
- Adds dragover listener.

param: event The non-custom DragEvent.

over(e) X-Ref

No description

DropZoneComponent({className,label,onFilesDrop,onHTMLDrop,onDrop,...restProps}) X-Ref

`DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.

```jsx
import { DropZone } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyDropZone = () => {
const [ hasDropped, setHasDropped ] = useState( false );

return (
<div>
{ hasDropped ? 'Dropped!' : 'Drop something here' }
<DropZone
onFilesDrop={ () => setHasDropped( true ) }
onHTMLDrop={ () => setHasDropped( true ) }
onDrop={ () => setHasDropped( true ) }
/>
</div>
);
}
```

DropZoneProvider({children}) X-Ref

WordPress dependencies

getDefaultColors(palette) X-Ref

Calculate the brightest and darkest values from a color palette.

param: palette Color palette for the theme.
return: Tuple of the darkest color and brightest color.

getGradientFromCSSColors(colors = [], angle = '90deg') X-Ref

Generate a duotone gradient from a list of colors.

param: colors CSS color strings.
param: angle CSS gradient angle.
return: CSS gradient string for the duotone swatch.

getColorStopsFromColors(colors) X-Ref

Convert a color array to an array of color stops.

param: colors CSS colors array
return: Color stop information.

getColorsFromColorStops(colorStops = []) X-Ref

Convert a color stop array to an array colors.

param: colorStops Color stop information.
return: CSS colors array.

DuotoneSwatch({values}) X-Ref

No description

ColorOption({label,value,colors,disableCustomColors,enableAlpha,onChange}) X-Ref

No description

ColorListPicker({colors,labels,value = [],disableCustomColors,enableAlpha,onChange}) X-Ref

No description

CustomDuotoneBar({value,onChange}) X-Ref

No description

DuotonePicker({asButtons,loop,clearable = true,unsetable = true,colorPalette,duotonePalette,disableCustomColors,disableCustomDuotone,value,onChange,'aria-label': ariaLabel,'aria-labelledby': ariaLabelledby,...otherProps}) X-Ref

```jsx
import { DuotonePicker, DuotoneSwatch } from '@wordpress/components';
import { useState } from '@wordpress/element';

const DUOTONE_PALETTE = [
{ colors: [ '#8c00b7', '#fcff41' ], name: 'Purple and yellow', slug: 'purple-yellow' },
{ colors: [ '#000097', '#ff4747' ], name: 'Blue and red', slug: 'blue-red' },
];

const COLOR_PALETTE = [
{ color: '#ff4747', name: 'Red', slug: 'red' },
{ color: '#fcff41', name: 'Yellow', slug: 'yellow' },
{ color: '#000097', name: 'Blue', slug: 'blue' },
{ color: '#8c00b7', name: 'Purple', slug: 'purple' },
];

const Example = () => {
const [ duotone, setDuotone ] = useState( [ '#000000', '#ffffff' ] );
return (
<>
<DuotonePicker
duotonePalette={ DUOTONE_PALETTE }
colorPalette={ COLOR_PALETTE }
value={ duotone }
onChange={ setDuotone }
/>
<DuotoneSwatch values={ duotone } />
</>
);
};
```

UnforwardedExternalLink(props, ref) X-Ref

Internal dependencies

getExtension(filename = '') X-Ref

Gets the extension of a file name.

param: filename The file name.
return: The extension of the file name.

isVideoType(filename = '') X-Ref

Checks if a file is a video.

param: filename The file name.
return: Whether the file is a video.

fractionToPercentage(fraction) X-Ref

Transforms a fraction value to a percentage value.

param: fraction The fraction value.
return: A percentage value.

focal_point_picker_style_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

FocalPointPickerControls({__nextHasNoMarginBottom,hasHelpText,onChange = controls_noop,point = {x: 0.5,y: 0.5}}) X-Ref

No description

FocalPointUnitControl(props) X-Ref

No description

FocalPoint({left = '50%',top = '50%',...props}) X-Ref

External dependencies

FocalPointPickerGrid({bounds,...props}) X-Ref

No description

media_Media({alt,autoPlay,src,onLoad,mediaRef,muted = true,...props}) X-Ref

No description

FocalPointPicker({__nextHasNoMarginBottom,autoPlay = true,className,help,label,onChange,onDrag,onDragEnd,onDragStart,resolvePoint,url,value: valueProp = {x: 0.5,y: 0.5},...restProps}) X-Ref

Focal Point Picker is a component which creates a UI for identifying the most important visual point of an image.

This component addresses a specific problem: with large background images it is common to see undesirable crops,
especially when viewing on smaller viewports such as mobile phones. This component allows the selection of
the point with the most important visual information and returns it as a pair of numbers between 0 and 1.
This value can be easily converted into the CSS `background-position` attribute, and will ensure that the
focal point is never cropped out, regardless of viewport.

- Example focal point picker value: `{ x: 0.5, y: 0.1 }`
- Corresponding CSS: `background-position: 50% 10%;`

```jsx
import { FocalPointPicker } from '@wordpress/components';
import { useState } from '@wordpress/element';

const Example = () => {
const [ focalPoint, setFocalPoint ] = useState( {
x: 0.5,
y: 0.5,
} );

const url = '/path/to/image';

// Example function to render the CSS styles based on Focal Point Picker value
const style = {
backgroundImage: `url(${ url })`,
backgroundPosition: `${ focalPoint.x * 100 }% ${ focalPoint.y * 100 }%`,
};

return (
<>
<FocalPointPicker
__nextHasNoMarginBottom
url={ url }
value={ focalPoint }
onDragStart={ setFocalPoint }
onDrag={ setFocalPoint }
onChange={ setFocalPoint }
/>
<div style={ style } />
</>
);
};
```

FocusableIframe({iframeRef,...props}) X-Ref

Internal dependencies

isSimpleCssValue(value) X-Ref

Some themes use css vars for their font sizes, so until we
have the way of calculating them don't display them.

param: value The value that is checked.
return: Whether the value is a simple css value.

getCommonSizeUnit(fontSizes) X-Ref

If all of the given font sizes have the same unit (e.g. 'px'), return that
unit. Otherwise return null.

param: fontSizes List of font sizes.
return: The common unit, or null.

font_size_picker_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

FormFileUpload({accept,children,multiple = false,onChange,onClick,render,...props}) X-Ref

FormFileUpload is a component that allows users to select files from their local device.

```jsx
import { FormFileUpload } from '@wordpress/components';

const MyFormFileUpload = () => (
<FormFileUpload
accept="image/*"
onChange={ ( event ) => console.log( event.currentTarget.files ) }
>
Upload
</FormFileUpload>
);
```

UnforwardedFormToggle(props, ref) X-Ref

No description

Token({value,status,title,displayTransform,isBorderless = false,disabled = false,onClickRemove = token_noop,onMouseEnter,onMouseLeave,messages,termPosition,termsCount}) X-Ref

No description

FormTokenField(props) X-Ref

A `FormTokenField` is a field similar to the tags and categories fields in the interim editor chrome,
or the "to" field in Mail on OS X. Tokens can be entered by typing them or selecting them from a list of suggested tokens.

Up to one hundred suggestions that match what the user has typed so far will be shown from which the user can pick from (auto-complete).
Tokens are separated by the "," character. Suggestions can be selected with the up or down arrows and added with the tab or enter key.

The `value` property is handled in a manner similar to controlled form components.
See [Forms](https://react.dev/reference/react-dom/components#form-components) in the React Documentation for more information.

focus() X-Ref

No description

hasFocus() X-Ref

No description

onFocusHandler(event) X-Ref

No description

onBlur(event) X-Ref

No description

onKeyDown(event) X-Ref

No description

onKeyPress(event) X-Ref

No description

onContainerTouched(event) X-Ref

No description

onTokenClickRemove(event) X-Ref

No description

onSuggestionHovered(suggestion) X-Ref

No description

onSuggestionSelected(suggestion) X-Ref

No description

onInputChangeHandler(event) X-Ref

No description

handleDeleteKey(_deleteToken) X-Ref

No description

handleLeftArrowKey() X-Ref

No description

handleRightArrowKey() X-Ref

No description

handleUpArrowKey() X-Ref

No description

handleDownArrowKey() X-Ref

No description

handleEscapeKey(event) X-Ref

No description

handleCommaKey() X-Ref

No description

moveInputToIndex(index) X-Ref

No description

moveInputBeforePreviousToken() X-Ref

No description

moveInputAfterNextToken() X-Ref

No description

deleteTokenBeforeInput() X-Ref

No description

deleteTokenAfterInput() X-Ref

No description

addCurrentToken() X-Ref

No description

addNewTokens(tokens) X-Ref

No description

addNewToken(token) X-Ref

No description

deleteToken(token) X-Ref

No description

getTokenValue(token) X-Ref

No description

getMatchingSuggestions(searchValue = incompleteTokenValue, _suggestions = suggestions, _value = value, _maxSuggestions = maxSuggestions, _saveTransform = saveTransform) X-Ref

No description

getSelectedSuggestion() X-Ref

No description

valueContainsToken(token) X-Ref

No description

getIndexOfInput() X-Ref

No description

isInputEmpty() X-Ref

No description

inputHasValidValue() X-Ref

No description

updateSuggestions(resetSelectedSuggestion = true) X-Ref

No description

renderTokensAndInput() X-Ref

No description

renderToken(token, index, tokens) X-Ref

No description

renderInput() X-Ref

No description

PageControl({currentPage,numberOfPages,setCurrentPage}) X-Ref

No description

Guide({children,className,contentLabel,finishButtonText = (0,external_wp_i18n_namespaceObject.__) X-Ref

`Guide` is a React component that renders a _user guide_ in a modal. The guide consists of several pages which the user can step through one by one. The guide is finished when the modal is closed or when the user clicks _Finish_ on the last page of the guide.

```jsx
function MyTutorial() {
const [ isOpen, setIsOpen ] = useState( true );

if ( ! isOpen ) {
return null;
}

return (
<Guide
onFinish={ () => setIsOpen( false ) }
pages={ [
{
content: <p>Welcome to the ACME Store!</p>,
},
{
image: <img src="https://acmestore.com/add-to-cart.png" />,
content: (
<p>
Click <i>Add to Cart</i> to buy a product.
</p>
),
},
] }
/>
);
}
```

GuidePage(props) X-Ref

Internal dependencies

UnforwardedIconButton({label,labelPosition,size,tooltip,...props}, ref) X-Ref

Internal dependencies

useItem(props) X-Ref

No description

UnconnectedItem(props, forwardedRef) X-Ref

No description

KeyboardShortcut({target,callback,shortcut,bindGlobal,eventName}) X-Ref

No description

KeyboardShortcuts({children,shortcuts,bindGlobal,eventName}) X-Ref

`KeyboardShortcuts` is a component which handles keyboard sequences during the lifetime of the rendering element.

When passed children, it will capture key events which occur on or within the children. If no children are passed, events are captured on the document.

It uses the [Mousetrap](https://craig.is/killing/mice) library to implement keyboard sequence bindings.

```jsx
import { KeyboardShortcuts } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyKeyboardShortcuts = () => {
const [ isAllSelected, setIsAllSelected ] = useState( false );
const selectAll = () => {
setIsAllSelected( true );
};

return (
<div>
<KeyboardShortcuts
shortcuts={ {
'mod+a': selectAll,
} }
/>
[cmd/ctrl + A] Combination pressed? { isAllSelected ? 'Yes' : 'No' }
</div>
);
};
```

MenuGroup(props) X-Ref

`MenuGroup` wraps a series of related `MenuItem` components into a common
section.

```jsx
import { MenuGroup, MenuItem } from '@wordpress/components';

const MyMenuGroup = () => (
<MenuGroup label="Settings">
<MenuItem>Setting 1</MenuItem>
<MenuItem>Setting 2</MenuItem>
</MenuGroup>
);
```

UnforwardedMenuItem(props, ref) X-Ref

No description

MenuItemsChoice({choices = [],onHover = menu_items_choice_noop,onSelect,value}) X-Ref

`MenuItemsChoice` functions similarly to a set of `MenuItem`s, but allows the user to select one option from a set of multiple choices.

```jsx
import { MenuGroup, MenuItemsChoice } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyMenuItemsChoice = () => {
const [ mode, setMode ] = useState( 'visual' );
const choices = [
{
value: 'visual',
label: 'Visual editor',
},
{
value: 'text',
label: 'Code editor',
},
];

return (
<MenuGroup label="Editor">
<MenuItemsChoice
choices={ choices }
value={ mode }
onSelect={ ( newMode ) => setMode( newMode ) }
/>
</MenuGroup>
);
};
```

UnforwardedTabbableContainer({eventToOffset,...props}, ref) X-Ref

Internal dependencies

navigation_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

useNavigationTreeNodes() X-Ref

WordPress dependencies

Navigation({activeItem,activeMenu = ROOT_MENU,children,className,onActivateMenu = navigation_noop}) X-Ref

Render a navigation list with optional groupings and hierarchy.

UnforwardedNavigationBackButton({backButtonLabel,className,href,onClick,parentMenu}, ref) X-Ref

No description

NavigationGroup({children,className,title}) X-Ref

NavigationItemBaseContent(props) X-Ref

No description

NavigationItemBase(props) X-Ref

No description

NavigationItem(props) X-Ref

SuffixItem({searchRef,value,onChange,onClose}) X-Ref

No description

UnforwardedSearchControl({__nextHasNoMarginBottom = false,className,onChange,value,label = (0,external_wp_i18n_namespaceObject.__) X-Ref

No description

MenuTitleSearch({debouncedSpeak,onCloseSearch,onSearch,search,title}) X-Ref

No description

NavigationMenuTitle({hasSearch,onSearch,search,title,titleAction}) X-Ref

No description

NavigationSearchNoResultsFound({search}) X-Ref

No description

NavigationMenu(props) X-Ref

lexer(str) X-Ref

Tokenize input string.

dist_es2015_parse(str, options) X-Ref

Parse a string for the raw tokens.

dist_es2015_compile(str, options) X-Ref

Compile a string to a template function for the path.

tokensToFunction(tokens, options) X-Ref

Expose a method for transforming tokens into the path function.

dist_es2015_match(str, options) X-Ref

Create path match function from `path-to-regexp` spec.

regexpToFunction(re, keys, options) X-Ref

Create a path match function from `path-to-regexp` output.

escapeString(str) X-Ref

Escape a regular expression string.

flags(options) X-Ref

Get the flags for a regexp from the options.

regexpToRegexp(path, keys) X-Ref

Pull out keys from a regexp.

arrayToRegexp(paths, keys, options) X-Ref

Transform an array into a regexp.

stringToRegexp(path, keys, options) X-Ref

Create a path regexp from string input.

tokensToRegexp(tokens, keys, options) X-Ref

Expose a function for taking tokens and returning a RegExp.

pathToRegexp(path, keys, options) X-Ref

Normalize the given path string, returning a regular expression.

An empty array can be passed in for the keys, which will hold the
placeholder key descriptions. For example, using `/user/:id`, `keys` will
contain `[{ name: 'id', delimiter: '/', optional: false, repeat: false }]`.

matchPath(path, pattern) X-Ref

Internal dependencies

patternMatch(path, screens) X-Ref

No description

findParent(path, screens) X-Ref

No description

navigator_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

addScreen({screens}, screen) X-Ref

No description

removeScreen({screens}, screen) X-Ref

No description

goTo(state, path, options = {}) X-Ref

No description

getFocusSelectorsCopy() X-Ref

No description

goToParent(state, options = {}) X-Ref

No description

routerReducer(state, action) X-Ref

No description

UnconnectedNavigatorProvider(props, forwardedRef) X-Ref

No description

UnconnectedNavigatorScreen(props, forwardedRef) X-Ref

No description

useNavigator() X-Ref

Retrieves a `navigator` instance.

useNavigatorButton(props) X-Ref

No description

UnconnectedNavigatorButton(props, forwardedRef) X-Ref

No description

useNavigatorBackButton(props) X-Ref

No description

UnconnectedNavigatorBackButton(props, forwardedRef) X-Ref

No description

UnconnectedNavigatorToParentButton(props, forwardedRef) X-Ref

No description

useSpokenMessage(message, politeness) X-Ref

Custom hook which announces the message with the given politeness, if a
valid message is provided.

getDefaultPoliteness(status) X-Ref

No description

getStatusLabel(status) X-Ref

No description

Notice({className,status = 'info',children,spokenMessage = children,onRemove = notice_noop,isDismissible = true,actions = [],politeness = getDefaultPoliteness(status) X-Ref

`Notice` is a component used to communicate feedback to the user.

```jsx
import { Notice } from `@wordpress/components`;

const MyNotice = () => (
<Notice status="error">An unknown error occurred.</Notice>
);
```

NoticeList({notices,onRemove = list_noop,className,children}) X-Ref

`NoticeList` is a component used to render a collection of notices.

```jsx
import { Notice, NoticeList } from `@wordpress/components`;

const MyNoticeList = () => {
const [ notices, setNotices ] = useState( [
{
id: 'second-notice',
content: 'second notice content',
},
{
id: 'fist-notice',
content: 'first notice content',
},
] );

const removeNotice = ( id ) => {
setNotices( notices.filter( ( notice ) => notice.id !== id ) );
};

return <NoticeList notices={ notices } onRemove={ removeNotice } />;
};
```

PanelHeader({label,children}) X-Ref

`PanelHeader` renders the header for the `Panel`.
This is used by the `Panel` component under the hood,
so it does not typically need to be used.

UnforwardedPanel({header,className,children}, ref) X-Ref

No description

UnforwardedPanelBody(props, ref) X-Ref

No description

UnforwardedPanelRow({className,children}, ref) X-Ref

Internal dependencies

Placeholder(props) X-Ref

Renders a placeholder. Normally used by blocks to render their empty state.

```jsx
import { Placeholder } from '@wordpress/components';
import { more } from '@wordpress/icons';

const MyPlaceholder = () => <Placeholder icon={ more } label="Placeholder" />;
```

progress_bar_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

animateProgressBar(isRtl = false) X-Ref

Internal dependencies

UnforwardedProgressBar(props, ref) X-Ref

No description

buildTermsTree(flatTerms) X-Ref

Returns terms in a tree form.

param: flatTerms Array of terms in flat format.
return: Terms in tree format.

getSelectOptions(tree, level = 0) X-Ref

No description

TreeSelect(props) X-Ref

TreeSelect component is used to generate select input fields.

```jsx
import { TreeSelect } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyTreeSelect = () => {
const [ page, setPage ] = useState( 'p21' );

return (
<TreeSelect
__nextHasNoMarginBottom
label="Parent page"
noOptionLabel="No parent page"
onChange={ ( newPage ) => setPage( newPage ) }
selectedId={ page }
tree={ [
{
name: 'Page 1',
id: 'p1',
children: [
{ name: 'Descend 1 of page 1', id: 'p11' },
{ name: 'Descend 2 of page 1', id: 'p12' },
],
},
{
name: 'Page 2',
id: 'p2',
children: [
{
name: 'Descend 1 of page 2',
id: 'p21',
children: [
{
name: 'Descend 1 of Descend 1 of page 2',
id: 'p211',
},
],
},
],
},
] }
/>
);
}
```

AuthorSelect({__next40pxDefaultSize,label,noOptionLabel,authorList,selectedAuthorId,onChange: onChangeProp}) X-Ref

No description

CategorySelect({__next40pxDefaultSize,label,noOptionLabel,categoriesList,selectedCategoryId,onChange: onChangeProp,...props}) X-Ref

WordPress dependencies

isSingleCategorySelection(props) X-Ref

No description

isMultipleCategorySelection(props) X-Ref

No description

QueryControls({authorList,selectedAuthorId,numberOfItems,order,orderBy,maxItems = DEFAULT_MAX_ITEMS,minItems = DEFAULT_MIN_ITEMS,onAuthorChange,onNumberOfItemsChange,onOrderChange,onOrderByChange,...props}) X-Ref

Controls to query for posts.

```jsx
const MyQueryControls = () => (
<QueryControls
{ ...{ maxItems, minItems, numberOfItems, order, orderBy } }
onOrderByChange={ ( newOrderBy ) => {
updateQuery( { orderBy: newOrderBy } )
}
onOrderChange={ ( newOrder ) => {
updateQuery( { order: newOrder } )
}
categoriesList={ categories }
selectedCategoryId={ category }
onCategoryChange={ ( newCategory ) => {
updateQuery( { category: newCategory } )
}
onNumberOfItemsChange={ ( newNumberOfItems ) => {
updateQuery( { numberOfItems: newNumberOfItems } )
} }
/>
);
```

UnforwardedRadio({value,children,...props}, ref) X-Ref

No description

UnforwardedRadioGroup({label,checked,defaultChecked,disabled,onChange,children,...props}, ref) X-Ref

No description

generateOptionDescriptionId(radioGroupId, index) X-Ref

No description

generateOptionId(radioGroupId, index) X-Ref

No description

generateHelpId(radioGroupId) X-Ref

No description

RadioControl(props) X-Ref

Render a user interface to select the user type using radio inputs.

```jsx
import { RadioControl } from '@wordpress/components';
import { useState } from '@wordpress/element';

const MyRadioControl = () => {
const [ option, setOption ] = useState( 'a' );

return (
<RadioControl
label="User type"
help="The type of the current user"
selected={ option }
options={ [
{ label: 'Author', value: 'a' },
{ label: 'Editor', value: 'e' },
] }
onChange={ ( value ) => setOption( value ) }
/>
);
};
```

__() X-Ref

No description

Resizer() X-Ref

No description

__() X-Ref

No description

Resizable(props) X-Ref

No description

useResizeLabel({axis,fadeTimeout = 180,onResize = utils_noop,position = POSITIONS.bottom,showPx = false}) X-Ref

Custom hook that manages resize listener events. It also provides a label
based on current resize width x height values.

param: props
param: props.axis        Only shows the label corresponding to the axis.
param: props.fadeTimeout Duration (ms) before deactivating the resize label.
param: props.onResize    Callback when a resize occurs. Provides { width, height } callback.
param: props.position    Adjusts label value.
param: props.showPx      Whether to add `PX` to the label.
return: Properties for hook.

getSizeLabel({axis,height,moveX = false,moveY = false,position = POSITIONS.bottom,showPx = false,width}) X-Ref

Gets the resize label based on width and height values (as well as recent changes).

param: props
param: props.axis     Only shows the label corresponding to the axis.
param: props.height   Height value.
param: props.moveX    Recent width (x axis) changes.
param: props.moveY    Recent width (y axis) changes.
param: props.position Adjusts label value.
param: props.showPx   Whether to add `PX` to the label.
param: props.width    Width value.
return: The rendered label.

resize_tooltip_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

resize_tooltip_label_Label({label,position = POSITIONS.corner,zIndex = 1000,...props}, ref) X-Ref

No description

ResizeTooltip({axis,className,fadeTimeout = 180,isVisible = true,labelRef,onResize = resize_tooltip_noop,position = POSITIONS.bottom,showPx = true,zIndex = 1000,...props}, ref) X-Ref

No description

UnforwardedResizableBox({className,children,showHandle = true,__experimentalShowTooltip: showTooltip = false,__experimentalTooltipProps: tooltipProps = {},...props}, ref) X-Ref

No description

ResponsiveWrapper({naturalWidth,naturalHeight,children,isInline = false}) X-Ref

A wrapper component that maintains its aspect ratio when resized.

```jsx
import { ResponsiveWrapper } from '@wordpress/components';

const MyResponsiveWrapper = () => (
<ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>
<img
src="https://s.w.org/style/images/about/WordPress-logotype-standard.png"
alt="WordPress"
/>
</ResponsiveWrapper>
);
```

sendResize() X-Ref

No description

removeViewportStyles(ruleOrNode) X-Ref

No description

SandBox({html = '',title = '',type,styles = [],scripts = [],onFocus,tabIndex}) X-Ref

This component provides an isolated environment for arbitrary HTML via iframes.

```jsx
import { SandBox } from '@wordpress/components';

const MySandBox = () => (
<SandBox html="<p>Content</p>" title="SandBox" type="embed" />
);
```

isFrameAccessible() X-Ref

No description

trySandBox(forceRerender = false) X-Ref

No description

tryNoForceSandBox() X-Ref

No description

checkMessageForResize(event) X-Ref

No description

snackbar_useSpokenMessage(message, politeness) X-Ref

Custom hook which announces the message with the given politeness, if a
valid message is provided.

param: message Message to announce.
param: politeness Politeness to announce.

UnforwardedSnackbar({className,children,spokenMessage = children,politeness = 'polite',actions = [],onRemove,icon = null,explicitDismiss = false,onDismiss,listRef}, ref) X-Ref

No description

dismissMe(event) X-Ref

No description

onActionClick(event, onClick) X-Ref

No description

SnackbarList({notices,className,children,onRemove}) X-Ref

Renders a list of notices.

```jsx
const MySnackbarListNotice = () => (
<SnackbarList
notices={ notices }
onRemove={ removeNotice }
/>
);
```

spinner_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

UnforwardedSpinner({className,...props}, forwardedRef) X-Ref

No description

UnconnectedSurface(props, forwardedRef) X-Ref

No description

createTabStore(_a = {}) X-Ref

No description

useTabStoreProps(store, update, props) X-Ref

No description

useTabStore(props = {}) X-Ref

No description

useTabList2(_a) X-Ref

No description

useTabPanel2(_a) X-Ref

No description

UnforwardedTextControl(props, ref) X-Ref

Internal dependencies

UnforwardedTextareaControl(props, ref) X-Ref

No description

Tip(props) X-Ref

Internal dependencies

UnforwardedToggleControl({__nextHasNoMarginBottom,label,checked,help,className,onChange,disabled}, ref) X-Ref

No description

onChangeToggle(event) X-Ref

No description

useToolbarItem2(_a) X-Ref

No description

toolbar_item_ToolbarItem({children,as: Component,...props}, ref) X-Ref

Internal dependencies

toolbar_button_useDeprecatedProps({isDisabled,...otherProps}) X-Ref

No description

UnforwardedToolbarButton(props, ref) X-Ref

No description

ToolbarGroupCollapsed({controls = [],toggleProps,...props}) X-Ref

No description

isNestedArray(arr) X-Ref

No description

ToolbarGroup({controls = [],children,className,isCollapsed,title,...props}) X-Ref

Renders a collapsible group of controls

The `controls` prop accepts an array of sets. A set is an array of controls.
Controls have the following shape:

```
{
icon: string,
title: string,
subscript: string,
onClick: Function,
isActive: boolean,
isDisabled: boolean
}
```

For convenience it is also possible to pass only an array of controls. It is
then assumed this is the only set.

Either `controls` or `children` is required, otherwise this components
renders nothing.

param: props               Component props.
param: [props.controls]    The controls to render in this toolbar.
param: [props.children]    Any other things to render inside the toolbar besides the controls.
param: [props.className]   Class to set on the container div.
param: [props.isCollapsed] Turns ToolbarGroup into a dropdown menu.
param: [props.title]       ARIA label for dropdown menu if is collapsed.

createToolbarStore(props = {}) X-Ref

No description

useToolbarStoreProps(store, update, props) X-Ref

No description

useToolbarStore(props = {}) X-Ref

No description

useToolbar2(_a) X-Ref

No description

UnforwardedToolbarContainer({label,...props}, ref) X-Ref

Internal dependencies

UnforwardedToolbar({className,label,variant,...props}, ref) X-Ref

No description

ToolbarDropdownMenu(props, ref) X-Ref

No description

tools_panel_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

useToolsPanelHeader(props) X-Ref

No description

emptyMenuItems() X-Ref

No description

emptyState() X-Ref

No description

panelItemsReducer(panelItems, action) X-Ref

No description

menuItemOrderReducer(menuItemOrder, action) X-Ref

No description

menuItemsReducer(state, action) X-Ref

No description

panelReducer(state, action) X-Ref

No description

resetAllFiltersReducer(filters, action) X-Ref

No description

useToolsPanel(props) X-Ref

No description

useToolsPanelItem(props) X-Ref

No description

RovingTabIndex({children}) X-Ref

Provider for adding roving tab index behaviors to tree grid structures.

getRowFocusables(rowElement) X-Ref

Return focusables in a row element, excluding those from other branches
nested within the row.

param: rowElement The DOM element representing the row.
return: The array of focusables in the row.

UnforwardedTreeGrid({children,onExpandRow = () X-Ref

Renders both a table and tbody element, used to create a tree hierarchy.

UnforwardedTreeGridRow({children,level,positionInSet,setSize,isExpanded,...props}, ref) X-Ref

Internal dependencies

UnforwardedTreeGridItem({children,...props}, ref) X-Ref

Internal dependencies

UnforwardedTreeGridCell({children,withoutGridItem = false,...props}, ref) X-Ref

No description

stopPropagation(event) X-Ref

No description

useSlotFills(name) X-Ref

Internal dependencies

z_stack_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

UnconnectedZStack(props, forwardedRef) X-Ref

No description

useNavigateRegions(shortcuts = defaultShortcuts) X-Ref

No description

focusRegion(offset) X-Ref

No description

onClick() X-Ref

No description

withFilters(hookName) X-Ref

Creates a higher-order component which adds filtering capability to the
wrapped component. Filters get applied when the original component is about
to be mounted. When a filter is added or removed that matches the hook name,
the wrapped component re-renders.

param: hookName Hook name exposed to be used by filters.
return: Higher-order component factory.

ensureFilteredComponent() X-Ref

Initializes the FilteredComponent variable once, if not already
assigned. Subsequent calls are effectively a noop.

Class: FilteredComponentRenderer - X-Ref

onHooksUpdated(updatedHookName) X-Ref

When a filter is added or removed for the matching hook name, each
mounted instance should re-render with the new filters having been
applied to the original component.

param: updatedHookName Name of the hook that was updated.

isComponentLike(object) X-Ref

Returns true if the given object is component-like. An object is component-
like if it is an instance of wp.element.Component, or is a function.

param: object Object to test.
return: Whether object is component-like.

Component(props, ref) X-Ref

Override the default edit UI to include notices if supported.

Wrapping the original component with `withNotices` encapsulates the component
with the additional props `noticeOperations` and `noticeUI`.

```jsx
import { withNotices, Button } from '@wordpress/components';

const MyComponentWithNotices = withNotices(
( { noticeOperations, noticeUI } ) => {
const addError = () =>
noticeOperations.createErrorNotice( 'Error message' );
return (
<div>
{ noticeUI }
<Button variant="secondary" onClick={ addError }>
Add error
</Button>
</div>
);
}
);
```

param: OriginalComponent Original component.
return: Wrapped component.

createMenuStore(_a = {}) X-Ref

No description

useMenuStoreProps(store, update, props) X-Ref

No description

useMenuStore(props = {}) X-Ref

No description

getInitialFocus(event, dir) X-Ref

No description

hasActiveItem(items, excludeElement) X-Ref

No description

useMenuButton2(_a) X-Ref

No description

useAriaLabelledBy(_a) X-Ref

No description

useMenuList2(_a) X-Ref

No description

menuHasFocus(baseElement, items, currentTarget) X-Ref

No description

useMenuItem2(_a) X-Ref

No description

setMixed(element, mixed) X-Ref

No description

isNativeCheckbox(tagName, type) X-Ref

No description

getPrimitiveValue(value) X-Ref

No description

useCheckbox2(_a) X-Ref

No description

createCheckboxStore(props = {}) X-Ref

No description

useCheckboxStoreProps(store, update, props) X-Ref

No description

useCheckboxStore(props = {}) X-Ref

No description

menu_item_checkbox_getPrimitiveValue(value) X-Ref

No description

getValue(storeValue, value, checked) X-Ref

No description

useMenuItemCheckbox2(_a) X-Ref

No description

menu_item_radio_getValue(prevValue, value, checked) X-Ref

No description

useMenuItemRadio2(_a) X-Ref

No description

useMenuGroup2(props) X-Ref

No description

useMenuGroupLabel2(props) X-Ref

No description

useMenuSeparator2(_a) X-Ref

No description

dropdown_menu_v2_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

useTemporaryFocusVisibleFix({onBlur: onBlurProp}) X-Ref

WordPress dependencies

useMenuItemCheck2(_a) X-Ref

No description

theme_styles_EMOTION_STRINGIFIED_CSS_ERROR_() X-Ref

No description

generateThemeVariables(inputs) X-Ref

No description

validateInputs(inputs) X-Ref

No description

checkContrasts(inputs, outputs) X-Ref

No description

warnContrastIssues(issues) X-Ref

No description

generateAccentDependentColors(accent) X-Ref

No description

generateBackgroundDependentColors(background) X-Ref

No description

getForegroundForColor(color) X-Ref

No description

generateShades(background, foreground) X-Ref

No description

Theme({accent,background,className,...props}) X-Ref

`Theme` allows defining theme variables for components in the `@wordpress/components` package.

Multiple `Theme` components can be nested in order to override specific theme variables.

```jsx
const Example = () => {
return (
<Theme accent="red">
<Button variant="primary">I'm red</Button>
<Theme accent="blue">
<Button variant="primary">I'm blue</Button>
</Theme>
</Theme>
);
};
```

use_event_useEvent(callback) X-Ref

Creates a stable callback function that has access to the latest state and
can be used within event handlers and effect callbacks. Throws when used in
the render phase.

getElementOffsetRect(element) X-Ref

Returns the position and dimensions of an element, relative to its offset
parent, with subpixel precision. Values reflect the real measures before any
potential scaling distortions along the X and Y axes.

Useful in contexts where plain `getBoundingClientRect` calls or `ResizeObserver`
entries are not suitable, such as when the element is transformed, and when
`element.offset<Top|Left|Width|Height>` methods are not precise enough.

**Note:** in some contexts, like when the scale is 0, this method will fail
because it's impossible to calculate a scaling ratio. When that happens, it
will return `undefined`.

useTrackElementOffsetRect(targetElement) X-Ref

Tracks the position and dimensions of an element, relative to its offset
parent. The element can be changed dynamically.

**Note:** sometimes, the measurement will fail (see `getElementOffsetRect`'s
documentation for more details). When that happens, this hook will attempt
to measure again after a frame, and if that fails, it will poll every 100
milliseconds until it succeeds.

useOnValueUpdate(/*** The value to watch for changes.*/value,/*** Callback to fire when the value changes.*/onUpdate) X-Ref

Calls the `onUpdate` callback when the `value` changes.

Tabs({selectOnMove = true,defaultTabId,orientation = 'horizontal',onSelect,children,selectedTabId}) X-Ref

No description

Functions

Functions that are not part of a class:

isNonNullObject(value) X-Ref

No description

isSpecial(value) X-Ref

No description

isReactElement(value) X-Ref

No description

emptyTarget(val) X-Ref

No description

cloneUnlessOtherwiseSpecified(value, options) X-Ref

No description

defaultArrayMerge(target, source, options) X-Ref

No description

getMergeFunction(key, options) X-Ref

No description

getEnumerableOwnPropertySymbols(target) X-Ref

No description

getKeys(target) X-Ref

No description

propertyIsOnObject(object, property) X-Ref

No description

propertyIsUnsafe(target, key) X-Ref

No description

mergeObject(target, source, options) X-Ref

No description

deepmerge(target, source, options) X-Ref

No description

error(msg) X-Ref

No description

getAST() X-Ref

No description

matchListDefinitions() X-Ref

No description

matchDefinition() X-Ref

No description

matchGradient(gradientType, pattern, orientationMatcher) X-Ref

No description

matchCall(pattern, callback) X-Ref

No description

matchLinearOrientation() X-Ref

No description

matchSideOrCorner() X-Ref

No description

matchAngle() X-Ref

No description

matchListRadialOrientations() X-Ref

No description

matchRadialOrientation() X-Ref

No description

matchCircle() X-Ref

No description

matchEllipse() X-Ref

No description

matchExtentKeyword() X-Ref

No description

matchAtPosition() X-Ref

No description

matchPositioning() X-Ref

No description

matchCoordinates() X-Ref

No description

matchListing(matcher) X-Ref

No description

matchColorStop() X-Ref

No description

matchColor() X-Ref

No description

matchLiteralColor() X-Ref

No description

matchHexColor() X-Ref

No description

matchRGBColor() X-Ref

No description

matchRGBAColor() X-Ref

No description

matchNumber() X-Ref

No description

matchDistance() X-Ref

No description

matchPositionKeyword() X-Ref

No description

matchLength() X-Ref

No description

match(type, pattern, captureIndex) X-Ref

No description

scan(regexp) X-Ref

No description

consume(size) X-Ref

No description

__nested_webpack_require_187__(moduleId) X-Ref

No description

defaultSanitize(string) X-Ref

No description

escapeRegExpFn(string) X-Ref

No description

getStatics(component) X-Ref

No description

hoistNonReactStatics(targetComponent, sourceComponent, blacklist) X-Ref

No description

z(a) X-Ref

No description

matcher(match) X-Ref

No description

r(a) X-Ref

__webpack_require__(moduleId) X-Ref

No description

r(e) X-Ref

No description

noop(..._) X-Ref

No description

shallowEqual(a, b) X-Ref

No description

applyState(argument, currentValue) X-Ref

No description

isUpdater(argument) X-Ref

No description

isLazyValue(value) X-Ref

No description

isObject(arg) X-Ref

No description

isEmpty(arg) X-Ref

No description

isInteger(arg) X-Ref

No description

PBFD2E7P_hasOwnProperty(object, prop) X-Ref

No description

chain(...fns) X-Ref

No description

cx(...args) X-Ref

No description

normalizeString(str) X-Ref

No description

omit(object, keys) X-Ref

No description

pick(object, paths) X-Ref

No description

identity(value) X-Ref

No description

beforePaint(cb = noop) X-Ref

No description

afterPaint(cb = noop) X-Ref

No description

invariant(condition, message) X-Ref

No description

getKeys(obj) X-Ref

No description

isFalsyBooleanCallback(booleanOrCallback, ...args) X-Ref

No description

disabledFromProps(props) X-Ref

No description

removeUndefinedValues(obj) X-Ref

No description

defaultValue(...values) X-Ref

No description

setRef(ref, value) X-Ref

No description

isValidElementWithRef(element) X-Ref

No description

getRefProperty(element) X-Ref

No description

mergeProps(base, overrides) X-Ref

No description

checkIsBrowser() X-Ref

No description

getDocument(node) X-Ref

No description

getWindow(node) X-Ref

No description

getActiveElement(node, activeDescendant = false) X-Ref

No description

contains(parent, child) X-Ref

No description

isFrame(element) X-Ref

No description

isButton(element) X-Ref

No description

isVisible(element) X-Ref

No description

isTextField(element) X-Ref

No description

isTextbox(element) X-Ref

No description

getTextboxValue(element) X-Ref

No description

getTextboxSelection(element) X-Ref

No description

getPopupRole(element, fallback) X-Ref

No description

getPopupItemRole(element, fallback) X-Ref

No description

scrollIntoViewIfNeeded(element, arg) X-Ref

No description

getScrollingElement(element) X-Ref

No description

isPartiallyHidden(element) X-Ref

No description

setSelectionRange(element, ...args) X-Ref

No description

isTouchDevice() X-Ref

No description

isApple() X-Ref

No description

isSafari() X-Ref

No description

isFirefox() X-Ref

No description

isMac() X-Ref

No description

isPortalEvent(event) X-Ref

No description

isSelfTarget(event) X-Ref

No description

isOpeningInNewTab(event) X-Ref

No description

isDownloading(event) X-Ref

No description

fireEvent(element, type, eventInit) X-Ref

No description

fireBlurEvent(element, eventInit) X-Ref

No description

fireFocusEvent(element, eventInit) X-Ref

No description

fireKeyboardEvent(element, type, eventInit) X-Ref

No description

fireClickEvent(element, eventInit) X-Ref

No description

isFocusEventOutside(event, container) X-Ref

No description

getInputType(event) X-Ref

No description

queueBeforeEvent(element, type, callback, timeout) X-Ref

No description

addGlobalEventListener(type, listener, options, scope = window) X-Ref

No description

useInitialValue(value) X-Ref

No description

useLazyValue(init) X-Ref

No description

useLiveRef(value) X-Ref

No description

usePreviousValue(value) X-Ref

No description

useEvent(callback) X-Ref

No description

useTransactionState(callback) X-Ref

No description

useMergeRefs(...refs) X-Ref

No description

useId(defaultId) X-Ref

No description

useDeferredValue(value) X-Ref

No description

useTagName(refOrElement, type) X-Ref

No description

useAttribute(refOrElement, attributeName, defaultValue) X-Ref

No description

useUpdateEffect(effect, deps) X-Ref

No description

useUpdateLayoutEffect(effect, deps) X-Ref

No description

useForceUpdate() X-Ref

No description

useBooleanEvent(booleanOrCallback) X-Ref

No description

useWrapElement(props, callback, deps = []) X-Ref

No description

usePortalRef(portalProp = false, portalRefProp) X-Ref

No description

useMetadataProps(props, key, value) X-Ref

No description

useIsMouseMoving() X-Ref

No description

hasMouseMovement(event) X-Ref

No description

setMouseMoving(event) X-Ref

No description

resetMouseMoving() X-Ref

No description

getInternal(store, key) X-Ref

No description

createStore(initialState, ...stores) X-Ref

No description

setup(store, ...args) X-Ref

No description

init(store, ...args) X-Ref

No description

subscribe(store, ...args) X-Ref

No description

sync(store, ...args) X-Ref

No description

batch(store, ...args) X-Ref

No description

omit2(store, ...args) X-Ref

No description

pick2(store, ...args) X-Ref

No description

mergeStore(...stores) X-Ref

No description

throwOnConflictingProps(props, store) X-Ref

No description

useStoreState(store, keyOrSelector = identity) X-Ref

No description

useStoreProps(store, props, key, setKey) X-Ref

No description

_2GXGCHW6_useStore(createStore, props) X-Ref

No description

useCollectionStoreProps(store, update, props) X-Ref

No description

useCollectionStore(props = {}) X-Ref

No description

isElementPreceding(a, b) X-Ref

No description

sortBasedOnDOMPosition(items) X-Ref

No description

getCommonParent(items) X-Ref

No description

getPrivateStore(store) X-Ref

No description

createCollectionStore(props = {}) X-Ref

No description

toArray(arg) X-Ref

No description

addItemToArray(array, item, index = -1) X-Ref

No description

flatten2DArray(array) X-Ref

No description

reverseArray(array) X-Ref

No description

findFirstEnabledItem(items, excludeId) X-Ref

No description

getEnabledItems(items, excludeId) X-Ref

No description

getOppositeOrientation(orientation) X-Ref

No description

getItemsInRow(items, rowId) X-Ref

No description

flipItems(items, activeId, shouldInsertNullItem = false) X-Ref

No description

groupItemsByRows(items) X-Ref

No description

getMaxRowLength(array) X-Ref

No description

createEmptyItem(rowId) X-Ref

No description

normalizeRows(rows, activeId, focusShift) X-Ref

No description

verticalizeItems(items) X-Ref

No description

createCompositeStore(props = {}) X-Ref

No description

useCompositeStoreProps(store, update, props) X-Ref

No description

useCompositeStore(props = {}) X-Ref

No description

_5VQZOHHZ_flipItems(items, activeId, shouldInsertNullItem = false) X-Ref

No description

_5VQZOHHZ_findFirstEnabledItem(items, excludeId) X-Ref

No description

getEnabledItem(store, id) X-Ref

No description

_5VQZOHHZ_groupItemsByRows(items) X-Ref

No description

selectTextField(element, collapseToEnd = false) X-Ref

No description

focusSilently(element) X-Ref

No description

silentlyFocused(element) X-Ref

No description

isItem(store, element, exclude) X-Ref

No description

forwardRef2(render) X-Ref

No description

memo2(Component, propsAreEqual) X-Ref

No description

HKOOKEDE_createElement(Type, props) X-Ref

No description

createHook(useProps) X-Ref

No description

createStoreContext(providers = [], scopedProviders = []) X-Ref

No description

hasNegativeTabIndex(element) X-Ref

No description

isFocusable(element) X-Ref

No description

isTabbable(element) X-Ref

No description

getAllFocusableIn(container, includeContainer) X-Ref

No description

getAllFocusable(includeBody) X-Ref

No description

getFirstFocusableIn(container, includeContainer) X-Ref

No description

getFirstFocusable(includeBody) X-Ref

No description

getAllTabbableIn(container, includeContainer, fallbackToFocusable) X-Ref

No description

getAllTabbable(fallbackToFocusable) X-Ref

No description

getFirstTabbableIn(container, includeContainer, fallbackToFocusable) X-Ref

No description

getFirstTabbable(fallbackToFocusable) X-Ref

No description

getLastTabbableIn(container, includeContainer, fallbackToFocusable) X-Ref

No description

getLastTabbable(fallbackToFocusable) X-Ref

No description

getNextTabbableIn(container, includeContainer, fallbackToFirst, fallbackToFocusable) X-Ref

No description

getNextTabbable(fallbackToFirst, fallbackToFocusable) X-Ref

No description

getPreviousTabbableIn(container, includeContainer, fallbackToLast, fallbackToFocusable) X-Ref

No description

getPreviousTabbable(fallbackToFirst, fallbackToFocusable) X-Ref

No description

getClosestFocusable(element) X-Ref

No description

hasFocus(element) X-Ref

No description

hasFocusWithin(element) X-Ref

No description

focusIfNeeded(element) X-Ref

No description

disableFocus(element) X-Ref

No description

disableFocusIn(container, includeContainer) X-Ref

No description

restoreFocusIn(container) X-Ref

No description

focusIntoView(element, options) X-Ref

No description

isSafariFocusAncestor(element) X-Ref

No description

markSafariFocusAncestor(element, value) X-Ref

No description

isAlwaysFocusVisible(element) X-Ref

No description

getLabels(element) X-Ref

No description

isNativeCheckboxOrRadio(element) X-Ref

No description

isNativeTabbable(tagName) X-Ref

No description

supportsDisabledAttribute(tagName) X-Ref

No description

getTabIndex(focusable, trulyDisabled, nativeTabbable, supportsDisabled, tabIndexProp) X-Ref

No description

useDisableEvent(onEvent, disabled) X-Ref

No description

onGlobalMouseDown(event) X-Ref

No description

onGlobalKeyDown(event) X-Ref

No description

useFocusable2(_a) X-Ref

No description

isGrid(items) X-Ref

No description

isPrintableKey(event) X-Ref

No description

isModifierKey(event) X-Ref

No description

useKeyboardEventProxy(store, onKeyboardEvent, previousElementRef) X-Ref

No description

findFirstEnabledItemInTheLastRow(items) X-Ref

No description

useScheduleFocus(store) X-Ref

No description

useComposite2(_a) X-Ref

No description

useGroup2(props) X-Ref

No description

useCompositeGroup2(_a) X-Ref

No description

useGroupLabel2(props) X-Ref

No description

useCollectionItem2(_a) X-Ref

No description

isNativeClick(event) X-Ref

No description

useCommand2(_a) X-Ref

No description

isEditableElement(element) X-Ref

No description

getNextPageOffset(scrollingElement, pageUp = false) X-Ref

No description

getItemOffset(itemElement, pageUp = false) X-Ref

No description

findNextPageItemId(element, store, next, pageUp = false) X-Ref

No description

targetIsAnotherItem(event, store) X-Ref

No description

useCompositeItem2(_a) X-Ref

No description

useCompositeRow2(_a) X-Ref

No description

createDisclosureStore(props = {}) X-Ref

No description

useDisclosureStoreProps(store, update, props) X-Ref

No description

useDisclosureStore(props = {}) X-Ref

No description

createDialogStore(props = {}) X-Ref

No description

useDialogStoreProps(store, update, props) X-Ref

No description

useDialogStore(props = {}) X-Ref

No description

usePopoverStoreProps(store, update, props) X-Ref

No description

usePopoverStore(props = {}) X-Ref

No description

useHovercardStoreProps(store, update, props) X-Ref

No description

useHovercardStore(props = {}) X-Ref

No description

createPopoverStore(_a = {}) X-Ref

No description

createHovercardStore(props = {}) X-Ref

No description

createTooltipStore(props = {}) X-Ref

No description

useTooltipStoreProps(store, update, props) X-Ref

No description

useTooltipStore(props = {}) X-Ref

No description

useRole2(props) X-Ref

No description

Role2(props) X-Ref

No description

useHovercardAnchor2(_a) X-Ref

No description

createRemoveStoreCallback(store) X-Ref

No description

useTooltipAnchor2(_a) X-Ref

No description

getEventPoint(event) X-Ref

No description

isPointInPolygon(point, polygon) X-Ref

No description

getEnterPointPlacement(enterPoint, rect) X-Ref

No description

getElementPolygon(element, enterPoint) X-Ref

No description

_63XF7ACK_isBackdrop(element, ...ids) X-Ref

No description

orchestrate(element, key, setup) X-Ref

No description

setAttribute(element, attr, value) X-Ref

No description

setProperty(element, property, value) X-Ref

No description

assignStyle(element, style) X-Ref

No description

setCSSProperty(element, property, value) X-Ref

No description

getSnapshotPropertyName(id) X-Ref

No description

inSnapshot(id, element) X-Ref

No description

isValidElement(id, element, ignoredElements) X-Ref

No description

AOUGVQZ3_walkTreeOutside(id, elements, callback, ancestorCallback) X-Ref

No description

createWalkTreeSnapshot(id, elements) X-Ref

No description

getPropertyName(id = "", ancestor = false) X-Ref

No description

markElement(element, id = "") X-Ref

No description

markAncestor(element, id = "") X-Ref

No description

isElementMarked(element, id) X-Ref

No description

markTreeOutside(id, elements) X-Ref

No description

afterTimeout(timeoutMs, cb) X-Ref

No description

BSEL4YAF_afterPaint(cb) X-Ref

No description

parseCSSTime(...times) X-Ref

No description

isHidden(mounted, hidden, alwaysVisible) X-Ref

No description

DialogBackdrop({store,backdrop,alwaysVisible,hidden}) X-Ref

No description

hideElementFromAccessibilityTree(element) X-Ref

No description

disableAccessibilityTreeOutside(id, elements) X-Ref

No description

supportsInert() X-Ref

No description

disableTree(element, ignoredElements) X-Ref

No description

disableTreeOutside(id, elements) X-Ref

No description

useRootDialog({attribute,contentId,contentElement,enabled}) X-Ref

No description

getPaddingProperty(documentElement) X-Ref

No description

usePreventBodyScroll(contentElement, contentId, enabled) X-Ref

No description

useNestedDialogs(store) X-Ref

No description

usePreviousMouseDownRef(enabled) X-Ref

No description

isInDocument(target) X-Ref

No description

isDisclosure(disclosure, target) X-Ref

No description

isMouseEventOnDialog(event, dialog) X-Ref

No description

useEventOutside({store,type,listener,capture,domReady}) X-Ref

No description

shouldHideOnInteractOutside(hideOnInteractOutside, event) X-Ref

No description

useHideOnInteractOutside(store, hideOnInteractOutside, domReady) X-Ref

No description

prependHiddenDismiss(container, onClick) X-Ref

No description

HeadingLevel({ level, children }) X-Ref

No description

useVisuallyHidden2(props) X-Ref

No description

useFocusTrap2(props) X-Ref

No description

getRootElement(element) X-Ref

No description

getPortalElement(element, portalElement) X-Ref

No description

getRandomId(prefix = "id") X-Ref

No description

queueFocus(element) X-Ref

No description

isAlreadyFocusingAnotherElement(dialog) X-Ref

No description

getElementFromProp(prop, focusable = false) X-Ref

No description

createDialogComponent(Component, useProviderContext = useDialogProviderContext) X-Ref

No description

clamp(start, value, end) X-Ref

No description

floating_ui_utils_evaluate(value, param) X-Ref

No description

floating_ui_utils_getSide(placement) X-Ref

No description

floating_ui_utils_getAlignment(placement) X-Ref

No description

getOppositeAxis(axis) X-Ref

No description

getAxisLength(axis) X-Ref

No description

floating_ui_utils_getSideAxis(placement) X-Ref

No description

getAlignmentAxis(placement) X-Ref

No description

floating_ui_utils_getAlignmentSides(placement, rects, rtl) X-Ref

No description

getExpandedPlacements(placement) X-Ref

No description

floating_ui_utils_getOppositeAlignmentPlacement(placement) X-Ref

No description

getSideList(side, isStart, rtl) X-Ref

No description

getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) X-Ref

No description

getOppositePlacement(placement) X-Ref

No description

expandPaddingObject(padding) X-Ref

No description

floating_ui_utils_getPaddingObject(padding) X-Ref

No description

floating_ui_utils_rectToClientRect(rect) X-Ref

No description

computeCoordsFromPlacement(_ref, placement, rtl) X-Ref

No description

getPlacementList(alignment, autoAlignment, allowedPlacements) X-Ref

No description

getSideOffsets(overflow, rect) X-Ref

No description

isAnySideFullyClipped(overflow) X-Ref

No description

getBoundingRect(rects) X-Ref

No description

getRectsByLine(rects) X-Ref

No description

getBoundingClientRect() X-Ref

No description

floating_ui_utils_clamp(start, value, end) X-Ref

No description

dist_floating_ui_utils_evaluate(value, param) X-Ref

No description

dist_floating_ui_utils_getSide(placement) X-Ref

No description

dist_floating_ui_utils_getAlignment(placement) X-Ref

No description

floating_ui_utils_getOppositeAxis(axis) X-Ref

No description

floating_ui_utils_getAxisLength(axis) X-Ref

No description

dist_floating_ui_utils_getSideAxis(placement) X-Ref

No description

floating_ui_utils_getAlignmentAxis(placement) X-Ref

No description

dist_floating_ui_utils_getAlignmentSides(placement, rects, rtl) X-Ref

No description

floating_ui_utils_getExpandedPlacements(placement) X-Ref

No description

dist_floating_ui_utils_getOppositeAlignmentPlacement(placement) X-Ref

No description

floating_ui_utils_getSideList(side, isStart, rtl) X-Ref

No description

floating_ui_utils_getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) X-Ref

No description

floating_ui_utils_getOppositePlacement(placement) X-Ref

No description

floating_ui_utils_expandPaddingObject(padding) X-Ref

No description

dist_floating_ui_utils_getPaddingObject(padding) X-Ref

No description

dist_floating_ui_utils_rectToClientRect(rect) X-Ref

No description

hasWindow() X-Ref

No description

getNodeName(node) X-Ref

No description

floating_ui_utils_dom_getWindow(node) X-Ref

No description

getDocumentElement(node) X-Ref

No description

isNode(value) X-Ref

No description

isElement(value) X-Ref

No description

isHTMLElement(value) X-Ref

No description

isShadowRoot(value) X-Ref

No description

isOverflowElement(element) X-Ref

No description

isTableElement(element) X-Ref

No description

isTopLayer(element) X-Ref

No description

isContainingBlock(elementOrCss) X-Ref

No description

getContainingBlock(element) X-Ref

No description

isWebKit() X-Ref

No description

isLastTraversableNode(node) X-Ref

No description

floating_ui_utils_dom_getComputedStyle(element) X-Ref

No description

getNodeScroll(element) X-Ref

No description

getParentNode(node) X-Ref

No description

getNearestOverflowAncestor(node) X-Ref

No description

getOverflowAncestors(node, list, traverseIframes) X-Ref

No description

getFrameElement(win) X-Ref

No description

getCssDimensions(element) X-Ref

No description

unwrapElement(element) X-Ref

No description

getScale(element) X-Ref

No description

getVisualOffsets(element) X-Ref

No description

shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) X-Ref

No description

getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) X-Ref

No description

floating_ui_dom_isTopLayer(floating) X-Ref

No description

convertOffsetParentRelativeRectToViewportRelativeRect(_ref) X-Ref

No description

getClientRects(element) X-Ref

No description

getWindowScrollBarX(element) X-Ref

No description

getDocumentRect(element) X-Ref

No description

getViewportRect(element, strategy) X-Ref

No description

getInnerBoundingClientRect(element, strategy) X-Ref

No description

getClientRectFromClippingAncestor(element, clippingAncestor, strategy) X-Ref

No description

hasFixedPositionAncestor(element, stopNode) X-Ref

No description

getClippingElementAncestors(element, cache) X-Ref

No description

getClippingRect(_ref) X-Ref

No description

getDimensions(element) X-Ref

No description

getRectRelativeToOffsetParent(element, offsetParent, strategy) X-Ref

No description

getTrueOffsetParent(element, polyfill) X-Ref

No description

getOffsetParent(element, polyfill) X-Ref

No description

isRTL(element) X-Ref

No description

observeMove(element, onMove) X-Ref

No description

cleanup() X-Ref

No description

refresh(skip, threshold) X-Ref

No description

handleObserve(entries) X-Ref

No description

autoUpdate(reference, floating, update, options) X-Ref

Automatically updates the position of the floating element when necessary.
Should only be called when the floating element is mounted on the DOM or
visible on the screen.

returns: cleanup function that should be invoked when the floating element is

frameLoop() X-Ref

No description

createDOMRect(x = 0, y = 0, width = 0, height = 0) X-Ref

No description

getDOMRect(anchorRect) X-Ref

No description

getAnchorElement(anchorElement, getAnchorRect) X-Ref

No description

isValidPlacement(flip2) X-Ref

No description

roundByDPR(value) X-Ref

No description

getOffsetMiddleware(arrowElement, props) X-Ref

No description

getFlipMiddleware(props) X-Ref

No description

getShiftMiddleware(props) X-Ref

No description

getSizeMiddleware(props) X-Ref

No description

getArrowMiddleware(arrowElement, props) X-Ref

No description

usePopover2(_a) X-Ref

No description

isMovingOnHovercard(target, card, anchor, nested) X-Ref

No description

useAutoFocusOnHide(_a) X-Ref

No description

useHovercard2(_a) X-Ref

No description

useTooltip2(_a) X-Ref

No description

Shortcut(props) X-Ref

Shortcut component is used to display keyboard shortcuts, and it can be customized with a custom display and aria label if needed.

```jsx
import { Shortcut } from '@wordpress/components';

const MyShortcut = () => {
return (
<Shortcut shortcut={{ display: 'Ctrl + S', ariaLabel: 'Save' }} />
);
};
```

isTopBottom(anchorRef) X-Ref

No description

isRef(anchorRef) X-Ref

No description

UnforwardedTooltip(props, ref) X-Ref

No description

addDescribedById(element) X-Ref

No description

is_plain_object_isObject(o) X-Ref

No description

isPlainObject(o) X-Ref

No description

use_update_effect_useUpdateEffect(effect, deps) X-Ref

A `React.useEffect` that will not run on the first render.
Source:
https://github.com/ariakit/ariakit/blob/main/packages/ariakit-react-core/src/utils/hooks.ts

param: {import('react').EffectCallback} effect
param: {import('react').DependencyList} deps

useContextSystemBridge({value}) X-Ref

Consolidates incoming ContextSystem values with a (potential) parent ContextSystem value.

Note: This function will warn if it detects an un-memoized `value`

param: {Object} props
param: {Record<string, any>} props.value
return: {Record<string, any>} The consolidated value.

getNamespace(componentName) X-Ref

Creates a dedicated context namespace HTML attribute for components.
ns is short for "namespace"

param: {string} componentName The name for the component.
return: {Record<string, any>} A props object with the namespaced HTML attribute.

getConnectedNamespace() X-Ref

Creates a dedicated connected context namespace HTML attribute for components.
ns is short for "namespace"

return: {Record<string, any>} A props object with the namespaced HTML attribute.

__extends(d, b) X-Ref

No description

__() X-Ref

No description

__rest(s, e) X-Ref

No description

__decorate(decorators, target, key, desc) X-Ref

No description

__param(paramIndex, decorator) X-Ref

No description

__esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) X-Ref

No description

accept(f) X-Ref

No description

__runInitializers(thisArg, initializers, value) X-Ref

No description

__propKey(x) X-Ref

No description

__setFunctionName(f, name, prefix) X-Ref

No description

__metadata(metadataKey, metadataValue) X-Ref

No description

__awaiter(thisArg, _arguments, P, generator) X-Ref

No description

adopt(value) X-Ref

No description

fulfilled(value) X-Ref

No description

rejected(value) X-Ref

No description

step(result) X-Ref

No description

__generator(thisArg, body) X-Ref

No description

verb(n) X-Ref

No description

step(op) X-Ref

No description

__exportStar(m, o) X-Ref

No description

__values(o) X-Ref

No description

__read(o, n) X-Ref

No description

__spread() X-Ref

No description

__spreadArrays() X-Ref

No description

__spreadArray(to, from, pack) X-Ref

No description

__await(v) X-Ref

No description

__asyncGenerator(thisArg, _arguments, generator) X-Ref

No description

awaitReturn(f) X-Ref

No description

verb(n, f) X-Ref

No description

resume(n, v) X-Ref

No description

step(r) X-Ref

No description

fulfill(value) X-Ref

No description

reject(value) X-Ref

No description

settle(f, v) X-Ref

No description

__asyncDelegator(o) X-Ref

No description

verb(n, f) X-Ref

No description

__asyncValues(o) X-Ref

No description

verb(n) X-Ref

No description

settle(resolve, reject, d, v) X-Ref

No description

__makeTemplateObject(cooked, raw) X-Ref

No description

__importStar(mod) X-Ref

No description

__importDefault(mod) X-Ref

No description

__classPrivateFieldGet(receiver, state, kind, f) X-Ref

No description

__classPrivateFieldSet(receiver, state, value, kind, f) X-Ref

No description

__classPrivateFieldIn(state, receiver) X-Ref

No description

__addDisposableResource(env, value, async) X-Ref

No description

__disposeResources(env) X-Ref

No description

fail(e) X-Ref

No description

next() X-Ref

No description

localeLowerCase(str, locale) X-Ref

Localized lower case.

lowerCase(str) X-Ref

Lower case as a function.

noCase(input, options) X-Ref

Normalize the string into something other libraries can manipulate easier.

dist_es2015_replace(input, re, value) X-Ref

Replace `re` in the input string with the replacement value.

dotCase(input, options) X-Ref

No description

paramCase(input, options) X-Ref

No description

memize(fn, options) X-Ref

Accepts a function to be memoized, and returns a new memoized function, with
optional options.

param: {F} fn Function to memoize.
param: {MemizeOptions} [options] Options object.
return: {((...args: Parameters<F>) => ReturnType<F>) & MemizeMemoizedFunction} Memoized function.

memoized() X-Ref

No description

getStyledClassName(namespace) X-Ref

Generates the connected component CSS className based on the namespace.

param: namespace The name of the connected component.
return: The generated CSS className.

sheetForTag(tag) X-Ref

No description

createStyleElement(options) X-Ref

No description

StyleSheet(options) X-Ref

No description

hash(value, length) X-Ref

param: {string} value
param: {number} length
return: {number}

trim(value) X-Ref

param: {string} value
return: {string}

Utility_match(value, pattern) X-Ref

param: {string} value
param: {RegExp} pattern
return: {string?}

Utility_replace(value, pattern, replacement) X-Ref

param: {string} value
param: {(string|RegExp)} pattern
param: {string} replacement
return: {string}

indexof(value, search) X-Ref

param: {string} value
param: {string} search
return: {number}

Utility_charat(value, index) X-Ref

param: {string} value
param: {number} index
return: {number}

Utility_substr(value, begin, end) X-Ref

param: {string} value
param: {number} begin
param: {number} end
return: {string}

Utility_strlen(value) X-Ref

param: {string} value
return: {number}

Utility_sizeof(value) X-Ref

param: {any[]} value
return: {number}

Utility_append(value, array) X-Ref

param: {any} value
param: {any[]} array
return: {any}

Utility_combine(array, callback) X-Ref

param: {string[]} array
param: {function} callback
return: {string}

node(value, root, parent, type, props, children, length) X-Ref

param: {string} value
param: {object | null} root
param: {object | null} parent
param: {string} type
param: {string[] | string} props
param: {object[] | string} children
param: {number} length

Tokenizer_copy(root, props) X-Ref

param: {object} root
param: {object} props
return: {object}

Tokenizer_char() X-Ref

return: {number}

prev() X-Ref

return: {number}

next() X-Ref

return: {number}

peek() X-Ref

return: {number}

caret() X-Ref

return: {number}

slice(begin, end) X-Ref

param: {number} begin
param: {number} end
return: {string}

token(type) X-Ref

param: {number} type
return: {number}

alloc(value) X-Ref

param: {string} value
return: {any[]}

dealloc(value) X-Ref

param: {any} value
return: {any}

delimit(type) X-Ref

param: {number} type
return: {string}

Tokenizer_tokenize(value) X-Ref

param: {string} value
return: {string[]}

whitespace(type) X-Ref

param: {number} type
return: {string}

tokenizer(children) X-Ref

param: {string[]} children
return: {string[]}

escaping(index, count) X-Ref

param: {number} index
param: {number} count
return: {string}

delimiter(type) X-Ref

param: {number} type
return: {number}

commenter(type, index) X-Ref

param: {number} type
param: {number} index
return: {number}

identifier(index) X-Ref

No description

Serializer_serialize(children, callback) X-Ref

param: {object[]} children
param: {function} callback
return: {string}

stringify(element, index, children, callback) X-Ref

param: {object} element
param: {number} index
param: {object[]} children
param: {function} callback
return: {string}

middleware(collection) X-Ref

param: {function[]} collection
return: {function}

rulesheet(callback) X-Ref

param: {function} callback
return: {function}

prefixer(element, index, children, callback) X-Ref

param: {object} element
param: {number} index
param: {object[]} children
param: {function} callback

namespace(element) X-Ref

param: {object} element
param: {number} index
param: {object[]} children

compile(value) X-Ref

param: {string} value
return: {object[]}

parse(value, root, parent, rule, rules, rulesets, pseudo, points, declarations) X-Ref

param: {string} value
param: {object} root
param: {object?} parent
param: {string[]} rule
param: {string[]} rules
param: {string[]} rulesets
param: {number[]} pseudo
param: {number[]} points
param: {string[]} declarations
return: {object}

ruleset(value, root, parent, index, offset, rules, points, type, props, children, length) X-Ref

param: {string} value
param: {object} root
param: {object?} parent
param: {number} index
param: {number} offset
param: {string[]} rules
param: {number[]} points
param: {string} type
param: {string[]} props
param: {string[]} children
param: {number} length
return: {object}

comment(value, root, parent) X-Ref

param: {number} value
param: {object} root
param: {object?} parent
return: {object}

declaration(value, root, parent, length) X-Ref

param: {string} value
param: {object} root
param: {object?} parent
param: {number} length
return: {object}

emotion_cache_browser_esm_prefix(value, length) X-Ref

No description

murmur2(str) X-Ref

No description

memoize(fn) X-Ref

No description

handleInterpolation(mergedProps, registered, interpolation) X-Ref

No description

createStringFromObject(mergedProps, registered, obj) X-Ref

No description

withTheme(Component) X-Ref

No description

emotion_utils_browser_esm_getRegisteredStyles(registered, registeredStyles, classNames) X-Ref

No description

insertWithoutScoping(cache, serialized) X-Ref

No description

merge(registered, css, className) X-Ref

No description

useContextSystem(props, namespace) X-Ref

Custom hook that derives registered props from the Context system.
These derived props are then consolidated with incoming component props.

param: {P} props Incoming props from the component.
param: {string} namespace The namespace to register and to derive context props from.
return: {ConnectedProps<P>} The connected props.

contextConnect(Component, namespace) X-Ref

Forwards ref (React.ForwardRef) and "Connects" (or registers) a component
within the Context system under a specified namespace.

param: Component The component to register into the Context system.
param: namespace The namespace to register the component under.
return: The connected WordPressComponent

contextConnectWithoutRef(Component, namespace) X-Ref

"Connects" (or registers) a component within the Context system under a specified namespace.
Does not forward a ref.

param: Component The component to register into the Context system.
param: namespace The namespace to register the component under.
return: The connected WordPressComponent

_contextConnect(Component, namespace, options) X-Ref

No description

getConnectNamespace(Component) X-Ref

Attempts to retrieve the connected namespace from a component.

param: Component The component to retrieve a namespace from.
return: The connected namespaces.

hasConnectNamespace(Component, match) X-Ref

Checks to see if a component is connected within the Context system.

param: Component The component to retrieve a namespace from.
param: match The namespace to check.

extends_extends() X-Ref

No description

UnforwardedView({as,...restProps}, ref) X-Ref

No description

UnconnectedVisuallyHidden(props, forwardedRef) X-Ref

No description

normalize(value) X-Ref

Normalizes and transforms an incoming value to better match the alignment values

param: value An alignment value to parse.
return: The parsed value.

getItemId(prefixId, value) X-Ref

Creates an item ID based on a prefix ID and an alignment value.

param: prefixId An ID to prefix.
param: value An alignment value.
return: The item id.

getItemValue(prefixId, id) X-Ref

Extracts an item value from its ID

param: prefixId An ID prefix to remove
param: id An item ID
return: The item value

getAlignmentIndex(alignment = 'center') X-Ref

Retrieves the alignment index from a value.

param: alignment Value to check.
return: The index of a matching alignment.

emotion_react_browser_esm_css() X-Ref

No description

emotion_react_browser_esm_merge(registered, css, className) X-Ref

No description

space(value) X-Ref

A function that handles numbers, numeric strings, and unit values.

When given a number or a numeric string, it will return the grid-based
value as a factor of GRID_BASE, defined above.

When given a unit value or one of the named CSS values like `auto`,
it will simply return the value back.

param: value A number, numeric string, or a unit value.

_EMOTION_STRINGIFIED_CSS_ERROR__() X-Ref

No description

cell_Cell({id,value,...props}) X-Ref

No description

AlignmentMatrixControlIcon({className,disablePointerEvents = true,size,width,height,style = {},value = 'center',...props}) X-Ref

No description

UnforwardedAlignmentMatrixControl({className,id,label = (0,external_wp_i18n_namespaceObject.__) X-Ref

No description

getDefaultOrigin(type) X-Ref

param: type The animation type
return: Default origin

getAnimateClassName(options) X-Ref

param: options
return: ClassName that applies the animations

Animate({type,options = {},children}) X-Ref

Simple interface to introduce animations to components.

```jsx
import { Animate, Notice } from '@wordpress/components';

const MyAnimatedNotice = () => (
<Animate type="slide-in" options={ { origin: 'top' } }>
{ ( { className } ) => (
<Notice className={ className } status="success">
<p>Animation finished.</p>
</Notice>
) }
</Animate>
);
```

File Size:	71712 lines (2348 kb)
Included or required:	0 times
Referenced:	0 times
Includes or requires:	0 files

PHP Cross Reference of WordPress Trunk (Updated Daily)

/wp-includes/js/dist/ -> components.js (summary)

Defines 41 classes

Defines 46 functions