@prosekit/svelte 0.9.0-beta.0 → 0.9.0-beta.2

package/src/components/resizable/resizable-root.gen.ts

@@ -1,14 +1,49 @@
-import type { ResizableRootElement, ResizableRootProps as Props, ResizableRootEvents as Events } from '@prosekit/web/resizable'    
-import type { SvelteComponent } from 'svelte'
-import type { HTMLAttributes } from 'svelte/elements'
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
+
+import type { ResizableRootEvents, ResizableRootProps as ResizableRootElementProps } from '@prosekit/web/resizable';
+import type { Component, Snippet } from 'svelte';
 
-import type { CreateProps } from '../create-props.ts'
+import ResizableRootComponent from './resizable-root.gen.svelte';
 
-import Component from './resizable-root.gen.svelte'
+/**
+ * Props for the {@link ResizableRoot} Svelte component.
+ *
+ * @public
+ */
+export interface ResizableRootProps {
+  /**
+   * The width of the resizable element.
+   *
+   * @default null
+   */
+  width?: ResizableRootElementProps['width'];
+  /**
+   * The height of the resizable element.
+   *
+   * @default null
+   */
+  height?: ResizableRootElementProps['height'];
+  /**
+   * The aspect ratio of the resizable element.
+   *
+   * @default null
+   */
+  aspectRatio?: ResizableRootElementProps['aspectRatio'];
+  /** Emitted when a resize operation starts. */
+  onResizeStart?: (event: ResizableRootEvents['resizeStart']) => void;
+  /** Emitted when a resize operation ends. */
+  onResizeEnd?: (event: ResizableRootEvents['resizeEnd']) => void;
+  children?: Snippet;
+  [key: string]: unknown;
+}
 
 /**
- * Props for the {@link ResizableRoot} component.
+ * A Svelte component that renders an `prosekit-resizable-root` custom element.
+ *
+ * @public
  */
-export interface ResizableRootProps extends Partial<CreateProps<Props, Events>> {}
+export const ResizableRoot: Component<ResizableRootProps> = ResizableRootComponent as unknown as Component<ResizableRootProps>;
 
-export const ResizableRoot = Component as typeof SvelteComponent<ResizableRootProps & HTMLAttributes<ResizableRootElement>>
+export type { ResizableRootEvents };

package/src/components/table-handle/index.gen.ts

@@ -1,17 +1,25 @@
-export { TableHandleColumnRoot, type TableHandleColumnRootProps } from './table-handle-column-root.gen.ts'
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
 
-export { TableHandleColumnTrigger, type TableHandleColumnTriggerProps } from './table-handle-column-trigger.gen.ts'
+export { TableHandleColumnPopup, type TableHandleColumnPopupProps } from './table-handle-column-popup.gen.ts';
 
-export { TableHandleDragPreview, type TableHandleDragPreviewProps } from './table-handle-drag-preview.gen.ts'
+export { TableHandleColumnPositioner, type TableHandleColumnPositionerProps } from './table-handle-column-positioner.gen.ts';
 
-export { TableHandleDropIndicator, type TableHandleDropIndicatorProps } from './table-handle-drop-indicator.gen.ts'
+export { TableHandleColumnMenuRoot, type TableHandleColumnMenuRootProps } from './table-handle-column-menu-root.gen.ts';
 
-export { TableHandlePopoverContent, type TableHandlePopoverContentProps } from './table-handle-popover-content.gen.ts'
+export { TableHandleColumnMenuTrigger, type TableHandleColumnMenuTriggerProps } from './table-handle-column-menu-trigger.gen.ts';
 
-export { TableHandlePopoverItem, type TableHandlePopoverItemProps } from './table-handle-popover-item.gen.ts'
+export { TableHandleDragPreview, type TableHandleDragPreviewProps } from './table-handle-drag-preview.gen.ts';
 
-export { TableHandleRoot, type TableHandleRootProps } from './table-handle-root.gen.ts'
+export { TableHandleDropIndicator, type TableHandleDropIndicatorProps } from './table-handle-drop-indicator.gen.ts';
 
