@prosekit/vue 0.7.0-beta.1 → 0.7.0-beta.2

package/src/components/tooltip/tooltip-positioner.gen.ts

@@ -0,0 +1,174 @@
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
+
+import { registerTooltipPositionerElement, type TooltipPositionerProps as TooltipPositionerElementProps } from '@prosekit/web/tooltip';
+import { defineComponent, h, type DefineSetupFnComponent, type HTMLAttributes, shallowRef, computed, watchEffect } from 'vue';
+
+/**
+ * Props for the {@link TooltipPositioner} Vue component.
+ *
+ * @public
+ */
+export interface TooltipPositionerProps {
+  /**
+   * The strategy to use for positioning
+   *
+   * @default "absolute"
+   */
+  strategy?: TooltipPositionerElementProps['strategy'];
+  /**
+   * The initial placement of the floating element
+   *
+   * @default "top"
+   */
+  placement?: TooltipPositionerElementProps['placement'];
+  /**
+   * Options to activate auto-update listeners
+   *
+   * @see https://floating-ui.com/docs/autoUpdate
+   *
+   * @default true
+   */
+  autoUpdate?: TooltipPositionerElementProps['autoUpdate'];
+  /**
+   * Whether to use the browser Popover API to place the floating element on
+   * top of other page content.
+   *
+   * @default true
+   */
+  hoist?: TooltipPositionerElementProps['hoist'];
+  /**
+   * The distance between the reference and floating element.
+   *
+   * @default 6
+   */
+  offset?: TooltipPositionerElementProps['offset'];
+  /**
+   * Whether to flip the `placement` in order to keep it in view when the
+   * preferred placement(s) will overflow the clipping boundary. You can also
+   * provide an array of placements to try sequentially if the preferred
+   * `placement` does not fit.
+   *
+   * @default true
+   */
+  flip?: TooltipPositionerElementProps['flip'];
+  /**
+   * Whether the floating element should shift to keep it in view.
+   *
+   * @default true
+   */
+  shift?: TooltipPositionerElementProps['shift'];
+  /**
+   * Whether the floating element can overlap the reference element to keep it
+   * in view.
+   *
+   * @default false
+   */
+  overlap?: TooltipPositionerElementProps['overlap'];
+  /**
+   * Whether to constrain the floating element's width and height to not exceed
+   * the viewport.
+   *
+   * @default false
+   */
+  fitViewport?: TooltipPositionerElementProps['fitViewport'];
+  /**
+   * Whether to constrain the floating element's width so that it matches the
+   * reference element.
+   *
+   * @default false
+   */
+  sameWidth?: TooltipPositionerElementProps['sameWidth'];
+  /**
+   * Whether to constrain the floating element's height so that it matches the
+   * reference element.
+   *
+   * @default false
+   */
+  sameHeight?: TooltipPositionerElementProps['sameHeight'];
+  /**
+   * Whether to improve positioning for inline reference elements that span over
+   * multiple lines.
+   *
+   * @default false
+   */
+  inline?: TooltipPositionerElementProps['inline'];
+  /**
+   * Whether to hide the floating element when the reference element or the
+   * floating element is fully clipped.
+   *
+   * @default false
+   */
+  hide?: TooltipPositionerElementProps['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?: TooltipPositionerElementProps['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?: TooltipPositionerElementProps['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?: TooltipPositionerElementProps['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?: TooltipPositionerElementProps['elementContext'];
+  /**
+   * Whether to check the alternate elementContext's boundary. Please see
+   * https://floating-ui.com/docs/detectoverflow#altboundary for more
+   * information.
+   *
+   * @default false
+   */
+  altBoundary?: TooltipPositionerElementProps['altBoundary'];
+}
+
+/**
+ * A Vue component that renders an `prosekit-tooltip-positioner` custom element.
+ *
+ * @public
+ */
+export const TooltipPositioner: DefineSetupFnComponent<TooltipPositionerProps & HTMLAttributes> = /* @__PURE__ */ defineComponent<TooltipPositionerProps & HTMLAttributes>(
+  (props, { slots }) => {
+    registerTooltipPositionerElement();
+
+    const elementRef = shallowRef<HTMLElement | null>(null);
+
+    const splittedProps = computed(() => {
+      const { altBoundary: p0, autoUpdate: p1, boundary: p2, elementContext: p3, fitViewport: p4, flip: p5, hide: p6, hoist: p7, inline: p8, offset: p9, overflowPadding: p10, overlap: p11, placement: p12, rootBoundary: p13, sameHeight: p14, sameWidth: p15, shift: p16, strategy: p17, ...restProps } = props;
+      return [[p0, p1, p2, p3, p4, p5, p6, p7, p8, p9, p10, p11, p12, p13, p14, p15, p16, p17], restProps] as const;
+    });
+
+    watchEffect(() => {
+      const element = elementRef.value;
+      if (!element) return;
+
+      const [p0, p1, p2, p3, p4, p5, p6, p7, p8, p9, p10, p11, p12, p13, p14, p15, p16, p17] = splittedProps.value[0];
+
+      Object.assign(element, { altBoundary: p0, autoUpdate: p1, boundary: p2, elementContext: p3, fitViewport: p4, flip: p5, hide: p6, hoist: p7, inline: p8, offset: p9, overflowPadding: p10, overlap: p11, placement: p12, rootBoundary: p13, sameHeight: p14, sameWidth: p15, shift: p16, strategy: p17 });
+    });
+
+    return () => {
+      const restProps = splittedProps.value[1];
+      return h('prosekit-tooltip-positioner', { ...restProps, ref: elementRef }, slots.default?.());
+    };
+  },
+  { props: ['altBoundary', 'autoUpdate', 'boundary', 'elementContext', 'fitViewport', 'flip', 'hide', 'hoist', 'inline', 'offset', 'overflowPadding', 'overlap', 'placement', 'rootBoundary', 'sameHeight', 'sameWidth', 'shift', 'strategy'] },
+);

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

@@ -1,33 +1,88 @@
-import {
-  tooltipRootProps,
-  tooltipRootEvents,
-  type TooltipRootProps as Props,
-  type TooltipRootEvents as Events,
-} from '@prosekit/web/tooltip'
-import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
 
-import { createComponent } from '../create-component.ts'
-import type { CreateEmits } from '../create-emits.ts'
+import { registerTooltipRootElement, type TooltipRootEvents, type TooltipRootProps as TooltipRootElementProps } from '@prosekit/web/tooltip';
+import { defineComponent, h, type DefineSetupFnComponent, type HTMLAttributes, shallowRef, computed, watchEffect } from 'vue';
 
 /**
- * Props for the {@link TooltipRoot} component.
+ * Props for the {@link TooltipRoot} Vue component.
+ *
+ * @public
  */
-export interface TooltipRootProps extends Partial<Props> {}
+export interface TooltipRootProps {
+  /**
+   * Whether the overlay is initially open.
+   * @default false
+   */
+  defaultOpen?: TooltipRootElementProps['defaultOpen'];
+  /**
+   * Whether the overlay is currently open.
+   * @default null
+   */
+  open?: TooltipRootElementProps['open'];
+  /**
+   * Whether the component should ignore user interaction.
+   * @default false
+   */
+  disabled?: TooltipRootElementProps['disabled'];
+  /** Emitted when the tooltip is opened or closed. */
+  onOpenChange?: (event: TooltipRootEvents['openChange']) => void;
+}
 
 /**
- * Emits for the {@link TooltipRoot} component.
+ * A Vue component that renders an `prosekit-tooltip-root` custom element.
+ *
+ * @public
  */
-export interface TooltipRootEmits extends CreateEmits<Events> {}
-
-export const TooltipRoot: DefineSetupFnComponent<
-  TooltipRootProps & HTMLAttributes,
-  TooltipRootEmits
-> = createComponent<
-  TooltipRootProps,
-  TooltipRootEmits
->(
-  'prosekit-tooltip-root',
-  'TooltipRoot',
-  Object.keys(tooltipRootProps),
-  Object.keys(tooltipRootEvents),
-)
+export const TooltipRoot: DefineSetupFnComponent<TooltipRootProps & HTMLAttributes> = /* @__PURE__ */ defineComponent<TooltipRootProps & HTMLAttributes>(
+  (props, { slots }) => {
+    registerTooltipRootElement();
+
+    const elementRef = shallowRef<HTMLElement | null>(null);
+
+    const splittedProps = computed(() => {
+      const { defaultOpen: p0, disabled: p1, open: p2, onOpenChange: e0, ...restProps } = props;
+      return [[p0, p1, p2, e0], restProps] as const;
+    });
+
+    const handlers: Array<((event: any) => void) | undefined> = [];
+
+    watchEffect(() => {
+      const element = elementRef.value;
+      if (!element) return;
+
+      const [p0, p1, p2, e0] = splittedProps.value[0];
+
+      Object.assign(element, { defaultOpen: p0, disabled: p1, open: p2 });
+
+      handlers.length = 0;
+      handlers.push(e0);
+    });
+
+    watchEffect(() => {
+      const element = elementRef.value;
+      if (!element) return;
+
+      const ac = new AbortController();
+      for (const [index, eventName] of ['openChange'].entries()) {
+        element.addEventListener(
+          eventName,
+          (event: Event) => {
+            handlers[index]?.(event);
+          },
+          { signal: ac.signal },
+        );
+      }
+      return () => ac.abort();
+    });
+
+    return () => {
+      const restProps = splittedProps.value[1];
+      return h('prosekit-tooltip-root', { ...restProps, ref: elementRef }, slots.default?.());
+    };
+  },
+  { props: ['defaultOpen', 'disabled', 'open', 'onOpenChange'] },
+);
+
+export type { TooltipRootEvents };

package/src/components/tooltip/tooltip-trigger.gen.ts

@@ -1,33 +1,62 @@
-import {
-  tooltipTriggerProps,
-  tooltipTriggerEvents,
-  type TooltipTriggerProps as Props,
-  type TooltipTriggerEvents as Events,
-} from '@prosekit/web/tooltip'
-import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
+/**
+ * This file is auto-generated by the "@aria-ui/cli" tool. Do not edit this file directly.
+ */
 
-import { createComponent } from '../create-component.ts'
-import type { CreateEmits } from '../create-emits.ts'
+import { registerTooltipTriggerElement, type TooltipTriggerProps as TooltipTriggerElementProps } from '@prosekit/web/tooltip';
+import { defineComponent, h, type DefineSetupFnComponent, type HTMLAttributes, shallowRef, computed, watchEffect } from 'vue';
 
 /**
- * Props for the {@link TooltipTrigger} component.
+ * Props for the {@link TooltipTrigger} Vue component.
+ *
+ * @public
  */
-export interface TooltipTriggerProps extends Partial<Props> {}
+export interface TooltipTriggerProps {
+  /**
+   * Whether the component should ignore user interaction.
+   * @default false
+   */
+  disabled?: TooltipTriggerElementProps['disabled'];
+  /**
+   * The delay in milliseconds before opening the tooltip on hover.
+   * @default 600
+   */
+  openDelay?: TooltipTriggerElementProps['openDelay'];
+  /**
+   * The delay in milliseconds before closing the tooltip when hover/focus ends.
+   * @default 0
+   */
+  closeDelay?: TooltipTriggerElementProps['closeDelay'];
+}
 
 /**
- * Emits for the {@link TooltipTrigger} component.
+ * A Vue component that renders an `prosekit-tooltip-trigger` custom element.
+ *
+ * @public
  */
-export interface TooltipTriggerEmits extends CreateEmits<Events> {}
-
-export const TooltipTrigger: DefineSetupFnComponent<
-  TooltipTriggerProps & HTMLAttributes,
-  TooltipTriggerEmits
-> = createComponent<
-  TooltipTriggerProps,
-  TooltipTriggerEmits
->(
-  'prosekit-tooltip-trigger',
-  'TooltipTrigger',
-  Object.keys(tooltipTriggerProps),
-  Object.keys(tooltipTriggerEvents),
-)
+export const TooltipTrigger: DefineSetupFnComponent<TooltipTriggerProps & HTMLAttributes> = /* @__PURE__ */ defineComponent<TooltipTriggerProps & HTMLAttributes>(
+  (props, { slots }) => {
+    registerTooltipTriggerElement();
+
+    const elementRef = shallowRef<HTMLElement | null>(null);
+
+    const splittedProps = computed(() => {
+      const { closeDelay: p0, disabled: p1, openDelay: p2, ...restProps } = props;
+      return [[p0, p1, p2], restProps] as const;
+    });
+
+    watchEffect(() => {
+      const element = elementRef.value;
+      if (!element) return;
+
+      const [p0, p1, p2] = splittedProps.value[0];
+
+      Object.assign(element, { closeDelay: p0, disabled: p1, openDelay: p2 });
+    });
+
+    return () => {
+      const restProps = splittedProps.value[1];
+      return h('prosekit-tooltip-trigger', { ...restProps, ref: elementRef }, slots.default?.());
+    };
+  },
+  { props: ['closeDelay', 'disabled', 'openDelay'] },
+);

package/dist/create-component.js

@@ -1,45 +0,0 @@
-import { n as useEditorContext } from "./editor-context.js";
-import { defineComponent, h, onMounted, ref, watchEffect } from "vue";
-//#region src/components/create-component.ts
-function createComponent(tagName, displayName, propNames, eventNames) {
-	const hasEditor = propNames.includes("editor");
-	return defineComponent((props, { slots, emit }) => {
-		const editor = useEditorContext();
-		const mounted = ref(false);
-		onMounted(() => {
-			mounted.value = true;
-		});
-		const elementRef = ref(null);
-		watchEffect((onCleanup) => {
-			const element = elementRef.value;
-			if (!element) return;
-			const eventHandlers = {};
-			for (const eventName of eventNames) {
-				const extractDetail = eventName.endsWith("Change");
-				eventHandlers[eventName] = (event) => {
-					emit(eventName, extractDetail ? event.detail : event);
-				};
-			}
-			for (const [eventName, handler] of Object.entries(eventHandlers)) element.addEventListener(eventName, handler);
-			onCleanup(() => {
-				for (const [eventName, handler] of Object.entries(eventHandlers)) element.removeEventListener(eventName, handler);
-			});
-		});
-		return () => {
-			const properties = {};
-			for (const [key, value] of Object.entries(props)) if (value !== void 0 && !key.startsWith(".")) properties[propNames.includes(key) ? "." + key : key] = value;
-			if (hasEditor && editor && !properties["editor"]) properties.editor = editor;
-			properties.key = mounted.value ? 1 : 0;
-			properties.ref = elementRef;
-			return h(tagName, properties, slots.default?.());
-		};
-	}, {
-		name: displayName,
-		props: propNames,
-		emits: eventNames
-	});
-}
-//#endregion
-export { createComponent as t };
-
-//# sourceMappingURL=create-component.js.map

package/dist/create-component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"create-component.js","names":[],"sources":["../src/components/create-component.ts"],"sourcesContent":["import { defineComponent, h, onMounted, ref, watchEffect, type DefineSetupFnComponent, type EmitsOptions, type HTMLAttributes } from 'vue'\n\nimport { useEditorContext } from '../injection/editor-context.ts'\n\nexport function createComponent<\n  Props extends { [PropName in keyof Props]: unknown },\n  Emits extends EmitsOptions,\n>(\n  tagName: string,\n  displayName: string,\n  propNames: string[],\n  eventNames: string[],\n): DefineSetupFnComponent<Partial<Props> & HTMLAttributes, Emits> {\n  const hasEditor = propNames.includes('editor')\n\n  const Component = defineComponent<any, any>(\n    (props: Record<string, unknown>, { slots, emit }) => {\n      const editor = useEditorContext()\n\n      const mounted = ref(false)\n\n      onMounted(() => {\n        mounted.value = true\n      })\n\n      const elementRef = ref<HTMLElement | null>(null)\n\n      watchEffect((onCleanup) => {\n        const element = elementRef.value\n        if (!element) return\n\n        const eventHandlers: Record<string, (event: Event) => void> = {}\n        for (const eventName of eventNames) {\n          const extractDetail = eventName.endsWith('Change')\n          eventHandlers[eventName] = (event: Event) => {\n            emit(\n              eventName,\n              extractDetail ? (event as CustomEvent).detail : event,\n            )\n          }\n        }\n\n        for (const [eventName, handler] of Object.entries(eventHandlers)) {\n          element.addEventListener(eventName, handler)\n        }\n\n        onCleanup(() => {\n          for (const [eventName, handler] of Object.entries(eventHandlers)) {\n            element.removeEventListener(eventName, handler)\n          }\n        })\n      })\n\n      return () => {\n        const properties: Record<string, unknown> = {}\n\n        for (const [key, value] of Object.entries(props)) {\n          if (value !== undefined && !key.startsWith('.')) {\n            properties[propNames.includes(key) ? '.' + key : key] = value\n          }\n        }\n\n        // Try to add the editor prop if it's missing.\n        if (hasEditor && editor && !properties['editor']) {\n          properties.editor = editor\n        }\n\n        // Ensure web components work after SSR hydration.\n        properties.key = mounted.value ? 1 : 0\n\n        properties.ref = elementRef\n\n        return h(tagName, properties, slots.default?.())\n      }\n    },\n    {\n      name: displayName,\n      props: propNames,\n      emits: eventNames,\n    },\n  )\n\n  return Component\n}\n"],"mappings":";;;AAIA,SAAgB,gBAId,SACA,aACA,WACA,YACgE;CAChE,MAAM,YAAY,UAAU,SAAS,SAAS;AAqE9C,QAnEkB,iBACf,OAAgC,EAAE,OAAO,WAAW;EACnD,MAAM,SAAS,kBAAkB;EAEjC,MAAM,UAAU,IAAI,MAAM;AAE1B,kBAAgB;AACd,WAAQ,QAAQ;IAChB;EAEF,MAAM,aAAa,IAAwB,KAAK;AAEhD,eAAa,cAAc;GACzB,MAAM,UAAU,WAAW;AAC3B,OAAI,CAAC,QAAS;GAEd,MAAM,gBAAwD,EAAE;AAChE,QAAK,MAAM,aAAa,YAAY;IAClC,MAAM,gBAAgB,UAAU,SAAS,SAAS;AAClD,kBAAc,cAAc,UAAiB;AAC3C,UACE,WACA,gBAAiB,MAAsB,SAAS,MACjD;;;AAIL,QAAK,MAAM,CAAC,WAAW,YAAY,OAAO,QAAQ,cAAc,CAC9D,SAAQ,iBAAiB,WAAW,QAAQ;AAG9C,mBAAgB;AACd,SAAK,MAAM,CAAC,WAAW,YAAY,OAAO,QAAQ,cAAc,CAC9D,SAAQ,oBAAoB,WAAW,QAAQ;KAEjD;IACF;AAEF,eAAa;GACX,MAAM,aAAsC,EAAE;AAE9C,QAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,MAAM,CAC9C,KAAI,UAAU,KAAA,KAAa,CAAC,IAAI,WAAW,IAAI,CAC7C,YAAW,UAAU,SAAS,IAAI,GAAG,MAAM,MAAM,OAAO;AAK5D,OAAI,aAAa,UAAU,CAAC,WAAW,UACrC,YAAW,SAAS;AAItB,cAAW,MAAM,QAAQ,QAAQ,IAAI;AAErC,cAAW,MAAM;AAEjB,UAAO,EAAE,SAAS,YAAY,MAAM,WAAW,CAAC;;IAGpD;EACE,MAAM;EACN,OAAO;EACP,OAAO;EACR,CACF"}

package/dist/create-emits.d.ts

@@ -1,5 +0,0 @@
-//#region src/components/create-emits.d.ts
-type CreateEmits<Events extends { [EventName in keyof Events]: CustomEvent }> = { [EventName in keyof Events]: (event: EventName extends `${string}Change` ? Events[EventName]['detail'] : Events[EventName]) => void };
-//#endregion
-export { CreateEmits as t };
-//# sourceMappingURL=create-emits.d.ts.map

package/dist/create-emits.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"create-emits.d.ts","names":[],"sources":["../src/components/create-emits.ts"],"mappings":";KAAY,WAAA,sCAC2B,MAAA,GAAS,WAAA,4BAE1B,MAAA,IAClB,KAAA,EAAO,SAAA,6BAAsC,MAAA,CAAO,SAAA,cAChD,MAAA,CAAO,SAAA"}

