headless

API floatingUI

createFloatingUI

function

createFloatingUI(propsConfig?): FloatingUI

Create a floating UI service.

The returned service includes the patch method to patch the states, the stores to track the states and directives to apply.

Parameters

propsConfig?: PropsConfig<FloatingUIProps>

the props config for the floating UI service

Returns

FloatingUI

the floating UI service


FloatingUI

type alias

FloatingUI: Widget<FloatingUIProps, FloatingUIState, object, FloatingUIDirectives>

Represents the type returned by the createFloatingUI function.

This type is used to define the structure and behavior of the Floating UI component.


FloatingUIDirectives

interface
Properties
arrowDirective

arrowDirective: Directive<void, SSRHTMLElement>

Directive to attach to the arrow element


floatingDirective

floatingDirective: Directive<void, SSRHTMLElement>

Directive to attach to the floating element


referenceDirective

referenceDirective: Directive<void, SSRHTMLElement>

Directive to attach to the reference element


FloatingUIProps

interface

Interface representing the properties for configuring Floating UI.

Properties
arrowOptions

arrowOptions: Omit<object, "element"> | Derivable<Omit<object, "element">>

Options to use when calling the arrow middleware from Floating UI


autoUpdateOptions

autoUpdateOptions: AutoUpdateOptions

Options to use when calling autoUpdate from Floating UI


computePositionOptions

computePositionOptions: object

Options to use when calling computePosition from Floating UI


FloatingUIState

interface

Represents the state of a floating UI element.

Properties
middlewareData

middlewareData: undefined | MiddlewareData

Object containing data returned from all middleware, keyed by their name


placement

placement: undefined | Placement

The final chosen placement of the floating element


strategy

strategy: undefined | Strategy

The strategy used to position the floating element


x

x: undefined | number

The x coordinate of the floating ui


y

y: undefined | number

The y coordinate of the floating ui