-export { TableHandleRowRoot, type TableHandleRowRootProps } from './table-handle-row-root.gen.ts'
+export { TableHandleRoot, type TableHandleRootProps } from './table-handle-root.gen.ts';
 
-export { TableHandleRowTrigger, type TableHandleRowTriggerProps } from './table-handle-row-trigger.gen.ts'
+export { TableHandleRowPopup, type TableHandleRowPopupProps } from './table-handle-row-popup.gen.ts';
+
+export { TableHandleRowPositioner, type TableHandleRowPositionerProps } from './table-handle-row-positioner.gen.ts';
+
+export { TableHandleRowMenuRoot, type TableHandleRowMenuRootProps } from './table-handle-row-menu-root.gen.ts';
+
+export { TableHandleRowMenuTrigger, type TableHandleRowMenuTriggerProps } from './table-handle-row-menu-trigger.gen.ts';

package/src/components/table-handle/index.ts

@@ -0,0 +1,58 @@
+/**
+
+@module
+
+## Anatomy
+
+```jsx
+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>
+```
+*/
+
+export * from './index.gen.ts'

package/src/components/table-handle/table-handle-column-menu-root.gen.svelte

@@ -0,0 +1,18 @@
+<!-- This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly. -->
+
+<script lang="ts">
+  import { registerTableHandleColumnMenuRootElement } from '@prosekit/web/table-handle'
+  import type { TableHandleColumnMenuRootElement } from '@prosekit/web/table-handle'
+  registerTableHandleColumnMenuRootElement()
+
+  let { defaultOpen: p0, disabled: p1, open: p2, children = undefined, ...restProps } = $props()
+  let element: TableHandleColumnMenuRootElement | undefined
+
+  $effect(() => {
+    if (!element) return
+
+    Object.assign(element, { defaultOpen: p0, disabled: p1, open: p2 })
+  })
+</script>
+
+<prosekit-table-handle-column-menu-root {...restProps} bind:this={element}>{@render children?.()}</prosekit-table-handle-column-menu-root>

package/src/components/table-handle/table-handle-column-menu-root.gen.ts

@@ -0,0 +1,40 @@
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
+
+import type { TableHandleColumnMenuRootProps as TableHandleColumnMenuRootElementProps } from '@prosekit/web/table-handle';
+import type { Component, Snippet } from 'svelte';
+
+import TableHandleColumnMenuRootComponent from './table-handle-column-menu-root.gen.svelte';
+
+/**
+ * Props for the {@link TableHandleColumnMenuRoot} Svelte component.
+ *
+ * @public
+ */
+export interface TableHandleColumnMenuRootProps {
+  /**
+   * Whether the overlay is initially open.
+   * @default false
+   */
+  defaultOpen?: TableHandleColumnMenuRootElementProps['defaultOpen'];
+  /**
+   * Whether the overlay is currently open.
+   * @default null
+   */
+  open?: TableHandleColumnMenuRootElementProps['open'];
+  /**
+   * Whether the component should ignore user interaction.
+   * @default false
+   */
+  disabled?: TableHandleColumnMenuRootElementProps['disabled'];
+  children?: Snippet;
+  [key: string]: unknown;
+}
+
+/**
+ * A Svelte component that renders an `prosekit-table-handle-column-menu-root` custom element.
+ *
+ * @public
+ */
+export const TableHandleColumnMenuRoot: Component<TableHandleColumnMenuRootProps> = TableHandleColumnMenuRootComponent as unknown as Component<TableHandleColumnMenuRootProps>;

package/src/components/table-handle/table-handle-column-menu-trigger.gen.svelte

@@ -0,0 +1,21 @@
+<!-- This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly. -->
+
+<script lang="ts">
+  import { registerTableHandleColumnMenuTriggerElement } from '@prosekit/web/table-handle'
+  import type { TableHandleColumnMenuTriggerElement } from '@prosekit/web/table-handle'
+  import { useEditorContext } from '../../contexts/editor-context.ts'
+  registerTableHandleColumnMenuTriggerElement()
+
+  let { editor: p0, children = undefined, ...restProps } = $props()
+  let element: TableHandleColumnMenuTriggerElement | undefined
+
+  const p0Fallback = useEditorContext()
+
+  $effect(() => {
+    if (!element) return
+
+    Object.assign(element, { editor: p0 ?? p0Fallback })
+  })
+</script>
+
+<prosekit-table-handle-column-menu-trigger {...restProps} bind:this={element}>{@render children?.()}</prosekit-table-handle-column-menu-trigger>

