@prosekit/lit 0.0.9 → 0.0.11

package/dist/{chunk-HPMQEYGA.js → chunk-KGZID7N7.js}

@@ -1,8 +1,13 @@
 import {
-  __decorateClass,
-  blockComponentStyles,
   commandListContext
-} from "./chunk-J73E7P6J.js";
+} from "./chunk-DYEHERSG.js";
+import {
+  ListManager
+} from "./chunk-PCXKL6TA.js";
+import {
+  __decorateClass,
+  blockComponentStyles
+} from "./chunk-3UDA5JEW.js";
 
 // src/components/autocomplete-popover/context.ts
 import { createContext } from "@lit-labs/context";
@@ -13,7 +18,7 @@ var commandPopoverContext = createContext(
 // src/components/autocomplete-list/component.ts
 import { consume, provide } from "@lit-labs/context";
 import "@prosekit/core";
-import { html, LitElement } from "lit";
+import { LitElement, html } from "lit";
 import { customElement, property, query, state } from "lit/decorators.js";
 
 // src/utils/command-score.ts
@@ -25,6 +30,19 @@ function isAutocompleteItem(element) {
   var _a;
   return ((_a = element == null ? void 0 : element.tagName) == null ? void 0 : _a.toLowerCase()) === "prosekit-autocomplete-item";
 }
+function queryClosestAutocompleteItem(element) {
+  if (!element) {
+    return null;
+  }
+  if (isAutocompleteItem(element)) {
+    return element;
+  }
+  const item = element.closest("prosekit-autocomplete-item");
+  if (isAutocompleteItem(item)) {
+    return item;
+  }
+  return null;
+}
 
 // src/components/autocomplete-list/controller.ts
 import {
@@ -70,34 +88,30 @@ var AutocompleteList = class extends LitElement {
   constructor() {
     super(...arguments);
     /** @hidden */
-    this.controller = new AutocompleteListController(this, {
-      ArrowUp: () => {
-        if (!this.active)
-          return false;
-        this.updateSelectedByChange(-1);
-        return true;
-      },
-      ArrowDown: () => {
-        if (!this.active)
-          return false;
-        this.updateSelectedByChange(1);
-        return true;
-      },
-      Escape: () => {
+    this.listManager = new ListManager({
+      getItems: () => this.items,
+      getSelectedValue: () => this.context.selectedValue,
+      setSelectedValue: (value) => this.updateValue(value),
+      getItemValue: (item) => item.content,
+      queryClosestItem: queryClosestAutocompleteItem,
+      getActive: () => this.active,
+      onDismiss: () => {
         var _a, _b;
-        if (!this.active)
-          return false;
-        (_b = (_a = this.popoverContext) == null ? void 0 : _a.handleDismiss) == null ? void 0 : _b.call(_a);
-        return true;
+        return (_b = (_a = this.popoverContext) == null ? void 0 : _a.handleDismiss) == null ? void 0 : _b.call(_a);
       },
-      Enter: () => {
-        if (!this.active)
-          return false;
-        this.handleSelect(this.selectedItem);
-        return true;
+      onSelect: (item) => {
+        var _a, _b, _c;
+        (_b = (_a = this.popoverContext) == null ? void 0 : _a.handleSubmit) == null ? void 0 : _b.call(_a);
+        (_c = item == null ? void 0 : item.onSelect) == null ? void 0 : _c.call(item);
       }
     });
-    this.lastMouseMoveTime = 0;
+    /** @hidden */
+    this.controller = new AutocompleteListController(this, {
+      ArrowUp: () => this.listManager.handleArrowUp(),
+      ArrowDown: () => this.listManager.handleArrowDown(),
+      Escape: () => this.listManager.handleEscape(),
+      Enter: () => this.listManager.handleEnter()
+    });
     this.popoverContext = null;
     this.context = {
       scores: /* @__PURE__ */ new Map(),
@@ -110,30 +124,30 @@ var AutocompleteList = class extends LitElement {
     return (_b = (_a = this.popoverContext) == null ? void 0 : _a.active) != null ? _b : false;
   }
   firstUpdated() {
-    this.selectFirstItem();
+    this.listManager.selectFirstItem();
+    this.addEventListener(
+      "mousemove",
+      (event) => this.listManager.handleMouseMove(event)
+    );
+    this.addEventListener(
+      "mouseover",
+      (event) => this.listManager.handleMouseOver(event)
+    );
+    this.addEventListener(
+      "mousedown",
+      (event) => this.listManager.handleMouseDown(event)
+    );
+    this.addEventListener(
+      "click",
+      (event) => this.listManager.handleClick(event)
+    );
   }
   get items() {
     var _a, _b, _c;
     return (_c = (_b = (_a = this.defaultSlot) == null ? void 0 : _a.assignedElements({ flatten: true })) == null ? void 0 : _b.filter(isAutocompleteItem)) != null ? _c : [];
   }
-  get availableItems() {
-    var _a, _b;
-    return (_b = (_a = this.items) == null ? void 0 : _a.filter((item) => !item.hidden)) != null ? _b : [];
-  }
-  get firstItem() {
-    var _a;
-    return (_a = this.availableItems[0]) != null ? _a : null;
-  }
-  get selectedItem() {
-    var _a;
-    return (_a = this.availableItems.find(
-      (item) => item.content === this.context.selectedValue
-    )) != null ? _a : null;
-  }
   selectFirstItem() {
-    var _a, _b;
-    const selected = (_b = (_a = this.firstItem) == null ? void 0 : _a.content) != null ? _b : "";
-    this.updateValue(selected);
+    this.listManager.selectFirstItem();
   }
   updateValue(selectedValue) {
     if (this.context.selectedValue === selectedValue)
@@ -165,54 +179,9 @@ var AutocompleteList = class extends LitElement {
     );
     this.context = { ...this.context, scores };
   }
-  updateSelectedByChange(change) {
-    const items = this.availableItems;
-    if (items.length === 0) {
-      return;
-    }
-    const selectedItem = this.selectedItem;
-    const selectedIndex = selectedItem ? items.indexOf(selectedItem) : -1;
-    let nextIndex = selectedIndex + change;
-    if (nextIndex < 0) {
-      nextIndex = 0;
-    } else if (nextIndex >= items.length) {
-      nextIndex = items.length - 1;
-    }
-    if (selectedIndex !== nextIndex) {
-      this.updateValue(items[nextIndex].content);
-    }
-  }
-  handleMouseMove() {
-    this.lastMouseMoveTime = Date.now();
-  }
-  handleMouseOver(event) {
-    if (this.lastMouseMoveTime + 500 < Date.now()) {
-      return;
-    }
-    const target = event.target;
-    if (isAutocompleteItem(target)) {
-      this.updateValue(target.content);
-    }
-  }
-  handleClick(event) {
-    event.preventDefault();
-    const target = event.target;
-    const item = target == null ? void 0 : target.closest("prosekit-autocomplete-item");
-    if (item && isAutocompleteItem(item)) {
-      this.handleSelect(item);
-    }
-  }
-  handleMouseDown(event) {
-    event.preventDefault();
-  }
-  handleSelect(item) {
-    var _a, _b, _c;
-    (_b = (_a = this.popoverContext) == null ? void 0 : _a.handleSubmit) == null ? void 0 : _b.call(_a);
-    (_c = item == null ? void 0 : item.onSelect) == null ? void 0 : _c.call(item);
-  }
   /** @hidden */
   render() {
-    return html`<div role="listbox" aria-label="Suggestions" @mousemove="${this.handleMouseMove.bind(this)}" @mouseover="${this.handleMouseOver.bind(this)}" @click="${this.handleClick.bind(this)}" @mousedown="${this.handleMouseDown.bind(this)}"><slot></slot></div>`;
+    return html`<slot></slot>`;
   }
 };
 /** @hidden */

package/dist/chunk-PCXKL6TA.js

@@ -0,0 +1,109 @@
+// src/manager/list-manager.ts
+var ListManager = class {
+  constructor(options) {
+    this.lastMouseMoveTime = 0;
+    this.getItems = options.getItems;
+    this.getSelectedValue = options.getSelectedValue;
+    this.setSelectedValue = options.setSelectedValue;
+    this.getItemValue = options.getItemValue;
+    this.queryClosestItem = options.queryClosestItem;
+    this.getActive = options.getActive;
+    this.onDismiss = options.onDismiss;
+    this.onSelect = options.onSelect;
+  }
+  get items() {
+    return this.getItems();
+  }
+  get availableItems() {
+    var _a, _b;
+    return (_b = (_a = this.items) == null ? void 0 : _a.filter((item) => !item.hidden)) != null ? _b : [];
+  }
+  get firstItem() {
+    var _a;
+    return (_a = this.availableItems[0]) != null ? _a : null;
+  }
+  get selectedItem() {
+    var _a;
+    return (_a = this.availableItems.find(
+      (item) => this.getItemValue(item) === this.getSelectedValue()
+    )) != null ? _a : null;
+  }
+  updateSelectedByChange(change) {
+    const items = this.availableItems;
+    if (items.length === 0) {
+      return;
+    }
+    const selectedItem = this.selectedItem;
+    const selectedIndex = selectedItem ? items.indexOf(selectedItem) : -1;
+    let nextIndex = selectedIndex + change;
+    if (nextIndex < 0) {
+      nextIndex = 0;
+    } else if (nextIndex >= items.length) {
+      nextIndex = items.length - 1;
+    }
+    if (selectedIndex !== nextIndex) {
+      this.setSelectedValue(this.getItemValue(items[nextIndex]));
+    }
+  }
+  handleSelect(item) {
+    this.setSelectedValue(this.getItemValue(item));
+  }
+  selectFirstItem() {
+    const item = this.firstItem;
+    const value = item ? this.getItemValue(item) : "";
+    this.setSelectedValue(value);
+  }
+  handleMouseMove(_event) {
+    this.lastMouseMoveTime = Date.now();
+  }
+  handleMouseOver(event) {
+    if (this.lastMouseMoveTime + 500 < Date.now()) {
+      return;
+    }
+    const target = event.target;
+    const item = target && this.queryClosestItem(target);
+    if (item) {
+      this.setSelectedValue(this.getItemValue(item));
+    }
+  }
+  handleMouseDown(event) {
+    event.preventDefault();
+  }
+  handleClick(event) {
+    event.preventDefault();
+    const target = event.target;
+    const item = target && this.queryClosestItem(target);
+    if (item) {
+      this.handleSelect(item);
+      this.onSelect(item);
+    }
+  }
+  handleArrowUp() {
+    if (!this.getActive())
+      return false;
+    this.updateSelectedByChange(-1);
+    return true;
+  }
+  handleArrowDown() {
+    if (!this.getActive())
+      return false;
+    this.updateSelectedByChange(1);
+    return true;
+  }
+  handleEscape() {
+    if (!this.getActive())
+      return false;
+    this.onDismiss();
+    return true;
+  }
+  handleEnter() {
+    if (!this.getActive())
+      return false;
+    this.onSelect(this.selectedItem);
+    return true;
+  }
+};
+
+export {
+  ListManager
+};

package/dist/chunk-TRZW33VF.js

@@ -0,0 +1,35 @@
+import {
+  blockComponentStyles
+} from "./chunk-3UDA5JEW.js";
+
+// src/components/block-element/index.ts
+import { LitElement } from "lit";
+var BlockElement = class extends LitElement {
+  setHidden(hidden) {
+    if (this.hidden !== hidden) {
+      this.hidden = hidden;
+      const display = this.style.display;
+      this.style.display = hidden ? "none" : display === "none" ? "" : display;
+    }
+  }
+};
+var LightBlockElement = class extends BlockElement {
+  createRenderRoot() {
+    return this;
+  }
+};
+var ShadowBlockElement = class extends BlockElement {
+  setHidden(hidden) {
+    if (this.hidden !== hidden) {
+      this.hidden = hidden;
+      const display = this.style.display;
+      this.style.display = hidden ? "none" : display === "none" ? "" : display;
+    }
+  }
+};
+/** @hidden */
+ShadowBlockElement.styles = blockComponentStyles;
+
+export {
+  LightBlockElement
+};

package/dist/prosekit-lit-components-autocomplete-empty.d.ts

@@ -1,17 +1,3 @@
-import * as lit from 'lit';
-import { LitElement, CSSResultGroup, PropertyValues } from 'lit';
-import { A as AutocompleteListContext } from './context-19474449.js';
-
-declare const propNames: readonly [];
-interface AutocompleteEmptyProps {
-}
-declare class AutocompleteEmpty extends LitElement implements AutocompleteEmptyProps {
-    /** @hidden */
-    static styles: CSSResultGroup;
-    listContext?: AutocompleteListContext;
-    protected willUpdate(_changedProperties: PropertyValues<this>): void;
-    /** @hidden */
-    render(): lit.TemplateResult<1> | null;
-}
-
-export { AutocompleteEmpty, AutocompleteEmptyProps, propNames };
+export { propNames } from './_tsup-dts-rollup';
+export { AutocompleteEmptyProps } from './_tsup-dts-rollup';
+export { AutocompleteEmpty } from './_tsup-dts-rollup';

package/dist/prosekit-lit-components-autocomplete-empty.js

@@ -1,8 +1,10 @@
 import {
-  __decorateClass,
-  blockComponentStyles,
   commandListContext
-} from "./chunk-J73E7P6J.js";
+} from "./chunk-DYEHERSG.js";
+import {
+  __decorateClass,
+  blockComponentStyles
+} from "./chunk-3UDA5JEW.js";
 
 // src/components/autocomplete-empty/index.ts
 import { consume } from "@lit-labs/context";

package/dist/prosekit-lit-components-autocomplete-item.d.ts

@@ -1,32 +1,3 @@
-import * as lit from 'lit';
-import { LitElement, CSSResultGroup, PropertyValues } from 'lit';
-import { A as AutocompleteListContext } from './context-19474449.js';
-
-declare const propNames: readonly ["value", "onSelect"];
-interface AutocompleteItemProps {
-    value?: string;
-    onSelect: VoidFunction;
-}
-/**
- * Command menu item. Becomes active on pointer enter or through keyboard
- * navigation. Preferably pass a `value`, otherwise the value will be inferred
- * from the rendered item's `textContent`.
- */
-declare class AutocompleteItem extends LitElement implements Partial<AutocompleteItemProps> {
-    /** @hidden */
-    static styles: CSSResultGroup;
-    value: string;
-    selected: boolean;
-    /** @hidden */
-    onSelect?: VoidFunction;
-    /** @hidden */
-    defaultSlot?: HTMLSlotElement;
-    listContext?: AutocompleteListContext;
-    get content(): string;
-    protected willUpdate(changedProperties: PropertyValues<this>): void;
-    protected updated(changedProperties: PropertyValues<this>): void;
-    /** @hidden */
-    render(): lit.TemplateResult<1> | null;
-}
-
-export { AutocompleteItem, AutocompleteItemProps, propNames };
+export { AutocompleteItemProps_alias_1 as AutocompleteItemProps } from './_tsup-dts-rollup';
+export { AutocompleteItem_alias_1 as AutocompleteItem } from './_tsup-dts-rollup';
+export { propNames_alias_2 as propNames } from './_tsup-dts-rollup';

package/dist/prosekit-lit-components-autocomplete-item.js

@@ -1,8 +1,9 @@
 import {
   AutocompleteItem,
   propNames
-} from "./chunk-37EPOFI5.js";
-import "./chunk-J73E7P6J.js";
+} from "./chunk-AWQAU2JR.js";
+import "./chunk-DYEHERSG.js";
+import "./chunk-3UDA5JEW.js";
 export {
   AutocompleteItem,
   propNames

package/dist/prosekit-lit-components-autocomplete-list.d.ts

@@ -1,43 +1,3 @@
-import * as lit from 'lit';
-import { LitElement, CSSResultGroup, PropertyValues } from 'lit';
-import { Editor } from '@prosekit/core';
-import { A as AutocompletePopoverContext } from './context-436a56d3.js';
-import { A as AutocompleteListContext } from './context-19474449.js';
-
-declare const propNames: readonly ["editor"];
-interface AutocompleteListProps {
-    editor: Editor;
-}
-declare class AutocompleteList extends LitElement implements Partial<AutocompleteListProps> {
-    /** @hidden */
-    static styles: CSSResultGroup;
-    /** @hidden */
-    private controller;
-    private get active();
-    private lastMouseMoveTime;
-    editor?: Editor;
-    popoverContext: AutocompletePopoverContext | null;
-    context: AutocompleteListContext;
-    protected firstUpdated(): void;
-    private get items();
-    private get availableItems();
-    private get firstItem();
-    private get selectedItem();
-    selectFirstItem(): void;
-    private updateValue;
-    private registerValue;
-    /** @hidden */
-    defaultSlot?: HTMLSlotElement;
-    /** @hidden */
-    willUpdate(changedProperties: PropertyValues<this>): void;
-    private updateSelectedByChange;
-    private handleMouseMove;
-    private handleMouseOver;
-    private handleClick;
-    private handleMouseDown;
-    private handleSelect;
-    /** @hidden */
-    render(): lit.TemplateResult<1>;
-}
-
-export { AutocompleteList, AutocompleteListProps, propNames };
+export { AutocompleteList_alias_1 as AutocompleteList } from './_tsup-dts-rollup';
+export { AutocompleteListProps_alias_1 as AutocompleteListProps } from './_tsup-dts-rollup';
+export { propNames_alias_4 as propNames } from './_tsup-dts-rollup';

package/dist/prosekit-lit-components-autocomplete-list.js

@@ -1,9 +1,11 @@
 import {
   AutocompleteList,
   propNames
-} from "./chunk-HPMQEYGA.js";
-import "./chunk-37EPOFI5.js";
-import "./chunk-J73E7P6J.js";
+} from "./chunk-KGZID7N7.js";
+import "./chunk-AWQAU2JR.js";
+import "./chunk-DYEHERSG.js";
+import "./chunk-PCXKL6TA.js";
+import "./chunk-3UDA5JEW.js";
 export {
   AutocompleteList,
   propNames

package/dist/prosekit-lit-components-autocomplete-popover.d.ts

@@ -1,47 +1,4 @@
-import * as lit from 'lit';
-import { LitElement, CSSResultGroup } from 'lit';
-import { ComputePositionConfig } from '@floating-ui/dom';
-import { Editor } from '@prosekit/core';
-import { A as AutocompletePopoverContext } from './context-436a56d3.js';
-
-/**
- * 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
- */
-type PopoverOptions = ComputePositionConfig;
-
-declare const propNames: readonly ["editor", "regex", "popoverOptions"];
-interface AutocompletePopoverProps {
-    editor: Editor;
-    regex: RegExp;
-    popoverOptions?: PopoverOptions;
-}
-declare class AutocompletePopover extends LitElement implements Partial<AutocompletePopoverProps> {
-    /** @hidden */
-    static styles: CSSResultGroup;
-    /** @hidden */
-    private controller;
-    editor?: Editor;
-    regex?: RegExp;
-    popoverOptions: PopoverOptions;
-    context: AutocompletePopoverContext;
-    /** @hidden */
-    onSelect?: VoidFunction;
-    private get list();
-    private updateContext;
-    /** @hidden */
-    defaultSlot?: HTMLSlotElement;
-    /** @hidden */
-    protected get active(): boolean;
-    /** @hidden */
-    willUpdate(): void;
-    /** @hidden */
-    render(): lit.TemplateResult<1>;
-}
-
-export { AutocompletePopover, AutocompletePopoverProps, PopoverOptions, propNames };
+export { PopoverOptions } from './_tsup-dts-rollup';
+export { propNames_alias_5 as propNames } from './_tsup-dts-rollup';
+export { AutocompletePopoverProps } from './_tsup-dts-rollup';
+export { AutocompletePopover } from './_tsup-dts-rollup';