diff --git a/js/build.ts b/js/build.ts index 9a4e3e8b5..3a8825389 100644 --- a/js/build.ts +++ b/js/build.ts @@ -93,11 +93,6 @@ const opts: Array = [ entryPoints: { "data-frame/data-frame": "data-frame/index.tsx" }, plugins: [sassPlugin({ type: "css-text", sourceMap: false })], }, - { - entryPoints: { - "text-area/textarea-autoresize": "text-area/textarea-autoresize.ts", - }, - }, { entryPoints: { "page-output/page-output": "page-output/page-output.ts", diff --git a/js/text-area/textarea-autoresize.css b/js/text-area/textarea-autoresize.css deleted file mode 100644 index f97cff187..000000000 --- a/js/text-area/textarea-autoresize.css +++ /dev/null @@ -1,6 +0,0 @@ -.textarea-autoresize textarea.form-control { - padding: 5px 8px; - resize: none; - overflow-y: hidden; - height: auto; -} diff --git a/js/text-area/textarea-autoresize.ts b/js/text-area/textarea-autoresize.ts deleted file mode 100644 index 4f8d9114a..000000000 --- a/js/text-area/textarea-autoresize.ts +++ /dev/null @@ -1,86 +0,0 @@ -// By importing the css file, it will be copied to the output directory. -import "./textarea-autoresize.css"; - -export interface DOMEvent extends Event { - readonly target: T; -} - -function onDelegatedEvent( - eventName: string, - selector: string, - callback: (target: HTMLTextAreaElement) => void -) { - document.addEventListener(eventName, (e) => { - const e2 = e as DOMEvent; - if (e2.target.matches(selector)) { - callback(e2.target); - } - }); -} - -// Use a single intersectionObserver as they are slow to create / use. -let textAreaIntersectionObserver: null | IntersectionObserver = null; - -function callUpdateHeightWhenTargetIsVisible(target: HTMLTextAreaElement) { - if (textAreaIntersectionObserver === null) { - // Create a single observer to watch for the textarea becoming visible - textAreaIntersectionObserver = new IntersectionObserver( - (entries, observer) => { - entries.forEach((entry) => { - // Quit if the entry is not visible - if (!entry.isIntersecting) { - return; - } - // If the entry is visible (even if it's just a single pixel) - // Stop observing the target - textAreaIntersectionObserver!.unobserve(entry.target); - - // Update the height of the textarea - update_height(entry.target as HTMLTextAreaElement); - }); - } - ); - } - - textAreaIntersectionObserver.observe(target); -} - -function update_height(target: HTMLTextAreaElement) { - if (target.scrollHeight > 0) { - // Automatically resize the textarea to fit its content. - target.style.height = "auto"; - target.style.height = target.scrollHeight + 2 + "px"; - } else { - // The textarea is not visible on the page, therefore it has a 0 scroll height. - - // If we should autoresize the text area height, then we can wait for the textarea to - // become visible and call `update_height` again. Hopefully the scroll height is no - // longer 0 - callUpdateHeightWhenTargetIsVisible(target); - } -} - -// Update on change -onDelegatedEvent( - "input", - "textarea.textarea-autoresize", - (target: HTMLTextAreaElement) => { - update_height(target); - } -); - -// Update on load -function update_on_load() { - if (document.readyState === "loading") { - // Document still loading, wait 10ms to check again. - setTimeout(update_on_load, 10); - return; - } - - // document.readyState in ["interactive", "complete"];\ - const textAreas = document.querySelectorAll( - "textarea.textarea-autoresize" - ) as NodeListOf; - textAreas.forEach(update_height); -} -update_on_load(); diff --git a/shiny/ui/_html_deps_external.py b/shiny/ui/_html_deps_external.py index 00e40c723..e4cbd2464 100644 --- a/shiny/ui/_html_deps_external.py +++ b/shiny/ui/_html_deps_external.py @@ -19,7 +19,7 @@ For... * External dependencies (e.g. jQuery, Bootstrap), see `shiny.ui._html_deps_external` -* Internal dependencies (e.g. dataframe, autoresize), see `shiny.ui._html_deps_py_shiny` +* Internal dependencies (e.g. dataframe), see `shiny.ui._html_deps_py_shiny` * shinyverse dependencies (e.g. bslib, htmltools), see `shiny.ui._html_deps_shinyverse` """ diff --git a/shiny/ui/_html_deps_py_shiny.py b/shiny/ui/_html_deps_py_shiny.py index 49c9b81a6..21e0d0f51 100644 --- a/shiny/ui/_html_deps_py_shiny.py +++ b/shiny/ui/_html_deps_py_shiny.py @@ -6,11 +6,11 @@ from . import busy_indicators """ -HTML dependencies for internal dependencies such as dataframe or text area's autoresize. +HTML dependencies for internal dependencies such as dataframe. For... * External dependencies (e.g. jQuery, Bootstrap), see `shiny.ui._html_deps_external` -* Internal dependencies (e.g. dataframe, autoresize), see `shiny.ui._html_deps_py_shiny` +* Internal dependencies (e.g. dataframe), see `shiny.ui._html_deps_py_shiny` * shinyverse dependencies (e.g. bslib, htmltools), see `shiny.ui._html_deps_shinyverse` """ @@ -38,8 +38,7 @@ def chat_deps() -> list[HTMLDependency]: script={"src": "chat.js", "type": "module"}, stylesheet={"href": "chat.css"}, ) - # Chat's