package/src/components/table-handle/table-handle-column-menu-trigger.gen.ts

@@ -0,0 +1,30 @@
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
+
+import type { TableHandleColumnMenuTriggerProps as TableHandleColumnMenuTriggerElementProps } from '@prosekit/web/table-handle';
+import type { Component, Snippet } from 'svelte';
+
+import TableHandleColumnMenuTriggerComponent from './table-handle-column-menu-trigger.gen.svelte';
+
+/**
+ * Props for the {@link TableHandleColumnMenuTrigger} Svelte component.
+ *
+ * @public
+ */
+export interface TableHandleColumnMenuTriggerProps {
+  /**
+   * @default null
+   * @hidden
+   */
+  editor?: TableHandleColumnMenuTriggerElementProps['editor'];
+  children?: Snippet;
+  [key: string]: unknown;
+}
+
+/**
+ * A Svelte component that renders an `prosekit-table-handle-column-menu-trigger` custom element.
+ *
+ * @public
+ */
+export const TableHandleColumnMenuTrigger: Component<TableHandleColumnMenuTriggerProps> = TableHandleColumnMenuTriggerComponent as unknown as Component<TableHandleColumnMenuTriggerProps>;

package/src/components/table-handle/table-handle-column-popup.gen.svelte

@@ -0,0 +1,10 @@
+<!-- This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly. -->
+
+<script lang="ts">
+  import { registerTableHandleColumnPopupElement } from '@prosekit/web/table-handle'
+  registerTableHandleColumnPopupElement()
+
+  let { children = undefined, ...restProps } = $props()
+</script>
+
+<prosekit-table-handle-column-popup {...restProps}>{@render children?.()}</prosekit-table-handle-column-popup>

package/src/components/table-handle/table-handle-column-popup.gen.ts

@@ -0,0 +1,24 @@
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
+
+import type { Component, Snippet } from 'svelte';
+
+import TableHandleColumnPopupComponent from './table-handle-column-popup.gen.svelte';
+
+/**
+ * Props for the {@link TableHandleColumnPopup} Svelte component.
+ *
+ * @public
+ */
+export interface TableHandleColumnPopupProps {
+  children?: Snippet;
+  [key: string]: unknown;
+}
+
+/**
+ * A Svelte component that renders an `prosekit-table-handle-column-popup` custom element.
+ *
+ * @public
+ */
+export const TableHandleColumnPopup: Component<TableHandleColumnPopupProps> = TableHandleColumnPopupComponent as unknown as Component<TableHandleColumnPopupProps>;

package/src/components/table-handle/table-handle-column-positioner.gen.svelte

@@ -0,0 +1,21 @@
+<!-- This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly. -->
+
+<script lang="ts">
+  import { registerTableHandleColumnPositionerElement } from '@prosekit/web/table-handle'
+  import type { TableHandleColumnPositionerElement } from '@prosekit/web/table-handle'
+  import { useEditorContext } from '../../contexts/editor-context.ts'
+  registerTableHandleColumnPositionerElement()
+
+  let { altBoundary: p0, autoUpdate: p1, boundary: p2, editor: p3, elementContext: p4, fitViewport: p5, flip: p6, hide: p7, hoist: p8, inline: p9, offset: p10, overflowPadding: p11, overlap: p12, placement: p13, rootBoundary: p14, sameHeight: p15, sameWidth: p16, shift: p17, strategy: p18, children = undefined, ...restProps } = $props()
+  let element: TableHandleColumnPositionerElement | undefined
+
+  const p3Fallback = useEditorContext()
+
+  $effect(() => {
+    if (!element) return
+
+    Object.assign(element, { altBoundary: p0, autoUpdate: p1, boundary: p2, editor: p3 ?? p3Fallback, elementContext: p4, fitViewport: p5, flip: p6, hide: p7, hoist: p8, inline: p9, offset: p10, overflowPadding: p11, overlap: p12, placement: p13, rootBoundary: p14, sameHeight: p15, sameWidth: p16, shift: p17, strategy: p18 })
+  })
+</script>
+
+<prosekit-table-handle-column-positioner {...restProps} bind:this={element}>{@render children?.()}</prosekit-table-handle-column-positioner>

