From db2455185ca6ae80704ee0753253acb8f2958393 Mon Sep 17 00:00:00 2001
From: Farhan <www.mfarvirus@gmail.com>
Date: Thu, 9 Jul 2026 12:12:45 +0500
Subject: [PATCH 1/5] feat(docs): improve a11y and lazy-load Inkeep search
 widget

Add accessible names to icon-only controls (copy-code, clear-input,
search) and card overlay links, mark the feedback thumbs as a labeled
group, and make the mobile nav overlay a real button.

Defer mounting the ~276 KB Inkeep widget (and its Google Fonts
stylesheet) until the user activates search: render a lightweight
placeholder trigger that mirrors the widget styling to avoid layout
shift, forward Cmd/Ctrl+K to it, and mount the real widget with its
controlled modal starting open so the same interaction opens search.
---
 .../pages/docs_landing/views/ai_builder.py    |   2 +-
 .../pages/docs_landing/views/framework.py     |   2 +-
 .../pages/docs_landing/views/link_item.py     |   2 +-
 .../reflex_docs/templates/docpage/docpage.py  |  20 ++-
 docs/app/reflex_docs/views/inkeep.py          | 124 +++++++++++++++++-
 .../src/reflex_components_code/code.py        |   1 +
 .../shiki_code_block.py                       |   1 +
 .../components/base/input.py                  |   1 +
 8 files changed, 139 insertions(+), 14 deletions(-)

diff --git a/docs/app/reflex_docs/pages/docs_landing/views/ai_builder.py b/docs/app/reflex_docs/pages/docs_landing/views/ai_builder.py
index caed0932ec5..c1f44ec534c 100644
--- a/docs/app/reflex_docs/pages/docs_landing/views/ai_builder.py
+++ b/docs/app/reflex_docs/pages/docs_landing/views/ai_builder.py
@@ -88,7 +88,7 @@ def card(
             class_name="flex flex-col gap-2 p-8",
         ),
         content,
-        rx.el.a(href=href, class_name="absolute inset-0"),
+        rx.el.a(href=href, aria_label=title, class_name="absolute inset-0"),
         class_name="flex flex-col bg-secondary-1/96 backdrop-blur-[16px] rounded-xl relative cursor-pointer transition-colors overflow-hidden shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_12px_24px_0_rgba(0,0,0,0.08),0_1px_1px_0_rgba(0,0,0,0.01),0_4px_8px_0_rgba(0,0,0,0.03)] dark:shadow-none dark:border dark:border-secondary-4",
     )
 
diff --git a/docs/app/reflex_docs/pages/docs_landing/views/framework.py b/docs/app/reflex_docs/pages/docs_landing/views/framework.py
index c857b5edefe..216ae938fab 100644
--- a/docs/app/reflex_docs/pages/docs_landing/views/framework.py
+++ b/docs/app/reflex_docs/pages/docs_landing/views/framework.py
@@ -38,7 +38,7 @@ def docs_item(
             description,
             class_name="text-secondary-11 text-sm font-[475]",
         ),
-        rx.el.a(to=href, class_name="absolute inset-0"),
+        rx.el.a(to=href, aria_label=title, class_name="absolute inset-0"),
         class_name="flex flex-col gap-2 py-8 pr-8 relative group lg:max-w-[21rem] w-full max-lg:text-start hover:bg-[linear-gradient(243deg,var(--secondary-2)_0%,var(--secondary-1)_100%)]",
     )
 
diff --git a/docs/app/reflex_docs/pages/docs_landing/views/link_item.py b/docs/app/reflex_docs/pages/docs_landing/views/link_item.py
index 6097a3dddd2..c86d93ec734 100644
--- a/docs/app/reflex_docs/pages/docs_landing/views/link_item.py
+++ b/docs/app/reflex_docs/pages/docs_landing/views/link_item.py
@@ -43,7 +43,7 @@ def link_item(
             description,
             class_name="text-secondary-11 text-sm font-[475] text-start",
         ),
