ui:useProps

Imports the props of another component, so that a wrapper around a primitive declares and forwards them without listing each one.

A tooltip root that opens after 200 ms by default:

<ui:useProps name="primitives:tooltip.root" as="rootProps" defaults="{openDelay: 200}" />

<primitives:tooltip.root spreadProps="{rootProps}">
    <f:slot />
</primitives:tooltip.root>

as binds the imported prop names to a variable that you pass to spreadProps of the component you render. Omit as to reuse the props of a component without rendering it, see Inheriting Props.

Import only some props

Pass the prop names to props:

<ui:useProps name="primitives:tooltip.root" as="rootProps" props="{0: 'openDelay', 1: 'closeDelay'}" />

Require a prop of a wrapped component

A prop forwarded with ui:useProps and spreadProps cannot be a required argument, because Fluid checks required arguments while it parses the template. Declare such a prop with requiredAtRuntime on ui:prop. The component then throws an exception at render time when the prop is missing.

Arguments

Name	Type	Description	Required	Default
`name`	string	Name of component to use the props from	Yes	-
`as`	string	Bind the imported, forwardable prop names under this name, so the actual delegate call can use spreadProps="{name}". Needed to delegate rendering. Omit it to only reuse the prop declarations of the referenced component without rendering it.	No	-
`defaults`	array	Default values for props to override the imported ones. Key-value pairs	No	[]
`props`	array	Only use a subset of props from the referenced component. Value should be an array of prop names.	No	[]