From e09c0db03b93f900c70d9d61533e070e3a40f242 Mon Sep 17 00:00:00 2001 From: Carson Date: Tue, 29 Apr 2025 17:33:40 -0500 Subject: [PATCH 1/5] chore: update to latest shiny.js; cut autoresize logic that now comes bundled with shiny.js --- js/build.ts | 5 -- js/text-area/textarea-autoresize.css | 6 -- js/text-area/textarea-autoresize.ts | 86 ------------------- scripts/_pkg-sources.R | 2 +- shiny/ui/_html_deps_external.py | 2 +- shiny/ui/_html_deps_py_shiny.py | 17 +--- shiny/ui/_input_text.py | 2 - .../text-area/textarea-autoresize.css | 2 - .../text-area/textarea-autoresize.css.map | 7 -- .../py-shiny/text-area/textarea-autoresize.js | 2 - .../text-area/textarea-autoresize.js.map | 7 -- shiny/www/shared/_version.json | 2 +- shiny/www/shared/bootstrap/_version.json | 2 +- shiny/www/shared/bootstrap/bootstrap.min.css | 2 +- .../sass/preset/bootstrap/bootstrap.min.css | 2 +- .../sass/preset/shiny/bootstrap.min.css | 2 +- .../shiny/www/shared/shiny_scss/shiny.scss | 8 ++ shiny/www/shared/shiny.js | 48 +++++++++++ shiny/www/shared/shiny.js.map | 6 +- shiny/www/shared/shiny.min.css | 2 +- shiny/www/shared/shiny.min.js | 40 ++++----- shiny/www/shared/shiny.min.js.map | 6 +- 22 files changed, 93 insertions(+), 165 deletions(-) delete mode 100644 js/text-area/textarea-autoresize.css delete mode 100644 js/text-area/textarea-autoresize.ts delete mode 100644 shiny/www/py-shiny/text-area/textarea-autoresize.css delete mode 100644 shiny/www/py-shiny/text-area/textarea-autoresize.css.map delete mode 100644 shiny/www/py-shiny/text-area/textarea-autoresize.js delete mode 100644 shiny/www/py-shiny/text-area/textarea-autoresize.js.map 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/scripts/_pkg-sources.R b/scripts/_pkg-sources.R index 0be521cb0..03c721bd6 100644 --- a/scripts/_pkg-sources.R +++ b/scripts/_pkg-sources.R @@ -1,6 +1,6 @@ list( bslib = "rstudio/bslib@main", - shiny = "rstudio/shiny@main", + shiny = "rstudio/shiny@feat/textAreaAutoResize", sass = "sass", htmltools = "rstudio/htmltools@main" ) 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