Skip to content

feat: Add debouncing #9

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mert-ergun wants to merge 1 commit into
base: main
Choose a base branch
from
Open

feat: Add debouncing #9

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions textcomplete/__init__.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -139,6 +139,8 @@ def textcomplete(
stop_enter_propagation: bool = False,
dynamic_width: bool = True,
dropdown_style: str = "",
debounce_enabled: bool = True,
debounce_timeout: int = 300,
args: Optional[Tuple] = tuple(),
key: Optional[str] = None,
) -> Optional[TextcompleteResult]:
Expand Down Expand Up @@ -169,6 +171,8 @@ def textcomplete(
strategies=[strategy.to_dict() for strategy in strategies],
dropdown_option=dropdown_option,
stop_enter_propagation=stop_enter_propagation,
debounce_enabled=debounce_enabled,
debounce_timeout=debounce_timeout,
key=key,
)

Expand Down
27 changes: 22 additions & 5 deletions textcomplete/frontend/src/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
import { Streamlit } from './streamlit';
import { Textcomplete } from '@textcomplete/core';
import { TextareaEditor } from '@textcomplete/textarea';
import { debounce } from 'lodash.debounce';
import {
parseTextcompleteLabel,
parseTextcompleteCss,
Expand Down Expand Up @@ -49,28 +50,42 @@ function onRender(event) {
option.dropdown.parent = textareaElement.parentElement || rootElement;
const strategies = parseTextcompleteStrategies(args);

const debounceEnabled = args.debounce_enabled !== false;
const debounceWait = args.debounce_wait || 300;

// Create an instance of TextareaEditor
const editor = new TextareaEditor(textareaElement);

if (debounceEnabled) {
editor.onInput = debounce(editor.onInput.bind(editor), debounceWait);

// Reattach the event listeners to use the debounced onInput
editor.stopListening();
editor.startListening();
}

const textcomplete = new Textcomplete(editor, strategies, option);

// Mark the textarea as initialized
textareaElement.textcompleteInitialized = true;
// Store the Textcomplete options on the textarea element for potential disposal
// Store the Textcomplete options on the textarea element
textareaElement.setAttribute(
'data-textcomplete',
JSON.stringify(event.detail.args.dropdown_option)
);
if (!!args.stop_enter_propagation) {
if (args.stop_enter_propagation) {
textareaElement.setAttribute('data-textcomplete-stopenterpropagation', true);
}
/**
* Adjust position of dropdown when rendered
*/

// Adjust position of dropdown when rendered
textcomplete.on('rendered', () => {
const dropdownElement = textareaElement.parentElement.querySelector(
'.textcomplete-dropdown'
);
dropdownElement.style.top = '4px';
});


/**
* Event handler for 'selected' event
* @param {string} ename
Expand Down Expand Up @@ -98,6 +113,8 @@ function onRender(event) {
writable: false,
value: textareaElement,
});


// Create a new synthetic event object with the same properties and methods as the synthetic event object that is created by React
const changeEvent = new Event('change', {
bubbles: true,
Expand Down