package/src/components/autocomplete/autocomplete-list.gen.ts

@@ -1,33 +0,0 @@
-import {
-  autocompleteListProps,
-  autocompleteListEvents,
-  type AutocompleteListProps as Props,
-  type AutocompleteListEvents as Events,
-} from '@prosekit/web/autocomplete'
-import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
-
-import { createComponent } from '../create-component.ts'
-import type { CreateEmits } from '../create-emits.ts'
-
-/**
- * Props for the {@link AutocompleteList} component.
- */
-export interface AutocompleteListProps extends Partial<Props> {}
-
-/**
- * Emits for the {@link AutocompleteList} component.
- */
-export interface AutocompleteListEmits extends CreateEmits<Events> {}
-
-export const AutocompleteList: DefineSetupFnComponent<
-  AutocompleteListProps & HTMLAttributes,
-  AutocompleteListEmits
-> = createComponent<
-  AutocompleteListProps,
-  AutocompleteListEmits
->(
-  'prosekit-autocomplete-list',
-  'AutocompleteList',
-  Object.keys(autocompleteListProps),
-  Object.keys(autocompleteListEvents),
-)

package/src/components/autocomplete/autocomplete-popover.gen.ts

@@ -1,33 +0,0 @@
-import {
-  autocompletePopoverProps,
-  autocompletePopoverEvents,
-  type AutocompletePopoverProps as Props,
-  type AutocompletePopoverEvents as Events,
-} from '@prosekit/web/autocomplete'
-import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
-
-import { createComponent } from '../create-component.ts'
-import type { CreateEmits } from '../create-emits.ts'
-
-/**
- * Props for the {@link AutocompletePopover} component.
- */
-export interface AutocompletePopoverProps extends Partial<Props> {}
-
-/**
- * Emits for the {@link AutocompletePopover} component.
- */
-export interface AutocompletePopoverEmits extends CreateEmits<Events> {}
-
-export const AutocompletePopover: DefineSetupFnComponent<
-  AutocompletePopoverProps & HTMLAttributes,
-  AutocompletePopoverEmits
-> = createComponent<
-  AutocompletePopoverProps,
-  AutocompletePopoverEmits
->(
-  'prosekit-autocomplete-popover',
-  'AutocompletePopover',
-  Object.keys(autocompletePopoverProps),
-  Object.keys(autocompletePopoverEvents),
-)

