instaui 0.1.10__py3-none-any.whl → 0.1.12__py3-none-any.whl

instaui/systems/module_system.py

@@ -1,29 +1,45 @@
 from importlib import import_module
 from types import ModuleType
-from typing import Any, List
+from typing import Any, Callable, List, Optional
+from instaui.runtime.context import get_context
 
 
 class LazyModule(ModuleType):
-    def __init__(self, name: str, member: str):
+    def __init__(
+        self,
+        name: str,
+        member: str,
+        *,
+        import_error_callback: Optional[Callable[[Exception], None]] = None,
+    ):
         super().__init__(name)
         self._name = name
         self._mod = None
         self._member_obj = None
         self._member = member
+        self._import_error_callback = import_error_callback
 
     def __getattr__(self, attr: str) -> Any:
-        self.__try_import()
-        return getattr(self._member_obj, attr)
+        return self.__try_run(lambda: getattr(self._member_obj, attr))  # type: ignore
 
     def __call__(self, *args: Any, **kwds: Any) -> Any:
-        self.__try_import()
-        return self._member_obj(*args, **kwds)  # type: ignore
+        return self.__try_run(lambda: self._member_obj(*args, **kwds))  # type: ignore
 
     def __dir__(self) -> List[str]:
         if self._mod is None:
             self._mod = import_module(self._name)
         return dir(self._mod)
 
+    def __try_run(self, fn: Callable[..., Any]):
+        try:
+            self.__try_import()
+            return fn()  # type: ignore
+        except ImportError as e:
+            if get_context().debug_mode and (self._import_error_callback is not None):
+                self._import_error_callback(e)
+            else:
+                raise e
+
     def __try_import(self):
         if self._mod is None:
             self._mod = import_module(self._name)

instaui/ui/__init__.py

@@ -68,6 +68,7 @@ __all__ = [
     "markdown",
     "echarts",
     "use_shadcn_classless",
+    "mermaid",
 ]
 
 # -- static imports
@@ -130,11 +131,14 @@ from instaui.ui_functions.str_format import str_format
 from instaui.ui_functions.ui_types import TBindable, is_bindable
 
 from .events import on_page_request_lifespan
+from instaui.extra_libs._import_error import show_error  # noqa: E402, F401
 
 # -- dynamic imports
-from instaui.systems.module_system import LazyModule
-code = LazyModule('instaui.components.shiki_code.shiki_code', 'Code')
-markdown = LazyModule('instaui.components.markdown.markdown', 'Markdown')
-webview = LazyModule('instaui.webview', 'WebviewWrapper')
-echarts = LazyModule('instaui.components.echarts.echarts', 'ECharts')
-use_shadcn_classless = LazyModule('instaui.shadcn_classless._index', 'use_shadcn_classless')
+from instaui.systems.module_system import LazyModule as _LazyModule
+markdown = _LazyModule('instaui.components.markdown.markdown', 'Markdown')
+webview = _LazyModule('instaui.webview', 'WebviewWrapper')
+use_shadcn_classless = _LazyModule('instaui.shadcn_classless._index', 'use_shadcn_classless')
+# -- extra libs
+mermaid = _LazyModule('instaui.extra_libs._mermaid', 'mermaid', import_error_callback=show_error('Mermaid is not installed. Please run "pip install instaui-mermaid" to install it.'),)
+code = _LazyModule('instaui.extra_libs._shiki_code', 'code', import_error_callback=show_error('Shiki is not installed. Please run "pip install instaui-shiki" to install it.'),)
+echarts = _LazyModule('instaui.extra_libs._echarts', 'echarts', import_error_callback=show_error('Echarts is not installed. Please run "pip install instaui-echarts" to install it.'),)

instaui/ui/__init__.pyi

@@ -68,6 +68,7 @@ __all__ = [
     "markdown",
     "echarts",
     "use_shadcn_classless",
+    "mermaid",
 ]
 
 # -- static imports
@@ -130,10 +131,19 @@ from instaui.ui_functions.str_format import str_format
 from instaui.ui_functions.ui_types import TBindable, is_bindable
 
 from .events import on_page_request_lifespan
