@prosekit/lit 0.1.8 → 0.2.0

package/dist/_tsup-dts-rollup.d.ts

@@ -1,16 +1,23 @@
 import { AutoUpdateOptions } from '@floating-ui/dom';
-import { ComputePositionConfig } from '@floating-ui/dom';
+import type { Boundary } from '@floating-ui/dom';
+import type { ComputePositionReturn } from '@floating-ui/dom';
 import { CSSResult } from 'lit';
 import { Editor } from '@prosekit/core';
 import type { EditorView } from '@prosekit/pm/view';
+import { Extension } from '@prosekit/core';
+import type { FloatingElement } from '@floating-ui/dom';
+import { FocusChangeHandler } from '@prosekit/core';
 import { Keymap } from '@prosekit/core';
 import { LitElement } from 'lit';
 import { Options } from 'tsup';
+import type { Placement } from '@floating-ui/dom';
 import { PropertyValues } from 'lit';
 import { ReactiveController } from 'lit';
 import { ReactiveControllerHost } from 'lit';
+import type { ReferenceElement } from '@floating-ui/dom';
 import type { Selection as Selection_2 } from '@prosekit/pm/state';
 import { TemplateResult } from 'lit';
+import { UpdateHandler } from '@prosekit/core';
 import { VirtualElement } from '@floating-ui/dom';
 
 export declare class AutocompleteEmpty extends LightElement implements AutocompleteEmptyProps {
@@ -135,43 +142,33 @@ export declare class AutocompletePopover extends Popover implements Partial<Auto
      */
     static properties: {
         editor: {
+            type: ObjectConstructor;
+            reflect: false;
             attribute: false;
         };
         regex: {
             attribute: false;
         };
-        popoverOptions: {
+        positioning: {
+            type: ObjectConstructor;
+            reflect: false;
             attribute: false;
         };
-        onSelect: {
+        reference: {
             attribute: false;
         };
-        active: {
+        open: {
             type: BooleanConstructor;
-            reflect: true;
-        };
-        reference: {
+            reflect: false;
             attribute: false;
         };
-        options: {
+        onOpenChange: {
             attribute: false;
         };
-        autoUpdate: {
-            type: BooleanConstructor;
-            reflect: true;
-        };
-        autoUpdateOptions: {
-            type: ObjectConstructor;
-        };
-        dismiss: {
-            type: StringConstructor;
-            reflect: true;
-        };
     };
     editor?: Editor;
     regex?: RegExp;
-    popoverOptions: PopoverOptions;
-    onSelect?: VoidFunction;
+    positioning?: PositioningOptions;
     private context;
     private get list();
     private updateContext;
@@ -215,20 +212,13 @@ export declare class AutocompletePopoverController implements ReactiveController
 export declare interface AutocompletePopoverProps {
     editor: Editor;
     regex: RegExp;
-    popoverOptions?: PopoverOptions;
+    positioning?: PositioningOptions;
 }
 
 export { AutoUpdateOptions }
 
 export declare const blockComponentStyles: CSSResult;
 
-/**
- * If the browser supports the Popover API, we use the body as the boundary
- * since we don't need to worry about the popover overflowing the parent
- * element.
- */
-export declare const boundary: HTMLElement | undefined;
-
 export declare function calcResize(position: 'top' | 'right' | 'bottom' | 'left' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right', w: number, h: number, dx: number, dy: number, aspectRatio: number | null | undefined): [w: number, h: number];
 
 /**
@@ -242,26 +232,21 @@ export declare class ComboBox extends Popover {
         onDismiss: {
             attribute: false;
         };
-        active: {
-            type: BooleanConstructor;
-            reflect: true;
-        };
         reference: {
             attribute: false;
         };
-        options: {
+        open: {
+            type: BooleanConstructor;
+            reflect: false;
             attribute: false;
         };
-        autoUpdate: {
-            type: BooleanConstructor;
-            reflect: true;
+        onOpenChange: {
+            attribute: false;
         };
-        autoUpdateOptions: {
+        positioning: {
             type: ObjectConstructor;
-        };
-        dismiss: {
-            type: StringConstructor;
-            reflect: true;
+            reflect: false;
+            attribute: false;
         };
     };
     onDismiss?: VoidFunction;
@@ -405,22 +390,26 @@ export declare const default_alias_1: {
 };
 
 /**
- * Default popover options.
+ * If the browser supports the Popover API, we use the body as the boundary
+ * since we don't need to worry about the popover overflowing the parent
+ * element.
  */
-export declare const defaultPopoverOptions: PopoverOptions;
+export declare const defaultBoundary: HTMLElement | undefined;
 
 /**
- * Default popover options.
+ * @internal
  */
-export declare const defaultPopoverOptions_alias_1: PopoverOptions;
-
-export declare const defaultPopoverOptions_alias_2: PopoverOptions;
+export declare const defaultOptions: PositioningOptions;
 
 export declare function defaultQueryBuilder(match: RegExpExecArray): string;
 
 export declare function defineCustomElement(name: string, constructor: CustomElementConstructor, options?: ElementDefinitionOptions): void;
 
-export declare function getVirtualSelectionElement(view: EditorView): Range | undefined;
+export declare function getPlacement(reference: ReferenceElement | null, floating: FloatingElement | null, options: PositioningOptions): (() => void) | undefined;
+
+export declare function getReferenceContextElement(reference: HTMLElement | VirtualElement | undefined | null): HTMLElement | null;
+
+export declare function getVirtualSelectionElement(view: EditorView): ReferenceElement | undefined;
 
 export declare class InlinePopover extends Popover implements Partial<InlinePopoverProps> {
     /**
@@ -430,67 +419,42 @@ export declare class InlinePopover extends Popover implements Partial<InlinePopo
         editor: {
             attribute: false;
         };
-        popoverOptions: {
+        reference: {
             attribute: false;
         };
-        active: {
+        open: {
             type: BooleanConstructor;
-            reflect: true;
-        };
-        reference: {
+            reflect: false;
             attribute: false;
         };
-        options: {
+        onOpenChange: {
             attribute: false;
         };
-        autoUpdate: {
-            type: BooleanConstructor;
-            reflect: true;
-        };
-        autoUpdateOptions: {
+        positioning: {
             type: ObjectConstructor;
-        };
-        dismiss: {
-            type: StringConstructor;
-            reflect: true;
+            reflect: false;
+            attribute: false;
         };
     };
     editor?: Editor;
-    popoverOptions: PopoverOptions;
-    dismiss: "escape";
+    positioning?: PositioningOptions;
     /**
      * @hidden
      */
-    private controller;
+    constructor();
     /**
      * @hidden
      */
-    willUpdate(): void;
+    protected updated(changedProperties: PropertyValues<this>): void;
     /**
      * @hidden
      */
     hide(): void;
 }
 
-export declare class InlinePopoverController implements ReactiveController {
-    private host;
-    reference?: VirtualElement;
-    private editor?;
-    private cleanupExtension?;
-    private cleanupEventListener?;
-    private mouseHovering;
-    constructor(host: ReactiveControllerHost);
-    setEditor(editor: Editor): void;
-    hostConnected(): void;
-    hostDisconnected(): void;
-    private update;
-    private defineExtension;
-}
-
-export declare interface InlinePopoverProps {
+export declare type InlinePopoverProps = {
     editor: Editor;
-    popoverOptions?: PopoverOptions;
-}
+} & PopoverProps;
 
 export declare function isAutocompleteItem(element?: Element | null): element is AutocompleteItem;
 
@@ -561,35 +525,61 @@ export declare class Popover extends LightElement implements Partial<PopoverProp
      * @hidden
      */
     static properties: {
-        active: {
-            type: BooleanConstructor;
-            reflect: true;
-        };
         reference: {
             attribute: false;
         };
-        options: {
+        open: {
+            type: BooleanConstructor;
+            reflect: false;
             attribute: false;
         };
-        autoUpdate: {
-            type: BooleanConstructor;
-            reflect: true;
+        onOpenChange: {
+            attribute: false;
         };
-        autoUpdateOptions: {
+        positioning: {
             type: ObjectConstructor;
-        };
-        dismiss: {
-            type: StringConstructor;
-            reflect: true;
+            reflect: false;
+            attribute: false;
         };
     };
+    reference?: HTMLElement | VirtualElement;
+    open?: boolean;
+    onOpenChange?: ((open: boolean) => void) | undefined;
+    positioning?: PositioningOptions;
     /**
-     * Controls the visibility of the popover element. When set to `true`, the
-     * popover is displayed and positioned relative to its reference element. When
-     * set to `false`, the popover is hidden and its positioning logic is
-     * deactivated.
+     * @hidden
      */
-    active: boolean;
+    constructor();
+    /**
+     * @hidden
+     */
+    connectedCallback(): void;
+    private updatePopoverAttribute;
+    private updateDateAttributes;
+    /**
+     * @hidden
+     */
+    protected updated(changedProperties: PropertyValues<this>): void;
+    /**
+     * @hidden
+     */
+    hide(): void;
+}
+
+/**
+ * Whether the browser supports the [Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API).
+ */
+export declare const popoverAvailable: boolean;
+
+export declare interface PopoverProps {
+    /**
+     * Whether the popover is open.
+     */
+    open?: boolean;
+    /**
+     * Function invoked when the popover opens or closes.
+     */
+    onOpenChange?: (open: boolean) => void;
     /**
      * The element that the popover is anchored to. This can be either a DOM
      * element or an object that implements the virtual element interface from
@@ -597,105 +587,132 @@ export declare class Popover extends LightElement implements Partial<PopoverProp
      */
     reference?: Element | VirtualElement;
     /**
-     * The options that are passed to the `computePosition` function from Floating
-     * UI. These options are used to configure the positioning of the popover
-     * element relative to its reference element. For more information on the
-     * available options, please refer to the Floating UI documentation.
+     * The user provided options used to position the popover content.
      */
-    options?: PopoverOptions;
+    positioning?: PositioningOptions;
+}
+
+declare const popoverPropsNames: readonly ["open", "onOpenChange", "reference", "positioning"];
+export { popoverPropsNames }
+export { popoverPropsNames as propNames_alias_13 }
+
+/**
+ * @public
+ */
+declare interface PositioningOptions {
     /**
-     * Controls whether the popover position is automatically updated when the
-     * reference element changes position. When set to `true`, the popover
-     * position is updated automatically. When set to `false`, the popover
-     * position is only updated when the given properties are changed.
+     * The strategy to use for positioning
      *
-     * @default false
+     * @default 'absolute'
      */
-    autoUpdate: boolean;
+    strategy?: 'absolute' | 'fixed';
     /**
-     * The options that are passed to the `autoUpdate` function from Floating UI.
-     * These options are used to configure the automatic update behavior of the
-     * popover position. For more information on the available options, please
-     * refer to the Floating UI documentation. This property is only used when the
-     * `autoUpdate` property is set to `true`.
+     * The initial placement of the floating element
+     *
+     * @default 'bottom'
      */
-    autoUpdateOptions?: AutoUpdateOptions;
+    placement?: Placement;
     /**
-     * Controls whether the popover should be dismissed based on user interaction.
+     * Options to activate auto-update listeners
      *
-     * Available options:
+     * @default true
+     */
+    autoUpdate?: boolean | AutoUpdateOptions;
+    /**
+     * The virtual padding around the viewport edges to check for overflow
      *
-     * - "off": The popover is not dismissed.
-     * - "on": The popover is dismissed when the user clicks outside of the popover or presses the escape key.
-     * - "click": The popover is dismissed when the user clicks outside of the popover.
-     * - "escape": The popover is dismissed when the user presses the escape key.
+     * @default 8
+     */
+    overflowPadding?: number;
+    /**
+     * Whether to flip the placement
      *
-     * @default "on"
+     * @default true
      */
-    dismiss: 'off' | 'on' | 'click' | 'escape';
+    flip?: boolean | Placement[];
     /**
-     * @hidden
+     * Whether the floating element should shift to keep it in view.
+     *
+     * @default true
      */
-    private disposeAutoUpdate?;
+    shift?: boolean;
     /**
-     * @hidden
+     * Whether the floating element can overlap the reference element
+     *
+     * @default false
      */
-    private disposeEventListeners?;
+    overlap?: boolean;
     /**
-     * @hidden
+     * Whether to improve positioning for inline reference elements that span over
+     * multiple lines.
+     *
+     * @default false
      */
-    connectedCallback(): void;
+    inline?: boolean;
     /**
-     * @hidden
+     * Whether to hide the floating element when the reference element is fully clipped.
+     *
+     * @default true
      */
-    disconnectedCallback(): void;
+    hide?: boolean;
     /**
-     * @hidden
+     * Whether to make the floating element same width as the reference element
+     *
+     * @default false
      */
-    protected updated(changedProperties: PropertyValues<this>): void;
+    sameWidth?: boolean;
     /**
-     * @hidden
+     * Whether the popover should fit the viewport.
+     *
+     * @default false
      */
-    private start;
+    fitViewport?: boolean;
     /**
-     * @hidden
+     * The distance between the reference and floating element.
+     *
+     * @default 8
+     */
+    offset?: number | {
+        mainAxis?: number;
+        crossAxis?: number;
+        alignmentAxis?: number;
+    };
+    /**
+     * The overflow boundary of the reference element
+     *
+     * @default undefined
      */
-    private compute;
+    boundary?: Boundary | (() => Boundary);
     /**
-     * @hidden
+     * Function called when the placement is computed
+     *
+     * @default undefined
      */
-    hide(): void;
-    private handleDocumentMouseDown;
-    private handleDocumentKeyDown;
-}
-
-/**
- * Whether the browser supports the [Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API).
- */
-export declare const popoverAvailable: boolean;
-
-/**
- * The `PopoverOptions` interface defines the options that can be passed to the
- * `computePosition` function from Floating UI. These options are used to
- * configure the positioning of the popover element relative to its reference
- * element. For more information on the available options, please refer to the
- * Floating UI documentation.
- *
- * https://floating-ui.com/docs/computeposition#options
- */
-declare type PopoverOptions = ComputePositionConfig;
-export { PopoverOptions }
-export { PopoverOptions as PopoverOptions_alias_1 }
-export { PopoverOptions as PopoverOptions_alias_2 }
-export { PopoverOptions as PopoverOptions_alias_3 }
-
-export declare interface PopoverProps {
-    active: boolean;
-    reference?: Element | VirtualElement;
-    options?: PopoverOptions;
-    autoUpdate?: boolean;
-    autoUpdateOptions?: AutoUpdateOptions;
+    onComplete?(data: ComputePositionReturn): void;
+    /**
+     * Function called on cleanup of all listeners
+     *
+     * @default undefined
+     */
+    onCleanup?: VoidFunction;
+    /**
+     * Function called when the escape key is down. By default, the popover is
+     * hidden when the escape key is down. It can be prevented by calling
+     * `event.preventDefault`.
+     */
+    onEscapeKeyDown?: (event: KeyboardEvent) => void;
+    /**
+     * Function called when when pointer down event happens outside of the
+     * popover. By default, the popover is hidden when the pointer down event
+     * happens outside of the popover. It can be prevented by calling
+     * `event.preventDefault`.
+     */
+    onPointerDownOutside?: (event: Event) => void;
 }
+export { PositioningOptions }
+export { PositioningOptions as PositioningOptions_alias_1 }
+export { PositioningOptions as PositioningOptions_alias_2 }
+export { PositioningOptions as PositioningOptions_alias_3 }
 
 /**
  * @internal
@@ -738,11 +755,9 @@ declare const propNames_7: readonly [];
 export { propNames_7 as propNames_alias_16 }
 export { propNames_7 as propNames_alias_17 }
 
-export declare const propNames_alias_12: readonly ["editor", "popoverOptions"];
-
-export declare const propNames_alias_13: readonly ["active", "reference", "options", "autoUpdate", "autoUpdateOptions"];
+export declare const propNames_alias_12: readonly ["editor", "open", "onOpenChange", "reference", "positioning"];
 
-export declare const propNames_alias_5: readonly ["editor", "regex", "popoverOptions"];
+export declare const propNames_alias_5: readonly ["editor", "regex", "positioning"];
 
 /**
  * @internal
@@ -787,6 +802,10 @@ declare class Resizable extends LightElement implements Partial<ResizableProps>
             reflect: true;
         };
     };
+    /**
+     * @hidden
+     */
+    constructor();
     width?: number | string;
     height?: number | string;
     aspectRatio?: number;
@@ -806,7 +825,6 @@ declare class Resizable extends LightElement implements Partial<ResizableProps>
         width: number;
         height: number;
     }) => void;
-    private context;
     private startWidth;
     private startHeight;
     private handleResizeStart;
@@ -902,4 +920,31 @@ export { ResizableProps as ResizableProps_alias_1 }
 /** Rounds a value to the nearest device pixel ratio. */
 export declare function roundByDPR(value: number): number;
 
+export declare function setFloatingStyles(element: HTMLElement, options: PositioningOptions): void;
+
+export declare function useDismissable(host: LitElement, { onEscapeKeyDown, onPointerDownOutside, onDismiss, getReference, }: {
+    onEscapeKeyDown: (event: KeyboardEvent) => void;
+    onPointerDownOutside: (event: Event) => void;
+    onDismiss?: VoidFunction;
+    getReference?: () => ReferenceElement | null | undefined;
+}): void;
+
+export declare function useEditorExtension(host: WithEditor<ReactiveControllerHost>, extension: Extension): void;
+
+export declare function useEditorFocusChangeEvent(host: WithEditor<ReactiveControllerHost>, handler: FocusChangeHandler): void;
+
+export declare function useEditorUpdateEvent(host: WithEditor<ReactiveControllerHost>, handler: UpdateHandler): void;
+
+export declare function useEffect<T>(host: ReactiveControllerHost, getValue: () => T, onChange: (value: T) => void): void;
+
+export declare function useInlinePopover(host: WithEditor<LitElement>, onReferenceChange: (reference: ReferenceElement | undefined) => void): () => ReferenceElement | undefined;
+
+export declare function usePointerDownEvent(host: LitElement, handler: (event: PointerEvent) => void): void;
+
+export declare function usePopover(host: LitElement, getReference: () => ReferenceElement | null, getPositioning: () => PositioningOptions | null): void;
+
+export declare type WithEditor<T> = T & {
+    editor?: Editor | undefined | null;
+};
+
 export { }