@lostgradient/cinder 0.3.0 → 0.4.0

package/dist/components/command-palette/index.js

@@ -26,7 +26,7 @@ import"@lostgradient/cinder/command-palette/styles";
 
 // src/components/command-palette/command-palette.svelte
 import"svelte/internal/disclose-version";
-import * as $ from "svelte/internal/client";
+import * as $2 from "svelte/internal/client";
 import { onDestroy } from "svelte";
 
 // src/_internal/overlay.ts
@@ -94,20 +94,6 @@ function classNames(...parts) {
   return parts.filter((part) => typeof part === "string" && part.length > 0).join(" ");
 }
 
-// src/utilities/document-order.ts
-function inDocumentOrder(items) {
-  return items.toSorted((a, b) => {
-    if (a.node === b.node)
-      return 0;
-    const position = a.node.compareDocumentPosition(b.node);
-    if (position & Node.DOCUMENT_POSITION_FOLLOWING)
-      return -1;
-    if (position & Node.DOCUMENT_POSITION_PRECEDING)
-      return 1;
-    return 0;
-  });
-}
-
 // src/utilities/focus.ts
 function restoreFocusTo(target) {
   if (!target)
@@ -144,41 +130,216 @@ function hasCommandListContext() {
   }
 }
 
+// src/components/_internal/create-command-list-state.svelte.ts
+import * as $ from "svelte/internal/client";
+
+// src/utilities/document-order.ts
+function inDocumentOrder(items) {
+  return items.toSorted((a, b) => {
+    if (a.node === b.node)
+      return 0;
+    const position = a.node.compareDocumentPosition(b.node);
+    if (position & Node.DOCUMENT_POSITION_FOLLOWING)
+      return -1;
+    if (position & Node.DOCUMENT_POSITION_PRECEDING)
+      return 1;
+    return 0;
+  });
+}
+
+// src/components/_internal/create-command-list-state.svelte.ts
+class CommandListState {
+  listboxId;
+  #registrations = $.state($.proxy([]));
+  get registrations() {
+    return $.get(this.#registrations);
+  }
+  set registrations(value) {
+    $.set(this.#registrations, value, true);
+  }
+  #registrationsReady = $.state(false);
+  get registrationsReady() {
+    return $.get(this.#registrationsReady);
+  }
+  set registrationsReady(value) {
+    $.set(this.#registrationsReady, value, true);
+  }
+  #itemCounter = 0;
+  #readyCycle = 0;
+  #intendedActiveId = $.state(null);
+  #enabledIds = $.derived(() => {
+    return inDocumentOrder(this.registrations).filter((registration) => !registration.getDisabled()).map((registration) => registration.id);
+  });
+  get enabledIds() {
+    return $.get(this.#enabledIds);
+  }
+  set enabledIds(value) {
+    $.set(this.#enabledIds, value);
+  }
+  #activeItemId = $.derived(() => $.get(this.#intendedActiveId) !== null && this.enabledIds.includes($.get(this.#intendedActiveId)) ? $.get(this.#intendedActiveId) : this.enabledIds[0] ?? null);
+  get activeItemId() {
+    return $.get(this.#activeItemId);
+  }
+  set activeItemId(value) {
+    $.set(this.#activeItemId, value);
+  }
+  constructor(listboxId) {
+    this.listboxId = listboxId;
+  }
+  resetActiveItem() {
+    $.set(this.#intendedActiveId, null);
+  }
+  refreshRegistrationsReady() {
+    this.registrationsReady = false;
+    const cycle = ++this.#readyCycle;
+    queueMicrotask(() => {
+      if (cycle === this.#readyCycle)
+        this.registrationsReady = true;
+    });
+  }
+  scrollActiveItemIntoView() {
+    if (this.activeItemId === null)
+      return;
+    const record = this.registrations.find((registration) => registration.id === this.activeItemId);
+    record?.node.scrollIntoView({ block: "nearest" });
+  }
+  setActiveById(id) {
+    $.set(this.#intendedActiveId, id, true);
+  }
+  register(input, node) {
+    const id = `${this.listboxId}-item-${++this.#itemCounter}`;
+    this.registrations.push({
+      id,
+      node,
+      getValue: input.getValue,
+      getOnselect: input.getOnselect,
+      getDisabled: input.getDisabled
+    });
+    return {
+      id,
+      unregister: () => {
+        const index = this.registrations.findIndex((registration) => registration.id === id);
+        if (index !== -1)
+          this.registrations.splice(index, 1);
+      }
+    };
+  }
+  activateItemById(id) {
+    const record = this.registrations.find((registration) => registration.id === id);
+    if (!record || record.getDisabled())
+      return null;
+    record.getOnselect()();
+    return record;
+  }
+  handleKeydown({
+    event,
+    onEnter,
+    onEscape,
+    ignoreModifiedNavigation = false,
+    preventDefaultOnEmptyEnter = false
+  }) {
+    if (event.isComposing || event.keyCode === 229)
+      return false;
+    const isModified = event.altKey || event.ctrlKey || event.metaKey || event.shiftKey;
+    const ids = this.enabledIds;
+    if (event.key === "ArrowDown") {
+      if (ignoreModifiedNavigation && isModified)
+        return false;
+      event.preventDefault();
+      if (ids.length === 0)
+        return true;
+      const index = this.activeItemId === null ? -1 : ids.indexOf(this.activeItemId);
+      $.set(this.#intendedActiveId, ids[(index + 1) % ids.length] ?? null, true);
+      return true;
+    }
+    if (event.key === "ArrowUp") {
+      if (ignoreModifiedNavigation && isModified)
+        return false;
+      event.preventDefault();
+      if (ids.length === 0)
+        return true;
+      const index = this.activeItemId === null ? 0 : ids.indexOf(this.activeItemId);
+      $.set(this.#intendedActiveId, ids[index <= 0 ? ids.length - 1 : index - 1] ?? null, true);
+      return true;
+    }
+    if (event.key === "Home") {
+      if (ignoreModifiedNavigation && isModified)
+        return false;
+      event.preventDefault();
+      $.set(this.#intendedActiveId, ids[0] ?? null, true);
+      return true;
+    }
+    if (event.key === "End") {
+      if (ignoreModifiedNavigation && isModified)
+        return false;
+      event.preventDefault();
+      $.set(this.#intendedActiveId, ids[ids.length - 1] ?? null, true);
+      return true;
+    }
+    if (event.key === "Enter") {
+      if (!onEnter)
+        return false;
+      if (this.activeItemId === null && !preventDefaultOnEmptyEnter)
+        return false;
+      event.preventDefault();
+      event.stopPropagation();
+      if (this.activeItemId === null)
+        return true;
+      onEnter?.(this.activeItemId);
+      return true;
+    }
+    if (event.key === "Escape" && onEscape) {
+      event.preventDefault();
+      event.stopPropagation();
+      onEscape();
+      return true;
+    }
+    return false;
+  }
+  createContext(activateItemById = (id) => void this.activateItemById(id)) {
+    const listboxId = this.listboxId;
+    const getActiveItemId = () => this.activeItemId;
+    const register = (input, node) => this.register(input, node);
+    const setActiveById = (id) => this.setActiveById(id);
+    return {
+      get listboxId() {
+        return listboxId;
+      },
+      get activeItemId() {
+        return getActiveItemId();
+      },
+      register,
+      setActiveById,
+      activateItemById
+    };
+  }
+}
+function createCommandListState(listboxId) {
+  return new CommandListState(listboxId);
+}
+
 // src/components/command-palette/command-palette.svelte
-var root_3 = $.from_html(`<div class="cinder-command-palette__empty" role="status"><!></div>`);
-var root_4 = $.from_html(`<div class="cinder-command-palette__footer"><!></div>`);
-var root_2 = $.from_html(`<div><div class="cinder-command-palette__search"><svg class="cinder-command-palette__search-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"><path fill-rule="evenodd" d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z" clip-rule="evenodd"></path></svg> <label class="cinder-sr-only"> </label> <input type="text" class="cinder-command-palette__input" role="combobox" autocomplete="off" autocorrect="off" spellcheck="false" aria-autocomplete="list" aria-expanded="true"/></div> <ul role="listbox" class="cinder-command-palette__listbox"><!></ul> <!> <!></div>`);
-var root_1 = $.from_html(`<dialog class="cinder-command-palette" aria-modal="true"><!></dialog>`);
+var root_3 = $2.from_html(`<div class="cinder-command-palette__empty" role="status"><!></div>`);
+var root_4 = $2.from_html(`<div class="cinder-command-palette__footer"><!></div>`);
+var root_2 = $2.from_html(`<div><div class="cinder-command-palette__search"><svg class="cinder-command-palette__search-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"><path fill-rule="evenodd" d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z" clip-rule="evenodd"></path></svg> <label class="cinder-sr-only"> </label> <input type="text" class="cinder-command-palette__input" role="combobox" autocomplete="off" autocorrect="off" spellcheck="false" aria-autocomplete="list" aria-expanded="true"/></div> <ul role="listbox" class="cinder-command-palette__listbox"><!></ul> <!> <!></div>`);
+var root_1 = $2.from_html(`<dialog class="cinder-command-palette" aria-modal="true"><!></dialog>`);
 function Command_palette($$anchor, $$props) {
-  const baseId = $.props_id();
-  $.push($$props, true);
-  let open = $.prop($$props, "open", 15, false), placeholder = $.prop($$props, "placeholder", 3, "Search…"), label = $.prop($$props, "label", 3, "Command palette"), query = $.prop($$props, "query", 15, ""), triggerRef = $.prop($$props, "triggerRef", 3, null);
+  const baseId = $2.props_id();
+  $2.push($$props, true);
+  let open = $2.prop($$props, "open", 15, false), placeholder = $2.prop($$props, "placeholder", 3, "Search…"), label = $2.prop($$props, "label", 3, "Command palette"), query = $2.prop($$props, "query", 15, ""), triggerRef = $2.prop($$props, "triggerRef", 3, null);
   const listboxId = `${baseId}-listbox`;
   const inputId = `${baseId}-input`;
-  let dialogElement = $.state(undefined);
-  let inputElement = $.state(undefined);
-  let mounted = $.state(false);
-  $.user_effect(() => {
-    $.set(mounted, true);
+  let dialogElement = $2.state(undefined);
+  let inputElement = $2.state(undefined);
+  let mounted = $2.state(false);
+  $2.user_effect(() => {
+    $2.set(mounted, true);
   });
   let capturedFocus = null;
-  let registrations = $.proxy([]);
-  let itemCounter = 0;
-  let intendedActiveId = $.state(null);
-  const enabledIds = $.derived(() => {
-    return inDocumentOrder(registrations).filter((r) => !r.getDisabled()).map((r) => r.id);
-  });
-  const activeItemId = $.derived(() => $.get(intendedActiveId) !== null && $.get(enabledIds).includes($.get(intendedActiveId)) ? $.get(intendedActiveId) : $.get(enabledIds)[0] ?? null);
-  let registrationsReady = $.state(false);
-  let readyCycle = 0;
-  $.user_effect(() => {
+  const commandList = createCommandListState(listboxId);
+  $2.user_effect(() => {
     query();
-    $.set(registrationsReady, false);
-    const cycle = ++readyCycle;
-    queueMicrotask(() => {
-      if (cycle === readyCycle)
-        $.set(registrationsReady, true);
-    });
+    commandList.refreshRegistrationsReady();
   });
   let releaseEscape = null;
   function returnFocus() {
@@ -193,27 +354,29 @@ function Command_palette($$anchor, $$props) {
   function closePalette() {
     if (isClosing)
       return;
-    if (!open() && !$.get(dialogElement)?.open)
+    if (!open() && !$2.get(dialogElement)?.open)
       return;
     isClosing = true;
     open(false);
     releaseEscape?.();
     releaseEscape = null;
-    if ($.get(dialogElement)?.open)
-      $.get(dialogElement).close();
+    if ($2.get(dialogElement)?.open)
+      $2.get(dialogElement).close();
     returnFocus();
     $$props.onclose?.();
     isClosing = false;
   }
-  $.user_effect(() => {
-    if (!$.get(dialogElement))
+  $2.user_effect(() => {
+    if (!$2.get(dialogElement))
       return;
-    if (open() && !$.get(dialogElement).open) {
+    if (open() && !$2.get(dialogElement).open) {
+      query("");
+      commandList.resetActiveItem();
       capturedFocus = captureFocus();
-      $.get(dialogElement).showModal();
-      $.get(inputElement)?.focus();
+      $2.get(dialogElement).showModal();
+      $2.get(inputElement)?.focus();
       releaseEscape = pushEscapeHandler(closePalette);
-    } else if (!open() && $.get(dialogElement).open) {
+    } else if (!open() && $2.get(dialogElement).open) {
       closePalette();
     }
   });
@@ -228,188 +391,115 @@ function Command_palette($$anchor, $$props) {
     closePalette();
   }
   function handleBackdropClick(event2) {
-    if (event2.target === $.get(dialogElement)) {
+    if (event2.target === $2.get(dialogElement)) {
       closePalette();
     }
   }
   function handleKeydown(event2) {
-    const ids = $.get(enabledIds);
-    if (event2.key === "ArrowDown") {
-      event2.preventDefault();
-      if (ids.length === 0)
-        return;
-      if ($.get(activeItemId) === null) {
-        const firstId = ids[0];
-        if (firstId !== undefined)
-          $.set(intendedActiveId, firstId, true);
-      } else {
-        const index = ids.indexOf($.get(activeItemId));
-        const nextId = ids[(index + 1) % ids.length];
-        if (nextId !== undefined)
-          $.set(intendedActiveId, nextId, true);
-      }
-    } else if (event2.key === "ArrowUp") {
-      event2.preventDefault();
-      if (ids.length === 0)
-        return;
-      if ($.get(activeItemId) === null) {
-        const lastId = ids[ids.length - 1];
-        if (lastId !== undefined)
-          $.set(intendedActiveId, lastId, true);
-      } else {
-        const index = ids.indexOf($.get(activeItemId));
-        const previousId = ids[index <= 0 ? ids.length - 1 : index - 1];
-        if (previousId !== undefined)
-          $.set(intendedActiveId, previousId, true);
-      }
-    } else if (event2.key === "Home") {
-      event2.preventDefault();
-      $.set(intendedActiveId, ids[0] ?? null, true);
-    } else if (event2.key === "End") {
-      event2.preventDefault();
-      $.set(intendedActiveId, ids[ids.length - 1] ?? null, true);
-    } else if (event2.key === "Enter") {
-      event2.preventDefault();
-      if ($.get(activeItemId) !== null)
-        context.activateItemById($.get(activeItemId));
-    }
+    commandList.handleKeydown({
+      event: event2,
+      onEnter: (id) => commandList.activateItemById(id),
+      preventDefaultOnEmptyEnter: true
+    });
   }
   function handleInput(event2) {
     const target = event2.target;
     query(target.value);
   }
-  $.user_effect(() => {
-    if ($.get(activeItemId) === null)
-      return;
-    const record = registrations.find((r) => r.id === $.get(activeItemId));
-    record?.node.scrollIntoView({ block: "nearest" });
+  $2.user_effect(() => {
+    commandList.scrollActiveItemIntoView();
   });
-  const context = {
-    get listboxId() {
-      return listboxId;
-    },
-    get activeItemId() {
-      return $.get(activeItemId);
-    },
-    register(input, node) {
-      const id = `${listboxId}-item-${++itemCounter}`;
-      registrations.push({
-        id,
-        node,
-        getValue: input.getValue,
-        getOnselect: input.getOnselect,
-        getDisabled: input.getDisabled
-      });
-      return {
-        id,
-        unregister: () => {
-          const index = registrations.findIndex((r) => r.id === id);
-          if (index !== -1)
-            registrations.splice(index, 1);
-        }
-      };
-    },
-    setActiveById(id) {
-      $.set(intendedActiveId, id, true);
-    },
-    activateItemById(id) {
-      const record = registrations.find((r) => r.id === id);
-      if (record && !record.getDisabled()) {
-        record.getOnselect()();
-      }
-    }
-  };
-  setCommandListContext(context);
-  const showEmpty = $.derived(() => $.get(mounted) && $.get(registrationsReady) && registrations.length === 0);
-  var fragment = $.comment();
-  var node_1 = $.first_child(fragment);
+  setCommandListContext(commandList.createContext());
+  const showEmpty = $2.derived(() => $2.get(mounted) && commandList.registrationsReady && commandList.registrations.length === 0);
+  var fragment = $2.comment();
+  var node = $2.first_child(fragment);
   {
     var consequent_3 = ($$anchor2) => {
       var dialog = root_1();
-      var node_2 = $.child(dialog);
+      var node_1 = $2.child(dialog);
       {
         var consequent_2 = ($$anchor3) => {
           var div = root_2();
-          var div_1 = $.child(div);
-          var label_1 = $.sibling($.child(div_1), 2);
-          var text = $.child(label_1, true);
-          $.reset(label_1);
-          var input_1 = $.sibling(label_1, 2);
-          $.remove_input_defaults(input_1);
-          $.bind_this(input_1, ($$value) => $.set(inputElement, $$value), () => $.get(inputElement));
-          $.reset(div_1);
-          var ul = $.sibling(div_1, 2);
-          var node_3 = $.child(ul);
-          $.snippet(node_3, () => $$props.items, () => ({ query: query() }));
-          $.reset(ul);
-          var node_4 = $.sibling(ul, 2);
+          var div_1 = $2.child(div);
+          var label_1 = $2.sibling($2.child(div_1), 2);
+          var text = $2.child(label_1, true);
+          $2.reset(label_1);
+          var input = $2.sibling(label_1, 2);
+          $2.remove_input_defaults(input);
+          $2.bind_this(input, ($$value) => $2.set(inputElement, $$value), () => $2.get(inputElement));
+          $2.reset(div_1);
+          var ul = $2.sibling(div_1, 2);
+          var node_2 = $2.child(ul);
+          $2.snippet(node_2, () => $$props.items, () => ({ query: query() }));
+          $2.reset(ul);
+          var node_3 = $2.sibling(ul, 2);
           {
             var consequent = ($$anchor4) => {
               var div_2 = root_3();
-              var node_5 = $.child(div_2);
-              $.snippet(node_5, () => $$props.empty);
-              $.reset(div_2);
-              $.append($$anchor4, div_2);
+              var node_4 = $2.child(div_2);
+              $2.snippet(node_4, () => $$props.empty);
+              $2.reset(div_2);
+              $2.append($$anchor4, div_2);
             };
-            $.if(node_4, ($$render) => {
-              if ($.get(showEmpty) && $$props.empty)
+            $2.if(node_3, ($$render) => {
+              if ($2.get(showEmpty) && $$props.empty)
                 $$render(consequent);
             });
           }
-          var node_6 = $.sibling(node_4, 2);
+          var node_5 = $2.sibling(node_3, 2);
           {
             var consequent_1 = ($$anchor4) => {
               var div_3 = root_4();
-              var node_7 = $.child(div_3);
-              $.snippet(node_7, () => $$props.footer);
-              $.reset(div_3);
-              $.append($$anchor4, div_3);
+              var node_6 = $2.child(div_3);
+              $2.snippet(node_6, () => $$props.footer);
+              $2.reset(div_3);
+              $2.append($$anchor4, div_3);
             };
-            $.if(node_6, ($$render) => {
+            $2.if(node_5, ($$render) => {
               if ($$props.footer)
                 $$render(consequent_1);
             });
           }
-          $.reset(div);
-          $.template_effect(($0) => {
-            $.set_class(div, 1, $0);
-            $.set_attribute(label_1, "for", inputId);
-            $.set_text(text, label());
-            $.set_attribute(input_1, "id", inputId);
-            $.set_attribute(input_1, "placeholder", placeholder());
-            $.set_value(input_1, query());
-            $.set_attribute(input_1, "aria-controls", listboxId);
-            $.set_attribute(input_1, "aria-activedescendant", $.get(activeItemId) ?? undefined);
-            $.set_attribute(ul, "id", listboxId);
+          $2.reset(div);
+          $2.template_effect(($0) => {
+            $2.set_class(div, 1, $0);
+            $2.set_attribute(label_1, "for", inputId);
+            $2.set_text(text, label());
+            $2.set_attribute(input, "id", inputId);
+            $2.set_attribute(input, "placeholder", placeholder());
+            $2.set_value(input, query());
+            $2.set_attribute(input, "aria-controls", listboxId);
+            $2.set_attribute(input, "aria-activedescendant", commandList.activeItemId ?? undefined);
+            $2.set_attribute(ul, "id", listboxId);
           }, [
-            () => $.clsx(classNames("cinder-command-palette__panel", $$props.class))
+            () => $2.clsx(classNames("cinder-command-palette__panel", $$props.class))
           ]);
-          $.delegated("input", input_1, handleInput);
-          $.delegated("keydown", input_1, handleKeydown);
-          $.append($$anchor3, div);
+          $2.delegated("input", input, handleInput);
+          $2.delegated("keydown", input, handleKeydown);
+          $2.append($$anchor3, div);
         };
-        $.if(node_2, ($$render) => {
+        $2.if(node_1, ($$render) => {
           if (open())
             $$render(consequent_2);
         });
       }
-      $.reset(dialog);
-      $.bind_this(dialog, ($$value) => $.set(dialogElement, $$value), () => $.get(dialogElement));
-      $.template_effect(() => $.set_attribute(dialog, "aria-label", label()));
-      $.event("cancel", dialog, handleCancel);
-      $.event("close", dialog, handleClose);
-      $.delegated("click", dialog, handleBackdropClick);
-      $.append($$anchor2, dialog);
+      $2.reset(dialog);
+      $2.bind_this(dialog, ($$value) => $2.set(dialogElement, $$value), () => $2.get(dialogElement));
+      $2.template_effect(() => $2.set_attribute(dialog, "aria-label", label()));
+      $2.event("cancel", dialog, handleCancel);
+      $2.event("close", dialog, handleClose);
+      $2.delegated("click", dialog, handleBackdropClick);
+      $2.append($$anchor2, dialog);
     };
-    $.if(node_1, ($$render) => {
-      if ($.get(mounted) || open())
+    $2.if(node, ($$render) => {
+      if ($2.get(mounted) || open())
         $$render(consequent_3);
     });
   }
-  $.append($$anchor, fragment);
-  $.pop();
+  $2.append($$anchor, fragment);
+  $2.pop();
 }
-$.delegate(["click", "input", "keydown"]);
+$2.delegate(["click", "input", "keydown"]);
 
 // src/components/command-palette/index.ts
 var command_palette_default = Command_palette;
@@ -418,4 +508,4 @@ export {
   Command_palette as CommandPalette
 };
 
-//# debugId=14159019C7D8CB8C64756E2164756E21
+//# debugId=504E793111C17A4F64756E2164756E21

package/dist/components/confirm-dialog/index.js

@@ -596,6 +596,10 @@ function createBodyScrollLock() {
     return release;
   };
 }
+function isInsideEventPath(event, element) {
+  const path = event.composedPath();
+  return path.some((entry) => entry instanceof Node && element.contains(entry));
+}
 function createClickOutside(options) {
   const { handler, enabled = true, eventType = "click", capture = true, ignoreRefs } = options;
   return (node) => {
@@ -603,17 +607,19 @@ function createClickOutside(options) {
       const isEnabled = typeof enabled === "function" ? enabled() : enabled;
       if (!isEnabled)
         return;
+      if (event.type === "touchstart" && !event.cancelable)
+        return;
       const target = event.target;
       if (!(target instanceof Node)) {
         handler();
         return;
       }
-      if (node.contains(target))
+      if (isInsideEventPath(event, node))
         return;
       if (ignoreRefs) {
         for (const ref of ignoreRefs) {
           const element = ref();
-          if (element && element.contains(target))
+          if (element && isInsideEventPath(event, element))
             return;
         }
       }
@@ -974,4 +980,4 @@ export {
   Confirm_dialog as ConfirmDialog
 };
 
-//# debugId=837E45119E6F194D64756E2164756E21
+//# debugId=61597A7CC221982D64756E2164756E21

package/dist/components/context-menu/context-menu.context.d.ts

@@ -1,7 +1,9 @@
+import type { TextDirection } from '../../_internal/locale-context.ts';
 export type ContextMenuContext = {
     get disabled(): boolean;
     get isOpen(): boolean;
     get longPressDelay(): number;
+    get direction(): TextDirection | undefined;
     openAt: (x: number, y: number) => void;
     close: () => void;
 };