-        rx.el.a(to=href, class_name="absolute inset-0"),
+        rx.el.a(to=href, aria_label=title, class_name="absolute inset-0"),
         class_name=ui.cn(
             "flex flex-col gap-2 pr-8 py-8 group border-r border-b border-secondary-4 relative max-lg:p-6 hover:bg-[linear-gradient(243deg,var(--secondary-2)_0%,var(--secondary-1)_100%)]",
             "lg:pl-8 pl-6" if has_padding_left else "",
diff --git a/docs/app/reflex_docs/templates/docpage/docpage.py b/docs/app/reflex_docs/templates/docpage/docpage.py
index 997b4195904..bccb0fae12a 100644
--- a/docs/app/reflex_docs/templates/docpage/docpage.py
+++ b/docs/app/reflex_docs/templates/docpage/docpage.py
@@ -234,22 +234,26 @@ def feedback_content() -> rx.Component:
 def feedback_button() -> rx.Component:
     thumb_cn = "w-full gap-2 px-3 py-0.5 flex flex-row items-center justify-center whitespace-nowrap border cursor-pointer transition-colors font-small"
     return ui.popover.root(
-        ui.popover.trigger(
-            render_=rx.el.div(
-                feedback_choice_button(
+        rx.el.div(
+            ui.popover.trigger(
+                render_=feedback_choice_button(
                     "Yes",
                     "ThumbsUpIcon",
                     1,
                     ui.cn("rounded-[20px_0_0_20px] border-r-0", thumb_cn),
                 ),
-                feedback_choice_button(
+            ),
+            ui.popover.trigger(
+                render_=feedback_choice_button(
                     "No",
                     "ThumbsDownIcon",
                     0,
                     ui.cn("rounded-[0_20px_20px_0]", thumb_cn),
                 ),
-                class_name="w-full lg:w-auto items-center flex flex-row",
             ),
+            role="group",
+            aria_label="Was this page helpful?",
+            class_name="w-full lg:w-auto items-center flex flex-row",
         ),
         ui.popover.portal(
             ui.popover.positioner(
@@ -746,8 +750,10 @@ def breadcrumb(path: str, nav_sidebar: rx.Component, doc_content: str | None = N
     return rx.box(
         docs_sidebar_drawer(
             nav_sidebar,
-            trigger=rx.box(
-                class_name="absolute inset-0 bg-transparent z-[1] lg:hidden flex",
+            trigger=rx.el.button(
+                type="button",
+                aria_label="Open docs navigation",
+                class_name="absolute inset-0 bg-transparent z-[1] lg:hidden flex border-none p-0 cursor-pointer",
             ),
         ),
         rx.box(
diff --git a/docs/app/reflex_docs/views/inkeep.py b/docs/app/reflex_docs/views/inkeep.py
index 72a826518e5..d4b88c96e1b 100644
--- a/docs/app/reflex_docs/views/inkeep.py
+++ b/docs/app/reflex_docs/views/inkeep.py
@@ -1,8 +1,11 @@
 """UI and logic inkeep chat component."""
 
 import reflex as rx
+from reflex.event import EventSpec
+from reflex.experimental.client_state import ClientStateVar
 from reflex.utils.imports import ImportVar
 from reflex.vars import Var
+from reflex.vars.base import VarData
 
 
 class InkeepSearchBar(rx.NoSSRComponent):
@@ -10,6 +13,97 @@ class InkeepSearchBar(rx.NoSSRComponent):
     library = "@inkeep/cxkit-react@0.5.115"
 
 
+_INKEEP_LOADED_STATE = "inkeep_loaded"
+_INKEEP_OPEN_STATE = "inkeep_open"
+_SEARCH_TRIGGER_ID = "inkeep-search-trigger"
+
+# Inline copy of assets/icons/search.svg so the placeholder needs no extra request.
+_SEARCH_ICON_SVG = (
+    '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none"'
+    ' viewBox="0 0 16 16" aria-hidden="true"><path stroke="currentColor"'
+    ' stroke-linecap="round" stroke-linejoin="round" stroke-width="1.25"'
+    ' d="M11.332 11.333 13.999 14"/><path stroke="currentColor"'
+    ' stroke-linecap="round" stroke-linejoin="round" stroke-width="1.25"'
+    ' d="M12.667 7.333A5.333 5.333 0 1 0 2 7.333a5.333 5.333 0 0 0 10.667 0"/></svg>'
+)
+
+# Cmd/Ctrl+K opens search before the widget has been loaded: forward the
+# shortcut to the placeholder trigger, which mounts the real widget with its
+# modal open. Once the widget is mounted, its own shortcut handler takes over.
+_HOTKEY_SCRIPT = f"""
+(function () {{
+  if (window.__inkeepLazyHotkey) return;
+  window.__inkeepLazyHotkey = true;
+  document.addEventListener('keydown', function (event) {{
+    if (!(event.metaKey || event.ctrlKey) || event.key.toLowerCase() !== 'k') return;
+
+    var trigger = document.getElementById('{_SEARCH_TRIGGER_ID}');
+    if (!trigger) return;
+
+    event.preventDefault();
+    trigger.click();
+  }});
+}})();
+"""
+
+
+def _controlled_modal_settings(opened: ClientStateVar) -> Var:
+    """Create controlled modal settings for the Inkeep search bar.
+
+    Args:
+        opened: Client state var tracking whether the modal is open.
+
+    Returns:
+        A Var containing the Inkeep props and client state dependencies.
+    """
+    is_open = opened.value
+    on_open_change = opened.set
+    return Var(
+        "{...searchBarProps, modalSettings: "
+        f"{{isOpen: {is_open!s}, onOpenChange: {on_open_change!s}}}}}"
+    )._replace(
+        merge_var_data=VarData.merge(
+            is_open._get_all_var_data(),
+            on_open_change._get_all_var_data(),
+        )
+    )
+
+
+def _search_trigger_placeholder(on_click: EventSpec) -> rx.Component:
+    """Lightweight stand-in for the Inkeep search bar button.
+
+    Mirrors the widget's trigger styling so mounting the real search bar does
+    not shift layout, while keeping the ~276 KB Inkeep chunk (and the Google
+    Fonts stylesheet it injects) off the critical path until first use.
+
+    Args:
+        on_click: Event handler that mounts the real search widget.
+
+    Returns:
+        The placeholder button component.
+    """
+    return rx.el.button(
+        rx.html(_SEARCH_ICON_SVG, class_name="flex shrink-0"),
+        rx.el.span("Search", class_name="max-xl:hidden"),
+        rx.el.kbd(
+            "⌘K",
+            class_name="max-xl:hidden ml-auto flex items-center justify-center px-1 h-5 rounded bg-secondary-3 text-[0.8125rem] font-[475] leading-5 font-sans",
+        ),
+        id=_SEARCH_TRIGGER_ID,
+        type="button",
+        aria_label="Search documentation",
+        on_click=on_click,
+        class_name=(
+            "flex flex-row items-center justify-center xl:justify-start gap-2 rounded-lg "
+            "h-8 min-h-8 w-8 xl:w-40 px-0 xl:px-2 "
+            "bg-secondary-1 dark:bg-secondary-2 hover:bg-secondary-2 dark:hover:bg-secondary-3 "
+            "text-secondary-11 text-sm font-medium leading-6 border-none cursor-pointer "
+            "shadow-[0_-1px_0_0_rgba(0,0,0,0.08)_inset,0_0_0_1px_rgba(0,0,0,0.08)_inset,0_1px_2px_0_rgba(0,0,0,0.02),0_1px_4px_0_rgba(0,0,0,0.02)] "
+            "dark:shadow-[0_-1px_0_0_rgba(255,255,255,0.06)_inset,0_0_0_1px_rgba(255,255,255,0.04)_inset]"
+        ),
+    )
+
+
 class Search(rx.el.Div):
     def add_imports(self):
         """Add the imports for the component."""
@@ -135,6 +229,9 @@ def add_hooks(self):
       forcedColorMode: resolvedColorMode, // options: 'light' or dark'
     },
     theme: {
+      // The site ships its own fonts; skip the widget's default Google Fonts
+      // (Inter) stylesheet injection.
+      disableLoadingDefaultFont: true,
       // Add inline styles using the recommended approach from the docs
       styles: [
         {
@@ -390,11 +487,30 @@ def add_hooks(self):
 
     @classmethod
     def create(cls):
-        """Create the search component."""
+        """Create the search component.
+
+        The Inkeep widget is not mounted until the user interacts with the
+        search trigger, keeping its large bundle out of the initial page load.
+        The modal is controlled and starts open, so the interaction that
+        mounts the widget also opens search.
+        """
+        loaded = ClientStateVar.create(
+            _INKEEP_LOADED_STATE, default=False, global_ref=False
+        )
+        opened = ClientStateVar.create(
+            _INKEEP_OPEN_STATE, default=True, global_ref=False
+        )
         return super().create(
-            InkeepSearchBar.create(
-                special_props=[Var("{...searchBarProps}")],
-            )
+            rx.cond(
+                loaded.value,
+                InkeepSearchBar.create(
+                    special_props=[_controlled_modal_settings(opened)],
+                ),
+                _search_trigger_placeholder(
+                    on_click=rx.call_function(loaded.set_value(True)),
+                ),
+            ),
+            rx.el.script(_HOTKEY_SCRIPT),
         )
 
 
diff --git a/packages/reflex-components-code/src/reflex_components_code/code.py b/packages/reflex-components-code/src/reflex_components_code/code.py
index a6fec988df6..4cd3db193e2 100644
--- a/packages/reflex-components-code/src/reflex_components_code/code.py
+++ b/packages/reflex-components-code/src/reflex_components_code/code.py
@@ -466,6 +466,7 @@ def create(
                 if copy_button is not None
                 else Button.create(
                     Icon.create(tag="copy"),
+                    aria_label="Copy code",
                     on_click=set_clipboard(code),
                     style=Style({"position": "absolute", "top": "0.5em", "right": "0"}),
                 )
diff --git a/packages/reflex-components-code/src/reflex_components_code/shiki_code_block.py b/packages/reflex-components-code/src/reflex_components_code/shiki_code_block.py
index f18568d5912..c16c89197ed 100644
--- a/packages/reflex-components-code/src/reflex_components_code/shiki_code_block.py
+++ b/packages/reflex-components-code/src/reflex_components_code/shiki_code_block.py
@@ -785,6 +785,7 @@ def create(
                 if copy_button is not None
                 else Button.create(
                     Icon.create(tag="copy", size=16, color=color("gray", 11)),
+                    aria_label="Copy code",
                     on_click=[
                         set_clipboard(cls._strip_transformer_triggers(code)),
                         copy_script(),
diff --git a/packages/reflex-components-internal/src/reflex_components_internal/components/base/input.py b/packages/reflex-components-internal/src/reflex_components_internal/components/base/input.py
index 824836ea4af..79d5b6c9faf 100644
--- a/packages/reflex-components-internal/src/reflex_components_internal/components/base/input.py
+++ b/packages/reflex-components-internal/src/reflex_components_internal/components/base/input.py
@@ -178,6 +178,7 @@ def _create_clear_button(id: str, clear_events: list[EventHandler]) -> Button:
         return Button.create(
             hi("CancelCircleIcon"),
             type="button",
+            aria_label="Clear input",
             on_click=[
                 set_value(id, ""),
                 set_focus(id).stop_propagation,

From b377236df0113e5d30b041e08373bb12f56bb0a7 Mon Sep 17 00:00:00 2001
From: Farhan <www.mfarvirus@gmail.com>
Date: Thu, 9 Jul 2026 16:12:17 +0500
Subject: [PATCH 2/5] fix(docs): run Inkeep hotkey/hint logic in a mount effect

A React-rendered inline <script> tag does not execute on client
navigation, so Cmd/Ctrl+K never opened search before the widget
mounted and the placeholder always showed the Mac glyph. Move the
shortcut forwarder and platform-aware hint correction into a useEffect
so they run reliably on mount; non-Mac platforms now show "Ctrl K".
---
 docs/app/reflex_docs/views/inkeep.py | 43 +++++++++++++++++-----------
 1 file changed, 27 insertions(+), 16 deletions(-)

diff --git a/docs/app/reflex_docs/views/inkeep.py b/docs/app/reflex_docs/views/inkeep.py
index d4b88c96e1b..cca5efd47bc 100644
--- a/docs/app/reflex_docs/views/inkeep.py
+++ b/docs/app/reflex_docs/views/inkeep.py
@@ -27,23 +27,34 @@ class InkeepSearchBar(rx.NoSSRComponent):
     ' d="M12.667 7.333A5.333 5.333 0 1 0 2 7.333a5.333 5.333 0 0 0 10.667 0"/></svg>'
 )
 
-# Cmd/Ctrl+K opens search before the widget has been loaded: forward the
-# shortcut to the placeholder trigger, which mounts the real widget with its
-# modal open. Once the widget is mounted, its own shortcut handler takes over.
-_HOTKEY_SCRIPT = f"""
-(function () {{
-  if (window.__inkeepLazyHotkey) return;
-  window.__inkeepLazyHotkey = true;
-  document.addEventListener('keydown', function (event) {{
-    if (!(event.metaKey || event.ctrlKey) || event.key.toLowerCase() !== 'k') return;
-
-    var trigger = document.getElementById('{_SEARCH_TRIGGER_ID}');
+# Runs on mount (as a real effect, not an inert rendered <script>) to:
+#   1. Fix the placeholder's keyboard hint for non-Mac platforms, which can't
+#      be known during SSR (the default label is the Mac glyph).
+#   2. Forward Cmd/Ctrl+K to the placeholder trigger before the widget loads,
+#      mounting the real widget with its modal open. Once mounted, the
+#      placeholder is gone so this no-ops and Inkeep's own handler takes over.
+_HOTKEY_AND_HINT_HOOK = f"""
+useEffect(() => {{
+  const triggerId = "{_SEARCH_TRIGGER_ID}";
+  const platform =
+    (navigator.userAgentData && navigator.userAgentData.platform) ||
+    navigator.platform ||
+    navigator.userAgent ||
+    "";
+  if (!/mac|iphone|ipad|ipod/i.test(platform)) {{
+    const hint = document.getElementById(triggerId)?.querySelector("kbd");
+    if (hint) hint.textContent = "Ctrl K";
+  }}
+  const onKeydown = (event) => {{
+    if (!(event.metaKey || event.ctrlKey) || event.key.toLowerCase() !== "k") return;
+    const trigger = document.getElementById(triggerId);
     if (!trigger) return;
-
     event.preventDefault();
     trigger.click();
-  }});
-}})();
+  }};
+  document.addEventListener("keydown", onKeydown);
+  return () => document.removeEventListener("keydown", onKeydown);
+}}, [])
 """
 
 
@@ -108,7 +119,7 @@ class Search(rx.el.Div):
     def add_imports(self):
         """Add the imports for the component."""
         return {
-            "react": {ImportVar(tag="useContext")},
+            "react": {ImportVar(tag="useContext"), ImportVar(tag="useEffect")},
             "$/utils/context": {ImportVar(tag="ColorModeContext")},
         }
 
@@ -116,6 +127,7 @@ def add_hooks(self):
         """Add the hooks for the component."""
         return [
             "const { resolvedColorMode } = useContext(ColorModeContext)",
+            _HOTKEY_AND_HINT_HOOK,
             """
 const escalationParams = {
   type: "object",
@@ -510,7 +522,6 @@ def create(cls):
                     on_click=rx.call_function(loaded.set_value(True)),
                 ),
             ),
-            rx.el.script(_HOTKEY_SCRIPT),
         )
 
 

From 18f162c711a9a75b5b376d0130be7932edbeb770 Mon Sep 17 00:00:00 2001
From: Farhan <www.mfarvirus@gmail.com>
Date: Fri, 10 Jul 2026 18:45:23 +0500
Subject: [PATCH 3/5] fix(docs): smooth Inkeep search handoff

---
 docs/app/reflex_docs/views/inkeep.py | 36 +++++++++++----
 docs/app/tests/test_inkeep.py        | 67 ++++++++++++++++++++++++++++
 2 files changed, 94 insertions(+), 9 deletions(-)
 create mode 100644 docs/app/tests/test_inkeep.py

diff --git a/docs/app/reflex_docs/views/inkeep.py b/docs/app/reflex_docs/views/inkeep.py
index cca5efd47bc..17030c564af 100644
--- a/docs/app/reflex_docs/views/inkeep.py
+++ b/docs/app/reflex_docs/views/inkeep.py
@@ -1,6 +1,7 @@
 """UI and logic inkeep chat component."""
 
 import reflex as rx
+from reflex.constants import MemoizationMode
 from reflex.event import EventSpec
 from reflex.experimental.client_state import ClientStateVar
 from reflex.utils.imports import ImportVar
@@ -15,7 +16,12 @@ class InkeepSearchBar(rx.NoSSRComponent):
 
 _INKEEP_LOADED_STATE = "inkeep_loaded"
 _INKEEP_OPEN_STATE = "inkeep_open"
+_SEARCH_WRAPPER_ID = "inkeep-search-wrapper"
 _SEARCH_TRIGGER_ID = "inkeep-search-trigger"
+_SEARCH_TRIGGER_FALLBACK_STYLE = (
+    f"#{_SEARCH_WRAPPER_ID}:has(> [id^='inkeep-shadow']) "
+    f"> #{_SEARCH_TRIGGER_ID} {{ display: none; }}"
+)
 
 # Inline copy of assets/icons/search.svg so the placeholder needs no extra request.
 _SEARCH_ICON_SVG = (
@@ -31,11 +37,12 @@ class InkeepSearchBar(rx.NoSSRComponent):
 #   1. Fix the placeholder's keyboard hint for non-Mac platforms, which can't
 #      be known during SSR (the default label is the Mac glyph).
 #   2. Forward Cmd/Ctrl+K to the placeholder trigger before the widget loads,
-#      mounting the real widget with its modal open. Once mounted, the
-#      placeholder is gone so this no-ops and Inkeep's own handler takes over.
+#      mounting the real widget with its modal open. Once Inkeep's shadow host
+#      mounts, this no-ops and Inkeep's own handler takes over.
 _HOTKEY_AND_HINT_HOOK = f"""
 useEffect(() => {{
   const triggerId = "{_SEARCH_TRIGGER_ID}";
+  const wrapperId = "{_SEARCH_WRAPPER_ID}";
   const platform =
     (navigator.userAgentData && navigator.userAgentData.platform) ||
     navigator.platform ||
@@ -48,7 +55,10 @@ class InkeepSearchBar(rx.NoSSRComponent):
   const onKeydown = (event) => {{
     if (!(event.metaKey || event.ctrlKey) || event.key.toLowerCase() !== "k") return;
     const trigger = document.getElementById(triggerId);
-    if (!trigger) return;
+    const widgetReady = document
+      .getElementById(wrapperId)
+      ?.querySelector("[id^='inkeep-shadow']");
+    if (!trigger || widgetReady) return;
     event.preventDefault();
     trigger.click();
   }};
@@ -116,6 +126,8 @@ def _search_trigger_placeholder(on_click: EventSpec) -> rx.Component:
 
 
 class Search(rx.el.Div):
+    _memoization_mode = MemoizationMode(recursive=False)
+
     def add_imports(self):
         """Add the imports for the component."""
         return {
@@ -389,7 +401,8 @@ def add_hooks(self):
               width: auto;
             }
 
-            .ikp-search-bar__kbd-wrapper {
+            [data-theme='light'] .ikp-search-bar__kbd-wrapper,
+            [data-theme='dark'] .ikp-search-bar__kbd-wrapper {
               padding: 0px 0.25rem;
               justify-content: center;
               align-items: center;
@@ -408,8 +421,10 @@ def add_hooks(self):
               width: fit-content;
             }
 
-            .ikp-search-bar__text,
-            .ikp-search-bar__icon {
+            [data-theme='light'] .ikp-search-bar__text,
+            [data-theme='dark'] .ikp-search-bar__text,
+            [data-theme='light'] .ikp-search-bar__icon,
+            [data-theme='dark'] .ikp-search-bar__icon {
               color: var(--secondary-11);
               font-weight: 500;
               font-style: normal;
@@ -513,15 +528,18 @@ def create(cls):
             _INKEEP_OPEN_STATE, default=True, global_ref=False
         )
         return super().create(
+            rx.el.style(_SEARCH_TRIGGER_FALLBACK_STYLE),
             rx.cond(
                 loaded.value,
                 InkeepSearchBar.create(
                     special_props=[_controlled_modal_settings(opened)],
                 ),
-                _search_trigger_placeholder(
-                    on_click=rx.call_function(loaded.set_value(True)),
-                ),
+                rx.fragment(),
+            ),
+            _search_trigger_placeholder(
+                on_click=rx.call_function(loaded.set_value(True)),
             ),
+            id=_SEARCH_WRAPPER_ID,
         )
 
 
diff --git a/docs/app/tests/test_inkeep.py b/docs/app/tests/test_inkeep.py
new file mode 100644
index 00000000000..1cbc8d8bd1f
--- /dev/null
+++ b/docs/app/tests/test_inkeep.py
@@ -0,0 +1,67 @@
+"""Tests for the lazy-loaded Inkeep search control."""
+
+import re
+
+from reflex_docs.views.inkeep import _HOTKEY_AND_HINT_HOOK, Search
+
+
+def _has_prop(component: dict, prop: str) -> bool:
+    """Check whether a rendered component has an exact prop.
+
+    Args:
+        component: Rendered Reflex component dictionary.
+        prop: Serialized prop to find.
+
+    Returns:
+        Whether the component contains the prop.
+    """
+    return prop in component.get("props", [])
+
+
+def test_search_keeps_local_state_in_one_memo_boundary():
+    """Keep the local state hooks and their consumers in the same JS component."""
+    assert not Search.create()._memoization_mode.recursive
+
+
+def test_search_placeholder_stays_mounted_until_shadow_host_exists():
+    """Keep the placeholder visible until Inkeep's shadow host mounts."""
+    search = Search.create()
+    rendered = search.render()
+    placeholder = next(
+        (
+            child
+            for child in rendered["children"]
+            if child.get("name") == '"button"'
+            and _has_prop(child, 'id:"inkeep-search-trigger"')
+        ),
+        None,
+    )
+
+    assert placeholder is not None
+    global_css = "\n".join(
+        nested["contents"]
+        for child in rendered["children"]
+        if child.get("name") == '"style"'
+        for nested in child.get("children", [])
+    )
+    assert (
+        "#inkeep-search-wrapper:has(> [id^='inkeep-shadow']) > #inkeep-search-trigger"
+    ) in global_css
+    assert "[id^='inkeep-shadow']" in _HOTKEY_AND_HINT_HOOK
+    assert ".ikp-search-bar__container" not in _HOTKEY_AND_HINT_HOOK
+
+
+def test_search_widget_dark_colors_match_placeholder():
+    """Override Inkeep's higher-specificity dark colors with the placeholder color."""
+    styles = "\n".join(Search.create().add_hooks())
+
+    for selector in (
+        ".ikp-search-bar__text",
+        ".ikp-search-bar__icon",
+        ".ikp-search-bar__kbd-wrapper",
+    ):
+        assert re.search(
+            rf"\[data-theme='dark'\] {re.escape(selector)}[^{{}}]*"
+            r"\{[^{}]*color:\s*var\(--secondary-11\)",
+            styles,
+        )

From c68712542c0cf3d1c764b4a8db68a1ebbb76fbbb Mon Sep 17 00:00:00 2001
From: Farhan <www.mfarvirus@gmail.com>
Date: Fri, 10 Jul 2026 19:20:41 +0500
Subject: [PATCH 4/5] fix(docs): match Inkeep kbd hint to the search
 placeholder

Inkeep's base styles give the inner <kbd> keys a monospace font stack,
so the shortcut hint visibly changed font and width ("Ctrl K" ->
monospace "CtrlK") when the real widget replaced the placeholder. Make
the keys inherit the wrapper's font, and mirror the widget's two-key
2px-gap markup in the placeholder so the handoff is pixel-identical.
---
 docs/app/reflex_docs/views/inkeep.py | 17 +++++++++++++----
 docs/app/tests/test_inkeep.py        | 15 +++++++++++++++
 2 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/docs/app/reflex_docs/views/inkeep.py b/docs/app/reflex_docs/views/inkeep.py
index 17030c564af..f3cb89793bd 100644
--- a/docs/app/reflex_docs/views/inkeep.py
+++ b/docs/app/reflex_docs/views/inkeep.py
@@ -49,8 +49,8 @@ class InkeepSearchBar(rx.NoSSRComponent):
     navigator.userAgent ||
     "";
   if (!/mac|iphone|ipad|ipod/i.test(platform)) {{
-    const hint = document.getElementById(triggerId)?.querySelector("kbd");
-    if (hint) hint.textContent = "Ctrl K";
+    const hint = document.getElementById(triggerId)?.querySelector("kbd > span");
+    if (hint) hint.textContent = "Ctrl";
   }}
   const onKeydown = (event) => {{
     if (!(event.metaKey || event.ctrlKey) || event.key.toLowerCase() !== "k") return;
@@ -107,8 +107,10 @@ def _search_trigger_placeholder(on_click: EventSpec) -> rx.Component:
         rx.html(_SEARCH_ICON_SVG, class_name="flex shrink-0"),
         rx.el.span("Search", class_name="max-xl:hidden"),
         rx.el.kbd(
-            "⌘K",
-            class_name="max-xl:hidden ml-auto flex items-center justify-center px-1 h-5 rounded bg-secondary-3 text-[0.8125rem] font-[475] leading-5 font-sans",
+            # Two keys with a 2px gap, mirroring Inkeep's kbd-wrapper markup.
+            rx.el.span("⌘"),
+            rx.el.span("K"),
+            class_name="max-xl:hidden ml-auto flex items-center justify-center gap-0.5 px-1 h-5 rounded bg-secondary-3 text-[0.8125rem] font-[475] leading-5 font-sans",
         ),
         id=_SEARCH_TRIGGER_ID,
         type="button",
@@ -421,6 +423,13 @@ def add_hooks(self):
               width: fit-content;
             }
 
+            .ikp-search-bar__kbd-wrapper kbd {
+              /* Inkeep's base styles give the inner keys a monospace stack;
+                 inherit the wrapper's font so the hint matches the
+                 pre-mount placeholder trigger. */
+              font: inherit;
+            }
+
             [data-theme='light'] .ikp-search-bar__text,
             [data-theme='dark'] .ikp-search-bar__text,
             [data-theme='light'] .ikp-search-bar__icon,
diff --git a/docs/app/tests/test_inkeep.py b/docs/app/tests/test_inkeep.py
index 1cbc8d8bd1f..b1655ff1bac 100644
--- a/docs/app/tests/test_inkeep.py
+++ b/docs/app/tests/test_inkeep.py
@@ -51,6 +51,21 @@ def test_search_placeholder_stays_mounted_until_shadow_host_exists():
     assert ".ikp-search-bar__container" not in _HOTKEY_AND_HINT_HOOK
 
 
+def test_search_widget_kbd_hint_matches_placeholder():
+    """Keep the widget's kbd hint visually identical to the placeholder's.
+
+    Inkeep's base styles give the inner <kbd> keys a monospace font stack, so
+    the hint visibly changes font (and width) when the real widget replaces
+    the placeholder unless the keys inherit the wrapper's font.
+    """
+    styles = "\n".join(Search.create().add_hooks())
+    assert re.search(
+        r"\.ikp-search-bar__kbd-wrapper kbd\s*\{[^{}]*font:\s*inherit", styles
+    )
+    # The hook targets the placeholder's first key span to swap ⌘ for Ctrl.
+    assert 'querySelector("kbd > span")' in _HOTKEY_AND_HINT_HOOK
+
+
 def test_search_widget_dark_colors_match_placeholder():
     """Override Inkeep's higher-specificity dark colors with the placeholder color."""
     styles = "\n".join(Search.create().add_hooks())

From 11e22c4cc2c37fb3d1986a6813d78f7f720e3b8d Mon Sep 17 00:00:00 2001
From: Farhan <www.mfarvirus@gmail.com>
Date: Fri, 10 Jul 2026 22:52:36 +0500
Subject: [PATCH 5/5] perf(docs): highlight literal code blocks at build time

Discover literal docs code blocks during a production prepass, render them through a pinned Shiki runtime, and embed the cached HTML in the final prerendered pages. Keep development and dynamic code paths on the existing client component.
---
 docs/app/assets/tailwind-theme.css            |  18 +-
 docs/app/rxconfig.py                          |   2 +
 docs/app/tests/test_static_shiki.py           | 407 ++++++++++++
 docs/getting_started/introduction.md          |  40 +-
 .../news/6732.bugfix.md                       |   1 +
 .../_generate_static_shiki.mjs                | 104 ++++
 .../components/blocks/code.py                 | 229 ++++++-
 .../src/reflex_site_shared/static_shiki.py    | 581 ++++++++++++++++++
 .../static_shiki_runtime/bun.lock             | 101 +++
 .../static_shiki_runtime/package.json         |   8 +
 10 files changed, 1472 insertions(+), 19 deletions(-)
 create mode 100644 docs/app/tests/test_static_shiki.py
 create mode 100644 packages/reflex-components-code/news/6732.bugfix.md
 create mode 100644 packages/reflex-site-shared/src/reflex_site_shared/_generate_static_shiki.mjs
 create mode 100644 packages/reflex-site-shared/src/reflex_site_shared/static_shiki.py
 create mode 100644 packages/reflex-site-shared/src/reflex_site_shared/static_shiki_runtime/bun.lock
 create mode 100644 packages/reflex-site-shared/src/reflex_site_shared/static_shiki_runtime/package.json

diff --git a/docs/app/assets/tailwind-theme.css b/docs/app/assets/tailwind-theme.css
index 848002ec1fc..0df15d1f618 100644
--- a/docs/app/assets/tailwind-theme.css
+++ b/docs/app/assets/tailwind-theme.css
@@ -3,6 +3,22 @@
 
 @custom-variant dark (&:where(.dark, .dark *));
 
+.dark .static-shiki .shiki {
+    color: var(--shiki-dark) !important;
+    background-color: var(--shiki-dark-bg) !important;
+    font-style: var(--shiki-dark-font-style) !important;
+    font-weight: var(--shiki-dark-font-weight) !important;
+    text-decoration: var(--shiki-dark-text-decoration) !important;
+}
+
+.dark .static-shiki .shiki span {
+    color: var(--shiki-dark) !important;
+    background-color: transparent !important;
+    font-style: var(--shiki-dark-font-style) !important;
+    font-weight: var(--shiki-dark-font-weight) !important;
+    text-decoration: var(--shiki-dark-text-decoration) !important;
+}
+
 :root {
     /* Primary */
     --primary-1: var(--violet-1);
@@ -2184,4 +2200,4 @@
 
 #ph-conversations-widget-container button[aria-label^="Open chat"]+div {
     display: none !important;
-}
\ No newline at end of file
+}
diff --git a/docs/app/rxconfig.py b/docs/app/rxconfig.py
index f8825f87283..ce547593b89 100644
--- a/docs/app/rxconfig.py
+++ b/docs/app/rxconfig.py
@@ -1,4 +1,5 @@
 import reflex as rx
+from reflex_site_shared.static_shiki import StaticShikiPlugin
 
 from agent_files import AgentFilesPlugin
 
@@ -14,5 +15,6 @@
         rx.plugins.TailwindV4Plugin(),
         rx.plugins.SitemapPlugin(trailing_slash="always"),
         AgentFilesPlugin(),
+        StaticShikiPlugin(),
     ],
 )
diff --git a/docs/app/tests/test_static_shiki.py b/docs/app/tests/test_static_shiki.py
new file mode 100644
index 00000000000..f470155edef
--- /dev/null
+++ b/docs/app/tests/test_static_shiki.py
@@ -0,0 +1,407 @@
+"""Tests for docs build-time Shiki highlighting."""
+
+import json
+import os
+import subprocess
+import sys
+from pathlib import Path
+
+import pytest
+from reflex_site_shared import static_shiki
+from reflex_site_shared.components.blocks.code import (
+    _copy_button,
+    code_block,
+    code_block_dark,
+    doccmdoutput,
+    literal_shiki_code_block,
+)
+
+
+@pytest.fixture(autouse=True)
+def reset_static_shiki_state(monkeypatch):
+    """Reset process-local Shiki state between tests."""
+    monkeypatch.delenv(static_shiki.BUILD_PHASE_ENV, raising=False)
+    monkeypatch.delenv(static_shiki.CACHE_DIR_ENV, raising=False)
+    static_shiki._reset_for_testing()
+    yield
+    static_shiki._reset_for_testing()
+
+
+def _write_cache(tmp_path, *requests):
+    """Write a valid cache for the supplied requests."""
+    entries = {
+        static_shiki.request_key(request): {
+            "request": request,
+            "html": ('<pre class="shiki"><code>' + request["code"] + "</code></pre>"),
+        }
+        for request in requests
+    }
+    (tmp_path / static_shiki.CACHE_FILENAME).write_text(
+        json.dumps({
+            "schema_version": static_shiki.SCHEMA_VERSION,
+            "shiki_version": static_shiki.SHIKI_VERSION,
+            "entries": entries,
+        })
+    )
+
+
+def test_request_key_is_stable_and_normalizes_aliases():
+    """Equivalent requests have the same content-addressed key."""
+    request = static_shiki.make_request("echo hi", language="bash")
+
+    assert request == {
+        "code": "echo hi",
+        "language": "shellscript",
+        "themes": {"dark": "one-dark-pro", "light": "one-light"},
+    }
+    assert static_shiki.request_key(request) == static_shiki.request_key(
+        dict(reversed(request.items()))
+    )
+
+
+@pytest.mark.parametrize(
+    ("alias", "language"),
+    [
+        ("console", "shellsession"),
+        ("py", "python"),
+        ("js", "javascript"),
+        ("text", "plain"),
+    ],
+)
+def test_request_normalizes_common_docs_language_aliases(alias, language):
+    """Discovery uses Shiki's canonical identifiers for docs aliases."""
+    assert static_shiki.make_request("code", language=alias)["language"] == language
+
+
+def test_build_phase_defaults_to_client_and_rejects_unknown_values(monkeypatch):
+    """Ordinary development keeps the existing client component path."""
+    assert static_shiki.get_build_phase() == static_shiki.CLIENT_PHASE
+
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, "benchmark")
+
+    with pytest.raises(static_shiki.StaticShikiError, match="benchmark"):
+        static_shiki.get_build_phase()
+
+
+def test_discovery_manifest_is_sorted_and_deduplicated(tmp_path, monkeypatch):
+    """Discovery writes deterministic, content-addressed requests."""
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.DISCOVERY_PHASE)
+    second = static_shiki.make_request("print(2)", language="python")
+    first = static_shiki.make_request("print(1)", language="python")
+
+    static_shiki.register_request(second)
+    static_shiki.register_request(first)
+    static_shiki.register_request(second)
+    manifest_path = static_shiki.flush_discovery_manifest()
+
+    manifest = json.loads(manifest_path.read_text())
+    assert list(manifest["requests"]) == sorted(manifest["requests"])
+    assert len(manifest["requests"]) == 2
+    assert manifest["schema_version"] == static_shiki.SCHEMA_VERSION
+    assert manifest["shiki_version"] == static_shiki.SHIKI_VERSION
+
+
+def test_plugin_flushes_only_the_discovery_manifest(tmp_path, monkeypatch):
+    """The compiler hook writes the complete manifest before its process exits."""
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    plugin = static_shiki.StaticShikiPlugin()
+    request = static_shiki.make_request("print(1)", language="python")
+    static_shiki.register_request(request)
+
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.CLIENT_PHASE)
+    plugin.pre_compile()
+    assert not (tmp_path / static_shiki.MANIFEST_FILENAME).exists()
+
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.DISCOVERY_PHASE)
+    plugin.pre_compile()
+    assert (tmp_path / static_shiki.MANIFEST_FILENAME).exists()
+
+
+def test_plugin_prepares_static_cache_automatically_in_production(
+    tmp_path, monkeypatch
+):
+    """A normal production compile owns discovery and cache generation."""
+    calls = []
+    web_dir = tmp_path / "web"
+    web_dir.mkdir()
+
+    class TemporaryDirectory:
+        def __init__(self, **kwargs):
+            calls.append(("temporary", kwargs))
+            self.name = str(tmp_path / "build-cache")
+            Path(self.name).mkdir()
+
+        def cleanup(self):
+            calls.append(("cleanup", self.name))
+
+    def run(command, **kwargs):
+        calls.append((command, kwargs))
+        return subprocess.CompletedProcess(command, 0)
+
+    def generate_cache(runtime_dir):
+        calls.append(("generate", runtime_dir))
+        cache_dir = Path(static_shiki.get_cache_dir())
+        _write_cache(cache_dir)
+        return cache_dir / static_shiki.CACHE_FILENAME
+
+    monkeypatch.setattr(static_shiki, "is_prod_mode", lambda: True)
+    monkeypatch.setattr(static_shiki.prerequisites, "get_web_dir", lambda: web_dir)
+    monkeypatch.setattr(static_shiki.tempfile, "TemporaryDirectory", TemporaryDirectory)
+    monkeypatch.setattr(static_shiki.subprocess, "run", run)
+    monkeypatch.setattr(static_shiki, "generate_cache", generate_cache)
+    monkeypatch.setattr(static_shiki.path_ops, "get_bun_path", lambda: Path("/bun"))
+
+    plugin = static_shiki.StaticShikiPlugin()
+
+    assert plugin.get_frontend_dependencies() == ()
+    child = next(call for call in calls if isinstance(call[0], list))
+    assert child[0][:4] == [sys.executable, "-m", "reflex", "compile"]
+    assert "--dry" in child[0]
+    assert child[1]["env"][static_shiki.BUILD_PHASE_ENV] == (
+        static_shiki.DISCOVERY_PHASE
+    )
+    install = next(call for call in calls if call[0][0:1] == ["/bun"])
+    assert install[0][-2:] == ["--frozen-lockfile", "--ignore-scripts"]
+    assert (tmp_path / "build-cache/shiki-runtime/bun.lock").exists()
+    assert static_shiki.get_build_phase() == static_shiki.RENDER_PHASE
+    assert Path(static_shiki.get_cache_dir()) == tmp_path / "build-cache/shiki-cache"
+
+    plugin.post_build()
+    assert static_shiki.get_build_phase() == static_shiki.CLIENT_PHASE
+    assert static_shiki.CACHE_DIR_ENV not in os.environ
+    assert ("cleanup", str(tmp_path / "build-cache")) in calls
+
+
+def test_plugin_leaves_development_and_child_phases_unchanged(monkeypatch):
+    """Development remains one-pass and the discovery child cannot recurse."""
+    plugin = static_shiki.StaticShikiPlugin()
+    monkeypatch.setattr(static_shiki, "is_prod_mode", lambda: False)
+    assert plugin.get_frontend_dependencies() == ()
+
+    monkeypatch.setattr(static_shiki, "is_prod_mode", lambda: True)
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.DISCOVERY_PHASE)
+    assert plugin.get_frontend_dependencies() == ()
+
+
+def test_cached_html_rejects_stale_and_missing_requests(tmp_path, monkeypatch):
+    """A render build cannot silently use stale or incomplete output."""
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    request = static_shiki.make_request("print(1)", language="python")
+    key = static_shiki.request_key(request)
+    (tmp_path / static_shiki.CACHE_FILENAME).write_text(
+        json.dumps({
+            "schema_version": static_shiki.SCHEMA_VERSION,
+            "shiki_version": static_shiki.SHIKI_VERSION,
+            "entries": {
+                key: {
+                    "request": {**request, "code": "print(2)"},
+                    "html": "x",
+                }
+            },
+        })
+    )
+
+    with pytest.raises(static_shiki.StaticShikiError, match="does not match"):
+        static_shiki.get_cached_html(request)
+
+    static_shiki._reset_for_testing()
+    _write_cache(tmp_path)
+    with pytest.raises(static_shiki.StaticShikiError, match="not present"):
+        static_shiki.get_cached_html(request)
+
+
+def test_cache_generation_rejects_empty_discovery(tmp_path, monkeypatch):
+    """A false-success discovery compile cannot proceed to the final build."""
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    (tmp_path / static_shiki.MANIFEST_FILENAME).write_text(
+        json.dumps({
+            "schema_version": static_shiki.SCHEMA_VERSION,
+            "shiki_version": static_shiki.SHIKI_VERSION,
+            "requests": {},
+        })
+    )
+
+    with pytest.raises(static_shiki.StaticShikiError, match="no requests"):
+        static_shiki.generate_cache(tmp_path / "web")
+
+
+def test_literal_component_uses_client_during_development(monkeypatch):
+    """Local development remains one-pass and supports dynamic client behavior."""
+    sentinel = object()
+
+    def client_component(code, **props):
+        assert code == "print(1)"
+        assert props == {"language": "python"}
+        return sentinel
+
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.CLIENT_PHASE)
+
+    assert (
+        literal_shiki_code_block(
+            "print(1)", language="python", client_component=client_component
+        )
+        is sentinel
+    )
+
+
+def test_literal_component_discovers_before_using_client(tmp_path, monkeypatch):
+    """Discovery records a request without changing the rendered component."""
+    sentinel = object()
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.DISCOVERY_PHASE)
+
+    result = literal_shiki_code_block(
+        "output",
+        language="console",
+        client_component=lambda *_args, **_kwargs: sentinel,
+    )
+
+    assert result is sentinel
+    manifest = json.loads(static_shiki.flush_discovery_manifest().read_text())
+    assert next(iter(manifest["requests"].values()))["language"] == "shellsession"
+
+
+def test_literal_component_renders_cached_html_without_client_import(
+    tmp_path, monkeypatch
+):
+    """The final component contains HTML and no Shiki runtime dependency."""
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.RENDER_PHASE)
+    request = static_shiki.make_request("print(1)", language="python")
+    _write_cache(tmp_path, request)
+
+    component = literal_shiki_code_block(
+        "print(1)", language="python", class_name="code-block", can_copy=True
+    )
+
+    assert not any(
+        "shiki" in library.lower() for library in component._get_all_imports()
+    )
+    rendered = str(component.render())
+    assert "static-shiki code-block" in rendered
+    assert "print(1)" in rendered
+
+
+def test_all_literal_docs_code_paths_use_cached_html(tmp_path, monkeypatch):
+    """Dark demos and command output cannot reintroduce client-side Shiki."""
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.RENDER_PHASE)
+    requests = [
+        static_shiki.make_request("print(1)", language="python"),
+        static_shiki.make_request(
+            "reflex run",
+            language="bash",
+            themes={"light": "ayu-dark", "dark": "ayu-dark"},
+        ),
+        static_shiki.make_request(
+            "Running...",
+            language="log",
+            themes={"light": "ayu-dark", "dark": "ayu-dark"},
+        ),
+    ]
+    _write_cache(tmp_path, *requests)
+
+    components = (
+        code_block("print(1)", "python"),
+        code_block_dark("print(1)", "python"),
+        doccmdoutput("reflex run", "Running..."),
+    )
+
+    for component in components:
+        assert not any(
+            "shiki" in library.lower() for library in component._get_all_imports()
+        )
+
+
+def test_static_component_respects_disabled_copy_button(tmp_path, monkeypatch):
+    """Honor an explicitly disabled custom copy control like the client block."""
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.RENDER_PHASE)
+    request = static_shiki.make_request("print(1)", language="python")
+    _write_cache(tmp_path, request)
+
+    component = literal_shiki_code_block(
+        "print(1)",
+        language="python",
+        can_copy=True,
+        copy_button=False,
+    )
+
+    assert 'aria-label":"Copy code' not in str(component.render())
+
+
+def test_request_rejects_dynamic_code_and_unsupported_options(monkeypatch):
+    """The static path fails clearly for values it cannot reproduce exactly."""
+    import reflex as rx
+
+    with pytest.raises(static_shiki.StaticShikiError, match="literal string"):
+        static_shiki.make_request(rx.Var.create("dynamic"), language="python")
+
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.DISCOVERY_PHASE)
+    with pytest.raises(static_shiki.StaticShikiError, match="not supported"):
+        literal_shiki_code_block("print(1)", language="python", use_transformers=True)
+
+
+def test_docs_code_block_discovers_before_using_original_memo(tmp_path, monkeypatch):
+    """Discovery records literals without exposing them to client prop validation."""
+    sentinel = object()
+
+    def plain_code_block(**props):
+        assert props == {"code": "output", "language": "console"}
+        return sentinel
+
+    monkeypatch.setenv(static_shiki.BUILD_PHASE_ENV, static_shiki.DISCOVERY_PHASE)
+    monkeypatch.setenv(static_shiki.CACHE_DIR_ENV, str(tmp_path))
+    monkeypatch.setitem(code_block.__globals__, "_plain_code_block", plain_code_block)
+
+    assert code_block("output", "console") is sentinel
+    manifest = json.loads(static_shiki.flush_discovery_manifest().read_text())
+    assert next(iter(manifest["requests"].values()))["language"] == "shellsession"
+
+
+def test_copy_button_strips_transformer_markers():
+    """Static copy controls copy source without display-only annotations."""
+    button = _copy_button('print("hello")  # [!code highlight]')
+
+    rendered = str(button.render())
+    assert "hello" in rendered
+    assert "[!code highlight]" not in rendered
+    assert button.type._var_value == "button"
+
+
+def test_dark_tokens_do_not_paint_the_block_background():
+    """Token spans stay transparent instead of becoming gray rectangles."""
+    stylesheet = (
+        Path(__file__).parents[1] / "assets" / "tailwind-theme.css"
+    ).read_text()
+
+    rule = stylesheet.split(".dark .static-shiki .shiki span", maxsplit=1)[1]
+    rule = rule.split("}", maxsplit=1)[0]
+    assert "background-color: transparent !important" in rule
+
+
+def test_intro_route_avoids_runtime_markdown_highlighter():
+    """Static prose must not pull React Syntax Highlighter into the key route."""
+    source = (Path(__file__).parents[2] / "getting_started/introduction.md").read_text()
+
+    assert "rx.markdown(" not in source
+    assert 'href="/pages/overview/"' in source
+
+
+def test_docs_register_static_shiki_plugin_unconditionally():
+    """Production highlighting must not depend on an experiment selector."""
+    from rxconfig import config
+
+    assert any(
+        isinstance(plugin, static_shiki.StaticShikiPlugin) for plugin in config.plugins
+    )
+
+
+def test_shiki_runtime_has_a_frozen_direct_dependency():
+    """The isolated generator cannot drift from the validated Shiki version."""
+    runtime_dir = Path(static_shiki.__file__).with_name("static_shiki_runtime")
+    package = json.loads((runtime_dir / "package.json").read_text())
+
+    assert package["dependencies"] == {"shiki": static_shiki.SHIKI_VERSION}
+    assert (runtime_dir / "bun.lock").is_file()
diff --git a/docs/getting_started/introduction.md b/docs/getting_started/introduction.md
index d6a9f5850bb..aa6bbca6ae5 100644
--- a/docs/getting_started/introduction.md
+++ b/docs/getting_started/introduction.md
@@ -1,5 +1,6 @@
 ```python exec
 import reflex as rx
+from reflex_site_shared.components.blocks.code import literal_shiki_code_block
 ```
 
 # Introduction