package/src/components/table-handle/table-handle-column-positioner.gen.ts

@@ -0,0 +1,151 @@
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
+
+import type { TableHandleColumnPositionerProps as TableHandleColumnPositionerElementProps } from '@prosekit/web/table-handle';
+import type { Component, Snippet } from 'svelte';
+
+import TableHandleColumnPositionerComponent from './table-handle-column-positioner.gen.svelte';
+
+/**
+ * Props for the {@link TableHandleColumnPositioner} Svelte component.
+ *
+ * @public
+ */
+export interface TableHandleColumnPositionerProps {
+  /**
+   * The placement of the popover, relative to the hovered table cell.
+   *
+   * @default "top"
+   */
+  placement?: TableHandleColumnPositionerElementProps['placement'];
+  /**
+   * The strategy to use for positioning
+   *
+   * @default "absolute"
+   */
+  strategy?: TableHandleColumnPositionerElementProps['strategy'];
+  /**
+   * Options to activate auto-update listeners
+   *
+   * @see https://floating-ui.com/docs/autoUpdate
+   *
+   * @default true
+   */
+  autoUpdate?: TableHandleColumnPositionerElementProps['autoUpdate'];
+  /**
+   * Whether to use the browser [Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)
+   * to place the floating element on top of other page content.
+   *
+   * @default false
+   */
+  hoist?: TableHandleColumnPositionerElementProps['hoist'];
+  /**
+   * @default 0
+   * @hidden
+   */
+  offset?: TableHandleColumnPositionerElementProps['offset'];
+  /**
+   * @default false
+   * @hidden
+   */
+  flip?: TableHandleColumnPositionerElementProps['flip'];
+  /**
+   * @default false
+   * @hidden
+   */
+  shift?: TableHandleColumnPositionerElementProps['shift'];
+  /**
+   * Whether the floating element can overlap the reference element to keep it
+   * in view.
+   *
+   * @default false
+   */
+  overlap?: TableHandleColumnPositionerElementProps['overlap'];
+  /**
+   * Whether to constrain the floating element's width and height to not exceed
+   * the viewport.
+   *
+   * @default false
+   */
+  fitViewport?: TableHandleColumnPositionerElementProps['fitViewport'];
+  /**
+   * Whether to constrain the floating element's width so that it matches the
+   * reference element.
+   *
+   * @default false
+   */
+  sameWidth?: TableHandleColumnPositionerElementProps['sameWidth'];
+  /**
+   * Whether to constrain the floating element's height so that it matches the
+   * reference element.
+   *
+   * @default false
+   */
+  sameHeight?: TableHandleColumnPositionerElementProps['sameHeight'];
+  /**
+   * Whether to improve positioning for inline reference elements that span over
+   * multiple lines.
+   *
+   * @default false
+   */
+  inline?: TableHandleColumnPositionerElementProps['inline'];
+  /**
+   * @default true
+   * @hidden
+   */
+  hide?: TableHandleColumnPositionerElementProps['hide'];
+  /**
+   * 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'
+   */
+  boundary?: TableHandleColumnPositionerElementProps['boundary'];
+  /**
+   * 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'
+   */
+  rootBoundary?: TableHandleColumnPositionerElementProps['rootBoundary'];
+  /**
+   * 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
+   */
+  overflowPadding?: TableHandleColumnPositionerElementProps['overflowPadding'];
+  /**
+   * The element that will be used to check for overflow. Please see
+   * https://floating-ui.com/docs/detectoverflow#elementcontext for more
+   * information.
+   *
+   * @default 'floating'
+   */
+  elementContext?: TableHandleColumnPositionerElementProps['elementContext'];
+  /**
+   * Whether to check the alternate elementContext's boundary. Please see
+   * https://floating-ui.com/docs/detectoverflow#altboundary for more
+   * information.
+   *
+   * @default false
+   */
+  altBoundary?: TableHandleColumnPositionerElementProps['altBoundary'];
+  /**
+   * The ProseKit editor instance.
+   *
+   * @default null
+   * @hidden
+   */
+  editor?: TableHandleColumnPositionerElementProps['editor'];
+  children?: Snippet;
+  [key: string]: unknown;
+}
+
+/**
+ * A Svelte component that renders an `prosekit-table-handle-column-positioner` custom element.
+ *
+ * @public
+ */
+export const TableHandleColumnPositioner: Component<TableHandleColumnPositionerProps> = TableHandleColumnPositionerComponent as unknown as Component<TableHandleColumnPositionerProps>;