package/src/components/block-handle/block-handle-popover.gen.ts

@@ -1,33 +0,0 @@
-import {
-  blockHandlePopoverProps,
-  blockHandlePopoverEvents,
-  type BlockHandlePopoverProps as Props,
-  type BlockHandlePopoverEvents as Events,
-} from '@prosekit/web/block-handle'
-import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
-
-import { createComponent } from '../create-component.ts'
-import type { CreateEmits } from '../create-emits.ts'
-
-/**
- * Props for the {@link BlockHandlePopover} component.
- */
-export interface BlockHandlePopoverProps extends Partial<Props> {}
-
-/**
- * Emits for the {@link BlockHandlePopover} component.
- */
-export interface BlockHandlePopoverEmits extends CreateEmits<Events> {}
-
-export const BlockHandlePopover: DefineSetupFnComponent<
-  BlockHandlePopoverProps & HTMLAttributes,
-  BlockHandlePopoverEmits
-> = createComponent<
-  BlockHandlePopoverProps,
-  BlockHandlePopoverEmits
->(
-  'prosekit-block-handle-popover',
-  'BlockHandlePopover',
-  Object.keys(blockHandlePopoverProps),
-  Object.keys(blockHandlePopoverEvents),
-)

package/src/components/create-component.ts

@@ -1,84 +0,0 @@
-import { defineComponent, h, onMounted, ref, watchEffect, type DefineSetupFnComponent, type EmitsOptions, type HTMLAttributes } from 'vue'
-
-import { useEditorContext } from '../injection/editor-context.ts'
-
-export function createComponent<
-  Props extends { [PropName in keyof Props]: unknown },
-  Emits extends EmitsOptions,
->(
-  tagName: string,
-  displayName: string,
-  propNames: string[],
-  eventNames: string[],
-): DefineSetupFnComponent<Partial<Props> & HTMLAttributes, Emits> {
-  const hasEditor = propNames.includes('editor')
-
-  const Component = defineComponent<any, any>(
-    (props: Record<string, unknown>, { slots, emit }) => {
-      const editor = useEditorContext()
-
-      const mounted = ref(false)
-
-      onMounted(() => {
-        mounted.value = true
-      })
-
-      const elementRef = ref<HTMLElement | null>(null)
-
-      watchEffect((onCleanup) => {
-        const element = elementRef.value
-        if (!element) return
-
-        const eventHandlers: Record<string, (event: Event) => void> = {}
-        for (const eventName of eventNames) {
-          const extractDetail = eventName.endsWith('Change')
-          eventHandlers[eventName] = (event: Event) => {
-            emit(
-              eventName,
-              extractDetail ? (event as CustomEvent).detail : event,
-            )
-          }
-        }
-
-        for (const [eventName, handler] of Object.entries(eventHandlers)) {
-          element.addEventListener(eventName, handler)
-        }
-
-        onCleanup(() => {
-          for (const [eventName, handler] of Object.entries(eventHandlers)) {
-            element.removeEventListener(eventName, handler)
-          }
-        })
-      })
-
-      return () => {
-        const properties: Record<string, unknown> = {}
-
-        for (const [key, value] of Object.entries(props)) {
-          if (value !== undefined && !key.startsWith('.')) {
-            properties[propNames.includes(key) ? '.' + key : key] = value
-          }
-        }
-
-        // Try to add the editor prop if it's missing.
-        if (hasEditor && editor && !properties['editor']) {
-          properties.editor = editor
-        }
-
-        // Ensure web components work after SSR hydration.
-        properties.key = mounted.value ? 1 : 0
-
-        properties.ref = elementRef
-
-        return h(tagName, properties, slots.default?.())
-      }
-    },
-    {
-      name: displayName,
-      props: propNames,
-      emits: eventNames,
-    },
-  )
-
-  return Component
-}