@@ -58,8 +59,9 @@ class IntroTabsState(rx.State):
 def counter_code_section(code: str, tab: str) -> rx.Component:
     active = IntroTabsState.value == tab
     return rx.box(
-        rx.code_block(
+        literal_shiki_code_block(
             code,
+            client_component=rx.code_block,
             class_name="code-block counter-code-block",
         ),
         background=rx.cond(active, "var(--c-violet-3)", "transparent"),
@@ -86,25 +88,43 @@ def tabs():
             class_name="pill-tab-list",
         ),
         rx.tabs.content(
-            rx.markdown(
-                """The frontend is built declaratively with Reflex components, which compile to JS and run in the browser. Use `rx.cond` and `rx.foreach` instead of `if` and `for` for dynamic UIs. Any non-UI logic belongs in `State`.
-                """,
+            rx.text(
+                "The frontend is built declaratively with Reflex components, which compile to JS and run in the browser. Use ",
+                rx.code("rx.cond"),
+                " and ",
+                rx.code("rx.foreach"),
+                " instead of ",
+                rx.code("if"),
+                " and ",
+                rx.code("for"),
+                " for dynamic UIs. Any non-UI logic belongs in ",
+                rx.code("State"),
+                ".",
+                class_name="font-[475] text-secondary-11 mb-4 leading-7",
             ),
             value="tab1",
             class_name="pt-4",
         ),
         rx.tabs.content(
-            rx.markdown(
-                """Write your backend in the `State` class. Here you can define functions and variables that can be referenced in the frontend. This code runs directly on the server and is not compiled, so there are no special caveats. Here you can use any Python external library and call any method/function.
-                """,
+            rx.text(
+                "Write your backend in the ",
+                rx.code("State"),
+                " class. Here you can define functions and variables that can be referenced in the frontend. This code runs directly on the server and is not compiled, so there are no special caveats. Here you can use any Python external library and call any method/function.",
+                class_name="font-[475] text-secondary-11 mb-4 leading-7",
             ),
             value="tab2",
             class_name="pt-4",
         ),
         rx.tabs.content(
-            rx.markdown(
-                """Each page is a Python function returning a Reflex component. Add as many as you want and link between them — see [Routing](/docs/pages/overview) for details.
-                """,
+            rx.text(
+                "Each page is a Python function returning a Reflex component. Add as many as you want and link between them — see ",
+                rx.link(
+                    "Routing",
+                    href="/pages/overview/",
+                    class_name="text-secondary-12 decoration-secondary-12 underline",
+                ),
+                " for details.",
+                class_name="font-[475] text-secondary-11 mb-4 leading-7",
             ),
             value="tab3",
             class_name="pt-4",
diff --git a/packages/reflex-components-code/news/6732.bugfix.md b/packages/reflex-components-code/news/6732.bugfix.md
new file mode 100644
index 00000000000..ffdd741e15e
--- /dev/null
+++ b/packages/reflex-components-code/news/6732.bugfix.md
@@ -0,0 +1 @@
+Added accessible labels to the default copy buttons in Code Block and Shiki Code Block components.
diff --git a/packages/reflex-site-shared/src/reflex_site_shared/_generate_static_shiki.mjs b/packages/reflex-site-shared/src/reflex_site_shared/_generate_static_shiki.mjs
new file mode 100644
index 00000000000..d62aa419f10
--- /dev/null
+++ b/packages/reflex-site-shared/src/reflex_site_shared/_generate_static_shiki.mjs
@@ -0,0 +1,104 @@
+import { createHash } from "node:crypto";
+import { createRequire } from "node:module";
+import { readFile, rename, writeFile } from "node:fs/promises";
+import { dirname, join } from "node:path";
+import { pathToFileURL } from "node:url";
+
+const SCHEMA_VERSION = 1;
+const SHIKI_VERSION = "3.3.0";
+const [manifestPath, cachePath, webDir] = process.argv.slice(2);
+if (!manifestPath || !cachePath || !webDir) {
+  throw new Error(
+    "Expected manifest, cache, and frontend directory arguments.",
+  );
+}
+
+function sortedValue(value) {
+  if (Array.isArray(value)) return value.map(sortedValue);
+  if (value !== null && typeof value === "object") {
+    return Object.fromEntries(
+      Object.keys(value)
+        .sort()
+        .map((key) => [key, sortedValue(value[key])]),
+    );
+  }
+  return value;
+}
+
+function requestKey(request) {
+  return createHash("sha256")
+    .update(JSON.stringify(sortedValue(request)), "utf8")
+    .digest("hex");
+}
+
+function validateRequest(key, request) {
+  if (
+    request === null ||
+    typeof request !== "object" ||
+    Array.isArray(request) ||
+    Object.keys(request).sort().join(",") !== "code,language,themes" ||
+    typeof request.code !== "string" ||
+    typeof request.language !== "string" ||
+    request.themes === null ||
+    typeof request.themes !== "object" ||
+    Array.isArray(request.themes) ||
+    Object.keys(request.themes).sort().join(",") !== "dark,light" ||
+    typeof request.themes.dark !== "string" ||
+    typeof request.themes.light !== "string"
+  ) {
+    throw new Error(`Static Shiki request ${key} has an invalid shape.`);
+  }
+  if (requestKey(request) !== key) {
+    throw new Error(`Static Shiki request ${key} does not match its hash.`);
+  }
+}
+
+const manifest = JSON.parse(await readFile(manifestPath, "utf8"));
+if (
+  manifest === null ||
+  typeof manifest !== "object" ||
+  Array.isArray(manifest) ||
+  manifest.schema_version !== SCHEMA_VERSION ||
+  manifest.shiki_version !== SHIKI_VERSION ||
+  manifest.requests === null ||
+  typeof manifest.requests !== "object" ||
+  Array.isArray(manifest.requests)
+) {
+  throw new Error("Static Shiki manifest schema or version is stale.");
+}
+
+const require = createRequire(pathToFileURL(join(webDir, "package.json")));
+const shikiEntry = require.resolve("shiki");
+const shikiPackage = JSON.parse(
+  await readFile(join(dirname(shikiEntry), "..", "package.json"), "utf8"),
+);
+if (shikiPackage.version !== SHIKI_VERSION) {
+  throw new Error(
+    `Static Shiki requires shiki ${SHIKI_VERSION}, found ${shikiPackage.version}.`,
+  );
+}
+const { codeToHtml } = await import(pathToFileURL(shikiEntry));
+
+const requestKeys = Object.keys(manifest.requests).sort();
+const entries = {};
+for (const key of requestKeys) {
+  const request = manifest.requests[key];
+  validateRequest(key, request);
+  const html = await codeToHtml(request.code, {
+    lang: request.language,
+    themes: request.themes,
+  });
+  entries[key] = { request, html };
+}
+if (Object.keys(entries).sort().join(",") !== requestKeys.join(",")) {
+  throw new Error("Static Shiki generated an incomplete request key set.");
+}
+
+const cache = {
+  schema_version: SCHEMA_VERSION,
+  shiki_version: shikiPackage.version,
+  entries,
+};
+const temporaryPath = `${cachePath}.tmp`;
+await writeFile(temporaryPath, `${JSON.stringify(cache)}\n`, "utf8");
+await rename(temporaryPath, cachePath);
diff --git a/packages/reflex-site-shared/src/reflex_site_shared/components/blocks/code.py b/packages/reflex-site-shared/src/reflex_site_shared/components/blocks/code.py
index 769cc12d41f..4ff3476d12d 100644
--- a/packages/reflex-site-shared/src/reflex_site_shared/components/blocks/code.py
+++ b/packages/reflex-site-shared/src/reflex_site_shared/components/blocks/code.py
@@ -1,15 +1,171 @@
 """Code block components for documentation pages."""
 
+from collections.abc import Callable
+
+from reflex_components_code.shiki_code_block import (
+    BOX_PARENT_STYLING,
+    LINE_NUMBER_STYLING,
+    ShikiHighLevelCodeBlock,
+    copy_script,
+)
 from reflex_components_code.shiki_code_block import code_block as shiki_code_block
 
 import reflex as rx
 import reflex_site_shared.styles.fonts as fonts
-from reflex_site_shared import styles
+from reflex_site_shared import static_shiki, styles
 
 EXPAND_THRESHOLD_LINES = 20
 COLLAPSED_MAX_HEIGHT = "400px"
 
 
+def _copy_button(code: str | rx.Var[str]) -> rx.Component:
+    """Create the copy control used by static and client Shiki blocks.
+
+    Args:
+        code: Literal source copied by the button.
+
+    Returns:
+        The copy button.
+    """
+    copy_text = ShikiHighLevelCodeBlock._strip_transformer_triggers(code)
+    return rx.el.button(
+        rx.icon("copy", size=16, color=rx.color("gray", 11)),
+        type="button",
+        aria_label="Copy code",
+        on_click=[
+            rx.set_clipboard(copy_text),
+            copy_script(),
+        ],
+        style={
+            "position": "absolute",
+            "top": "4px",
+            "right": "4px",
+            "background": rx.color("gray", 3),
+            "border": "1px solid",
+            "border_color": rx.color("gray", 5),
+            "border_radius": "6px",
+            "padding": "5px",
+            "opacity": "1",
+            "cursor": "pointer",
+            "_hover": {"background": rx.color("gray", 4)},
+            "transition": "background 0.12s ease-out",
+            "&>svg": {"transition": "transform 0.12s ease-out, opacity 0.12s ease-out"},
+            "_active": {"background": rx.color("gray", 5)},
+        },
+    )
+
+
+def _static_shiki_block(
+    code: str,
+    html: str,
+    *,
+    can_copy: bool,
+    show_line_numbers: bool,
+    **props,
+) -> rx.Component:
+    """Render cached Shiki HTML in the same wrapper as the client component.
+
+    Args:
+        code: Literal source copied by the optional button.
+        html: Highlighted HTML generated by Shiki.
+        can_copy: Whether to render the copy button.
+        show_line_numbers: Whether to apply line-number styles.
+        **props: Wrapper component properties.
+
+    Returns:
+        A static highlighted code block.
+    """
+    copy_button = props.pop("copy_button", None)
+    wrapper_style = props.pop("style", {})
+    if show_line_numbers:
+        wrapper_style = {**LINE_NUMBER_STYLING, **wrapper_style}
+    class_name = props.pop("class_name", "")
+    if isinstance(class_name, str):
+        class_name = class_name.split()
+    children = [rx.html(html, class_name="static-shiki-html")]
+    if can_copy and copy_button is None:
+        copy_button = _copy_button(code)
+    if copy_button:
+        children.append(copy_button)
+        props["position"] = "relative"
+    return rx.box(
+        *children,
+        class_name=" ".join(["static-shiki", *class_name]),
+        style={**wrapper_style, **BOX_PARENT_STYLING},
+        **props,
+    )
+
+
+def literal_shiki_code_block(
+    code: str,
+    *,
+    client_component: Callable[..., rx.Component] = shiki_code_block,
+    **props,
+) -> rx.Component:
+    """Render a literal code block through client or build-time Shiki.
+
+    Args:
+        code: Literal code to highlight.
+        client_component: Original component used for development and discovery.
+        **props: Shiki code block properties.
+
+    Returns:
+        The selected code block implementation.
+    """
+    if static_shiki.get_build_phase() == static_shiki.CLIENT_PHASE:
+        return client_component(code, **props)
+
+    if (
+        props.get("decorations")
+        or props.get("transformers")
+        or props.get("use_transformers")
+    ):
+        msg = "Shiki decorations and transformers are not supported at build time."
+        raise static_shiki.StaticShikiError(msg)
+
+    language = props.get("language", "python")
+    theme = props.get("theme")
+    themes = props.get("themes")
+    if themes is not None:
+        normalized_themes = themes
+    elif theme is None:
+        normalized_themes = static_shiki.DEFAULT_THEMES
+    elif isinstance(theme, str):
+        mapped_theme = ShikiHighLevelCodeBlock._map_themes(theme)
+        normalized_themes = {"light": mapped_theme, "dark": mapped_theme}
+    else:
+        msg = "Static Shiki requires literal theme names."
+        raise static_shiki.StaticShikiError(msg)
+
+    request = static_shiki.make_request(
+        code,
+        language=language,
+        themes=normalized_themes,
+    )
+    html = static_shiki.discover_or_get_html(request)
+    if html is None:
+        return client_component(code, **props)
+
+    static_props = dict(props)
+    for key in (
+        "decorations",
+        "language",
+        "theme",
+        "themes",
+        "transformers",
+        "use_transformers",
+        "code_tag_props",
+    ):
+        static_props.pop(key, None)
+    return _static_shiki_block(
+        code,
+        html,
+        can_copy=static_props.pop("can_copy", False),
+        show_line_numbers=static_props.pop("show_line_numbers", False),
+        **static_props,
+    )
+
+
 @rx.memo
 def _plain_code_block(code: rx.Var[str], language: rx.Var[str]) -> rx.Component:
     """Shared plain code block implementation.
@@ -36,11 +192,33 @@ def code_block(code: str, language: str):
     """
     # During import-graph introspection ``code`` may be a Var, not a Python str.
     # Skip the line-count check in that case and render the plain block.
-    if not isinstance(code, str):
+    if not isinstance(code, str) or not isinstance(language, str):
         return _plain_code_block(code=code, language=language)
+    if static_shiki.is_discovery():
+        plain_block = literal_shiki_code_block(
+            code,
+            client_component=lambda *_args, **_kwargs: _plain_code_block(
+                code=code, language=language
+            ),
+            language=language,
+            class_name="code-block",
+            can_copy=True,
+        )
+    elif static_shiki.is_render():
+        plain_block = rx.box(
+            literal_shiki_code_block(
+                code,
+                language=language,
+                class_name="code-block",
+                can_copy=True,
+            ),
+            class_name="relative mb-4",
+        )
+    else:
+        plain_block = _plain_code_block(code=code, language=language)
     if code.count("\n") + 1 > EXPAND_THRESHOLD_LINES:
         return rx.el.div(
-            _plain_code_block(code=code, language=language),
+            plain_block,
             rx.el.details(
                 rx.el.summary(
                     rx.el.span(
@@ -79,12 +257,12 @@ def code_block(code: str, language: str):
                 "has-[details[open]]:max-h-none"
             ),
         )
-    return _plain_code_block(code=code, language=language)
+    return plain_block
 
 
 @rx.memo
-def code_block_dark(code: rx.Var[str], language: rx.Var[str]) -> rx.Component:
-    """Code block dark.
+def _plain_code_block_dark(code: rx.Var[str], language: rx.Var[str]) -> rx.Component:
+    """Render the client-side code block used by dark demos.
 
     Returns:
         The component.
@@ -100,6 +278,41 @@ def code_block_dark(code: rx.Var[str], language: rx.Var[str]) -> rx.Component:
     )
 
 
+def code_block_dark(code: str | rx.Var[str], language: str | rx.Var[str]):
+    """Render a dark-demo code block with build-time highlighting for literals.
+
+    Args:
+        code: Source code to render.
+        language: Shiki language name.
+
+    Returns:
+        The code block component.
+    """
+    if not isinstance(code, str) or not isinstance(language, str):
+        return _plain_code_block_dark(code=code, language=language)
+    if static_shiki.is_discovery():
+        return literal_shiki_code_block(
+            code,
+            client_component=lambda *_args, **_kwargs: _plain_code_block_dark(
+                code=code, language=language
+            ),
+            language=language,
+            class_name="code-block",
+            can_copy=True,
+        )
+    if static_shiki.is_render():
+        return rx.box(
+            literal_shiki_code_block(
+                code,
+                language=language,
+                class_name="code-block",
+                can_copy=True,
+            ),
+            class_name="relative mb-4",
+        )
+    return _plain_code_block_dark(code=code, language=language)
+
+
 def code_block_markdown(*children, **props):
     """Code block markdown.
 
@@ -134,7 +347,7 @@ def doccmdoutput(
         The styled command and its example output.
     """
     return rx.vstack(
-        shiki_code_block(
+        literal_shiki_code_block(
             command,
             can_copy=True,
             border_radius=styles.DOC_BORDER_RADIUS,
@@ -150,7 +363,7 @@ def doccmdoutput(
             font_family="JetBrains Mono",
             width="100%",
         ),
-        shiki_code_block(
+        literal_shiki_code_block(
             output,
             can_copy=False,
             border_radius="12px",
diff --git a/packages/reflex-site-shared/src/reflex_site_shared/static_shiki.py b/packages/reflex-site-shared/src/reflex_site_shared/static_shiki.py
new file mode 100644
index 00000000000..5e79dfa9919
--- /dev/null
+++ b/packages/reflex-site-shared/src/reflex_site_shared/static_shiki.py
@@ -0,0 +1,581 @@
+"""Build-time Shiki highlighting for production documentation builds."""
+
+from __future__ import annotations
+
+import hashlib
+import json
+import os
+import shutil
+import subprocess
+import sys
+import tempfile
+import threading
+from pathlib import Path
+from typing import Any
+
+from reflex_base.plugins import Plugin
+
+from reflex.utils import path_ops, prerequisites
+from reflex.utils.exec import is_prod_mode
+
+BUILD_PHASE_ENV = "REFLEX_DOCS_SHIKI_BUILD_PHASE"
+CACHE_DIR_ENV = "REFLEX_DOCS_SHIKI_CACHE_DIR"
+CLIENT_PHASE = "client"
+DISCOVERY_PHASE = "discover"
+RENDER_PHASE = "render"
+BUILD_PHASES = frozenset({CLIENT_PHASE, DISCOVERY_PHASE, RENDER_PHASE})
+MANIFEST_FILENAME = "manifest.json"
+CACHE_FILENAME = "cache.json"
+SCHEMA_VERSION = 1
+SHIKI_VERSION = "3.3.0"
+DEFAULT_THEMES = {"light": "one-light", "dark": "one-dark-pro"}
+LANGUAGE_ALIASES = {
+    "bash": "shellscript",
+    "console": "shellsession",
+    "js": "javascript",
+    "py": "python",
+    "text": "plain",
+}
+
+_registry_lock = threading.Lock()
+_registries: dict[Path, dict[str, dict[str, Any]]] = {}
+_cache_by_path: dict[Path, dict[str, Any]] = {}
+
+
+class StaticShikiError(RuntimeError):
+    """Raised when static highlighting cannot be completed exactly."""
+
+
+def _require_bun() -> Path:
+    """Return the configured Bun executable.
+
+    Returns:
+        The configured Bun executable path.
+
+    Raises:
+        StaticShikiError: If Bun is not installed.
+    """
+    bun = path_ops.get_bun_path()
+    if bun is None:
+        msg = "Bun is required for production docs syntax highlighting."
+        raise StaticShikiError(msg)
+    return bun
+
+
+def get_build_phase() -> str:
+    """Return the selected static-highlighting build phase.
+
+    Returns:
+        One of ``client``, ``discover``, or ``render``.
+
+    Raises:
+        StaticShikiError: If the configured phase is unknown.
+    """
+    phase = os.environ.get(BUILD_PHASE_ENV, CLIENT_PHASE).lower()
+    if phase not in BUILD_PHASES:
+        valid = ", ".join(sorted(BUILD_PHASES))
+        msg = f"{BUILD_PHASE_ENV} must be one of: {valid}; got {phase!r}."
+        raise StaticShikiError(msg)
+    return phase
+
+
+def is_discovery() -> bool:
+    """Return whether this compile collects literal highlighting requests."""
+    return get_build_phase() == DISCOVERY_PHASE
+
+
+def is_render() -> bool:
+    """Return whether this compile consumes generated highlighting HTML."""
+    return get_build_phase() == RENDER_PHASE
+
+
+def get_cache_dir() -> Path:
+    """Return the build-owned Shiki cache directory.
+
+    Returns:
+        The resolved cache directory.
+
+    Raises:
+        StaticShikiError: If a build phase omitted the cache directory.
+    """
+    value = os.environ.get(CACHE_DIR_ENV)
+    if not value:
+        msg = f"{CACHE_DIR_ENV} must be set for the {get_build_phase()!r} phase."
+        raise StaticShikiError(msg)
+    return Path(value).expanduser().resolve()
+
+
+def make_request(
+    code: str,
+    *,
+    language: str,
+    themes: dict[str, str] | None = None,
+) -> dict[str, Any]:
+    """Create a normalized build-time highlighting request.
+
+    Args:
+        code: Literal source code.
+        language: Shiki language or supported docs alias.
+        themes: Literal light and dark Shiki theme names.
+
+    Returns:
+        A deterministic request mapping.
+
+    Raises:
+        StaticShikiError: If an option cannot be rendered exactly.
+    """
+    if not isinstance(code, str):
+        msg = "Build-time Shiki highlighting requires code to be a literal string."
+        raise StaticShikiError(msg)
+    if not isinstance(language, str):
+        msg = "Build-time Shiki highlighting requires language to be a literal string."
+        raise StaticShikiError(msg)
+    normalized_themes = themes or DEFAULT_THEMES
+    if set(normalized_themes) != {"light", "dark"} or any(
+        not isinstance(theme, str) for theme in normalized_themes.values()
+    ):
+        msg = "Static Shiki themes must contain literal 'light' and 'dark' names."
+        raise StaticShikiError(msg)
+    return {
+        "code": code,
+        "language": LANGUAGE_ALIASES.get(language, language),
+        "themes": {
+            "dark": normalized_themes["dark"],
+            "light": normalized_themes["light"],
+        },
+    }
+
+
+def _canonical_json(value: Any) -> str:
+    """Serialize data deterministically for hashing and artifacts.
+
+    Args:
+        value: JSON-compatible data.
+
+    Returns:
+        Canonical JSON text.
+    """
+    return json.dumps(value, ensure_ascii=False, separators=(",", ":"), sort_keys=True)
+
+
+def request_key(request: dict[str, Any]) -> str:
+    """Return the content-addressed key for a normalized request.
+
+    Args:
+        request: A request returned by :func:`make_request`.
+
+    Returns:
+        The hexadecimal SHA-256 digest.
+    """
+    return hashlib.sha256(_canonical_json(request).encode()).hexdigest()
+
+
+def _validate_request(request: Any, key: str, *, source: Path) -> dict[str, Any]:
+    """Validate one normalized request and its content-addressed key.
+
+    Args:
+        request: Parsed request data.
+        key: Expected content hash.
+        source: Artifact path used in errors.
+
+    Returns:
+        The validated request.
+
+    Raises:
+        StaticShikiError: If the shape or hash is invalid.
+    """
+    if not isinstance(request, dict) or set(request) != {"code", "language", "themes"}:
+        msg = f"Static Shiki request {key!r} in {source} has an invalid shape."
+        raise StaticShikiError(msg)
+    code = request.get("code")
+    language = request.get("language")
+    themes = request.get("themes")
+    if (
+        not isinstance(code, str)
+        or not isinstance(language, str)
+        or not isinstance(themes, dict)
+        or set(themes) != {"light", "dark"}
+        or any(not isinstance(theme, str) for theme in themes.values())
+    ):
+        msg = f"Static Shiki request {key!r} in {source} has invalid values."
+        raise StaticShikiError(msg)
+    if request_key(request) != key:
+        msg = f"Static Shiki request {key!r} in {source} does not match its hash."
+        raise StaticShikiError(msg)
+    return request
+
+
+def register_request(request: dict[str, Any]) -> str:
+    """Register a request in the current discovery manifest.
+
+    Args:
+        request: A normalized highlighting request.
+
+    Returns:
+        The request's content-addressed key.
+    """
+    cache_dir = get_cache_dir()
+    key = request_key(request)
+    _validate_request(request, key, source=cache_dir / MANIFEST_FILENAME)
+    with _registry_lock:
+        _registries.setdefault(cache_dir, {})[key] = request
+    return key
+
+
+def _write_json(path: Path, value: Any) -> None:
+    """Atomically write deterministic JSON.
+
+    Args:
+        path: Destination path.
+        value: JSON-compatible value.
+    """
+    path.parent.mkdir(parents=True, exist_ok=True)
+    temporary = path.with_suffix(f"{path.suffix}.tmp")
+    temporary.write_text(f"{_canonical_json(value)}\n", encoding="utf-8")
+    temporary.replace(path)
+
+
+def flush_discovery_manifest(cache_dir: Path | None = None) -> Path:
+    """Write the deterministic discovery manifest.
+
+    Args:
+        cache_dir: Cache directory to flush, or the active configured directory.
+
+    Returns:
+        The written manifest path.
+    """
+    target = (cache_dir or get_cache_dir()).resolve()
+    with _registry_lock:
+        requests = dict(_registries.get(target, {}))
+    path = target / MANIFEST_FILENAME
+    manifest = {
+        "schema_version": SCHEMA_VERSION,
+        "shiki_version": SHIKI_VERSION,
+        "requests": {key: requests[key] for key in sorted(requests)},
+    }
+    _write_json(path, manifest)
+    return path
+
+
+def _read_json(path: Path, artifact: str) -> dict[str, Any]:
+    """Read a JSON object from a build artifact.
+
+    Args:
+        path: Artifact path.
+        artifact: Human-readable artifact name.
+
+    Returns:
+        The parsed mapping.
+
+    Raises:
+        StaticShikiError: If the artifact is missing or malformed.
+    """
+    try:
+        value = json.loads(path.read_text(encoding="utf-8"))
+    except FileNotFoundError as error:
+        msg = f"Static Shiki {artifact} is missing at {path}."
+        raise StaticShikiError(msg) from error
+    except (OSError, json.JSONDecodeError) as error:
+        msg = f"Static Shiki {artifact} at {path} is not valid JSON."
+        raise StaticShikiError(msg) from error
+    if not isinstance(value, dict):
+        msg = f"Static Shiki {artifact} at {path} must contain a JSON object."
+        raise StaticShikiError(msg)
+    return value
+
+
+def _validate_metadata(value: dict[str, Any], path: Path, artifact: str) -> None:
+    """Validate common manifest/cache metadata.
+
+    Args:
+        value: Parsed artifact.
+        path: Artifact path.
+        artifact: Human-readable artifact name.
+
+    Raises:
+        StaticShikiError: If the schema or Shiki version is stale.
+    """
+    if value.get("schema_version") != SCHEMA_VERSION:
+        msg = f"Static Shiki {artifact} at {path} has a stale schema version."
+        raise StaticShikiError(msg)
+    if value.get("shiki_version") != SHIKI_VERSION:
+        msg = f"Static Shiki {artifact} at {path} was not generated by Shiki {SHIKI_VERSION}."
+        raise StaticShikiError(msg)
+
+
+def _load_manifest(path: Path) -> dict[str, dict[str, Any]]:
+    """Load and validate a discovery manifest.
+
+    Args:
+        path: Manifest path.
+
+    Returns:
+        Validated requests keyed by content hash.
+    """
+    manifest = _read_json(path, "manifest")
+    _validate_metadata(manifest, path, "manifest")
+    requests = manifest.get("requests")
+    if not isinstance(requests, dict):
+        msg = f"Static Shiki manifest at {path} has no requests mapping."
+        raise StaticShikiError(msg)
+    if not requests:
+        msg = f"Static Shiki manifest at {path} contains no requests."
+        raise StaticShikiError(msg)
+    for key, request in requests.items():
+        if not isinstance(key, str):
+            msg = f"Static Shiki manifest at {path} contains a non-string key."
+            raise StaticShikiError(msg)
+        _validate_request(request, key, source=path)
+    return requests
+
+
+def _load_cache(path: Path) -> dict[str, Any]:
+    """Load and validate a generated Shiki cache.
+
+    Args:
+        path: Cache JSON path.
+
+    Returns:
+        The parsed cache.
+
+    Raises:
+        StaticShikiError: If the cache is absent, invalid, or stale.
+    """
+    cached = _cache_by_path.get(path)
+    if cached is not None:
+        return cached
+    cache = _read_json(path, "cache")
+    _validate_metadata(cache, path, "cache")
+    entries = cache.get("entries")
+    if not isinstance(entries, dict):
+        msg = f"Static Shiki cache at {path} has no entries mapping."
+        raise StaticShikiError(msg)
+    for key, entry in entries.items():
+        if not isinstance(key, str) or not isinstance(entry, dict):
+            msg = f"Static Shiki cache at {path} contains an invalid entry."
+            raise StaticShikiError(msg)
+        request = _validate_request(entry.get("request"), key, source=path)
+        if entry.get("request") != request or not isinstance(entry.get("html"), str):
+            msg = f"Static Shiki cache entry {key} does not contain valid HTML."
+            raise StaticShikiError(msg)
+
+    manifest_path = path.parent / MANIFEST_FILENAME
+    if manifest_path.exists():
+        requests = _load_manifest(manifest_path)
+        if set(entries) != set(requests):
+            msg = f"Static Shiki cache and manifest at {path.parent} have different key sets."
+            raise StaticShikiError(msg)
+    _cache_by_path[path] = cache
+    return cache
+
+
+def get_cached_html(request: dict[str, Any]) -> str:
+    """Return exact cached HTML for a highlighting request.
+
+    Args:
+        request: A normalized highlighting request.
+
+    Returns:
+        Shiki-rendered HTML.
+
+    Raises:
+        StaticShikiError: If the request is missing or does not match its cache entry.
+    """
+    path = get_cache_dir() / CACHE_FILENAME
+    cache = _load_cache(path)
+    key = request_key(request)
+    entry = cache["entries"].get(key)
+    if entry is None:
+        msg = f"Shiki request {key} is not present in {path}. Rerun discovery."
+        raise StaticShikiError(msg)
+    if entry.get("request") != request:
+        msg = f"Shiki cache entry {key} does not match its request."
+        raise StaticShikiError(msg)
+    return entry["html"]
+
+
+def discover_or_get_html(request: dict[str, Any]) -> str | None:
+    """Register a discovery request or return its cached HTML.
+
+    Args:
+        request: A normalized highlighting request.
+
+    Returns:
+        Cached HTML during render, otherwise ``None``.
+    """
+    phase = get_build_phase()
+    if phase == DISCOVERY_PHASE:
+        register_request(request)
+    if phase == RENDER_PHASE:
+        return get_cached_html(request)
+    return None
+
+
+def generate_cache(web_dir: Path) -> Path:
+    """Generate cached HTML in one JavaScript process.
+
+    Args:
+        web_dir: Compiled frontend directory containing ``node_modules``.
+
+    Returns:
+        The generated cache path.
+
+    Raises:
+        StaticShikiError: If inputs, runtime, or generation are invalid.
+    """
+    cache_dir = get_cache_dir()
+    manifest_path = cache_dir / MANIFEST_FILENAME
+    cache_path = cache_dir / CACHE_FILENAME
+    requests = _load_manifest(manifest_path)
+    runtime = path_ops.get_node_path() or path_ops.get_bun_path()
+    if runtime is None:
+        msg = "Node.js or Bun is required to generate the static Shiki cache."
+        raise StaticShikiError(msg)
+    script = Path(__file__).with_name("_generate_static_shiki.mjs")
+    try:
+        subprocess.run(
+            [
+                str(runtime),
+                str(script),
+                str(manifest_path),
+                str(cache_path),
+                str(web_dir.resolve()),
+            ],
+            check=True,
+        )
+    except subprocess.CalledProcessError as error:
+        msg = f"Static Shiki cache generation failed with exit code {error.returncode}."
+        raise StaticShikiError(msg) from error
+    _cache_by_path.pop(cache_path, None)
+    cache = _load_cache(cache_path)
+    if set(cache["entries"]) != set(requests):
+        msg = "Static Shiki generator did not produce the complete request key set."
+        raise StaticShikiError(msg)
+    return cache_path
+
+
+class StaticShikiPlugin(Plugin):
+    """Prepare and consume build-time highlighting during production compilation."""
+
+    def __init__(self) -> None:
+        """Initialize the build-owned temporary directory holder."""
+        self._temporary_directory: tempfile.TemporaryDirectory[str] | None = None
+        self._previous_cache_dir: str | None = None
+
+    def get_frontend_dependencies(self, **_context: Any) -> tuple[str, ...]:
+        """Prepare the static cache before production pages are evaluated.
+
+        Args:
+            _context: Unused plugin context.
+
+        Returns:
+            No additional application frontend dependencies.
+        """
+        if BUILD_PHASE_ENV not in os.environ and is_prod_mode():
+            self._prepare_production_cache()
+        return ()
+
+    def _prepare_production_cache(self) -> None:
+        """Run discovery and generate the cache in an isolated build directory.
+
+        Raises:
+            StaticShikiError: If discovery, dependency installation, or cache
+                generation fails.
+        """
+        web_dir = prerequisites.get_web_dir().resolve()
+        web_dir.mkdir(parents=True, exist_ok=True)
+        temporary = tempfile.TemporaryDirectory(
+            prefix=".static-shiki-",
+            dir=web_dir,
+        )
+        self._temporary_directory = temporary
+        build_dir = Path(temporary.name)
+        cache_dir = build_dir / "shiki-cache"
+        runtime_dir = build_dir / "shiki-runtime"
+        self._previous_cache_dir = os.environ.get(CACHE_DIR_ENV)
+        environment = os.environ.copy()
+        discovery_environment = {
+            **environment,
+            BUILD_PHASE_ENV: DISCOVERY_PHASE,
+            CACHE_DIR_ENV: str(cache_dir),
+        }
+        try:
+            cache_dir.mkdir()
+            shutil.copytree(
+                Path(__file__).with_name("static_shiki_runtime"),
+                runtime_dir,
+            )
+            bun = _require_bun()
+            subprocess.run(
+                [
+                    sys.executable,
+                    "-m",
+                    "reflex",
+                    "compile",
+                    "--dry",
+                    "--no-rich",
+                    "--loglevel=error",
+                ],
+                cwd=Path.cwd(),
+                env=discovery_environment,
+                check=True,
+            )
+            subprocess.run(
+                [
+                    str(bun),
+                    "install",
+                    "--frozen-lockfile",
+                    "--ignore-scripts",
+                ],
+                cwd=runtime_dir,
+                env=environment,
+                check=True,
+            )
+            os.environ[CACHE_DIR_ENV] = str(cache_dir)
+            generate_cache(runtime_dir)
+        except (OSError, subprocess.CalledProcessError, StaticShikiError) as error:
+            self._restore_environment()
+            self._cleanup()
+            msg = "Unable to prepare build-time Shiki highlighting."
+            raise StaticShikiError(msg) from error
+        os.environ[BUILD_PHASE_ENV] = RENDER_PHASE
+
+    def pre_compile(self, **_context: Any) -> None:
+        """Persist the complete discovery manifest before the process exits.
+
+        Args:
+            _context: Unused compiler context.
+        """
+        if is_discovery():
+            flush_discovery_manifest()
+
+    def post_build(self, **_context: Any) -> None:
+        """Remove temporary highlighting artifacts after the frontend build.
+
+        Args:
+            _context: Unused post-build context.
+        """
+        self._cleanup()
+        self._restore_environment()
+
+    def _cleanup(self) -> None:
+        """Remove the build-owned temporary directory, when present."""
+        if self._temporary_directory is not None:
+            self._temporary_directory.cleanup()
+            self._temporary_directory = None
+
+    def _restore_environment(self) -> None:
+        """Restore build phase variables changed by production preparation."""
+        os.environ.pop(BUILD_PHASE_ENV, None)
+        if self._previous_cache_dir is None:
+            os.environ.pop(CACHE_DIR_ENV, None)
+        else:
+            os.environ[CACHE_DIR_ENV] = self._previous_cache_dir
+        self._previous_cache_dir = None
+
+
+def _reset_for_testing() -> None:
+    """Reset process-local registries and loaded caches for tests."""
+    with _registry_lock:
+        _registries.clear()
+        _cache_by_path.clear()
diff --git a/packages/reflex-site-shared/src/reflex_site_shared/static_shiki_runtime/bun.lock b/packages/reflex-site-shared/src/reflex_site_shared/static_shiki_runtime/bun.lock
new file mode 100644
index 00000000000..08fe975d26e
--- /dev/null
+++ b/packages/reflex-site-shared/src/reflex_site_shared/static_shiki_runtime/bun.lock
@@ -0,0 +1,101 @@
+{
+  "lockfileVersion": 1,
+  "configVersion": 1,
+  "workspaces": {
+    "": {
+      "name": "reflex-static-shiki-runtime",
+      "dependencies": {
+        "shiki": "3.3.0",
+      },
+    },
+  },
+  "packages": {
+    "@shikijs/core": ["@shikijs/core@3.3.0", "", { "dependencies": { "@shikijs/types": "3.3.0", "@shikijs/vscode-textmate": "^10.0.2", "@types/hast": "^3.0.4", "hast-util-to-html": "^9.0.5" } }, "sha512-CovkFL2WVaHk6PCrwv6ctlmD4SS1qtIfN8yEyDXDYWh4ONvomdM9MaFw20qHuqJOcb8/xrkqoWQRJ//X10phOQ=="],
+
+    "@shikijs/engine-javascript": ["@shikijs/engine-javascript@3.3.0", "", { "dependencies": { "@shikijs/types": "3.3.0", "@shikijs/vscode-textmate": "^10.0.2", "oniguruma-to-es": "^4.2.0" } }, "sha512-XlhnFGv0glq7pfsoN0KyBCz9FJU678LZdQ2LqlIdAj6JKsg5xpYKay3DkazXWExp3DTJJK9rMOuGzU2911pg7Q=="],
+
+    "@shikijs/engine-oniguruma": ["@shikijs/engine-oniguruma@3.3.0", "", { "dependencies": { "@shikijs/types": "3.3.0", "@shikijs/vscode-textmate": "^10.0.2" } }, "sha512-l0vIw+GxeNU7uGnsu6B+Crpeqf+WTQ2Va71cHb5ZYWEVEPdfYwY5kXwYqRJwHrxz9WH+pjSpXQz+TJgAsrkA5A=="],
+
+    "@shikijs/langs": ["@shikijs/langs@3.3.0", "", { "dependencies": { "@shikijs/types": "3.3.0" } }, "sha512-zt6Kf/7XpBQKSI9eqku+arLkAcDQ3NHJO6zFjiChI8w0Oz6Jjjay7pToottjQGjSDCFk++R85643WbyINcuL+g=="],
+
+    "@shikijs/themes": ["@shikijs/themes@3.3.0", "", { "dependencies": { "@shikijs/types": "3.3.0" } }, "sha512-tXeCvLXBnqq34B0YZUEaAD1lD4lmN6TOHAhnHacj4Owh7Ptb/rf5XCDeROZt2rEOk5yuka3OOW2zLqClV7/SOg=="],
+
+    "@shikijs/types": ["@shikijs/types@3.3.0", "", { "dependencies": { "@shikijs/vscode-textmate": "^10.0.2", "@types/hast": "^3.0.4" } }, "sha512-KPCGnHG6k06QG/2pnYGbFtFvpVJmC3uIpXrAiPrawETifujPBv0Se2oUxm5qYgjCvGJS9InKvjytOdN+bGuX+Q=="],
+
+    "@shikijs/vscode-textmate": ["@shikijs/vscode-textmate@10.0.2", "", {}, "sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg=="],
+
+    "@types/hast": ["@types/hast@3.0.5", "", { "dependencies": { "@types/unist": "*" } }, "sha512-rp/ezSWaD1m44dPKICGhiskI13nVr7qTloFwDa/IYkhhf5nzwP+zIQcIJh3WIFSBOy/H1PzB40jPjMDksN4F+g=="],
+
+    "@types/mdast": ["@types/mdast@4.0.4", "", { "dependencies": { "@types/unist": "*" } }, "sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA=="],
+
+    "@types/unist": ["@types/unist@3.0.3", "", {}, "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q=="],
+
+    "@ungap/structured-clone": ["@ungap/structured-clone@1.3.3", "", {}, "sha512-60YRaenCQcVjYEKOcG824+DRGGIQ3VKErcBoAEDJZz5bKIs2ZG+X/H9Nk+Q6EVkwJk5QNApxbrc5QtBSwtrXAg=="],
+
+    "ccount": ["ccount@2.0.1", "", {}, "sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg=="],
+
+    "character-entities-html4": ["character-entities-html4@2.1.0", "", {}, "sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA=="],
+
+    "character-entities-legacy": ["character-entities-legacy@3.0.0", "", {}, "sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ=="],
+
+    "comma-separated-tokens": ["comma-separated-tokens@2.0.3", "", {}, "sha512-Fu4hJdvzeylCfQPp9SGWidpzrMs7tTrlu6Vb8XGaRGck8QSNZJJp538Wrb60Lax4fPwR64ViY468OIUTbRlGZg=="],
+
+    "dequal": ["dequal@2.0.3", "", {}, "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA=="],
+
+    "devlop": ["devlop@1.1.0", "", { "dependencies": { "dequal": "^2.0.0" } }, "sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA=="],
+
+    "hast-util-to-html": ["hast-util-to-html@9.0.5", "", { "dependencies": { "@types/hast": "^3.0.0", "@types/unist": "^3.0.0", "ccount": "^2.0.0", "comma-separated-tokens": "^2.0.0", "hast-util-whitespace": "^3.0.0", "html-void-elements": "^3.0.0", "mdast-util-to-hast": "^13.0.0", "property-information": "^7.0.0", "space-separated-tokens": "^2.0.0", "stringify-entities": "^4.0.0", "zwitch": "^2.0.4" } }, "sha512-OguPdidb+fbHQSU4Q4ZiLKnzWo8Wwsf5bZfbvu7//a9oTYoqD/fWpe96NuHkoS9h0ccGOTe0C4NGXdtS0iObOw=="],
+
+    "hast-util-whitespace": ["hast-util-whitespace@3.0.0", "", { "dependencies": { "@types/hast": "^3.0.0" } }, "sha512-88JUN06ipLwsnv+dVn+OIYOvAuvBMy/Qoi6O7mQHxdPXpjy+Cd6xRkWwux7DKO+4sYILtLBRIKgsdpS2gQc7qw=="],
+
+    "html-void-elements": ["html-void-elements@3.0.0", "", {}, "sha512-bEqo66MRXsUGxWHV5IP0PUiAWwoEjba4VCzg0LjFJBpchPaTfyfCKTG6bc5F8ucKec3q5y6qOdGyYTSBEvhCrg=="],
+
+    "mdast-util-to-hast": ["mdast-util-to-hast@13.2.1", "", { "dependencies": { "@types/hast": "^3.0.0", "@types/mdast": "^4.0.0", "@ungap/structured-clone": "^1.0.0", "devlop": "^1.0.0", "micromark-util-sanitize-uri": "^2.0.0", "trim-lines": "^3.0.0", "unist-util-position": "^5.0.0", "unist-util-visit": "^5.0.0", "vfile": "^6.0.0" } }, "sha512-cctsq2wp5vTsLIcaymblUriiTcZd0CwWtCbLvrOzYCDZoWyMNV8sZ7krj09FSnsiJi3WVsHLM4k6Dq/yaPyCXA=="],
+
+    "micromark-util-character": ["micromark-util-character@2.1.1", "", { "dependencies": { "micromark-util-symbol": "^2.0.0", "micromark-util-types": "^2.0.0" } }, "sha512-wv8tdUTJ3thSFFFJKtpYKOYiGP2+v96Hvk4Tu8KpCAsTMs6yi+nVmGh1syvSCsaxz45J6Jbw+9DD6g97+NV67Q=="],
+
+    "micromark-util-encode": ["micromark-util-encode@2.0.1", "", {}, "sha512-c3cVx2y4KqUnwopcO9b/SCdo2O67LwJJ/UyqGfbigahfegL9myoEFoDYZgkT7f36T0bLrM9hZTAaAyH+PCAXjw=="],
+
+    "micromark-util-sanitize-uri": ["micromark-util-sanitize-uri@2.0.1", "", { "dependencies": { "micromark-util-character": "^2.0.0", "micromark-util-encode": "^2.0.0", "micromark-util-symbol": "^2.0.0" } }, "sha512-9N9IomZ/YuGGZZmQec1MbgxtlgougxTodVwDzzEouPKo3qFWvymFHWcnDi2vzV1ff6kas9ucW+o3yzJK9YB1AQ=="],
+
+    "micromark-util-symbol": ["micromark-util-symbol@2.0.1", "", {}, "sha512-vs5t8Apaud9N28kgCrRUdEed4UJ+wWNvicHLPxCa9ENlYuAY31M0ETy5y1vA33YoNPDFTghEbnh6efaE8h4x0Q=="],
+
+    "micromark-util-types": ["micromark-util-types@2.0.2", "", {}, "sha512-Yw0ECSpJoViF1qTU4DC6NwtC4aWGt1EkzaQB8KPPyCRR8z9TWeV0HbEFGTO+ZY1wB22zmxnJqhPyTpOVCpeHTA=="],
+
+    "oniguruma-parser": ["oniguruma-parser@0.12.2", "", {}, "sha512-6HVa5oIrgMC6aA6WF6XyyqbhRPJrKR02L20+2+zpDtO5QAzGHAUGw5TKQvwi5vctNnRHkJYmjAhRVQF2EKdTQw=="],
+
+    "oniguruma-to-es": ["oniguruma-to-es@4.3.6", "", { "dependencies": { "oniguruma-parser": "^0.12.2", "regex": "^6.1.0", "regex-recursion": "^6.0.2" } }, "sha512-csuQ9x3Yr0cEIs/Zgx/OEt9iBw9vqIunAPQkx19R/fiMq2oGVTgcMqO/V3Ybqefr1TBvosI6jU539ksaBULJyA=="],
+
+    "property-information": ["property-information@7.2.0", "", {}, "sha512-IAtzIB6sUiWaJYrX9smp3V46pBGbBeLFRGdh25kg1334VcBlD8HzhPeNIWQH9zhGmo2itIe25EHt9dQP7G5hmg=="],
+
+    "regex": ["regex@6.1.0", "", { "dependencies": { "regex-utilities": "^2.3.0" } }, "sha512-6VwtthbV4o/7+OaAF9I5L5V3llLEsoPyq9P1JVXkedTP33c7MfCG0/5NOPcSJn0TzXcG9YUrR0gQSWioew3LDg=="],
+
+    "regex-recursion": ["regex-recursion@6.0.2", "", { "dependencies": { "regex-utilities": "^2.3.0" } }, "sha512-0YCaSCq2VRIebiaUviZNs0cBz1kg5kVS2UKUfNIx8YVs1cN3AV7NTctO5FOKBA+UT2BPJIWZauYHPqJODG50cg=="],
+
+    "regex-utilities": ["regex-utilities@2.3.0", "", {}, "sha512-8VhliFJAWRaUiVvREIiW2NXXTmHs4vMNnSzuJVhscgmGav3g9VDxLrQndI3dZZVVdp0ZO/5v0xmX516/7M9cng=="],
+
+    "shiki": ["shiki@3.3.0", "", { "dependencies": { "@shikijs/core": "3.3.0", "@shikijs/engine-javascript": "3.3.0", "@shikijs/engine-oniguruma": "3.3.0", "@shikijs/langs": "3.3.0", "@shikijs/themes": "3.3.0", "@shikijs/types": "3.3.0", "@shikijs/vscode-textmate": "^10.0.2", "@types/hast": "^3.0.4" } }, "sha512-j0Z1tG5vlOFGW8JVj0Cpuatzvshes7VJy5ncDmmMaYcmnGW0Js1N81TOW98ivTFNZfKRn9uwEg/aIm638o368g=="],
+
+    "space-separated-tokens": ["space-separated-tokens@2.0.2", "", {}, "sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q=="],
+
+    "stringify-entities": ["stringify-entities@4.0.4", "", { "dependencies": { "character-entities-html4": "^2.0.0", "character-entities-legacy": "^3.0.0" } }, "sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg=="],
+
+    "trim-lines": ["trim-lines@3.0.1", "", {}, "sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg=="],
+
+    "unist-util-is": ["unist-util-is@6.0.1", "", { "dependencies": { "@types/unist": "^3.0.0" } }, "sha512-LsiILbtBETkDz8I9p1dQ0uyRUWuaQzd/cuEeS1hoRSyW5E5XGmTzlwY1OrNzzakGowI9Dr/I8HVaw4hTtnxy8g=="],
+
+    "unist-util-position": ["unist-util-position@5.0.0", "", { "dependencies": { "@types/unist": "^3.0.0" } }, "sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA=="],
+
+    "unist-util-stringify-position": ["unist-util-stringify-position@4.0.0", "", { "dependencies": { "@types/unist": "^3.0.0" } }, "sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ=="],
+
+    "unist-util-visit": ["unist-util-visit@5.1.0", "", { "dependencies": { "@types/unist": "^3.0.0", "unist-util-is": "^6.0.0", "unist-util-visit-parents": "^6.0.0" } }, "sha512-m+vIdyeCOpdr/QeQCu2EzxX/ohgS8KbnPDgFni4dQsfSCtpz8UqDyY5GjRru8PDKuYn7Fq19j1CQ+nJSsGKOzg=="],
+
+    "unist-util-visit-parents": ["unist-util-visit-parents@6.0.2", "", { "dependencies": { "@types/unist": "^3.0.0", "unist-util-is": "^6.0.0" } }, "sha512-goh1s1TBrqSqukSc8wrjwWhL0hiJxgA8m4kFxGlQ+8FYQ3C/m11FcTs4YYem7V664AhHVvgoQLk890Ssdsr2IQ=="],
+
+    "vfile": ["vfile@6.0.3", "", { "dependencies": { "@types/unist": "^3.0.0", "vfile-message": "^4.0.0" } }, "sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q=="],
+
+    "vfile-message": ["vfile-message@4.0.3", "", { "dependencies": { "@types/unist": "^3.0.0", "unist-util-stringify-position": "^4.0.0" } }, "sha512-QTHzsGd1EhbZs4AsQ20JX1rC3cOlt/IWJruk893DfLRr57lcnOeMaWG4K0JrRta4mIJZKth2Au3mM3u03/JWKw=="],
+
+    "zwitch": ["zwitch@2.0.4", "", {}, "sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A=="],
+  }
+}
diff --git a/packages/reflex-site-shared/src/reflex_site_shared/static_shiki_runtime/package.json b/packages/reflex-site-shared/src/reflex_site_shared/static_shiki_runtime/package.json
new file mode 100644
index 00000000000..aca339af080
--- /dev/null
+++ b/packages/reflex-site-shared/src/reflex_site_shared/static_shiki_runtime/package.json
@@ -0,0 +1,8 @@
+{
+  "name": "reflex-static-shiki-runtime",
+  "private": true,
+  "type": "module",
+  "dependencies": {
+    "shiki": "3.3.0"
+  }
+}