prosekit/web/table-handle

Anatomy

<prosekit-table-handle-root>
  <prosekit-table-handle-drag-preview></prosekit-table-handle-drag-preview>
  <prosekit-table-handle-drop-indicator></prosekit-table-handle-drop-indicator>
  <prosekit-table-handle-column-positioner>
    <prosekit-table-handle-column-popup>
      <prosekit-table-handle-column-menu-root>
        <prosekit-table-handle-column-menu-trigger>...</prosekit-table-handle-column-menu-trigger>
        <prosekit-menu-positioner>
          <prosekit-menu-popup>
            <prosekit-menu-item>...</prosekit-menu-item>
          </prosekit-menu-popup>
        </prosekit-menu-positioner>
      </prosekit-table-handle-column-menu-root>
    </prosekit-table-handle-column-popup>
  </prosekit-table-handle-column-positioner>
  <prosekit-table-handle-row-positioner>
    <prosekit-table-handle-row-popup>
      <prosekit-table-handle-row-menu-root>
        <prosekit-table-handle-row-menu-trigger>...</prosekit-table-handle-row-menu-trigger>
        <prosekit-menu-positioner>
          <prosekit-menu-popup>
            <prosekit-menu-item>...</prosekit-menu-item>
          </prosekit-menu-popup>
        </prosekit-menu-positioner>
      </prosekit-table-handle-row-menu-root>
    </prosekit-table-handle-row-popup>
  </prosekit-table-handle-row-positioner>
</prosekit-table-handle-root>

Classes

TableHandleColumnMenuRootElement

<prosekit-table-handle-column-menu-root> custom element.

Properties: TableHandleColumnMenuRootProps

Constructors

Constructor

new TableHandleColumnMenuRootElement(): TableHandleColumnMenuRootElement

Properties

defaultOpen: boolean

Whether the overlay is initially open.

Default

false

open: boolean | null

Whether the overlay is currently open.

Default

null

disabled: boolean

Whether the component should ignore user interaction.

Default

false

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleColumnMenuTriggerElement

<prosekit-table-handle-column-menu-trigger> custom element.

Properties: TableHandleColumnMenuTriggerProps

Constructors

Constructor

new TableHandleColumnMenuTriggerElement(): TableHandleColumnMenuTriggerElement

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleColumnPopupElement

<prosekit-table-handle-column-popup> custom element.

Properties: TableHandleColumnPopupProps

Data attributes:

Attribute	Description
`data-state`	`"open"` when visible, `"closed"` otherwise

Constructors

Constructor

new TableHandleColumnPopupElement(): TableHandleColumnPopupElement

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleColumnPositionerElement

<prosekit-table-handle-column-positioner> custom element.

Properties: TableHandleColumnPositionerProps

Data attributes:

Attribute	Description
`data-state`	`"open"` when visible, `"closed"` otherwise
`data-side`	The side of the anchor element the positioner is on
`data-align`	The alignment of the positioner relative to the anchor element

CSS variables:

Variable	Description
`--transform-origin`	The coordinates that this element is anchored to. Useful for scale animations.

Constructors

Constructor

new TableHandleColumnPositionerElement(): TableHandleColumnPositionerElement

Properties

strategy: "fixed" | "absolute"

The strategy to use for positioning

Default

"absolute"

autoUpdate: boolean | AutoUpdateOptions

Options to activate auto-update listeners

See

https://floating-ui.com/docs/autoUpdate

Default

true

overlap: boolean

Whether the floating element can overlap the reference element to keep it in view.

Default

false

fitViewport: boolean

Whether to constrain the floating element's width and height to not exceed the viewport.

Default

false

sameWidth: boolean

Whether to constrain the floating element's width so that it matches the reference element.

Default

false

sameHeight: boolean

Whether to constrain the floating element's height so that it matches the reference element.

Default

false

inline: boolean

Whether to improve positioning for inline reference elements that span over multiple lines.

Default

false

boundary: Boundary

Describes the clipping element(s) or area that overflow will be checked relative to. Please see https://floating-ui.com/docs/detectoverflow#boundary for more information.

Default

'clippingAncestors'

rootBoundary: RootBoundary

Describes the root boundary that the element will be checked for overflow relative to. Please see https://floating-ui.com/docs/detectoverflow#rootboundary for more information.

Default

'viewport'

overflowPadding: number

Describes the virtual padding around the boundary to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#padding for more information.

Default

4