package/src/components/create-emits.ts

@@ -1,8 +0,0 @@
-export type CreateEmits<
-  Events extends { [EventName in keyof Events]: CustomEvent },
-> = {
-  [EventName in keyof Events]: (
-    event: EventName extends `${string}Change` ? Events[EventName]['detail']
-      : Events[EventName],
-  ) => void
-}

package/src/components/inline-popover/inline-popover.gen.ts

@@ -1,33 +0,0 @@
-import {
-  inlinePopoverProps,
-  inlinePopoverEvents,
-  type InlinePopoverProps as Props,
-  type InlinePopoverEvents as Events,
-} from '@prosekit/web/inline-popover'
-import type { DefineSetupFnComponent, HTMLAttributes } from 'vue'
-
-import { createComponent } from '../create-component.ts'
-import type { CreateEmits } from '../create-emits.ts'
-
-/**
- * Props for the {@link InlinePopover} component.
- */
-export interface InlinePopoverProps extends Partial<Props> {}
-
-/**
- * Emits for the {@link InlinePopover} component.
- */
-export interface InlinePopoverEmits extends CreateEmits<Events> {}
-
-export const InlinePopover: DefineSetupFnComponent<
-  InlinePopoverProps & HTMLAttributes,
-  InlinePopoverEmits
-> = createComponent<
-  InlinePopoverProps,
-  InlinePopoverEmits
->(
-  'prosekit-inline-popover',
-  'InlinePopover',
-  Object.keys(inlinePopoverProps),
-  Object.keys(inlinePopoverEvents),
-)