package/src/components/table-handle/table-handle-drag-preview.gen.svelte

@@ -1,23 +1,21 @@
+<!-- This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly. -->
+
 <script lang="ts">
-import '@prosekit/web/table-handle'
+  import { registerTableHandleDragPreviewElement } from '@prosekit/web/table-handle'
+  import type { TableHandleDragPreviewElement } from '@prosekit/web/table-handle'
+  import { useEditorContext } from '../../contexts/editor-context.ts'
+  registerTableHandleDragPreviewElement()
+
+  let { editor: p0, children = undefined, ...restProps } = $props()
+  let element: TableHandleDragPreviewElement | undefined
 
-import { tableHandleDragPreviewProps, tableHandleDragPreviewEvents } from '@prosekit/web/table-handle'
-import { ClientUpdate } from '../client-update/index.ts'
-import { useComponent } from '../use-component.ts'
-import { useEventHandlers } from '../use-event-handlers.ts'
+  const p0Fallback = useEditorContext()
 
-let attributes: Record<string, unknown> = {}
-let eventHandlers: Record<string, (...args: any[]) => any> = {}
-let element: HTMLElement | undefined = undefined
-const handleChange = useComponent(Object.keys(tableHandleDragPreviewProps), Object.keys(tableHandleDragPreviewEvents))
+  $effect(() => {
+    if (!element) return
 
-$: {
-  [attributes, eventHandlers] = handleChange(element, $$props)
-}
+    Object.assign(element, { editor: p0 ?? p0Fallback })
+  })
 </script>
 
-<ClientUpdate>
-  <prosekit-table-handle-drag-preview {...attributes} use:useEventHandlers={eventHandlers} bind:this={element}>
-    <slot />
-  </prosekit-table-handle-drag-preview>
-</ClientUpdate>
+<prosekit-table-handle-drag-preview {...restProps} bind:this={element}>{@render children?.()}</prosekit-table-handle-drag-preview>

package/src/components/table-handle/table-handle-drag-preview.gen.ts

@@ -1,14 +1,30 @@
-import type { TableHandleDragPreviewElement, TableHandleDragPreviewProps as Props, TableHandleDragPreviewEvents as Events } from '@prosekit/web/table-handle'    
-import type { SvelteComponent } from 'svelte'
-import type { HTMLAttributes } from 'svelte/elements'
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
 
-import type { CreateProps } from '../create-props.ts'
+import type { TableHandleDragPreviewProps as TableHandleDragPreviewElementProps } from '@prosekit/web/table-handle';
+import type { Component, Snippet } from 'svelte';
 
-import Component from './table-handle-drag-preview.gen.svelte'
+import TableHandleDragPreviewComponent from './table-handle-drag-preview.gen.svelte';
 
 /**
- * Props for the {@link TableHandleDragPreview} component.
+ * Props for the {@link TableHandleDragPreview} Svelte component.
+ *
+ * @public
  */
-export interface TableHandleDragPreviewProps extends Partial<CreateProps<Props, Events>> {}
+export interface TableHandleDragPreviewProps {
+  /**
+   * @default null
+   * @hidden
+   */
+  editor?: TableHandleDragPreviewElementProps['editor'];
+  children?: Snippet;
+  [key: string]: unknown;
+}
 
