<!-- This file is auto-generated by the docs:generate-viewhelper-docs command. Do not edit directly -->

# ui:useProps

**Reference:** [View Source](https://github.com/jramke/fluid-primitives/tree/main/Classes/ViewHelpers/UsePropsViewHelper.php)

Use props from another component.

This ViewHelper allows you to import all props from another component and register them for the current component. This is helpful/needed when consuming the `primitives` components or when you want to reuse props from another component.

You can also override default values of the imported props by passing a `defaults` array with key-value pairs.

## Examples

`Tooltip/Root.html` that uses the tooltip primitive:
```html
<ui:useProps name="primitives:tooltip.root" defaults="{openDelay: 200}" />

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

If you dont want all props from a component, you can also selectively import props by passing an array of prop names to the `props` argument.
```html
<ui:useProps name="primitives:tooltip.root" props="{0: 'openDelay', 1: 'closeDelay'}" />

// ...
```

## Limitation

Currently its not possible to use this `useProps` and `spreadProps` pattern with required arguments because of how Fluid parses the templates. If a prop for a primitive is required, we use the `requiredAtRuntime` argument on the [ui:prop](./prop) ViewHelper.

## Arguments

| Name | Type | Description | Required | Default |
|------|------|-------------|----------|--------|
| `name` | string | Name of component to use the props from | Yes | - |
| `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 | [] |