+from instaui.extra_libs._import_error import show_error  # noqa: E402, F401
 
 # -- dynamic imports
-from instaui.components.shiki_code.shiki_code import Code as code
 from instaui.components.markdown.markdown import Markdown as markdown
 from instaui.webview import WebviewWrapper as webview
-from instaui.components.echarts.echarts import ECharts as echarts
 from instaui.shadcn_classless._index import use_shadcn_classless
+
+# -- extra libs
+# mermaid = _LazyModule('instaui.extra_libs._mermaid', 'mermaid', import_error_callback=show_error('Mermaid is not installed. Please run "pip install instaui-mermaid" to install it.'),)
+from instaui_mermaid import Mermaid as mermaid  # type: ignore
+
+# code = _LazyModule('instaui.extra_libs._shiki_code', 'code', import_error_callback=show_error('Shiki is not installed. Please run "pip install instaui-shiki" to install it.'),)
+from instaui_shiki import shiki as code  # type: ignore
+
+# echarts = _LazyModule('instaui.extra_libs._echarts', 'echarts', import_error_callback=show_error('Echarts is not installed. Please run "pip install instaui-echarts" to install it.'),)
+from instaui_echarts import echarts  # type: ignore

{instaui-0.1.10.dist-info → instaui-0.1.12.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: instaui
-Version: 0.1.10
+Version: 0.1.12
 Summary: insta-ui is a Python-based UI library for rapidly building user interfaces.
 Author-email: CrystalWindSnake <568166495@qq.com>
 License-Expression: MIT

{instaui-0.1.10.dist-info → instaui-0.1.12.dist-info}/RECORD

@@ -63,7 +63,7 @@ instaui/arco/components/pagination.py,sha256=SOim-t1TE25OkhH4IRavalXLz1TSVgOfVLS
 instaui/arco/components/pop_confirm.py,sha256=Q96oCK88FjNBesC9VZhv8dWuxlEMTqa-SIBV2fGbNBM,1490
 instaui/arco/components/popover.py,sha256=pfJBqvTOi4BzPGNHw6EjkXs7c7nOjLgeqBpCcwm9IUQ,955
 instaui/arco/components/progress.py,sha256=uB0HnUCug_FZdDaKUGiIkmECwV3jPBOOEpovrxV-Cck,388
-instaui/arco/components/radio.py,sha256=e9wwefL9liLnyfjz1mA0_fl6KysXVP7XwoskUT7Ht5E,1097
+instaui/arco/components/radio.py,sha256=w0v8Uh70MFjRFKzVKZTYa0V7aFW90IW4KAzcCjOBQFI,1096
 instaui/arco/components/radio_group.py,sha256=3LhRaljmD83cR5KAy0492zy62hRde6TTQF-VqkF1Wos,1290
 instaui/arco/components/rate.py,sha256=GLALtLZ1-1xklnnGKZf02KOLJga-IWVB-l_XSrQoQMs,1163
 instaui/arco/components/resize_box.py,sha256=imq3YgcLtaeFChZFvC-jflCaJxq0hY_cnK4TCN7s3j4,1678
@@ -115,9 +115,6 @@ instaui/components/transition_group.py,sha256=H9zx9NTlCoQnBArWfmxmh7CMKb5hZn8vKr
 instaui/components/value_element.py,sha256=wRIAaR3_Cq9qLNJw2KPhWt7dJmclj1mrttzlGpb01Y0,1412
 instaui/components/vfor.py,sha256=A6hvCpmY-5oNZLnIs2yvfQ12C1-GggKVAthqhi5E4lY,4031
 instaui/components/vif.py,sha256=2E62-8J9NIlZDhvgIOuDwz0tLLb6VoJ1ji1K4okrapw,1165
-instaui/components/echarts/echarts.js,sha256=pHkcgHJQOS1oHCumDvRNX9FIC55bl67x9NlIKJB5UdE,2734
-instaui/components/echarts/echarts.py,sha256=Up70IWBVLdW0_MZpV4GxM2-YFTe7u5ZWDoXHWaZVcEQ,5457
-instaui/components/echarts/static/echarts.esm.min.js,sha256=KN8OVRa4kTlat9NIfArzA3rtGcYfyrkcwjFBy_07vu8,1033915
 instaui/components/html/__init__.py,sha256=9bO1ai0aQCWwj80NKqDeq_3zwMg5gf17mE40a1IESAk,1088
 instaui/components/html/_mixins.py,sha256=5dcSM9h1PswIKL6_eiqUxqW4H2OCuyNeCuRZq3gDGOc,876
 instaui/components/html/_preset.py,sha256=c5rTj3r8W7UP0UHFLUW-ZSPedIa-gzrsU1goi60l20Q,94
@@ -163,10 +160,14 @@ instaui/event/vue_event.py,sha256=NRwEcAromivjyPtgMq5SEqHqx8GEc1OJZsRL2Nj43RY,21
 instaui/event/web_event.py,sha256=sojugqfXyF0q4gDCQsVjcfdBcuELVGeucZveFTDno10,3607
 instaui/experimental/__init__.py,sha256=nKvudMaBaDsxflSZQ00ck8Cc4hmrF0f6Xzs4mhIYa08,75
 instaui/experimental/debug.py,sha256=UGUWgNZ3ShanpuxfuPdx52TgQrkO9hByABYMnPZEIiE,1325
+instaui/extra_libs/_echarts.py,sha256=HCF4mxmzVyKRtxHuehiqf7kmBq7G14_dc2m9XQEM-fQ,78
+instaui/extra_libs/_import_error.py,sha256=qwmDoCoGutqjQpVmvtH5iUkrtyuiTTPZXgEMZzYBAG4,294
+instaui/extra_libs/_mermaid.py,sha256=2b0EymPyHUUBrNadvhK7lRtInh9K-7pzQJFZhj_WkNQ,89
+instaui/extra_libs/_shiki_code.py,sha256=UTC7gvTF8BEgVerhkL45xwpZKY9tPN2_Ddbe0jxFYjQ,79
 instaui/fastapi_server/_utils.py,sha256=MCqbebS4UkBOV8fp3Oy415Tvxnqi2mnMl5Eqe6yJogg,1177
 instaui/fastapi_server/_uvicorn.py,sha256=n-es5ajWepXb6xF9EP0ft2lrEbsyLGWMUE7uVqpkUAs,1174
 instaui/fastapi_server/debug_mode_router.py,sha256=EcYtPxI4FMnUqZcn-CZhZiMLgciHVNZpSRfiSIDRChc,1547
-instaui/fastapi_server/dependency_router.py,sha256=pvqL4qozwoJtZoFp34dw-VJkzGjUra0NVf12Phe0iV8,591
+instaui/fastapi_server/dependency_router.py,sha256=KZISD-0N1a40uXEsjOYlMTOJbItJ4Nyyb5W1VxXvOBA,898
 instaui/fastapi_server/event_router.py,sha256=_b0UNaPiwGwk7ElcF7XQnZfraPyWG2Miv9-wg-RI-PU,1648
 instaui/fastapi_server/middlewares.py,sha256=XyXjdGjH5hJ47ZK8EBeOln4Db1rfRijZpEGl3xmYQqU,643
 instaui/fastapi_server/request_context.py,sha256=EV5ZG4zgI_NPlTxinqO4AIREj6rbb1-HcjKCMa2Unfs,521
@@ -204,21 +205,21 @@ instaui/spa_router/_router_param_var.py,sha256=KCy54xBZxGMqLO3Zlbzr6XV8ts-M6jCOK
 instaui/spa_router/_types.py,sha256=KuGuv5C6qivwllfdmV5qrvM0S_GWJ6u8OOTkCNmJImU,81
 instaui/spa_router/templates/page_routes,sha256=8VjM_8f6pjFb01QbU9z5HNqpcNRdCiX3X0OqNHLq8fo,1355
 instaui/static/insta-ui.css,sha256=nVwKBfzSg887seRBCa4tkHoj_02rrhZqwNJBdvstI8A,293
-instaui/static/insta-ui.esm-browser.prod.js,sha256=A2y-kesfN4UcumpggMzxnl54yXiqtkHRM6Xl9EhCaOI,108944
+instaui/static/insta-ui.esm-browser.prod.js,sha256=oCWDu2L1d4SSNupZprQ0-Cg6DJorC4UeJNt00SHyyoU,109845
 instaui/static/insta-ui.ico,sha256=08FJg4qWolvOjfodoh8IJLStslrvd8sDyuRcTUDq5ak,1150
-instaui/static/insta-ui.js.map,sha256=v_YoQ6-ued7aRxRsTlvg9u7WuUD-VZLr-t0q3wt-OhI,659984
+instaui/static/insta-ui.js.map,sha256=PNEEw_xSUfYtFrnLZikz1-tMruQ-I31fniVaesyqTRY,663608
 instaui/static/instaui-tools-browser.js,sha256=cLHKNXYaYMZriMxV-yKGAHTrHSdNRUlDVZmv6uc6mMw,14455
 instaui/static/vue.esm-browser.prod.js,sha256=vwQkXANuVYQuEFc0VgiokJdhNyMmvxMKyb1FmrYrNb4,162662
-instaui/static/vue.global.prod.js,sha256=xFm6fMjbZcmCWJ-l1kx_9HiHfo5bD9dWgyB87GpOieg,157924
+instaui/static/vue.global.prod.js,sha256=YO-UVLcXWjFOKfGU2uRrIMYpliGY2y48OmEjV464Z7M,157933
 instaui/static/vue.runtime.esm-browser.prod.js,sha256=74FfP_s9pycfQXWAiGWx6SbjV_oJvMwZLFBkEXeW1Ek,102024
-instaui/static/templates/web.html,sha256=pCHoQIPUO03GX_aZ5zNjRYQC9b0GPFtoYE9P8eo5pHc,1789
-instaui/static/templates/webview.html,sha256=9zQB7wkYKSgHh866Dk3xqSYbcWhCMCaVuh9iM8TFnhg,1862
-instaui/static/templates/zero.html,sha256=_PHhx6uYD__tlt_bXG4j1WoZGnMBXIs2w2sU6-1zvH4,1684
+instaui/static/templates/web.html,sha256=E-CpEyAXV5E9X7CxkiJ8qy1IpudrCT8pQD4l1mFyAGU,1802
+instaui/static/templates/webview.html,sha256=NMISXyV5289WNdJYqL40srYUtjF1bo0jkoE-ouDyrAc,1875
+instaui/static/templates/zero.html,sha256=nDrQhbhZic3VTS3p961iMKHl-kwYgfUhQEq-jFXlluQ,1697
 instaui/static/templates/debug/sse.html,sha256=qw5pzfjbU_XM-hA_SJCt2F8Imbvp17tW5l2dwoSZYjY,3391
 instaui/systems/file_system.py,sha256=q8k_mSHhldkSRYXT73T9s8zvERZZo9HL1U2-4mwau-I,163
 instaui/systems/func_system.py,sha256=CER3Qm5luetdskMNVhJslvZK-QKbLe_n1aIGCe_i6Lc,3174
 instaui/systems/js_system.py,sha256=t_r7SFPmfvTiIrxzuf1YgHyi_Oi_81W0UH_kkC5MwmM,685
-instaui/systems/module_system.py,sha256=6qeR1K1vxocezBGPX5yecLVygqjzHNeDtlJTwJO9Szs,937
+instaui/systems/module_system.py,sha256=dtM7eWV0o5lYozQTXf4T0UycLdiT7wbq5uhJl9bjfn4,1552
 instaui/systems/pydantic_system.py,sha256=qibHh4QqjLNPBzyrCkJVJwCk1dC_H8gEDYYf8Sb-5ps,691
 instaui/systems/string_system.py,sha256=NzB7rgy7BZAYXAYDEWJQSvuYNui2TbLbrc9itVZGLmE,247
 instaui/tailwind/__init__.py,sha256=HNexMZAMG2c0QtkX3oNXmpWnyWDuJPrxuq5IBGvcjVs,75
@@ -231,8 +232,8 @@ instaui/template/env.py,sha256=ZqVsqpfSY1mupbgpBSkvOJytNui8xfNR5kNNC9rv4Ps,150
 instaui/template/web_template.py,sha256=BmZY13q4E_ZP4YVgfBKbbXvPHcGZfOl2f54wp_0DjJA,1603
 instaui/template/webview_template.py,sha256=rd51iPi600QOPQ9PMjgYk61oIxn3L2p3_sJ3eBPG_24,1557
 instaui/template/zero_template.py,sha256=E88VGsyjb1qbHFJlMW-xmLRFkwUXZA7VDoZ_Jd8YubA,3514
-instaui/ui/__init__.py,sha256=G0Zg9hqyO4RQ-izbES_qkYZb6SCv3lLTy4Etewhs8vo,4284
-instaui/ui/__init__.pyi,sha256=qH14avUiYgVNhQ5G8TFc8FT23NNCL6xFpicBKXUJkF8,4188
+instaui/ui/__init__.py,sha256=4aHnUvEv-0UjpZNu5fU6hvcj1ZGlWwIIobabWUJk-Mc,4818
+instaui/ui/__init__.pyi,sha256=VyyxCXkUhUe7V6lm23o0RYn8SFOE9Jm6aiRNqcCG3A4,4898
 instaui/ui/events.py,sha256=lfhiINwn-Kh0MezsSeLJPttWm6G1aWiwyk3TRo0NrlA,809
 instaui/ui_functions/input_slient_data.py,sha256=0A5DegIt_MqdZgbj1RiVFNmB_RUqgov9FYtkw6VX0DE,511
 instaui/ui_functions/server.py,sha256=B4w8KwBUMGStY19uUG8E4vRG7-L4cedttLkh35xr698,357
@@ -276,7 +277,7 @@ instaui/webview/resource.py,sha256=kFT6N5UZK5GLE0KmW3TrEYDNlViw9DL2OshRh41wBXs,5
 instaui/zero/__init__.py,sha256=N0LuRUAcaurxHSspcEDuwZg62W2S3qL4VtrMKxOivBE,49
 instaui/zero/func.py,sha256=8cA_wJMtRmoAARjWY8yY5MmLXDAQ7hyVW6f1Vbejtoc,3576
 instaui/zero/scope.py,sha256=HGohYOqnpRGVkkoz_gvR6-DgCc48AtJAcDwbOnnGHLM,3753
-instaui-0.1.10.dist-info/METADATA,sha256=lb1uK1JEJfD0Lw_TOI2I0sKQMlC4ndT3lz7NzNZU5zo,3591
-instaui-0.1.10.dist-info/WHEEL,sha256=qtCwoSJWgHk21S1Kb4ihdzI2rlJ1ZKaIurTj_ngOhyQ,87
-instaui-0.1.10.dist-info/licenses/LICENSE,sha256=_JjnAWrikJ6qkwT7PazeFNRlcIu8q_RH3mYcHTxEF5c,1094
-instaui-0.1.10.dist-info/RECORD,,
+instaui-0.1.12.dist-info/METADATA,sha256=NDS9aCL1CfE0u6XGLL9Sdh2E19Ej2M6wfV0avDTKLRI,3591
+instaui-0.1.12.dist-info/WHEEL,sha256=qtCwoSJWgHk21S1Kb4ihdzI2rlJ1ZKaIurTj_ngOhyQ,87
+instaui-0.1.12.dist-info/licenses/LICENSE,sha256=_JjnAWrikJ6qkwT7PazeFNRlcIu8q_RH3mYcHTxEF5c,1094
+instaui-0.1.12.dist-info/RECORD,,

instaui/components/echarts/echarts.js

@@ -1,130 +0,0 @@
-import { h, onMounted, shallowRef, watch } from "vue";
-import * as echarts from 'echarts';
-
-
-export default {
-  props: ['option', 'theme', 'initOptions', 'resizeOption', 'updateOptions', 'chartEvents', 'zrEvents'],
-  setup(props, { attrs, emit }) {
-    const root = shallowRef();
-    const chartIns = shallowRef();
-
-    onMounted(() => {
-      init(root, chartIns, props);
-      autoResize(root, chartIns, props);
-
-      setOption(root, chartIns, props);
-      setChartEvents(root, chartIns, emit, props);
-    })
-
-    watch(() => props.option, (newVal, oldVal) => {
-
-      setOption(root, chartIns, props);
-
-    }, { deep: true })
-
-
-    return () => {
-      return h("div", { ...attrs, ref: root })
-    };
-  }
-
-}
-
-
-function init(root, chartIns, props) {
-  if (!root.value) {
-    return;
-  }
-
-  chartIns.value = echarts.init(
-    root.value,
-    props.theme,
-    props.initOptions,
-  )
-}
-
-
-function setOption(root, chartIns, props) {
-  if (!chartIns.value) {
-    init(root, chartIns, props);
-  } else {
-    chartIns.value.setOption(props.option, props.updateOptions || {});
-  }
-}
-
-
-function autoResize(root, chartIns, props) {
-
-  watch(() => props.resizeOption, (resizeOption, _, onCleanup) => {
-
-    let ro = null;
-
-    if (resizeOption) {
-      const { offsetWidth, offsetHeight } = root.value;
-      const { throttle = 100 } = resizeOption;
-
-      let isInitialResize = false;
-      const callback = () => {
-        chartIns.value.resize()
-      }
-      const resizeCallback = throttle ? echarts.throttle(callback, throttle) : callback;
-
-      ro = new ResizeObserver(() => {
-
-        if (!isInitialResize) {
-          isInitialResize = true;
-          if (
-            root.value.offsetWidth === offsetWidth &&
-            root.value.offsetHeight === offsetHeight
-          ) {
-            return;
-          }
-        }
-        resizeCallback();
-      })
-
-      ro.observe(root.value);
-    }
-
-    onCleanup(() => {
-      if (ro) {
-        ro.disconnect();
-        ro = null;
-      }
-    });
-
-  }, { deep: true, immediate: true })
-
-}
-
-
-function setChartEvents(root, chartIns, emit, props) {
-
-  const { chartEvents, zrEvents } = props;
-
-  if (chartEvents) {
-    chartEvents.forEach(event => {
-      chartIns.value.on(event, (...args) => {
-        if (args.length > 0) {
-          const eventArgs = args[0]
-          delete eventArgs['event']
-          delete eventArgs['$vars']
-        }
-
-        emit(`chart:${event}`, ...args)
-      });
-    })
-  }
-
-  if (zrEvents) {
-    zrEvents.forEach(event => {
-      chartIns.value.getZr().on(event, (...args) => emit(`zr:${event}`, ...args));
-    })
-  }
-
-
-
-
-
-}
-

instaui/components/echarts/echarts.py

@@ -1,194 +0,0 @@
-from pathlib import Path
-from typing import Dict, Literal, Optional, Set, Union
-from typing_extensions import TypedDict
-from instaui import ui
-from instaui.event.event_mixin import EventMixin
-
-_STATIC_DIR = Path(__file__).parent / "static"
-_ECHARTS_JS_FILE = _STATIC_DIR / "echarts.esm.min.js"
-
-
-_IMPORT_MAPS = {
-    "echarts": _ECHARTS_JS_FILE,
-}
-
-
-TEChartsEvent = Literal[
-    "highlight",
-    "downplay",
-    "selectchanged",
-    "legendselectchanged",
-    "legendselected",
-    "legendunselected",
-    "legendselectall",
-    "legendinverseselect",
-    "legendscroll",
-    "datazoom",
-    "datarangeselected",
-    "timelinechanged",
-    "timelineplaychanged",
-    "restore",
-    "dataviewchanged",
-    "magictypechanged",
-    "geoselectchanged",
-    "geoselected",
-    "geounselected",
-    "axisareaselected",
-    "brush",
-    "brushEnd",
-    "brushselected",
-    "globalcursortaken",
-    "rendered",
-    "finished",
-    "click",
-    "dblclick",
-    "mouseover",
-    "mouseout",
-    "mousemove",
-    "mousedown",
-    "mouseup",
-    "globalout",
-    "contextmenu",
-]
-
-
-TZRenderEvent = Literal[
-    "click", "mousedown", "mouseup", "mousewheel", "dblclick", "contextmenu"
-]
-
-
-class TResizeOptions(TypedDict, total=False):
-    throttle: int
-
-
-class TInitOptions(TypedDict, total=False):
-    devicePixelRatio: int
-    renderer: Literal["canvas", "svg"]
-    width: Union[int, str]
-    height: Union[int, str]
-    locale: str
-    pointerSize: int
-
-
-class ECharts(
-    ui.element,
-    esm="./echarts.js",
-    externals=_IMPORT_MAPS,
-):
-    """ECharts component
-
-    Example usage:
-    .. code-block:: python
-
-        opts = {
-            "title": {"text": "ECharts Getting Started Example"},
-            "tooltip": {},
-            "legend": {"data": ["sales"]},
-            "xAxis": {
-                "data": ["Shirts", "Cardigans", "Chiffons", "Pants", "Heels", "Socks"]
-            },
-            "yAxis": {},
-            "series": [{"name": "sales", "type": "bar", "data": [5, 20, 36, 10, 10, 20]}],
-        }
-
-        ui.echarts(opts)
-
-    """
-
-    def __init__(
-        self,
-        option: ui.TMaybeRef[Dict],
-        *,
-        theme: Optional[Union[Path, str, Dict]] = None,
-        init_options: Optional[TInitOptions] = None,
-        update_options: Optional[Dict] = None,
-        resize_options: Optional[TResizeOptions] = None,
-    ):
-        """Create an ECharts component
-
-        Args:
-            option (ui.TMaybeRef[Dict]): Chart option.
-            theme (Optional[Union[Path, str, Dict]], optional): Theme file or object. Defaults to None.
-            init_options (Optional[TInitOptions], optional): Chart initialization options. Defaults to None.
-            update_options (Optional[Dict], optional): Chart update options. Defaults to None.
-            resize_options (Optional[TResizeOptions], optional): Chart resize options. Defaults to None.
-
-        Example usage:
-
-        resize_options:
-
-        .. code-block:: python
-            ui.echarts(opts, resize_options={"throttle": 100})
-
-        chart event:
-        .. code-block:: python
-            opts = ui.state(
-                {
-                    "title": {"text": "ECharts Getting Started Example"},
-                    "tooltip": {},
-                    "legend": {"data": ["sales"]},
-                    "xAxis": {
-                        "data": ["Shirts", "Cardigans", "Chiffons", "Pants", "Heels", "Socks"]
-                    },
-                    "yAxis": {},
-                    "series": [
-                        {"name": "sales", "type": "bar", "data": [5, 20, 36, 10, 10, 20]}
-                    ],
-                }
-            )
-
-            msg = ui.state("Click the bars in the chart.")
-
-            @ui.event(inputs=[ui.event_context.e()], outputs=[msg])
-            def click(arg):
-                return f'You clicked on "{arg["name"]}"'
-
-            ui.content(msg)
-            ui.echarts(opts).on_chart("click", click)
-
-        """
-
-        super().__init__()
-        self._chart_events: Set[str] = set()
-        self._zr_events: Set[str] = set()
-        self.props({"option": option})
-
-        if init_options is not None:
-            self.props({"initOptions": init_options})
-
-        if update_options:
-            self.props({"updateOptions": update_options})
-
-        if theme:
-            if isinstance(theme, (str, Path)):
-                raise NotImplementedError("Theme file not supported yet")
-            else:
-                self.props({"theme": theme})
-
-        self.props({"resizeOption": resize_options or {}})
-
-        self.style("width: 100%; height: 100%;min-width:0;")
-
-    def on_chart(
-        self,
-        event_name: TEChartsEvent,
-        handler: EventMixin,
-    ):
-        self._chart_events.add(event_name)
-        return self.on(f"chart:{event_name}", handler)
-
-    def on_zr(self, event_name: TZRenderEvent, handler: EventMixin):
-        self._zr_events.add(event_name)
-        return self.on(f"zr:{event_name}", handler)
-
-    def _to_json_dict(self):
-        data = super()._to_json_dict()
-        props = data.get("props", {})
-
-        if self._chart_events:
-            props["chartEvents"] = list(self._chart_events)
-
-        if self._zr_events:
-            props["zrEvents"] = list(self._zr_events)
-
-        return data