prosekit/svelte/table-handle

Anatomy

import {
  TableHandleColumnMenuRoot,
  TableHandleColumnMenuTrigger,
  TableHandleColumnPopup,
  TableHandleColumnPositioner,
  TableHandleDragPreview,
  TableHandleDropIndicator,
  TableHandleRoot,
  TableHandleRowMenuRoot,
  TableHandleRowMenuTrigger,
  TableHandleRowPopup,
  TableHandleRowPositioner,
} from 'prosekit/svelte/table-handle'
import {
  MenuItem,
  MenuPopup,
  MenuPositioner,
} from 'prosekit/svelte/menu'

<TableHandleRoot>
  <TableHandleDragPreview />
  <TableHandleDropIndicator />
  <TableHandleColumnPositioner>
    <TableHandleColumnPopup>
      <TableHandleColumnMenuRoot>
        <TableHandleColumnMenuTrigger>...</TableHandleColumnMenuTrigger>
        <MenuPositioner>
          <MenuPopup>
            <MenuItem>...</MenuItem>
          </MenuPopup>
        </MenuPositioner>
      </TableHandleColumnMenuRoot>
    </TableHandleColumnPopup>
  </TableHandleColumnPositioner>
  <TableHandleRowPositioner>
    <TableHandleRowPopup>
      <TableHandleRowMenuRoot>
        <TableHandleRowMenuTrigger>...</TableHandleRowMenuTrigger>
        <MenuPositioner>
          <MenuPopup>
            <MenuItem>...</MenuItem>
          </MenuPopup>
        </MenuPositioner>
      </TableHandleRowMenuRoot>
    </TableHandleRowPopup>
  </TableHandleRowPositioner>
</TableHandleRoot>

Interfaces

TableHandleColumnMenuRootProps

Props for the TableHandleColumnMenuRoot Svelte component.

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

children?: Snippet<[]>

TableHandleColumnMenuTriggerProps

Props for the TableHandleColumnMenuTrigger Svelte component.

Properties

children?: Snippet<[]>

TableHandleColumnPopupProps

Props for the TableHandleColumnPopup Svelte component.

Properties

children?: Snippet<[]>

TableHandleColumnPositionerProps

Props for the TableHandleColumnPositioner Svelte component.

Properties

placement?: Placement

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

Default

"top"

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

hoist?: boolean

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

Default

false

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

children?: Snippet<[]>

TableHandleDragPreviewProps

Props for the TableHandleDragPreview Svelte component.

Properties

children?: Snippet<[]>

TableHandleDropIndicatorProps

Props for the TableHandleDropIndicator Svelte component.

Properties

children?: Snippet<[]>

TableHandleRootProps

Props for the TableHandleRoot Svelte component.

Properties

children?: Snippet<[]>

TableHandleRowMenuRootProps

Props for the TableHandleRowMenuRoot Svelte component.

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

children?: Snippet<[]>

TableHandleRowMenuTriggerProps

Props for the TableHandleRowMenuTrigger Svelte component.

Properties

children?: Snippet<[]>

TableHandleRowPopupProps

Props for the TableHandleRowPopup Svelte component.

Properties

children?: Snippet<[]>

TableHandleRowPositionerProps

Props for the TableHandleRowPositioner Svelte component.

Properties

placement?: Placement

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

Default

"left"

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

hoist?: boolean

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

Default

false

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

children?: Snippet<[]>

Variables

TableHandleColumnMenuRoot

const TableHandleColumnMenuRoot: Component<TableHandleColumnMenuRootProps & HTMLAttributes<TableHandleColumnMenuRootElement>>: A Svelte component that renders an prosekit-table-handle-column-menu-root custom element.

TableHandleColumnMenuTrigger

const TableHandleColumnMenuTrigger: Component<TableHandleColumnMenuTriggerProps & HTMLAttributes<TableHandleColumnMenuTriggerElement>>: A Svelte component that renders an prosekit-table-handle-column-menu-trigger custom element.

TableHandleColumnPopup

const TableHandleColumnPopup: Component<TableHandleColumnPopupProps & HTMLAttributes<TableHandleColumnPopupElement>>: A Svelte component that renders an prosekit-table-handle-column-popup custom element.

TableHandleColumnPositioner

const TableHandleColumnPositioner: Component<TableHandleColumnPositionerProps & HTMLAttributes<TableHandleColumnPositionerElement>>: A Svelte component that renders an prosekit-table-handle-column-positioner custom element.

TableHandleDragPreview

const TableHandleDragPreview: Component<TableHandleDragPreviewProps & HTMLAttributes<TableHandleDragPreviewElement>>: A Svelte component that renders an prosekit-table-handle-drag-preview custom element.

TableHandleDropIndicator

const TableHandleDropIndicator: Component<TableHandleDropIndicatorProps & HTMLAttributes<TableHandleDropIndicatorElement>>: A Svelte component that renders an prosekit-table-handle-drop-indicator custom element.

TableHandleRoot

const TableHandleRoot: Component<TableHandleRootProps & HTMLAttributes<TableHandleRootElement>>: A Svelte component that renders an prosekit-table-handle-root custom element.

TableHandleRowMenuRoot

const TableHandleRowMenuRoot: Component<TableHandleRowMenuRootProps & HTMLAttributes<TableHandleRowMenuRootElement>>: A Svelte component that renders an prosekit-table-handle-row-menu-root custom element.

TableHandleRowMenuTrigger

const TableHandleRowMenuTrigger: Component<TableHandleRowMenuTriggerProps & HTMLAttributes<TableHandleRowMenuTriggerElement>>: A Svelte component that renders an prosekit-table-handle-row-menu-trigger custom element.

TableHandleRowPopup

const TableHandleRowPopup: Component<TableHandleRowPopupProps & HTMLAttributes<TableHandleRowPopupElement>>: A Svelte component that renders an prosekit-table-handle-row-popup custom element.

TableHandleRowPositioner

const TableHandleRowPositioner: Component<TableHandleRowPositionerProps & HTMLAttributes<TableHandleRowPositionerElement>>: A Svelte component that renders an prosekit-table-handle-row-positioner custom element.