elementContext: ElementContext

The element that will be used to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#elementcontext for more information.

Default

'floating'

altBoundary: boolean

Whether to check the alternate elementContext's boundary. Please see https://floating-ui.com/docs/detectoverflow#altboundary for more information.

Default

false

hoist: boolean

Whether to use the browser Popover API to place the floating element on top of other page content.

Default

false

placement: Placement

The placement of the popover, relative to the hovered table cell.

Default

"top"

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleDragPreviewElement

<prosekit-table-handle-drag-preview> custom element.

Properties: TableHandleDragPreviewProps

Constructors

Constructor

new TableHandleDragPreviewElement(): TableHandleDragPreviewElement

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleDropIndicatorElement

<prosekit-table-handle-drop-indicator> custom element.

Properties: TableHandleDropIndicatorProps

Constructors

Constructor

new TableHandleDropIndicatorElement(): TableHandleDropIndicatorElement

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleRootElement

<prosekit-table-handle-root> custom element.

Properties: TableHandleRootProps

Constructors

Constructor

new TableHandleRootElement(): TableHandleRootElement

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleRowMenuRootElement

<prosekit-table-handle-row-menu-root> custom element.

Properties: TableHandleRowMenuRootProps

Constructors

Constructor

new TableHandleRowMenuRootElement(): TableHandleRowMenuRootElement

Properties

defaultOpen: boolean

Whether the overlay is initially open.

Default

false

open: boolean | null

Whether the overlay is currently open.

Default

null

disabled: boolean

Whether the component should ignore user interaction.

Default

false

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleRowMenuTriggerElement

<prosekit-table-handle-row-menu-trigger> custom element.

Properties: TableHandleRowMenuTriggerProps

Constructors

Constructor

new TableHandleRowMenuTriggerElement(): TableHandleRowMenuTriggerElement

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleRowPopupElement

<prosekit-table-handle-row-popup> custom element.

Properties: TableHandleRowPopupProps

Data attributes:

Attribute	Description
`data-state`	`"open"` when visible, `"closed"` otherwise

Constructors

Constructor

new TableHandleRowPopupElement(): TableHandleRowPopupElement

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

TableHandleRowPositionerElement

<prosekit-table-handle-row-positioner> custom element.

Properties: TableHandleRowPositionerProps

Data attributes:

Attribute	Description
`data-state`	`"open"` when visible, `"closed"` otherwise
`data-side`	The side of the anchor element the positioner is on
`data-align`	The alignment of the positioner relative to the anchor element

CSS variables:

Variable	Description
`--transform-origin`	The coordinates that this element is anchored to. Useful for scale animations.

Constructors

Constructor

new TableHandleRowPositionerElement(): TableHandleRowPositionerElement

Properties

strategy: "fixed" | "absolute"

The strategy to use for positioning

Default

"absolute"

autoUpdate: boolean | AutoUpdateOptions

Options to activate auto-update listeners

See

https://floating-ui.com/docs/autoUpdate

Default

true

overlap: boolean

Whether the floating element can overlap the reference element to keep it in view.

Default

false

fitViewport: boolean

Whether to constrain the floating element's width and height to not exceed the viewport.

Default

false

sameWidth: boolean

Whether to constrain the floating element's width so that it matches the reference element.

Default

false

sameHeight: boolean

Whether to constrain the floating element's height so that it matches the reference element.

Default

false

inline: boolean

Whether to improve positioning for inline reference elements that span over multiple lines.

Default

false

boundary: Boundary

Describes the clipping element(s) or area that overflow will be checked relative to. Please see https://floating-ui.com/docs/detectoverflow#boundary for more information.

Default

'clippingAncestors'

rootBoundary: RootBoundary

Describes the root boundary that the element will be checked for overflow relative to. Please see https://floating-ui.com/docs/detectoverflow#rootboundary for more information.

Default

'viewport'

overflowPadding: number

Describes the virtual padding around the boundary to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#padding for more information.

Default

4

elementContext: ElementContext

The element that will be used to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#elementcontext for more information.

Default

'floating'

altBoundary: boolean

Whether to check the alternate elementContext's boundary. Please see https://floating-ui.com/docs/detectoverflow#altboundary for more information.

Default

false

hoist: boolean

Whether to use the browser Popover API to place the floating element on top of other page content.

Default

false

placement: Placement

The placement of the popover, relative to the hovered table cell.

Default

"left"

Methods