-export const TableHandleDragPreview = Component as typeof SvelteComponent<TableHandleDragPreviewProps & HTMLAttributes<TableHandleDragPreviewElement>>
+/**
+ * A Svelte component that renders an `prosekit-table-handle-drag-preview` custom element.
+ *
+ * @public
+ */
+export const TableHandleDragPreview: Component<TableHandleDragPreviewProps> = TableHandleDragPreviewComponent as unknown as Component<TableHandleDragPreviewProps>;

package/src/components/table-handle/table-handle-drop-indicator.gen.svelte

@@ -1,23 +1,21 @@
+<!-- This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly. -->
+
 <script lang="ts">
-import '@prosekit/web/table-handle'
+  import { registerTableHandleDropIndicatorElement } from '@prosekit/web/table-handle'
+  import type { TableHandleDropIndicatorElement } from '@prosekit/web/table-handle'
+  import { useEditorContext } from '../../contexts/editor-context.ts'
+  registerTableHandleDropIndicatorElement()
+
+  let { editor: p0, children = undefined, ...restProps } = $props()
+  let element: TableHandleDropIndicatorElement | undefined
 
-import { tableHandleDropIndicatorProps, tableHandleDropIndicatorEvents } from '@prosekit/web/table-handle'
-import { ClientUpdate } from '../client-update/index.ts'
-import { useComponent } from '../use-component.ts'
-import { useEventHandlers } from '../use-event-handlers.ts'
+  const p0Fallback = useEditorContext()
 
-let attributes: Record<string, unknown> = {}
-let eventHandlers: Record<string, (...args: any[]) => any> = {}
-let element: HTMLElement | undefined = undefined
-const handleChange = useComponent(Object.keys(tableHandleDropIndicatorProps), Object.keys(tableHandleDropIndicatorEvents))
+  $effect(() => {
+    if (!element) return
 
-$: {
-  [attributes, eventHandlers] = handleChange(element, $$props)
-}
+    Object.assign(element, { editor: p0 ?? p0Fallback })
+  })
 </script>
 
-<ClientUpdate>
-  <prosekit-table-handle-drop-indicator {...attributes} use:useEventHandlers={eventHandlers} bind:this={element}>
-    <slot />
-  </prosekit-table-handle-drop-indicator>
-</ClientUpdate>
+<prosekit-table-handle-drop-indicator {...restProps} bind:this={element}>{@render children?.()}</prosekit-table-handle-drop-indicator>

package/src/components/table-handle/table-handle-drop-indicator.gen.ts

@@ -1,14 +1,30 @@
-import type { TableHandleDropIndicatorElement, TableHandleDropIndicatorProps as Props, TableHandleDropIndicatorEvents as Events } from '@prosekit/web/table-handle'    
-import type { SvelteComponent } from 'svelte'
-import type { HTMLAttributes } from 'svelte/elements'
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
 
-import type { CreateProps } from '../create-props.ts'
+import type { TableHandleDropIndicatorProps as TableHandleDropIndicatorElementProps } from '@prosekit/web/table-handle';
+import type { Component, Snippet } from 'svelte';
 
-import Component from './table-handle-drop-indicator.gen.svelte'
+import TableHandleDropIndicatorComponent from './table-handle-drop-indicator.gen.svelte';
 
 /**
- * Props for the {@link TableHandleDropIndicator} component.
+ * Props for the {@link TableHandleDropIndicator} Svelte component.
+ *
+ * @public
  */
-export interface TableHandleDropIndicatorProps extends Partial<CreateProps<Props, Events>> {}
+export interface TableHandleDropIndicatorProps {
+  /**
+   * @default null
+   * @hidden
+   */
+  editor?: TableHandleDropIndicatorElementProps['editor'];
+  children?: Snippet;
+  [key: string]: unknown;
+}
 
-export const TableHandleDropIndicator = Component as typeof SvelteComponent<TableHandleDropIndicatorProps & HTMLAttributes<TableHandleDropIndicatorElement>>
+/**
+ * A Svelte component that renders an `prosekit-table-handle-drop-indicator` custom element.
+ *
+ * @public
+ */
+export const TableHandleDropIndicator: Component<TableHandleDropIndicatorProps> = TableHandleDropIndicatorComponent as unknown as Component<TableHandleDropIndicatorProps>;