addController(controller: ReactiveController): void

removeController(controller: ReactiveController): void

connectedCallback(): void

disconnectedCallback(): void

Interfaces

TableHandleColumnMenuRootProps

Properties

defaultOpen: boolean

Whether the overlay is initially open.

Default

false

open: boolean | null

Whether the overlay is currently open.

Default

null

disabled: boolean

Whether the component should ignore user interaction.

Default

false

TableHandleColumnMenuTriggerProps

TableHandleColumnPopupProps

TableHandleColumnPositionerProps

Properties

strategy: "fixed" | "absolute"

The strategy to use for positioning

Default

"absolute"

autoUpdate: boolean | AutoUpdateOptions

Options to activate auto-update listeners

See

https://floating-ui.com/docs/autoUpdate

Default

true

overlap: boolean

Whether the floating element can overlap the reference element to keep it in view.

Default

false

fitViewport: boolean

Whether to constrain the floating element's width and height to not exceed the viewport.

Default

false

sameWidth: boolean

Whether to constrain the floating element's width so that it matches the reference element.

Default

false

sameHeight: boolean

Whether to constrain the floating element's height so that it matches the reference element.

Default

false

inline: boolean

Whether to improve positioning for inline reference elements that span over multiple lines.

Default

false

boundary: Boundary

Describes the clipping element(s) or area that overflow will be checked relative to. Please see https://floating-ui.com/docs/detectoverflow#boundary for more information.

Default

'clippingAncestors'

rootBoundary: RootBoundary

Describes the root boundary that the element will be checked for overflow relative to. Please see https://floating-ui.com/docs/detectoverflow#rootboundary for more information.

Default

'viewport'

overflowPadding: number

Describes the virtual padding around the boundary to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#padding for more information.

Default

4

elementContext: ElementContext

The element that will be used to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#elementcontext for more information.

Default

'floating'

altBoundary: boolean

Whether to check the alternate elementContext's boundary. Please see https://floating-ui.com/docs/detectoverflow#altboundary for more information.

Default

false

hoist: boolean

Whether to use the browser Popover API to place the floating element on top of other page content.

Default

false

placement: Placement

The placement of the popover, relative to the hovered table cell.

Default

"top"

TableHandleDragPreviewProps

TableHandleDropIndicatorProps

TableHandleRootProps

TableHandleRowMenuRootProps

Properties

defaultOpen: boolean

Whether the overlay is initially open.

Default

false

open: boolean | null

Whether the overlay is currently open.

Default

null

disabled: boolean

Whether the component should ignore user interaction.

Default

false

TableHandleRowMenuTriggerProps

TableHandleRowPopupProps

TableHandleRowPositionerProps

Properties

strategy: "fixed" | "absolute"

The strategy to use for positioning

Default

"absolute"

autoUpdate: boolean | AutoUpdateOptions

Options to activate auto-update listeners

See

https://floating-ui.com/docs/autoUpdate

Default

true

overlap: boolean

Whether the floating element can overlap the reference element to keep it in view.

Default

false

fitViewport: boolean

Whether to constrain the floating element's width and height to not exceed the viewport.

Default

false

sameWidth: boolean

Whether to constrain the floating element's width so that it matches the reference element.

Default

false

sameHeight: boolean

Whether to constrain the floating element's height so that it matches the reference element.

Default

false

inline: boolean

Whether to improve positioning for inline reference elements that span over multiple lines.

Default

false

boundary: Boundary

Describes the clipping element(s) or area that overflow will be checked relative to. Please see https://floating-ui.com/docs/detectoverflow#boundary for more information.

Default

'clippingAncestors'

rootBoundary: RootBoundary

Describes the root boundary that the element will be checked for overflow relative to. Please see https://floating-ui.com/docs/detectoverflow#rootboundary for more information.

Default

'viewport'

overflowPadding: number

Describes the virtual padding around the boundary to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#padding for more information.

Default

4

elementContext: ElementContext

The element that will be used to check for overflow. Please see https://floating-ui.com/docs/detectoverflow#elementcontext for more information.

Default

'floating'

altBoundary: boolean

Whether to check the alternate elementContext's boundary. Please see https://floating-ui.com/docs/detectoverflow#altboundary for more information.

Default

false

hoist: boolean

Whether to use the browser Popover API to place the floating element on top of other page content.

Default

false

placement: Placement

The placement of the popover, relative to the hovered table cell.

Default

"left"