diff --git a/.github/workflows/check_outdated_dependencies.yml b/.github/workflows/check_outdated_dependencies.yml
index d5b9292f69..fb28bb318c 100644
--- a/.github/workflows/check_outdated_dependencies.yml
+++ b/.github/workflows/check_outdated_dependencies.yml
@@ -74,7 +74,7 @@ jobs:
echo "$outdated"
# Ignore 3rd party dependencies that are not updated.
- filtered_outdated=$(echo "$outdated" | grep -vE 'Package|@chakra-ui|lucide-react|@splinetool/runtime|ag-grid-react|framer-motion' || true)
+ filtered_outdated=$(echo "$outdated" | grep -vE 'Package|@chakra-ui|lucide-react|@splinetool/runtime|ag-grid-react|framer-motion|react-markdown|remark-math|remark-gfm|rehype-katex|rehype-raw' || true)
no_extra=$(echo "$filtered_outdated" | grep -vE '\|\-\-\-\-\-\-\-\-\-\-\-\-\-\-\-\-\-\-\-\-\-' || true)
diff --git a/.github/workflows/integration_tests.yml b/.github/workflows/integration_tests.yml
index e9fecc81a2..106ac13839 100644
--- a/.github/workflows/integration_tests.yml
+++ b/.github/workflows/integration_tests.yml
@@ -42,7 +42,7 @@ jobs:
fail-fast: false
matrix:
# Show OS combos first in GUI
- os: [ubuntu-latest, windows-latest, macos-12]
+ os: [ubuntu-latest, windows-latest]
python-version: ['3.9.18', '3.10.13', '3.11.5', '3.12.0']
exclude:
- os: windows-latest
@@ -122,7 +122,7 @@ jobs:
fail-fast: false
matrix:
# Show OS combos first in GUI
- os: [ubuntu-latest, windows-latest, macos-12]
+ os: [ubuntu-latest, windows-latest]
python-version: ['3.10.11', '3.11.4']
env:
@@ -161,4 +161,45 @@ jobs:
poetry run python benchmarks/benchmark_web_size.py --os "${{ matrix.os }}"
--python-version "${{ matrix.python-version }}" --commit-sha "${{ github.sha }}"
--pr-id "${{ github.event.pull_request.id }}" --branch-name "${{ github.head_ref || github.ref_name }}"
- --app-name "reflex-web" --path ./reflex-web/.web
\ No newline at end of file
+ --app-name "reflex-web" --path ./reflex-web/.web
+
+ reflex-web-macos:
+ if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+ strategy:
+ fail-fast: false
+ matrix:
+ python-version: ['3.11.5', '3.12.0']
+ runs-on: macos-12
+ steps:
+ - uses: actions/checkout@v4
+ - uses: ./.github/actions/setup_build_env
+ with:
+ python-version: ${{ matrix.python-version }}
+ run-poetry-install: true
+ create-venv-at-path: .venv
+ - name: Clone Reflex Website Repo
+ uses: actions/checkout@v4
+ with:
+ repository: reflex-dev/reflex-web
+ ref: main
+ path: reflex-web
+ - name: Install Requirements for reflex-web
+ working-directory: ./reflex-web
+ run: poetry run uv pip install -r requirements.txt
+ - name: Install additional dependencies for DB access
+ run: poetry run uv pip install psycopg2-binary
+ - name: Init Website for reflex-web
+ working-directory: ./reflex-web
+ run: poetry run reflex init
+ - name: Run Website and Check for errors
+ run: |
+ # Check that npm is home
+ npm -v
+ poetry run bash scripts/integration.sh ./reflex-web prod
+ - name: Measure and upload .web size
+ run:
+ poetry run python benchmarks/benchmark_web_size.py --os "${{ matrix.os }}"
+ --python-version "${{ matrix.python-version }}" --commit-sha "${{ github.sha }}"
+ --pr-id "${{ github.event.pull_request.id }}" --branch-name "${{ github.head_ref || github.ref_name }}"
+ --app-name "reflex-web" --path ./reflex-web/.web
+
\ No newline at end of file
diff --git a/.github/workflows/unit_tests.yml b/.github/workflows/unit_tests.yml
index 09e489949c..c769185833 100644
--- a/.github/workflows/unit_tests.yml
+++ b/.github/workflows/unit_tests.yml
@@ -27,7 +27,7 @@ jobs:
strategy:
fail-fast: false
matrix:
- os: [ubuntu-latest, windows-latest, macos-12]
+ os: [ubuntu-latest, windows-latest]
python-version: ['3.9.18', '3.10.13', '3.11.5', '3.12.0']
# Windows is a bit behind on Python version availability in Github
exclude:
@@ -41,6 +41,7 @@ jobs:
- os: windows-latest
python-version: '3.9.13'
runs-on: ${{ matrix.os }}
+
# Service containers to run with `runner-job`
services:
# Label used to access the service container
@@ -78,4 +79,30 @@ jobs:
export PYTHONUNBUFFERED=1
poetry run uv pip install "pydantic~=1.10"
poetry run pytest tests/units --cov --no-cov-on-fail --cov-report=
- - run: poetry run coverage html
+ - name: Generate coverage report
+ run: poetry run coverage html
+
+ unit-tests-macos:
+ timeout-minutes: 30
+ if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+ strategy:
+ fail-fast: false
+ matrix:
+ python-version: ['3.9.18', '3.10.13', '3.11.5', '3.12.0']
+ runs-on: macos-12
+ steps:
+ - uses: actions/checkout@v4
+ - uses: ./.github/actions/setup_build_env
+ with:
+ python-version: ${{ matrix.python-version }}
+ run-poetry-install: true
+ create-venv-at-path: .venv
+ - name: Run unit tests
+ run: |
+ export PYTHONUNBUFFERED=1
+ poetry run pytest tests/units --cov --no-cov-on-fail --cov-report=
+ - name: Run unit tests w/ pydantic v1
+ run: |
+ export PYTHONUNBUFFERED=1
+ poetry run uv pip install "pydantic~=1.10"
+ poetry run pytest tests/units --cov --no-cov-on-fail --cov-report=
\ No newline at end of file
diff --git a/README.md b/README.md
index c249aea9f2..9c965b00f0 100644
--- a/README.md
+++ b/README.md
@@ -17,7 +17,7 @@
---
-[English](https://github.com/reflex-dev/reflex/blob/main/README.md) | [简体中文](https://github.com/reflex-dev/reflex/blob/main/docs/zh/zh_cn/README.md) | [繁體中文](https://github.com/reflex-dev/reflex/blob/main/docs/zh/zh_tw/README.md) | [Türkçe](https://github.com/reflex-dev/reflex/blob/main/docs/tr/README.md) | [हिंदी](https://github.com/reflex-dev/reflex/blob/main/docs/in/README.md) | [Português (Brasil)](https://github.com/reflex-dev/reflex/blob/main/docs/pt/pt_br/README.md) | [Italiano](https://github.com/reflex-dev/reflex/blob/main/docs/it/README.md) | [Español](https://github.com/reflex-dev/reflex/blob/main/docs/es/README.md) | [한국어](https://github.com/reflex-dev/reflex/blob/main/docs/kr/README.md) | [日本語](https://github.com/reflex-dev/reflex/blob/main/docs/ja/README.md) | [Deutsch](https://github.com/reflex-dev/reflex/blob/main/docs/de/README.md) | [Persian (پارسی)](https://github.com/reflex-dev/reflex/blob/main/docs/pe/README.md)
+[English](https://github.com/reflex-dev/reflex/blob/main/README.md) | [简体中文](https://github.com/reflex-dev/reflex/blob/main/docs/zh/zh_cn/README.md) | [繁體中文](https://github.com/reflex-dev/reflex/blob/main/docs/zh/zh_tw/README.md) | [Türkçe](https://github.com/reflex-dev/reflex/blob/main/docs/tr/README.md) | [हिंदी](https://github.com/reflex-dev/reflex/blob/main/docs/in/README.md) | [Português (Brasil)](https://github.com/reflex-dev/reflex/blob/main/docs/pt/pt_br/README.md) | [Italiano](https://github.com/reflex-dev/reflex/blob/main/docs/it/README.md) | [Español](https://github.com/reflex-dev/reflex/blob/main/docs/es/README.md) | [한국어](https://github.com/reflex-dev/reflex/blob/main/docs/kr/README.md) | [日本語](https://github.com/reflex-dev/reflex/blob/main/docs/ja/README.md) | [Deutsch](https://github.com/reflex-dev/reflex/blob/main/docs/de/README.md) | [Persian (پارسی)](https://github.com/reflex-dev/reflex/blob/main/docs/pe/README.md) | [Tiếng Việt](https://github.com/reflex-dev/reflex/blob/main/docs/vi/README.md)
---
diff --git a/docs/vi/README.md b/docs/vi/README.md
new file mode 100644
index 0000000000..df7a315303
--- /dev/null
+++ b/docs/vi/README.md
@@ -0,0 +1,267 @@
+```diff
++ Bạn đang tìm kiếm Pynecone? Bạn đã tìm đúng. Pynecone đã được đổi tên thành Reflex. +
+```
+
+
+
+
+
+
+
+### **✨ Ứng dụng web hiệu suất cao, tùy chỉnh bằng Python thuần. Deploy trong vài giây. ✨**
+[](https://badge.fury.io/py/reflex)
+
+[](https://reflex.dev/docs/getting-started/introduction)
+[](https://discord.gg/T5WSbC2YtQ)
+
+
+
+
+
+
+📑 [Docs](https://reflex.dev/docs/getting-started/introduction) | 🗞️ [Blog](https://reflex.dev/blog) | 📱 [Component Library](https://reflex.dev/docs/library) | 🖼️ [Gallery](https://reflex.dev/docs/gallery) | 🛸 [Deployment](https://reflex.dev/docs/hosting/deploy-quick-start)
+
+
+
+
+## ✅ Status
+
+Reflex phát hành vào tháng 12/2022 với tên là Pynecone.
+
+Đến tháng 02/2024, chúng tôi tạo ra dịch vụ dưới phiên bản alpha! Trong thời gian này mọi người có thể triển khai ứng dụng hoàn toàn miễn phí. Xem [roadmap](https://github.com/reflex-dev/reflex/issues/2727) để biết thêm chi tiết.
+
+Reflex ra phiên bản mới với các tính năng mới hàng tuần! Hãy :star: star và :eyes: watch repo này để thấy các cập nhật mới nhất.
+
+## Contributing
+
+Chúng tôi chào đón mọi đóng góp dù lớn hay nhỏ. Dưới đây là các cách để bắt đầu với cộng đồng Reflex.
+
+- **Discord**: [Discord](https://discord.gg/T5WSbC2YtQ) của chúng tôi là nơi tốt nhất để nhờ sự giúp đỡ và thảo luận các bạn có thể đóng góp.
+- **GitHub Discussions**: Là cách tốt nhất để thảo luận về các tính năng mà bạn có thể đóng góp hoặc những điều bạn chưa rõ.
+- **GitHub Issues**: [Issues](https://github.com/reflex-dev/reflex/issues) là nơi tốt nhất để thông báo. Ngoài ra bạn có thể sửa chữa các vấn đề bằng cách tạo PR.
+
+Chúng tôi luôn sẵn sàng tìm kiếm các contributor, bất kể kinh nghiệm. Để tham gia đóng góp, xin mời xem
+[CONTIBUTING.md](https://github.com/reflex-dev/reflex/blob/main/CONTRIBUTING.md)
+
+
+## Xin cảm ơn các Contributors:
+
+ 
+
+
+## License
+
+Reflex là mã nguồn mở và sử dụng giấy phép [Apache License 2.0](LICENSE).
diff --git a/reflex/components/base/script.py b/reflex/components/base/script.py
index 0eba03f495..eb37d53e7b 100644
--- a/reflex/components/base/script.py
+++ b/reflex/components/base/script.py
@@ -8,7 +8,7 @@
from typing import Literal
from reflex.components.component import Component
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event
from reflex.vars.base import LiteralVar, Var
@@ -35,13 +35,13 @@ class Script(Component):
)
# Triggered when the script is loading
- on_load: EventHandler[lambda: []]
+ on_load: EventHandler[empty_event]
# Triggered when the script has loaded
- on_ready: EventHandler[lambda: []]
+ on_ready: EventHandler[empty_event]
# Triggered when the script has errored
- on_error: EventHandler[lambda: []]
+ on_error: EventHandler[empty_event]
@classmethod
def create(cls, *children, **props) -> Component:
diff --git a/reflex/components/datadisplay/dataeditor.py b/reflex/components/datadisplay/dataeditor.py
index 1c778f52ad..ab84ad3f71 100644
--- a/reflex/components/datadisplay/dataeditor.py
+++ b/reflex/components/datadisplay/dataeditor.py
@@ -8,7 +8,7 @@
from reflex.base import Base
from reflex.components.component import Component, NoSSRComponent
from reflex.components.literals import LiteralRowMarker
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event
from reflex.utils import console, format, types
from reflex.utils.imports import ImportDict, ImportVar
from reflex.utils.serializers import serializer
@@ -262,10 +262,10 @@ class DataEditor(NoSSRComponent):
on_finished_editing: EventHandler[lambda new_value, movement: [new_value, movement]]
# Fired when a row is appended.
- on_row_appended: EventHandler[lambda: []]
+ on_row_appended: EventHandler[empty_event]
# Fired when the selection is cleared.
- on_selection_cleared: EventHandler[lambda: []]
+ on_selection_cleared: EventHandler[empty_event]
# Fired when a column is resized.
on_column_resize: EventHandler[lambda col, width: [col, width]]
diff --git a/reflex/components/el/elements/forms.py b/reflex/components/el/elements/forms.py
index 1963f8b371..05168e66c6 100644
--- a/reflex/components/el/elements/forms.py
+++ b/reflex/components/el/elements/forms.py
@@ -10,7 +10,13 @@
from reflex.components.el.element import Element
from reflex.components.tags.tag import Tag
from reflex.constants import Dirs, EventTriggers
-from reflex.event import EventChain, EventHandler, prevent_default
+from reflex.event import (
+ EventChain,
+ EventHandler,
+ input_event,
+ key_event,
+ prevent_default,
+)
from reflex.utils.imports import ImportDict
from reflex.vars import VarData
from reflex.vars.base import LiteralVar, Var
@@ -345,19 +351,19 @@ class Input(BaseHTML):
value: Var[Union[str, int, float]]
# Fired when the input value changes
- on_change: EventHandler[lambda e0: [e0.target.value]]
+ on_change: EventHandler[input_event]
# Fired when the input gains focus
- on_focus: EventHandler[lambda e0: [e0.target.value]]
+ on_focus: EventHandler[input_event]
# Fired when the input loses focus
- on_blur: EventHandler[lambda e0: [e0.target.value]]
+ on_blur: EventHandler[input_event]
# Fired when a key is pressed down
- on_key_down: EventHandler[lambda e0: [e0.key]]
+ on_key_down: EventHandler[key_event]
# Fired when a key is released
- on_key_up: EventHandler[lambda e0: [e0.key]]
+ on_key_up: EventHandler[key_event]
class Label(BaseHTML):
@@ -496,7 +502,7 @@ class Select(BaseHTML):
size: Var[Union[str, int, bool]]
# Fired when the select value changes
- on_change: EventHandler[lambda e0: [e0.target.value]]
+ on_change: EventHandler[input_event]
AUTO_HEIGHT_JS = """
@@ -586,19 +592,19 @@ class Textarea(BaseHTML):
wrap: Var[Union[str, int, bool]]
# Fired when the input value changes
- on_change: EventHandler[lambda e0: [e0.target.value]]
+ on_change: EventHandler[input_event]
# Fired when the input gains focus
- on_focus: EventHandler[lambda e0: [e0.target.value]]
+ on_focus: EventHandler[input_event]
# Fired when the input loses focus
- on_blur: EventHandler[lambda e0: [e0.target.value]]
+ on_blur: EventHandler[input_event]
# Fired when a key is pressed down
- on_key_down: EventHandler[lambda e0: [e0.key]]
+ on_key_down: EventHandler[key_event]
# Fired when a key is released
- on_key_up: EventHandler[lambda e0: [e0.key]]
+ on_key_up: EventHandler[key_event]
def _exclude_props(self) -> list[str]:
return super()._exclude_props() + [
diff --git a/reflex/components/markdown/markdown.py b/reflex/components/markdown/markdown.py
index d6edca18c3..1665144fd3 100644
--- a/reflex/components/markdown/markdown.py
+++ b/reflex/components/markdown/markdown.py
@@ -75,7 +75,7 @@ def get_base_component_map() -> dict[str, Callable]:
class Markdown(Component):
"""A markdown component."""
- library = "react-markdown@9.0.1"
+ library = "react-markdown@8.0.7"
tag = "ReactMarkdown"
@@ -157,19 +157,19 @@ def add_imports(self) -> ImportDict | list[ImportDict]:
return [
{
"": "katex/dist/katex.min.css",
- "remark-math@6.0.0": ImportVar(
+ "remark-math@5.1.1": ImportVar(
tag=_REMARK_MATH._js_expr, is_default=True
),
- "remark-gfm@4.0.0": ImportVar(
+ "remark-gfm@3.0.1": ImportVar(
tag=_REMARK_GFM._js_expr, is_default=True
),
"remark-unwrap-images@4.0.0": ImportVar(
tag=_REMARK_UNWRAP_IMAGES._js_expr, is_default=True
),
- "rehype-katex@7.0.1": ImportVar(
+ "rehype-katex@6.0.3": ImportVar(
tag=_REHYPE_KATEX._js_expr, is_default=True
),
- "rehype-raw@7.0.0": ImportVar(
+ "rehype-raw@6.1.1": ImportVar(
tag=_REHYPE_RAW._js_expr, is_default=True
),
},
diff --git a/reflex/components/next/image.py b/reflex/components/next/image.py
index 9e2f718210..fe74b09356 100644
--- a/reflex/components/next/image.py
+++ b/reflex/components/next/image.py
@@ -2,7 +2,7 @@
from typing import Any, Literal, Optional, Union
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event
from reflex.utils import types
from reflex.vars.base import Var
@@ -56,10 +56,10 @@ class Image(NextComponent):
blurDataURL: Var[str]
# Fires when the image has loaded.
- on_load: EventHandler[lambda: []]
+ on_load: EventHandler[empty_event]
# Fires when the image has an error.
- on_error: EventHandler[lambda: []]
+ on_error: EventHandler[empty_event]
@classmethod
def create(
diff --git a/reflex/components/radix/primitives/drawer.py b/reflex/components/radix/primitives/drawer.py
index b814e878f0..f0efa7e180 100644
--- a/reflex/components/radix/primitives/drawer.py
+++ b/reflex/components/radix/primitives/drawer.py
@@ -11,6 +11,7 @@
from reflex.components.radix.themes.base import Theme
from reflex.components.radix.themes.layout.flex import Flex
from reflex.event import EventHandler
+from reflex.utils import console
from reflex.vars.base import Var
@@ -127,20 +128,20 @@ def _get_style(self) -> dict:
base_style.update(style)
return {"css": base_style}
- # Fired when the drawer content is opened.
- on_open_auto_focus: EventHandler[lambda e0: [e0.target.value]]
+ # Fired when the drawer content is opened. Deprecated.
+ on_open_auto_focus: EventHandler[lambda e0: []]
- # Fired when the drawer content is closed.
- on_close_auto_focus: EventHandler[lambda e0: [e0.target.value]]
+ # Fired when the drawer content is closed. Deprecated.
+ on_close_auto_focus: EventHandler[lambda e0: []]
- # Fired when the escape key is pressed.
- on_escape_key_down: EventHandler[lambda e0: [e0.target.value]]
+ # Fired when the escape key is pressed. Deprecated.
+ on_escape_key_down: EventHandler[lambda e0: []]
- # Fired when the pointer is down outside the drawer content.
- on_pointer_down_outside: EventHandler[lambda e0: [e0.target.value]]
+ # Fired when the pointer is down outside the drawer content. Deprecated.
+ on_pointer_down_outside: EventHandler[lambda e0: []]
- # Fired when interacting outside the drawer content.
- on_interact_outside: EventHandler[lambda e0: [e0.target.value]]
+ # Fired when interacting outside the drawer content. Deprecated.
+ on_interact_outside: EventHandler[lambda e0: []]
@classmethod
def create(cls, *children, **props):
@@ -157,6 +158,23 @@ def create(cls, *children, **props):
Returns:
The drawer content.
"""
+ deprecated_properties = [
+ "on_open_auto_focus",
+ "on_close_auto_focus",
+ "on_escape_key_down",
+ "on_pointer_down_outside",
+ "on_interact_outside",
+ ]
+
+ for prop in deprecated_properties:
+ if prop in props:
+ console.deprecate(
+ feature_name="drawer content events",
+ reason=f"The `{prop}` event is deprecated and will be removed in 0.7.0.",
+ deprecation_version="0.6.3",
+ removal_version="0.7.0",
+ )
+
comp = super().create(*children, **props)
return Theme.create(comp)
diff --git a/reflex/components/radix/primitives/form.py b/reflex/components/radix/primitives/form.py
index 895f6dbebe..4d4be7e40f 100644
--- a/reflex/components/radix/primitives/form.py
+++ b/reflex/components/radix/primitives/form.py
@@ -8,7 +8,7 @@
from reflex.components.core.debounce import DebounceInput
from reflex.components.el.elements.forms import Form as HTMLForm
from reflex.components.radix.themes.components.text_field import TextFieldRoot
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event
from reflex.vars.base import Var
from .base import RadixPrimitiveComponentWithClassName
@@ -28,7 +28,7 @@ class FormRoot(FormComponent, HTMLForm):
alias = "RadixFormRoot"
# Fired when the errors are cleared.
- on_clear_server_errors: EventHandler[lambda: []]
+ on_clear_server_errors: EventHandler[empty_event]
def add_style(self) -> dict[str, Any] | None:
"""Add style to the component.
diff --git a/reflex/components/radix/themes/components/dropdown_menu.py b/reflex/components/radix/themes/components/dropdown_menu.py
index 5ed1f9f64c..c853619dd2 100644
--- a/reflex/components/radix/themes/components/dropdown_menu.py
+++ b/reflex/components/radix/themes/components/dropdown_menu.py
@@ -164,7 +164,7 @@ class DropdownMenuSub(RadixThemesComponent):
default_open: Var[bool]
# Fired when the open state changes.
- on_open_change: EventHandler[lambda e0: [e0.target.value]]
+ on_open_change: EventHandler[lambda e0: [e0]]
class DropdownMenuSubContent(RadixThemesComponent):
@@ -240,7 +240,7 @@ class DropdownMenuItem(RadixThemesComponent):
_valid_parents: List[str] = ["DropdownMenuContent", "DropdownMenuSubContent"]
# Fired when the item is selected.
- on_select: EventHandler[lambda e0: [e0.target.value]]
+ on_select: EventHandler[lambda e0: []]
class DropdownMenuSeparator(RadixThemesComponent):
diff --git a/reflex/components/radix/themes/components/text_area.py b/reflex/components/radix/themes/components/text_area.py
index 8b3b531cbe..9f006c2e3b 100644
--- a/reflex/components/radix/themes/components/text_area.py
+++ b/reflex/components/radix/themes/components/text_area.py
@@ -6,7 +6,6 @@
from reflex.components.core.breakpoints import Responsive
from reflex.components.core.debounce import DebounceInput
from reflex.components.el import elements
-from reflex.event import EventHandler
from reflex.vars.base import Var
from ..base import (
@@ -82,21 +81,6 @@ class TextArea(RadixThemesComponent, elements.Textarea):
# How the text in the textarea is to be wrapped when submitting the form
wrap: Var[str]
- # Fired when the value of the textarea changes.
- on_change: EventHandler[lambda e0: [e0.target.value]]
-
- # Fired when the textarea is focused.
- on_focus: EventHandler[lambda e0: [e0.target.value]]
-
- # Fired when the textarea is blurred.
- on_blur: EventHandler[lambda e0: [e0.target.value]]
-
- # Fired when a key is pressed down.
- on_key_down: EventHandler[lambda e0: [e0.key]]
-
- # Fired when a key is released.
- on_key_up: EventHandler[lambda e0: [e0.key]]
-
@classmethod
def create(cls, *children, **props) -> Component:
"""Create an Input component.
diff --git a/reflex/components/radix/themes/components/text_field.py b/reflex/components/radix/themes/components/text_field.py
index 6c33729856..4277e93e0a 100644
--- a/reflex/components/radix/themes/components/text_field.py
+++ b/reflex/components/radix/themes/components/text_field.py
@@ -8,7 +8,7 @@
from reflex.components.core.breakpoints import Responsive
from reflex.components.core.debounce import DebounceInput
from reflex.components.el import elements
-from reflex.event import EventHandler
+from reflex.event import EventHandler, input_event, key_event
from reflex.vars.base import Var
from ..base import (
@@ -72,19 +72,19 @@ class TextFieldRoot(elements.Div, RadixThemesComponent):
value: Var[Union[str, int, float]]
# Fired when the value of the textarea changes.
- on_change: EventHandler[lambda e0: [e0.target.value]]
+ on_change: EventHandler[input_event]
# Fired when the textarea is focused.
- on_focus: EventHandler[lambda e0: [e0.target.value]]
+ on_focus: EventHandler[input_event]
# Fired when the textarea is blurred.
- on_blur: EventHandler[lambda e0: [e0.target.value]]
+ on_blur: EventHandler[input_event]
# Fired when a key is pressed down.
- on_key_down: EventHandler[lambda e0: [e0.key]]
+ on_key_down: EventHandler[key_event]
# Fired when a key is released.
- on_key_up: EventHandler[lambda e0: [e0.key]]
+ on_key_up: EventHandler[key_event]
@classmethod
def create(cls, *children, **props) -> Component:
diff --git a/reflex/components/radix/themes/components/tooltip.py b/reflex/components/radix/themes/components/tooltip.py
index f39de68a8b..7fd181465f 100644
--- a/reflex/components/radix/themes/components/tooltip.py
+++ b/reflex/components/radix/themes/components/tooltip.py
@@ -85,13 +85,13 @@ class Tooltip(RadixThemesComponent):
aria_label: Var[str]
# Fired when the open state changes.
- on_open_change: EventHandler[lambda e0: [e0.target.value]]
+ on_open_change: EventHandler[lambda e0: [e0]]
# Fired when the escape key is pressed.
- on_escape_key_down: EventHandler[lambda e0: [e0.target.value]]
+ on_escape_key_down: EventHandler[lambda e0: []]
# Fired when the pointer is down outside the tooltip.
- on_pointer_down_outside: EventHandler[lambda e0: [e0.target.value]]
+ on_pointer_down_outside: EventHandler[lambda e0: []]
@classmethod
def create(cls, *children, **props) -> Component:
diff --git a/reflex/components/react_player/react_player.py b/reflex/components/react_player/react_player.py
index db5d9e77cb..9da878b647 100644
--- a/reflex/components/react_player/react_player.py
+++ b/reflex/components/react_player/react_player.py
@@ -3,7 +3,7 @@
from __future__ import annotations
from reflex.components.component import NoSSRComponent
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event
from reflex.vars.base import Var
@@ -46,13 +46,13 @@ class ReactPlayer(NoSSRComponent):
height: Var[str]
# Called when media is loaded and ready to play. If playing is set to true, media will play immediately.
- on_ready: EventHandler[lambda: []]
+ on_ready: EventHandler[empty_event]
# Called when media starts playing.
- on_start: EventHandler[lambda: []]
+ on_start: EventHandler[empty_event]
# Called when media starts or resumes playing after pausing or buffering.
- on_play: EventHandler[lambda: []]
+ on_play: EventHandler[empty_event]
# Callback containing played and loaded progress as a fraction, and playedSeconds and loadedSeconds in seconds. eg { played: 0.12, playedSeconds: 11.3, loaded: 0.34, loadedSeconds: 16.7 }
on_progress: EventHandler[lambda progress: [progress]]
@@ -61,13 +61,13 @@ class ReactPlayer(NoSSRComponent):
on_duration: EventHandler[lambda seconds: [seconds]]
# Called when media is paused.
- on_pause: EventHandler[lambda: []]
+ on_pause: EventHandler[empty_event]
# Called when media starts buffering.
- on_buffer: EventHandler[lambda: []]
+ on_buffer: EventHandler[empty_event]
# Called when media has finished buffering. Works for files, YouTube and Facebook.
- on_buffer_end: EventHandler[lambda: []]
+ on_buffer_end: EventHandler[empty_event]
# Called when media seeks with seconds parameter.
on_seek: EventHandler[lambda seconds: [seconds]]
@@ -79,16 +79,16 @@ class ReactPlayer(NoSSRComponent):
on_playback_quality_change: EventHandler[lambda e0: []]
# Called when media finishes playing. Does not fire when loop is set to true.
- on_ended: EventHandler[lambda: []]
+ on_ended: EventHandler[empty_event]
# Called when an error occurs whilst attempting to play media.
- on_error: EventHandler[lambda: []]
+ on_error: EventHandler[empty_event]
# Called when user clicks the light mode preview.
- on_click_preview: EventHandler[lambda: []]
+ on_click_preview: EventHandler[empty_event]
# Called when picture-in-picture mode is enabled.
- on_enable_pip: EventHandler[lambda: []]
+ on_enable_pip: EventHandler[empty_event]
# Called when picture-in-picture mode is disabled.
- on_disable_pip: EventHandler[lambda: []]
+ on_disable_pip: EventHandler[empty_event]
diff --git a/reflex/components/recharts/cartesian.py b/reflex/components/recharts/cartesian.py
index e072f7da8d..bff8c582b2 100644
--- a/reflex/components/recharts/cartesian.py
+++ b/reflex/components/recharts/cartesian.py
@@ -6,7 +6,7 @@
from reflex.constants import EventTriggers
from reflex.constants.colors import Color
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event
from reflex.vars.base import LiteralVar, Var
from .recharts import (
@@ -109,25 +109,25 @@ class Axis(Recharts):
text_anchor: Var[LiteralTextAnchor]
# The customized event handler of click on the ticks of this axis
- on_click: EventHandler[lambda: []]
+ on_click: EventHandler[empty_event]
# The customized event handler of mousedown on the ticks of this axis
- on_mouse_down: EventHandler[lambda: []]
+ on_mouse_down: EventHandler[empty_event]
# The customized event handler of mouseup on the ticks of this axis
- on_mouse_up: EventHandler[lambda: []]
+ on_mouse_up: EventHandler[empty_event]
# The customized event handler of mousemove on the ticks of this axis
- on_mouse_move: EventHandler[lambda: []]
+ on_mouse_move: EventHandler[empty_event]
# The customized event handler of mouseout on the ticks of this axis
- on_mouse_out: EventHandler[lambda: []]
+ on_mouse_out: EventHandler[empty_event]
# The customized event handler of mouseenter on the ticks of this axis
- on_mouse_enter: EventHandler[lambda: []]
+ on_mouse_enter: EventHandler[empty_event]
# The customized event handler of mouseleave on the ticks of this axis
- on_mouse_leave: EventHandler[lambda: []]
+ on_mouse_leave: EventHandler[empty_event]
class XAxis(Axis):
@@ -137,20 +137,20 @@ class XAxis(Axis):
alias = "RechartsXAxis"
- # The orientation of axis 'top' | 'bottom'
+ # The orientation of axis 'top' | 'bottom'. Default: "bottom"
orientation: Var[LiteralOrientationTopBottom]
- # The id of x-axis which is corresponding to the data.
+ # The id of x-axis which is corresponding to the data. Default: 0
x_axis_id: Var[Union[str, int]]
- # Ensures that all datapoints within a chart contribute to its domain calculation, even when they are hidden
- include_hidden: Var[bool] = LiteralVar.create(False)
+ # Ensures that all datapoints within a chart contribute to its domain calculation, even when they are hidden. Default: False
+ include_hidden: Var[bool]
- # The range of the axis. Work best in conjuction with allow_data_overflow.
- domain: Var[List]
+ # The angle of axis ticks. Default: 0
+ angle: Var[int]
- # The range of the axis. Work best in conjuction with allow_data_overflow.
- domain: Var[List]
+ # Specify the padding of x-axis. Default: {"left": 0, "right": 0}
+ padding: Var[Dict[str, int]]
class YAxis(Axis):
@@ -160,14 +160,14 @@ class YAxis(Axis):
alias = "RechartsYAxis"
- # The orientation of axis 'left' | 'right'
+ # The orientation of axis 'left' | 'right'. Default: "left"
orientation: Var[LiteralOrientationLeftRight]
- # The id of y-axis which is corresponding to the data.
+ # The id of y-axis which is corresponding to the data. Default: 0
y_axis_id: Var[Union[str, int]]
- # The range of the axis. Work best in conjuction with allow_data_overflow.
- domain: Var[List]
+ # Specify the padding of y-axis. Default: {"top": 0, "bottom": 0}
+ padding: Var[Dict[str, int]]
class ZAxis(Recharts):
@@ -180,7 +180,10 @@ class ZAxis(Recharts):
# The key of data displayed in the axis.
data_key: Var[Union[str, int]]
- # The range of axis.
+ # The unique id of z-axis. Default: 0
+ z_axis_id: Var[Union[str, int]]
+
+ # The range of axis. Default: [10, 10]
range: Var[List[int]]
# The unit of data displayed in the axis. This option will be used to represent an index unit in a scatter chart.
@@ -189,7 +192,7 @@ class ZAxis(Recharts):
# The name of data displayed in the axis. This option will be used to represent an index in a scatter chart.
name: Var[Union[str, int]]
- # If 'auto' set, the scale function is decided by the type of chart, and the props type.
+ # If 'auto' set, the scale function is decided by the type of chart, and the props type. Default: "auto"
scale: Var[LiteralScale]
@@ -200,40 +203,40 @@ class Brush(Recharts):
alias = "RechartsBrush"
- # Stroke color
+ # Stroke color. Default: rx.color("gray", 9)
stroke: Var[Union[str, Color]] = LiteralVar.create(Color("gray", 9))
- # The fill color of brush.
+ # The fill color of brush. Default: rx.color("gray", 2)
fill: Var[Union[str, Color]] = LiteralVar.create(Color("gray", 2))
# The key of data displayed in the axis.
data_key: Var[Union[str, int]]
- # The x-coordinate of brush.
+ # The x-coordinate of brush. Default: 0
x: Var[int]
- # The y-coordinate of brush.
+ # The y-coordinate of brush. Default: 0
y: Var[int]
- # The width of brush.
+ # The width of brush. Default: 0
width: Var[int]
- # The height of brush.
+ # The height of brush. Default: 40
height: Var[int]
- # The data domain of brush, [min, max].
+ # The original data of a LineChart, a BarChart or an AreaChart.
data: Var[List[Any]]
- # The width of each traveller.
+ # The width of each traveller. Default: 5
traveller_width: Var[int]
- # The data with gap of refreshing chart. If the option is not set, the chart will be refreshed every time
+ # The data with gap of refreshing chart. If the option is not set, the chart will be refreshed every time. Default: 1
gap: Var[int]
- # The default start index of brush. If the option is not set, the start index will be 0.
+ # The default start index of brush. If the option is not set, the start index will be 0. Default: 0
start_index: Var[int]
- # The default end index of brush. If the option is not set, the end index will be 1.
+ # The default end index of brush. If the option is not set, the end index will be calculated by the length of data.
end_index: Var[int]
# The fill color of brush
@@ -272,28 +275,28 @@ class Cartesian(Recharts):
legend_type: Var[LiteralLegendType]
# The customized event handler of click on the component in this group
- on_click: EventHandler[lambda: []]
+ on_click: EventHandler[empty_event]
# The customized event handler of mousedown on the component in this group
- on_mouse_down: EventHandler[lambda: []]
+ on_mouse_down: EventHandler[empty_event]
# The customized event handler of mouseup on the component in this group
- on_mouse_up: EventHandler[lambda: []]
+ on_mouse_up: EventHandler[empty_event]
# The customized event handler of mousemove on the component in this group
- on_mouse_move: EventHandler[lambda: []]
+ on_mouse_move: EventHandler[empty_event]
# The customized event handler of mouseover on the component in this group
- on_mouse_over: EventHandler[lambda: []]
+ on_mouse_over: EventHandler[empty_event]
# The customized event handler of mouseout on the component in this group
- on_mouse_out: EventHandler[lambda: []]
+ on_mouse_out: EventHandler[empty_event]
# The customized event handler of mouseenter on the component in this group
- on_mouse_enter: EventHandler[lambda: []]
+ on_mouse_enter: EventHandler[empty_event]
# The customized event handler of mouseleave on the component in this group
- on_mouse_leave: EventHandler[lambda: []]
+ on_mouse_leave: EventHandler[empty_event]
class Area(Cartesian):
@@ -303,22 +306,22 @@ class Area(Cartesian):
alias = "RechartsArea"
- # The color of the line stroke.
+ # The color of the line stroke. Default: rx.color("accent", 9)
stroke: Var[Union[str, Color]] = LiteralVar.create(Color("accent", 9))
- # The width of the line stroke.
- stroke_width: Var[int] = LiteralVar.create(1)
+ # The width of the line stroke. Default: 1
+ stroke_width: Var[int]
- # The color of the area fill.
+ # The color of the area fill. Default: rx.color("accent", 5)
fill: Var[Union[str, Color]] = LiteralVar.create(Color("accent", 5))
- # The interpolation type of area. And customized interpolation function can be set to type. 'basis' | 'basisClosed' | 'basisOpen' | 'bumpX' | 'bumpY' | 'bump' | 'linear' | 'linearClosed' | 'natural' | 'monotoneX' | 'monotoneY' | 'monotone' | 'step' | 'stepBefore' | 'stepAfter' |
+ # The interpolation type of area. And customized interpolation function can be set to type. 'basis' | 'basisClosed' | 'basisOpen' | 'bumpX' | 'bumpY' | 'bump' | 'linear' | 'linearClosed' | 'natural' | 'monotoneX' | 'monotoneY' | 'monotone' | 'step' | 'stepBefore' | 'stepAfter'. Default: "monotone"
type_: Var[LiteralAreaType] = LiteralVar.create("monotone")
- # If false set, dots will not be drawn. If true set, dots will be drawn which have the props calculated internally.
+ # If false set, dots will not be drawn. If true set, dots will be drawn which have the props calculated internally. Default: False
dot: Var[Union[bool, Dict[str, Any]]]
- # The dot is shown when user enter an area chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally.
+ # The dot is shown when user enter an area chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally. Default: {stroke: rx.color("accent", 2), fill: rx.color("accent", 10)}
active_dot: Var[Union[bool, Dict[str, Any]]] = LiteralVar.create(
{
"stroke": Color("accent", 2),
@@ -326,17 +329,20 @@ class Area(Cartesian):
}
)
- # If set false, labels will not be drawn. If set true, labels will be drawn which have the props calculated internally.
+ # If set false, labels will not be drawn. If set true, labels will be drawn which have the props calculated internally. Default: False
label: Var[bool]
+ # The value which can describle the line, usually calculated internally.
+ base_line: Var[Union[str, List[Dict[str, Any]]]]
+
+ # The coordinates of all the points in the area, usually calculated internally.
+ points: Var[List[Dict[str, Any]]]
+
# The stack id of area, when two areas have the same value axis and same stack_id, then the two areas are stacked in order.
stack_id: Var[Union[str, int]]
- # The unit of data. This option will be used in tooltip.
- unit: Var[Union[str, int]]
-
- # The name of data. This option will be used in tooltip and legend to represent a bar. If no value was set to this option, the value of dataKey will be used alternatively.
- name: Var[Union[str, int]]
+ # Whether to connect a graph area across null points. Default: False
+ connect_nulls: Var[bool]
# Valid children components
_valid_children: List[str] = ["LabelList"]
@@ -355,12 +361,13 @@ class Bar(Cartesian):
# The width of the line stroke.
stroke_width: Var[int]
- # The width of the line stroke.
+ # The width of the line stroke. Default: Color("accent", 9)
fill: Var[Union[str, Color]] = LiteralVar.create(Color("accent", 9))
- # If false set, background of bars will not be drawn. If true set, background of bars will be drawn which have the props calculated internally.
+
+ # If false set, background of bars will not be drawn. If true set, background of bars will be drawn which have the props calculated internally. Default: False
background: Var[bool]
- # If false set, labels will not be drawn. If true set, labels will be drawn which have the props calculated internally.
+ # If false set, labels will not be drawn. If true set, labels will be drawn which have the props calculated internally. Default: False
label: Var[bool]
# The stack id of bar, when two bars have the same value axis and same stack_id, then the two bars are stacked in order.
@@ -381,30 +388,15 @@ class Bar(Cartesian):
# Max size of the bar
max_bar_size: Var[int]
+ # If set a value, the option is the radius of all the rounded corners. If set a array, the option are in turn the radiuses of top-left corner, top-right corner, bottom-right corner, bottom-left corner. Default: 0
+ radius: Var[Union[int, List[int]]]
+
# The active bar is shown when a user enters a bar chart and this chart has tooltip. If set to false, no active bar will be drawn. If set to true, active bar will be drawn with the props calculated internally. If passed an object, active bar will be drawn, and the internally calculated props will be merged with the key value pairs of the passed object.
# active_bar: Var[Union[bool, Dict[str, Any]]]
# Valid children components
_valid_children: List[str] = ["Cell", "LabelList", "ErrorBar"]
- # If set false, animation of bar will be disabled.
- is_animation_active: Var[bool]
-
- # Specifies when the animation should begin, the unit of this option is ms, default 0.
- animation_begin: Var[int]
-
- # Specifies the duration of animation, the unit of this option is ms, default 1500.
- animation_duration: Var[int]
-
- # The type of easing function, default 'ease'
- animation_easing: Var[LiteralAnimationEasing]
-
- # The customized event handler of animation start
- on_animation_start: EventHandler[lambda: []]
-
- # The customized event handler of animation end
- on_animation_end: EventHandler[lambda: []]
-
class Line(Cartesian):
"""A Line component in Recharts."""
@@ -416,13 +408,13 @@ class Line(Cartesian):
# The interpolation type of line. And customized interpolation function can be set to type. It's the same as type in Area.
type_: Var[LiteralAreaType]
- # The color of the line stroke.
+ # The color of the line stroke. Default: rx.color("accent", 9)
stroke: Var[Union[str, Color]] = LiteralVar.create(Color("accent", 9))
- # The width of the line stroke.
+ # The width of the line stroke. Default: 1
stroke_width: Var[int]
- # The dot is shown when mouse enter a line chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally.
+ # The dot is shown when mouse enter a line chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally. Default: {"stroke": rx.color("accent", 10), "fill": rx.color("accent", 4)}
dot: Var[Union[bool, Dict[str, Any]]] = LiteralVar.create(
{
"stroke": Color("accent", 10),
@@ -430,7 +422,7 @@ class Line(Cartesian):
}
)
- # The dot is shown when user enter an area chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally.
+ # The dot is shown when user enter an area chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally. Default: {"stroke": rx.color("accent", 2), "fill": rx.color("accent", 10)}
active_dot: Var[Union[bool, Dict[str, Any]]] = LiteralVar.create(
{
"stroke": Color("accent", 2),
@@ -438,10 +430,10 @@ class Line(Cartesian):
}
)
- # If false set, labels will not be drawn. If true set, labels will be drawn which have the props calculated internally.
+ # If false set, labels will not be drawn. If true set, labels will be drawn which have the props calculated internally. Default: False
label: Var[bool]
- # Hides the line when true, useful when toggling visibility state via legend.
+ # Hides the line when true, useful when toggling visibility state via legend. Default: False
hide: Var[bool]
# Whether to connect a graph line across null points.
@@ -450,8 +442,11 @@ class Line(Cartesian):
# The unit of data. This option will be used in tooltip.
unit: Var[Union[str, int]]
- # The name of data displayed in the axis. This option will be used to represent an index in a scatter chart.
- name: Var[Union[str, int]]
+ # The coordinates of all the points in the line, usually calculated internally.
+ points: Var[List[Dict[str, Any]]]
+
+ # The pattern of dashes and gaps used to paint the line.
+ stroke_dasharray: Var[str]
# Valid children components
_valid_children: List[str] = ["LabelList", "ErrorBar"]
@@ -467,71 +462,68 @@ class Scatter(Recharts):
# The source data, in which each element is an object.
data: Var[List[Dict[str, Any]]]
- # The type of icon in legend. If set to 'none', no legend item will be rendered. 'line' | 'plainline' | 'square' | 'rect'| 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye' | 'none'
+ # The type of icon in legend. If set to 'none', no legend item will be rendered. 'line' | 'plainline' | 'square' | 'rect'| 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye' | 'none'. Default: "circle"
legend_type: Var[LiteralLegendType]
- # The id of x-axis which is corresponding to the data.
+ # The id of x-axis which is corresponding to the data. Default: 0
x_axis_id: Var[Union[str, int]]
- # The id of y-axis which is corresponding to the data.
+ # The id of y-axis which is corresponding to the data. Default: 0
y_axis_id: Var[Union[str, int]]
- # The id of z-axis which is corresponding to the data.
- z_axis_id: Var[str]
+ # The id of z-axis which is corresponding to the data. Default: 0
+ z_axis_id: Var[Union[str, int]]
- # If false set, line will not be drawn. If true set, line will be drawn which have the props calculated internally.
+ # If false set, line will not be drawn. If true set, line will be drawn which have the props calculated internally. Default: False
line: Var[bool]
- # If a string set, specified symbol will be used to show scatter item. 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye'
+ # If a string set, specified symbol will be used to show scatter item. 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye'. Default: "circle"
shape: Var[LiteralShape]
- # If 'joint' set, line will generated by just jointing all the points. If 'fitting' set, line will be generated by fitting algorithm. 'joint' | 'fitting'
+ # If 'joint' set, line will generated by just jointing all the points. If 'fitting' set, line will be generated by fitting algorithm. 'joint' | 'fitting'. Default: "joint"
line_type: Var[LiteralLineType]
- # The fill
+ # The fill color of the scatter. Default: rx.color("accent", 9)
fill: Var[Union[str, Color]] = LiteralVar.create(Color("accent", 9))
- # the name
- name: Var[Union[str, int]]
-
# Valid children components.
_valid_children: List[str] = ["LabelList", "ErrorBar"]
- # If set false, animation of bar will be disabled.
+ # If set false, animation of bar will be disabled. Default: True in CSR, False in SSR
is_animation_active: Var[bool]
- # Specifies when the animation should begin, the unit of this option is ms, default 0.
+ # Specifies when the animation should begin, the unit of this option is ms. Default: 0
animation_begin: Var[int]
- # Specifies the duration of animation, the unit of this option is ms, default 1500.
+ # Specifies the duration of animation, the unit of this option is ms. Default: 1500
animation_duration: Var[int]
- # The type of easing function, default 'ease'
+ # The type of easing function. Default: "ease"
animation_easing: Var[LiteralAnimationEasing]
# The customized event handler of click on the component in this group
- on_click: EventHandler[lambda: []]
+ on_click: EventHandler[empty_event]
# The customized event handler of mousedown on the component in this group
- on_mouse_down: EventHandler[lambda: []]
+ on_mouse_down: EventHandler[empty_event]
# The customized event handler of mouseup on the component in this group
- on_mouse_up: EventHandler[lambda: []]
+ on_mouse_up: EventHandler[empty_event]
# The customized event handler of mousemove on the component in this group
- on_mouse_move: EventHandler[lambda: []]
+ on_mouse_move: EventHandler[empty_event]
# The customized event handler of mouseover on the component in this group
- on_mouse_over: EventHandler[lambda: []]
+ on_mouse_over: EventHandler[empty_event]
# The customized event handler of mouseout on the component in this group
- on_mouse_out: EventHandler[lambda: []]
+ on_mouse_out: EventHandler[empty_event]
# The customized event handler of mouseenter on the component in this group
- on_mouse_enter: EventHandler[lambda: []]
+ on_mouse_enter: EventHandler[empty_event]
# The customized event handler of mouseleave on the component in this group
- on_mouse_leave: EventHandler[lambda: []]
+ on_mouse_leave: EventHandler[empty_event]
class Funnel(Recharts):
@@ -572,34 +564,34 @@ class Funnel(Recharts):
_valid_children: List[str] = ["LabelList", "Cell"]
# The customized event handler of animation start
- on_animation_start: EventHandler[lambda: []]
+ on_animation_start: EventHandler[empty_event]
# The customized event handler of animation end
- on_animation_end: EventHandler[lambda: []]
+ on_animation_end: EventHandler[empty_event]
# The customized event handler of click on the component in this group
- on_click: EventHandler[lambda: []]
+ on_click: EventHandler[empty_event]
# The customized event handler of mousedown on the component in this group
- on_mouse_down: EventHandler[lambda: []]
+ on_mouse_down: EventHandler[empty_event]
# The customized event handler of mouseup on the component in this group
- on_mouse_up: EventHandler[lambda: []]
+ on_mouse_up: EventHandler[empty_event]
# The customized event handler of mousemove on the component in this group
- on_mouse_move: EventHandler[lambda: []]
+ on_mouse_move: EventHandler[empty_event]
# The customized event handler of mouseover on the component in this group
- on_mouse_over: EventHandler[lambda: []]
+ on_mouse_over: EventHandler[empty_event]
# The customized event handler of mouseout on the component in this group
- on_mouse_out: EventHandler[lambda: []]
+ on_mouse_out: EventHandler[empty_event]
# The customized event handler of mouseenter on the component in this group
- on_mouse_enter: EventHandler[lambda: []]
+ on_mouse_enter: EventHandler[empty_event]
# The customized event handler of mouseleave on the component in this group
- on_mouse_leave: EventHandler[lambda: []]
+ on_mouse_leave: EventHandler[empty_event]
class ErrorBar(Recharts):
@@ -628,19 +620,19 @@ class ErrorBar(Recharts):
class Reference(Recharts):
"""A base class for reference components in Reference."""
- # The id of x-axis which is corresponding to the data.
+ # The id of x-axis which is corresponding to the data. Default: 0
x_axis_id: Var[Union[str, int]]
- # The id of y-axis which is corresponding to the data.
+ # The id of y-axis which is corresponding to the data. Default: 0
y_axis_id: Var[Union[str, int]]
- # Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas.
+ # Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas. Default: "discard"
if_overflow: Var[LiteralIfOverflow]
# If set a string or a number, default label will be drawn, and the option is content.
label: Var[Union[str, int]]
- # If set true, the line will be rendered in front of bars in BarChart, etc.
+ # If set true, the line will be rendered in front of bars in BarChart, etc. Default: False
is_front: Var[bool]
@@ -660,7 +652,7 @@ class ReferenceLine(Reference):
# The color of the reference line.
stroke: Var[Union[str, Color]]
- # The width of the stroke.
+ # The width of the stroke. Default: 1
stroke_width: Var[Union[str, int]]
# Valid children components
@@ -696,28 +688,28 @@ class ReferenceDot(Reference):
_valid_children: List[str] = ["Label"]
# The customized event handler of click on the component in this chart
- on_click: EventHandler[lambda: []]
+ on_click: EventHandler[empty_event]
# The customized event handler of mousedown on the component in this chart
- on_mouse_down: EventHandler[lambda: []]
+ on_mouse_down: EventHandler[empty_event]
# The customized event handler of mouseup on the component in this chart
- on_mouse_up: EventHandler[lambda: []]
+ on_mouse_up: EventHandler[empty_event]
# The customized event handler of mouseover on the component in this chart
- on_mouse_over: EventHandler[lambda: []]
+ on_mouse_over: EventHandler[empty_event]
# The customized event handler of mouseout on the component in this chart
- on_mouse_out: EventHandler[lambda: []]
+ on_mouse_out: EventHandler[empty_event]
# The customized event handler of mouseenter on the component in this chart
- on_mouse_enter: EventHandler[lambda: []]
+ on_mouse_enter: EventHandler[empty_event]
# The customized event handler of mousemove on the component in this chart
- on_mouse_move: EventHandler[lambda: []]
+ on_mouse_move: EventHandler[empty_event]
# The customized event handler of mouseleave on the component in this chart
- on_mouse_leave: EventHandler[lambda: []]
+ on_mouse_leave: EventHandler[empty_event]
class ReferenceArea(Recharts):
@@ -754,10 +746,10 @@ class ReferenceArea(Recharts):
# A boundary value of the area. If the specified y-axis is a number axis, the type of y must be Number. If the specified y-axis is a category axis, the value of y must be one of the categorys. If one of y1 or y2 is invalidate, the area will cover along y-axis.
y2: Var[Union[str, int]]
- # Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas.
+ # Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas. Default: "discard"
if_overflow: Var[LiteralIfOverflow]
- # If set true, the line will be rendered in front of bars in BarChart, etc.
+ # If set true, the line will be rendered in front of bars in BarChart, etc. Default: False
is_front: Var[bool]
# Valid children components
@@ -787,28 +779,28 @@ class CartesianGrid(Grid):
alias = "RechartsCartesianGrid"
- # The horizontal line configuration.
+ # The horizontal line configuration. Default: True
horizontal: Var[bool]
- # The vertical line configuration.
+ # The vertical line configuration. Default: True
vertical: Var[bool]
- # The x-coordinates in pixel values of all vertical lines.
+ # The x-coordinates in pixel values of all vertical lines. Default: []
vertical_points: Var[List[Union[str, int]]]
- # The x-coordinates in pixel values of all vertical lines.
+ # The x-coordinates in pixel values of all vertical lines. Default: []
horizontal_points: Var[List[Union[str, int]]]
# The background of grid.
fill: Var[Union[str, Color]]
- # The opacity of the background used to fill the space between grid lines
+ # The opacity of the background used to fill the space between grid lines.
fill_opacity: Var[float]
- # The pattern of dashes and gaps used to paint the lines of the grid
+ # The pattern of dashes and gaps used to paint the lines of the grid.
stroke_dasharray: Var[str]
- # the stroke color of grid
+ # the stroke color of grid. Default: rx.color("gray", 7)
stroke: Var[Union[str, Color]] = LiteralVar.create(Color("gray", 7))
@@ -819,28 +811,31 @@ class CartesianAxis(Grid):
alias = "RechartsCartesianAxis"
- # The orientation of axis 'top' | 'bottom' | 'left' | 'right'
+ # The orientation of axis 'top' | 'bottom' | 'left' | 'right'. Default: "bottom"
orientation: Var[LiteralOrientationTopBottomLeftRight]
- # If set false, no axis line will be drawn. If set a object, the option is the configuration of axis line.
+ # The box of viewing area. Default: {"x": 0, "y": 0, "width": 0, "height": 0}
+ view_box: Var[Dict[str, Any]]
+
+ # If set false, no axis line will be drawn. If set a object, the option is the configuration of axis line. Default: True
axis_line: Var[bool]
- # If set false, no axis tick lines will be drawn. If set a object, the option is the configuration of tick lines.
+ # If set false, no ticks will be drawn.
+ tick: Var[bool]
+
+ # If set false, no axis tick lines will be drawn. If set a object, the option is the configuration of tick lines. Default: True
tick_line: Var[bool]
- # The length of tick line.
+ # The length of tick line. Default: 6
tick_size: Var[int]
- # If set 0, all the ticks will be shown. If set preserveStart", "preserveEnd" or "preserveStartEnd", the ticks which is to be shown or hidden will be calculated automatically.
+ # If set 0, all the ticks will be shown. If set preserveStart", "preserveEnd" or "preserveStartEnd", the ticks which is to be shown or hidden will be calculated automatically. Default: "preserveEnd"
interval: Var[LiteralInterval]
- # If set false, no ticks will be drawn.
- ticks: Var[bool]
-
# If set a string or a number, default label will be drawn, and the option is content.
- label: Var[str]
+ label: Var[Union[str, int]]
- # If set true, flips ticks around the axis line, displaying the labels inside the chart instead of outside.
+ # If set true, flips ticks around the axis line, displaying the labels inside the chart instead of outside. Default: False
mirror: Var[bool]
# The margin between tick line and tick.
diff --git a/reflex/components/recharts/cartesian.pyi b/reflex/components/recharts/cartesian.pyi
index 83a785e8b2..78a7a8ea70 100644
--- a/reflex/components/recharts/cartesian.pyi
+++ b/reflex/components/recharts/cartesian.pyi
@@ -212,7 +212,8 @@ class XAxis(Axis):
] = None,
x_axis_id: Optional[Union[Var[Union[int, str]], int, str]] = None,
include_hidden: Optional[Union[Var[bool], bool]] = None,
- domain: Optional[Union[List, Var[List]]] = None,
+ angle: Optional[Union[Var[int], int]] = None,
+ padding: Optional[Union[Dict[str, int], Var[Dict[str, int]]]] = None,
data_key: Optional[Union[Var[Union[int, str]], int, str]] = None,
hide: Optional[Union[Var[bool], bool]] = None,
width: Optional[Union[Var[Union[int, str]], int, str]] = None,
@@ -355,10 +356,12 @@ class XAxis(Axis):
Args:
*children: The children of the component.
- orientation: The orientation of axis 'top' | 'bottom'
- x_axis_id: The id of x-axis which is corresponding to the data.
- include_hidden: Ensures that all datapoints within a chart contribute to its domain calculation, even when they are hidden
+ orientation: The orientation of axis 'top' | 'bottom'. Default: "bottom"
+ x_axis_id: The id of x-axis which is corresponding to the data. Default: 0
+ include_hidden: Ensures that all datapoints within a chart contribute to its domain calculation, even when they are hidden. Default: False
domain: The range of the axis. Work best in conjuction with allow_data_overflow. Default: [0, "auto"]
+ angle: The angle of axis ticks. Default: 0
+ padding: Specify the padding of x-axis. Default: {"left": 0, "right": 0}
data_key: The key of data displayed in the axis.
hide: If set true, the axis do not display in the chart. Default: False
width: The width of axis which is usually calculated internally.
@@ -406,7 +409,7 @@ class YAxis(Axis):
Union[Literal["left", "right"], Var[Literal["left", "right"]]]
] = None,
y_axis_id: Optional[Union[Var[Union[int, str]], int, str]] = None,
- domain: Optional[Union[List, Var[List]]] = None,
+ padding: Optional[Union[Dict[str, int], Var[Dict[str, int]]]] = None,
data_key: Optional[Union[Var[Union[int, str]], int, str]] = None,
hide: Optional[Union[Var[bool], bool]] = None,
width: Optional[Union[Var[Union[int, str]], int, str]] = None,
@@ -549,9 +552,10 @@ class YAxis(Axis):
Args:
*children: The children of the component.
- orientation: The orientation of axis 'left' | 'right'
- y_axis_id: The id of y-axis which is corresponding to the data.
+ orientation: The orientation of axis 'left' | 'right'. Default: "left"
+ y_axis_id: The id of y-axis which is corresponding to the data. Default: 0
domain: The range of the axis. Work best in conjuction with allow_data_overflow. Default: [0, "auto"]
+ padding: Specify the padding of y-axis. Default: {"top": 0, "bottom": 0}
data_key: The key of data displayed in the axis.
hide: If set true, the axis do not display in the chart. Default: False
width: The width of axis which is usually calculated internally.
@@ -596,6 +600,7 @@ class ZAxis(Recharts):
cls,
*children,
data_key: Optional[Union[Var[Union[int, str]], int, str]] = None,
+ z_axis_id: Optional[Union[Var[Union[int, str]], int, str]] = None,
range: Optional[Union[List[int], Var[List[int]]]] = None,
unit: Optional[Union[Var[Union[int, str]], int, str]] = None,
name: Optional[Union[Var[Union[int, str]], int, str]] = None,
@@ -687,10 +692,11 @@ class ZAxis(Recharts):
Args:
*children: The children of the component.
data_key: The key of data displayed in the axis.
- range: The range of axis.
+ z_axis_id: The unique id of z-axis. Default: 0
+ range: The range of axis. Default: [10, 10]
unit: The unit of data displayed in the axis. This option will be used to represent an index unit in a scatter chart.
name: The name of data displayed in the axis. This option will be used to represent an index in a scatter chart.
- scale: If 'auto' set, the scale function is decided by the type of chart, and the props type.
+ scale: If 'auto' set, the scale function is decided by the type of chart, and the props type. Default: "auto"
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -739,15 +745,15 @@ class Brush(Recharts):
stroke: The stroke color of brush
fill: The fill color of brush
data_key: The key of data displayed in the axis.
- x: The x-coordinate of brush.
- y: The y-coordinate of brush.
- width: The width of brush.
- height: The height of brush.
- data: The data domain of brush, [min, max].
- traveller_width: The width of each traveller.
- gap: The data with gap of refreshing chart. If the option is not set, the chart will be refreshed every time
- start_index: The default start index of brush. If the option is not set, the start index will be 0.
- end_index: The default end index of brush. If the option is not set, the end index will be 1.
+ x: The x-coordinate of brush. Default: 0
+ y: The y-coordinate of brush. Default: 0
+ width: The width of brush. Default: 0
+ height: The height of brush. Default: 40
+ data: The original data of a LineChart, a BarChart or an AreaChart.
+ traveller_width: The width of each traveller. Default: 5
+ gap: The data with gap of refreshing chart. If the option is not set, the chart will be refreshed every time. Default: 1
+ start_index: The default start index of brush. If the option is not set, the start index will be 0. Default: 0
+ end_index: The default end index of brush. If the option is not set, the end index will be calculated by the length of data.
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -929,9 +935,12 @@ class Area(Cartesian):
Union[Dict[str, Any], Var[Union[Dict[str, Any], bool]], bool]
] = None,
label: Optional[Union[Var[bool], bool]] = None,
+ base_line: Optional[
+ Union[List[Dict[str, Any]], Var[Union[List[Dict[str, Any]], str]], str]
+ ] = None,
+ points: Optional[Union[List[Dict[str, Any]], Var[List[Dict[str, Any]]]]] = None,
stack_id: Optional[Union[Var[Union[int, str]], int, str]] = None,
- unit: Optional[Union[Var[Union[int, str]], int, str]] = None,
- name: Optional[Union[Var[Union[int, str]], int, str]] = None,
+ connect_nulls: Optional[Union[Var[bool], bool]] = None,
layout: Optional[
Union[
Literal["horizontal", "vertical"],
@@ -1020,16 +1029,17 @@ class Area(Cartesian):
Args:
*children: The children of the component.
- stroke: The color of the line stroke.
- stroke_width: The width of the line stroke.
- fill: The color of the area fill.
- type_: The interpolation type of area. And customized interpolation function can be set to type. 'basis' | 'basisClosed' | 'basisOpen' | 'bumpX' | 'bumpY' | 'bump' | 'linear' | 'linearClosed' | 'natural' | 'monotoneX' | 'monotoneY' | 'monotone' | 'step' | 'stepBefore' | 'stepAfter' |
- dot: If false set, dots will not be drawn. If true set, dots will be drawn which have the props calculated internally.
- active_dot: The dot is shown when user enter an area chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally.
- label: If set false, labels will not be drawn. If set true, labels will be drawn which have the props calculated internally.
+ stroke: The color of the line stroke. Default: rx.color("accent", 9)
+ stroke_width: The width of the line stroke. Default: 1
+ fill: The color of the area fill. Default: rx.color("accent", 5)
+ type_: The interpolation type of area. And customized interpolation function can be set to type. 'basis' | 'basisClosed' | 'basisOpen' | 'bumpX' | 'bumpY' | 'bump' | 'linear' | 'linearClosed' | 'natural' | 'monotoneX' | 'monotoneY' | 'monotone' | 'step' | 'stepBefore' | 'stepAfter'. Default: "monotone"
+ dot: If false set, dots will not be drawn. If true set, dots will be drawn which have the props calculated internally. Default: False
+ active_dot: The dot is shown when user enter an area chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally. Default: {stroke: rx.color("accent", 2), fill: rx.color("accent", 10)}
+ label: If set false, labels will not be drawn. If set true, labels will be drawn which have the props calculated internally. Default: False
+ base_line: The value which can describle the line, usually calculated internally.
+ points: The coordinates of all the points in the area, usually calculated internally.
stack_id: The stack id of area, when two areas have the same value axis and same stack_id, then the two areas are stacked in order.
- unit: The unit of data. This option will be used in tooltip.
- name: The name of data. This option will be used in tooltip and legend to represent a bar. If no value was set to this option, the value of dataKey will be used alternatively.
+ connect_nulls: Whether to connect a graph area across null points. Default: False
layout: The layout of bar in the chart, usually inherited from parent. 'horizontal' | 'vertical'
data_key: The key of a group of data which should be unique in an area chart.
x_axis_id: The id of x-axis which is corresponding to the data.
@@ -1065,15 +1075,7 @@ class Bar(Cartesian):
name: Optional[Union[Var[Union[int, str]], int, str]] = None,
bar_size: Optional[Union[Var[int], int]] = None,
max_bar_size: Optional[Union[Var[int], int]] = None,
- is_animation_active: Optional[Union[Var[bool], bool]] = None,
- animation_begin: Optional[Union[Var[int], int]] = None,
- animation_duration: Optional[Union[Var[int], int]] = None,
- animation_easing: Optional[
- Union[
- Literal["ease", "ease-in", "ease-in-out", "ease-out", "linear"],
- Var[Literal["ease", "ease-in", "ease-in-out", "ease-out", "linear"]],
- ]
- ] = None,
+ radius: Optional[Union[List[int], Var[Union[List[int], int]], int]] = None,
layout: Optional[
Union[
Literal["horizontal", "vertical"],
@@ -1121,12 +1123,6 @@ class Bar(Cartesian):
class_name: Optional[Any] = None,
autofocus: Optional[bool] = None,
custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
- on_animation_end: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_animation_start: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
on_blur: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
on_click: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
on_context_menu: Optional[
@@ -1170,19 +1166,16 @@ class Bar(Cartesian):
*children: The children of the component.
stroke: The color of the line stroke.
stroke_width: The width of the line stroke.
- fill: The width of the line stroke.
- background: If false set, background of bars will not be drawn. If true set, background of bars will be drawn which have the props calculated internally.
- label: If false set, labels will not be drawn. If true set, labels will be drawn which have the props calculated internally.
+ fill: The width of the line stroke. Default: Color("accent", 9)
+ background: If false set, background of bars will not be drawn. If true set, background of bars will be drawn which have the props calculated internally. Default: False
+ label: If false set, labels will not be drawn. If true set, labels will be drawn which have the props calculated internally. Default: False
stack_id: The stack id of bar, when two bars have the same value axis and same stack_id, then the two bars are stacked in order.
unit: The unit of data. This option will be used in tooltip.
min_point_size: The minimal height of a bar in a horizontal BarChart, or the minimal width of a bar in a vertical BarChart. By default, 0 values are not shown. To visualize a 0 (or close to zero) point, set the minimal point size to a pixel value like 3. In stacked bar charts, minPointSize might not be respected for tightly packed values. So we strongly recommend not using this prop in stacked BarCharts.
name: The name of data. This option will be used in tooltip and legend to represent a bar. If no value was set to this option, the value of dataKey will be used alternatively.
bar_size: Size of the bar (if one bar_size is set then a bar_size must be set for all bars)
max_bar_size: Max size of the bar
- is_animation_active: If set false, animation of bar will be disabled.
- animation_begin: Specifies when the animation should begin, the unit of this option is ms, default 0.
- animation_duration: Specifies the duration of animation, the unit of this option is ms, default 1500.
- animation_easing: The type of easing function, default 'ease'
+ radius: If set a value, the option is the radius of all the rounded corners. If set a array, the option are in turn the radiuses of top-left corner, top-right corner, bottom-right corner, bottom-left corner. Default: 0
layout: The layout of bar in the chart, usually inherited from parent. 'horizontal' | 'vertical'
data_key: The key of a group of data which should be unique in an area chart.
x_axis_id: The id of x-axis which is corresponding to the data.
@@ -1259,7 +1252,8 @@ class Line(Cartesian):
hide: Optional[Union[Var[bool], bool]] = None,
connect_nulls: Optional[Union[Var[bool], bool]] = None,
unit: Optional[Union[Var[Union[int, str]], int, str]] = None,
- name: Optional[Union[Var[Union[int, str]], int, str]] = None,
+ points: Optional[Union[List[Dict[str, Any]], Var[List[Dict[str, Any]]]]] = None,
+ stroke_dasharray: Optional[Union[Var[str], str]] = None,
layout: Optional[
Union[
Literal["horizontal", "vertical"],
@@ -1349,15 +1343,16 @@ class Line(Cartesian):
Args:
*children: The children of the component.
type_: The interpolation type of line. And customized interpolation function can be set to type. It's the same as type in Area.
- stroke: The color of the line stroke.
- stroke_width: The width of the line stroke.
- dot: The dot is shown when mouse enter a line chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally.
- active_dot: The dot is shown when user enter an area chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally.
- label: If false set, labels will not be drawn. If true set, labels will be drawn which have the props calculated internally.
- hide: Hides the line when true, useful when toggling visibility state via legend.
+ stroke: The color of the line stroke. Default: rx.color("accent", 9)
+ stroke_width: The width of the line stroke. Default: 1
+ dot: The dot is shown when mouse enter a line chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally. Default: {"stroke": rx.color("accent", 10), "fill": rx.color("accent", 4)}
+ active_dot: The dot is shown when user enter an area chart and this chart has tooltip. If false set, no active dot will not be drawn. If true set, active dot will be drawn which have the props calculated internally. Default: {"stroke": rx.color("accent", 2), "fill": rx.color("accent", 10)}
+ label: If false set, labels will not be drawn. If true set, labels will be drawn which have the props calculated internally. Default: False
+ hide: Hides the line when true, useful when toggling visibility state via legend. Default: False
connect_nulls: Whether to connect a graph line across null points.
unit: The unit of data. This option will be used in tooltip.
- name: The name of data displayed in the axis. This option will be used to represent an index in a scatter chart.
+ points: The coordinates of all the points in the line, usually calculated internally.
+ stroke_dasharray: The pattern of dashes and gaps used to paint the line.
layout: The layout of bar in the chart, usually inherited from parent. 'horizontal' | 'vertical'
data_key: The key of a group of data which should be unique in an area chart.
x_axis_id: The id of x-axis which is corresponding to the data.
@@ -1417,7 +1412,7 @@ class Scatter(Recharts):
] = None,
x_axis_id: Optional[Union[Var[Union[int, str]], int, str]] = None,
y_axis_id: Optional[Union[Var[Union[int, str]], int, str]] = None,
- z_axis_id: Optional[Union[Var[str], str]] = None,
+ z_axis_id: Optional[Union[Var[Union[int, str]], int, str]] = None,
line: Optional[Union[Var[bool], bool]] = None,
shape: Optional[
Union[
@@ -1441,7 +1436,6 @@ class Scatter(Recharts):
Union[Literal["fitting", "joint"], Var[Literal["fitting", "joint"]]]
] = None,
fill: Optional[Union[Color, Var[Union[Color, str]], str]] = None,
- name: Optional[Union[Var[Union[int, str]], int, str]] = None,
is_animation_active: Optional[Union[Var[bool], bool]] = None,
animation_begin: Optional[Union[Var[int], int]] = None,
animation_duration: Optional[Union[Var[int], int]] = None,
@@ -1499,19 +1493,18 @@ class Scatter(Recharts):
Args:
*children: The children of the component.
data: The source data, in which each element is an object.
- legend_type: The type of icon in legend. If set to 'none', no legend item will be rendered. 'line' | 'plainline' | 'square' | 'rect'| 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye' | 'none'
- x_axis_id: The id of x-axis which is corresponding to the data.
- y_axis_id: The id of y-axis which is corresponding to the data.
- z_axis_id: The id of z-axis which is corresponding to the data.
- line: If false set, line will not be drawn. If true set, line will be drawn which have the props calculated internally.
- shape: If a string set, specified symbol will be used to show scatter item. 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye'
- line_type: If 'joint' set, line will generated by just jointing all the points. If 'fitting' set, line will be generated by fitting algorithm. 'joint' | 'fitting'
- fill: The fill
- name: the name
- is_animation_active: If set false, animation of bar will be disabled.
- animation_begin: Specifies when the animation should begin, the unit of this option is ms, default 0.
- animation_duration: Specifies the duration of animation, the unit of this option is ms, default 1500.
- animation_easing: The type of easing function, default 'ease'
+ legend_type: The type of icon in legend. If set to 'none', no legend item will be rendered. 'line' | 'plainline' | 'square' | 'rect'| 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye' | 'none'. Default: "circle"
+ x_axis_id: The id of x-axis which is corresponding to the data. Default: 0
+ y_axis_id: The id of y-axis which is corresponding to the data. Default: 0
+ z_axis_id: The id of z-axis which is corresponding to the data. Default: 0
+ line: If false set, line will not be drawn. If true set, line will be drawn which have the props calculated internally. Default: False
+ shape: If a string set, specified symbol will be used to show scatter item. 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye'. Default: "circle"
+ line_type: If 'joint' set, line will generated by just jointing all the points. If 'fitting' set, line will be generated by fitting algorithm. 'joint' | 'fitting'. Default: "joint"
+ fill: The fill color of the scatter. Default: rx.color("accent", 9)
+ is_animation_active: If set false, animation of bar will be disabled. Default: True in CSR, False in SSR
+ animation_begin: Specifies when the animation should begin, the unit of this option is ms. Default: 0
+ animation_duration: Specifies the duration of animation, the unit of this option is ms. Default: 1500
+ animation_easing: The type of easing function. Default: "ease"
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -1792,11 +1785,11 @@ class Reference(Recharts):
Args:
*children: The children of the component.
- x_axis_id: The id of x-axis which is corresponding to the data.
- y_axis_id: The id of y-axis which is corresponding to the data.
- if_overflow: Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas.
+ x_axis_id: The id of x-axis which is corresponding to the data. Default: 0
+ y_axis_id: The id of y-axis which is corresponding to the data. Default: 0
+ if_overflow: Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas. Default: "discard"
label: If set a string or a number, default label will be drawn, and the option is content.
- is_front: If set true, the line will be rendered in front of bars in BarChart, etc.
+ is_front: If set true, the line will be rendered in front of bars in BarChart, etc. Default: False
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -1881,13 +1874,13 @@ class ReferenceLine(Reference):
x: If set a string or a number, a vertical line perpendicular to the x-axis specified by xAxisId will be drawn. If the specified x-axis is a number axis, the type of x must be Number. If the specified x-axis is a category axis, the value of x must be one of the categorys, otherwise no line will be drawn.
y: If set a string or a number, a horizontal line perpendicular to the y-axis specified by yAxisId will be drawn. If the specified y-axis is a number axis, the type of y must be Number. If the specified y-axis is a category axis, the value of y must be one of the categorys, otherwise no line will be drawn.
stroke: The color of the reference line.
- stroke_width: The width of the stroke.
+ stroke_width: The width of the stroke. Default: 1
segment: Array of endpoints in { x, y } format. These endpoints would be used to draw the ReferenceLine.
- x_axis_id: The id of x-axis which is corresponding to the data.
- y_axis_id: The id of y-axis which is corresponding to the data.
- if_overflow: Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas.
+ x_axis_id: The id of x-axis which is corresponding to the data. Default: 0
+ y_axis_id: The id of y-axis which is corresponding to the data. Default: 0
+ if_overflow: Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas. Default: "discard"
label: If set a string or a number, default label will be drawn, and the option is content.
- is_front: If set true, the line will be rendered in front of bars in BarChart, etc.
+ is_front: If set true, the line will be rendered in front of bars in BarChart, etc. Default: False
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -1974,11 +1967,11 @@ class ReferenceDot(Reference):
r: The radius of dot.
fill: The color of the area fill.
stroke: The color of the line stroke.
- x_axis_id: The id of x-axis which is corresponding to the data.
- y_axis_id: The id of y-axis which is corresponding to the data.
- if_overflow: Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas.
+ x_axis_id: The id of x-axis which is corresponding to the data. Default: 0
+ y_axis_id: The id of y-axis which is corresponding to the data. Default: 0
+ if_overflow: Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas. Default: "discard"
label: If set a string or a number, default label will be drawn, and the option is content.
- is_front: If set true, the line will be rendered in front of bars in BarChart, etc.
+ is_front: If set true, the line will be rendered in front of bars in BarChart, etc. Default: False
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -2070,8 +2063,8 @@ class ReferenceArea(Recharts):
x2: A boundary value of the area. If the specified x-axis is a number axis, the type of x must be Number. If the specified x-axis is a category axis, the value of x must be one of the categorys. If one of x1 or x2 is invalidate, the area will cover along x-axis.
y1: A boundary value of the area. If the specified y-axis is a number axis, the type of y must be Number. If the specified y-axis is a category axis, the value of y must be one of the categorys. If one of y1 or y2 is invalidate, the area will cover along y-axis.
y2: A boundary value of the area. If the specified y-axis is a number axis, the type of y must be Number. If the specified y-axis is a category axis, the value of y must be one of the categorys. If one of y1 or y2 is invalidate, the area will cover along y-axis.
- if_overflow: Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas.
- is_front: If set true, the line will be rendered in front of bars in BarChart, etc.
+ if_overflow: Defines how to draw the reference line if it falls partly outside the canvas. If set to 'discard', the reference line will not be drawn at all. If set to 'hidden', the reference line will be clipped to the canvas. If set to 'visible', the reference line will be drawn completely. If set to 'extendDomain', the domain of the overflown axis will be extended such that the reference line fits into the canvas. Default: "discard"
+ is_front: If set true, the line will be rendered in front of bars in BarChart, etc. Default: False
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -2228,14 +2221,14 @@ class CartesianGrid(Grid):
Args:
*children: The children of the component.
- horizontal: The horizontal line configuration.
- vertical: The vertical line configuration.
- vertical_points: The x-coordinates in pixel values of all vertical lines.
- horizontal_points: The x-coordinates in pixel values of all vertical lines.
+ horizontal: The horizontal line configuration. Default: True
+ vertical: The vertical line configuration. Default: True
+ vertical_points: The x-coordinates in pixel values of all vertical lines. Default: []
+ horizontal_points: The x-coordinates in pixel values of all vertical lines. Default: []
fill: The background of grid.
- fill_opacity: The opacity of the background used to fill the space between grid lines
- stroke_dasharray: The pattern of dashes and gaps used to paint the lines of the grid
- stroke: the stroke color of grid
+ fill_opacity: The opacity of the background used to fill the space between grid lines.
+ stroke_dasharray: The pattern of dashes and gaps used to paint the lines of the grid.
+ stroke: the stroke color of grid. Default: rx.color("gray", 7)
x: The x-coordinate of grid.
y: The y-coordinate of grid.
width: The width of grid.
@@ -2265,7 +2258,9 @@ class CartesianAxis(Grid):
Var[Literal["bottom", "left", "right", "top"]],
]
] = None,
+ view_box: Optional[Union[Dict[str, Any], Var[Dict[str, Any]]]] = None,
axis_line: Optional[Union[Var[bool], bool]] = None,
+ tick: Optional[Union[Var[bool], bool]] = None,
tick_line: Optional[Union[Var[bool], bool]] = None,
tick_size: Optional[Union[Var[int], int]] = None,
interval: Optional[
@@ -2274,8 +2269,7 @@ class CartesianAxis(Grid):
Var[Literal["preserveEnd", "preserveStart", "preserveStartEnd"]],
]
] = None,
- ticks: Optional[Union[Var[bool], bool]] = None,
- label: Optional[Union[Var[str], str]] = None,
+ label: Optional[Union[Var[Union[int, str]], int, str]] = None,
mirror: Optional[Union[Var[bool], bool]] = None,
tick_margin: Optional[Union[Var[int], int]] = None,
x: Optional[Union[Var[int], int]] = None,
@@ -2329,14 +2323,15 @@ class CartesianAxis(Grid):
Args:
*children: The children of the component.
- orientation: The orientation of axis 'top' | 'bottom' | 'left' | 'right'
- axis_line: If set false, no axis line will be drawn. If set a object, the option is the configuration of axis line.
- tick_line: If set false, no axis tick lines will be drawn. If set a object, the option is the configuration of tick lines.
- tick_size: The length of tick line.
- interval: If set 0, all the ticks will be shown. If set preserveStart", "preserveEnd" or "preserveStartEnd", the ticks which is to be shown or hidden will be calculated automatically.
- ticks: If set false, no ticks will be drawn.
+ orientation: The orientation of axis 'top' | 'bottom' | 'left' | 'right'. Default: "bottom"
+ view_box: The box of viewing area. Default: {"x": 0, "y": 0, "width": 0, "height": 0}
+ axis_line: If set false, no axis line will be drawn. If set a object, the option is the configuration of axis line. Default: True
+ tick: If set false, no ticks will be drawn.
+ tick_line: If set false, no axis tick lines will be drawn. If set a object, the option is the configuration of tick lines. Default: True
+ tick_size: The length of tick line. Default: 6
+ interval: If set 0, all the ticks will be shown. If set preserveStart", "preserveEnd" or "preserveStartEnd", the ticks which is to be shown or hidden will be calculated automatically. Default: "preserveEnd"
label: If set a string or a number, default label will be drawn, and the option is content.
- mirror: If set true, flips ticks around the axis line, displaying the labels inside the chart instead of outside.
+ mirror: If set true, flips ticks around the axis line, displaying the labels inside the chart instead of outside. Default: False
tick_margin: The margin between tick line and tick.
x: The x-coordinate of grid.
y: The y-coordinate of grid.
diff --git a/reflex/components/recharts/charts.py b/reflex/components/recharts/charts.py
index 6f79a70ae8..d4785f6c4d 100644
--- a/reflex/components/recharts/charts.py
+++ b/reflex/components/recharts/charts.py
@@ -8,8 +8,8 @@
from reflex.components.recharts.general import ResponsiveContainer
from reflex.constants import EventTriggers
from reflex.constants.colors import Color
-from reflex.event import EventHandler
-from reflex.vars.base import LiteralVar, Var
+from reflex.event import EventHandler, empty_event
+from reflex.vars.base import Var
from .recharts import (
LiteralAnimationEasing,
@@ -31,16 +31,16 @@ class ChartBase(RechartsCharts):
height: Var[Union[str, int]] = "100%" # type: ignore
# The customized event handler of click on the component in this chart
- on_click: EventHandler[lambda: []]
+ on_click: EventHandler[empty_event]
# The customized event handler of mouseenter on the component in this chart
- on_mouse_enter: EventHandler[lambda: []]
+ on_mouse_enter: EventHandler[empty_event]
# The customized event handler of mousemove on the component in this chart
- on_mouse_move: EventHandler[lambda: []]
+ on_mouse_move: EventHandler[empty_event]
# The customized event handler of mouseleave on the component in this chart
- on_mouse_leave: EventHandler[lambda: []]
+ on_mouse_leave: EventHandler[empty_event]
@staticmethod
def _ensure_valid_dimension(name: str, value: Any) -> None:
@@ -112,10 +112,10 @@ class CategoricalChartBase(ChartBase):
# If any two categorical charts(rx.line_chart, rx.area_chart, rx.bar_chart, rx.composed_chart) have the same sync_id, these two charts can sync the position GraphingTooltip, and the start_index, end_index of Brush.
sync_id: Var[str]
- # When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function
+ # When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function. Default: "index"
sync_method: Var[LiteralSyncMethod]
- # The layout of area in the chart. 'horizontal' | 'vertical'
+ # The layout of area in the chart. 'horizontal' | 'vertical'. Default: "horizontal"
layout: Var[LiteralLayout]
# The type of offset function used to generate the lower and upper values in the series array. The four types are built-in offsets in d3-shape. 'expand' | 'none' | 'wiggle' | 'silhouette'
@@ -129,7 +129,7 @@ class AreaChart(CategoricalChartBase):
alias = "RechartsAreaChart"
- # The base value of area. Number | 'dataMin' | 'dataMax' | 'auto'
+ # The base value of area. Number | 'dataMin' | 'dataMax' | 'auto'. Default: "auto"
base_value: Var[Union[int, LiteralComposedChartBaseValue]]
# Valid children components
@@ -155,11 +155,11 @@ class BarChart(CategoricalChartBase):
alias = "RechartsBarChart"
- # The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number
- bar_category_gap: Var[Union[str, int]] = LiteralVar.create("10%")
+ # The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number. Default: "10%"
+ bar_category_gap: Var[Union[str, int]]
- # The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number
- bar_gap: Var[Union[str, int]] = LiteralVar.create(4) # type: ignore
+ # The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number. Default: 4
+ bar_gap: Var[Union[str, int]]
# The width of all the bars in the chart. Number
bar_size: Var[int]
@@ -167,10 +167,10 @@ class BarChart(CategoricalChartBase):
# The maximum width of all the bars in a horizontal BarChart, or maximum height in a vertical BarChart.
max_bar_size: Var[int]
- # The type of offset function used to generate the lower and upper values in the series array. The four types are built-in offsets in d3-shape.
+ # The type of offset function used to generate the lower and upper values in the series array. The four types are built-in offsets in d3-shape. Default: "none"
stack_offset: Var[LiteralStackOffset]
- # If false set, stacked items will be rendered left to right. If true set, stacked items will be rendered right to left. (Render direction affects SVG layering, not x position.)
+ # If false set, stacked items will be rendered left to right. If true set, stacked items will be rendered right to left. (Render direction affects SVG layering, not x position.) Default: False
reverse_stack_order: Var[bool]
# Valid children components
@@ -217,19 +217,19 @@ class ComposedChart(CategoricalChartBase):
alias = "RechartsComposedChart"
- # The base value of area. Number | 'dataMin' | 'dataMax' | 'auto'
+ # The base value of area. Number | 'dataMin' | 'dataMax' | 'auto'. Default: "auto"
base_value: Var[Union[int, LiteralComposedChartBaseValue]]
- # The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number
- bar_category_gap: Var[Union[str, int]] # type: ignore
+ # The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number. Default: "10%"
+ bar_category_gap: Var[Union[str, int]]
- # The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number
- bar_gap: Var[Union[str, int]] # type: ignore
+ # The gap between two bars in the same category. Default: 4
+ bar_gap: Var[int]
- # The width of all the bars in the chart. Number
+ # The width or height of each bar. If the barSize is not specified, the size of the bar will be calculated by the barCategoryGap, barGap and the quantity of bar groups.
bar_size: Var[int]
- # If false set, stacked items will be rendered left to right. If true set, stacked items will be rendered right to left. (Render direction affects SVG layering, not x position.)
+ # If false set, stacked items will be rendered left to right. If true set, stacked items will be rendered right to left. (Render direction affects SVG layering, not x position). Default: False
reverse_stack_order: Var[bool]
# Valid children components
@@ -270,16 +270,16 @@ class PieChart(ChartBase):
]
# The customized event handler of mousedown on the sectors in this group
- on_mouse_down: EventHandler[lambda: []]
+ on_mouse_down: EventHandler[empty_event]
# The customized event handler of mouseup on the sectors in this group
- on_mouse_up: EventHandler[lambda: []]
+ on_mouse_up: EventHandler[empty_event]
# The customized event handler of mouseover on the sectors in this group
- on_mouse_over: EventHandler[lambda: []]
+ on_mouse_over: EventHandler[empty_event]
# The customized event handler of mouseout on the sectors in this group
- on_mouse_out: EventHandler[lambda: []]
+ on_mouse_out: EventHandler[empty_event]
class RadarChart(ChartBase):
@@ -292,25 +292,25 @@ class RadarChart(ChartBase):
# The source data, in which each element is an object.
data: Var[List[Dict[str, Any]]]
- # The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
+ # The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}. Default: {"top": 0, "right": 0, "left": 0, "bottom": 0}
margin: Var[Dict[str, Any]]
- # The The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of width. Number | Percentage
+ # The The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of width. Number | Percentage. Default: "50%"
cx: Var[Union[int, str]]
- # The The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of height. Number | Percentage
+ # The The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of height. Number | Percentage. Default: "50%"
cy: Var[Union[int, str]]
- # The angle of first radial direction line.
+ # The angle of first radial direction line. Default: 90
start_angle: Var[int]
- # The angle of last point in the circle which should be startAngle - 360 or startAngle + 360. We'll calculate the direction of chart by 'startAngle' and 'endAngle'.
+ # The angle of last point in the circle which should be startAngle - 360 or startAngle + 360. We'll calculate the direction of chart by 'startAngle' and 'endAngle'. Default: -270
end_angle: Var[int]
- # The inner radius of first circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage
+ # The inner radius of first circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage. Default: 0
inner_radius: Var[Union[int, str]]
- # The outer radius of last circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage
+ # The outer radius of last circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage. Default: "80%"
outer_radius: Var[Union[int, str]]
# Valid children components
@@ -346,31 +346,31 @@ class RadialBarChart(ChartBase):
# The source data which each element is an object.
data: Var[List[Dict[str, Any]]]
- # The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
+ # The sizes of whitespace around the chart. Default: {"top": 5, "right": 5, "left": 5 "bottom": 5}
margin: Var[Dict[str, Any]]
- # The The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of width. Number | Percentage
+ # The The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of width. Number | Percentage. Default: "50%"
cx: Var[Union[int, str]]
- # The The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of height. Number | Percentage
+ # The The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of height. Number | Percentage. Default: "50%"
cy: Var[Union[int, str]]
- # The angle of first radial direction line.
+ # The angle of first radial direction line. Default: 0
start_angle: Var[int]
- # The angle of last point in the circle which should be startAngle - 360 or startAngle + 360. We'll calculate the direction of chart by 'startAngle' and 'endAngle'.
+ # The angle of last point in the circle which should be startAngle - 360 or startAngle + 360. We'll calculate the direction of chart by 'startAngle' and 'endAngle'. Default: 360
end_angle: Var[int]
- # The inner radius of first circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage
+ # The inner radius of first circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage. Default: "30%"
inner_radius: Var[Union[int, str]]
- # The outer radius of last circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage
+ # The outer radius of last circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage. Default: "100%"
outer_radius: Var[Union[int, str]]
- # The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number
+ # The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number. Default: "10%"
bar_category_gap: Var[Union[int, str]]
- # The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number
+ # The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number. Default: 4
bar_gap: Var[str]
# The size of each bar. If the barSize is not specified, the size of bar will be calculated by the barCategoryGap, barGap and the quantity of bar groups.
@@ -394,7 +394,7 @@ class ScatterChart(ChartBase):
alias = "RechartsScatterChart"
- # The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
+ # The sizes of whitespace around the chart. Default: {"top": 5, "right": 5, "bottom": 5, "left": 5}
margin: Var[Dict[str, Any]]
# Valid children components
@@ -437,10 +437,10 @@ class FunnelChart(ChartBase):
alias = "RechartsFunnelChart"
- # The layout of bars in the chart. centeric
+ # The layout of bars in the chart. Default: "centric"
layout: Var[str]
- # The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
+ # The sizes of whitespace around the chart. Default: {"top": 5, "right": 5, "bottom": 5, "left": 5}
margin: Var[Dict[str, Any]]
# The stroke color of each bar. String | Object
@@ -457,38 +457,41 @@ class Treemap(RechartsCharts):
alias = "RechartsTreemap"
- # The width of chart container. String or Integer
+ # The width of chart container. String or Integer. Default: "100%"
width: Var[Union[str, int]] = "100%" # type: ignore
- # The height of chart container.
+ # The height of chart container. String or Integer. Default: "100%"
height: Var[Union[str, int]] = "100%" # type: ignore
# data of treemap. Array
data: Var[List[Dict[str, Any]]]
- # The key of a group of data which should be unique in a treemap. String | Number | Function
+ # The key of a group of data which should be unique in a treemap. String | Number. Default: "value"
data_key: Var[Union[str, int]]
+ # The key of each sector's name. String. Default: "name"
+ name_key: Var[str]
+
# The treemap will try to keep every single rectangle's aspect ratio near the aspectRatio given. Number
aspect_ratio: Var[int]
- # If set false, animation of area will be disabled.
+ # If set false, animation of area will be disabled. Default: True
is_animation_active: Var[bool]
- # Specifies when the animation should begin, the unit of this option is ms.
+ # Specifies when the animation should begin, the unit of this option is ms. Default: 0
animation_begin: Var[int]
- # Specifies the duration of animation, the unit of this option is ms.
+ # Specifies the duration of animation, the unit of this option is ms. Default: 1500
animation_duration: Var[int]
- # The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'
+ # The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'. Default: "ease"
animation_easing: Var[LiteralAnimationEasing]
# The customized event handler of animation start
- on_animation_start: EventHandler[lambda: []]
+ on_animation_start: EventHandler[empty_event]
# The customized event handler of animation end
- on_animation_end: EventHandler[lambda: []]
+ on_animation_end: EventHandler[empty_event]
@classmethod
def create(cls, *children, **props) -> Component:
diff --git a/reflex/components/recharts/charts.pyi b/reflex/components/recharts/charts.pyi
index 2d5036656b..cda2c0f04e 100644
--- a/reflex/components/recharts/charts.pyi
+++ b/reflex/components/recharts/charts.pyi
@@ -160,8 +160,8 @@ class CategoricalChartBase(ChartBase):
data: The source data, in which each element is an object.
margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
sync_id: If any two categorical charts(rx.line_chart, rx.area_chart, rx.bar_chart, rx.composed_chart) have the same sync_id, these two charts can sync the position GraphingTooltip, and the start_index, end_index of Brush.
- sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function
- layout: The layout of area in the chart. 'horizontal' | 'vertical'
+ sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function. Default: "index"
+ layout: The layout of area in the chart. 'horizontal' | 'vertical'. Default: "horizontal"
stack_offset: The type of offset function used to generate the lower and upper values in the series array. The four types are built-in offsets in d3-shape. 'expand' | 'none' | 'wiggle' | 'silhouette'
width: The width of chart container. String or Integer
height: The height of chart container.
@@ -258,12 +258,12 @@ class AreaChart(CategoricalChartBase):
Args:
*children: The children of the chart component.
- base_value: The base value of area. Number | 'dataMin' | 'dataMax' | 'auto'
+ base_value: The base value of area. Number | 'dataMin' | 'dataMax' | 'auto'. Default: "auto"
data: The source data, in which each element is an object.
margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
sync_id: If any two categorical charts(rx.line_chart, rx.area_chart, rx.bar_chart, rx.composed_chart) have the same sync_id, these two charts can sync the position GraphingTooltip, and the start_index, end_index of Brush.
- sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function
- layout: The layout of area in the chart. 'horizontal' | 'vertical'
+ sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function. Default: "index"
+ layout: The layout of area in the chart. 'horizontal' | 'vertical'. Default: "horizontal"
stack_offset: The type of offset function used to generate the lower and upper values in the series array. The four types are built-in offsets in d3-shape. 'expand' | 'none' | 'wiggle' | 'silhouette'
width: The width of chart container. String or Integer
height: The height of chart container.
@@ -358,17 +358,17 @@ class BarChart(CategoricalChartBase):
Args:
*children: The children of the chart component.
- bar_category_gap: The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number
- bar_gap: The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number
+ bar_category_gap: The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number. Default: "10%"
+ bar_gap: The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number. Default: 4
bar_size: The width of all the bars in the chart. Number
max_bar_size: The maximum width of all the bars in a horizontal BarChart, or maximum height in a vertical BarChart.
stack_offset: The type of offset function used to generate the lower and upper values in the series array. The four types are built-in offsets in d3-shape. 'expand' | 'none' | 'wiggle' | 'silhouette'
- reverse_stack_order: If false set, stacked items will be rendered left to right. If true set, stacked items will be rendered right to left. (Render direction affects SVG layering, not x position.)
+ reverse_stack_order: If false set, stacked items will be rendered left to right. If true set, stacked items will be rendered right to left. (Render direction affects SVG layering, not x position.) Default: False
data: The source data, in which each element is an object.
margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
sync_id: If any two categorical charts(rx.line_chart, rx.area_chart, rx.bar_chart, rx.composed_chart) have the same sync_id, these two charts can sync the position GraphingTooltip, and the start_index, end_index of Brush.
- sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function
- layout: The layout of area in the chart. 'horizontal' | 'vertical'
+ sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function. Default: "index"
+ layout: The layout of area in the chart. 'horizontal' | 'vertical'. Default: "horizontal"
width: The width of chart container. String or Integer
height: The height of chart container.
style: The style of the component.
@@ -460,8 +460,8 @@ class LineChart(CategoricalChartBase):
data: The source data, in which each element is an object.
margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
sync_id: If any two categorical charts(rx.line_chart, rx.area_chart, rx.bar_chart, rx.composed_chart) have the same sync_id, these two charts can sync the position GraphingTooltip, and the start_index, end_index of Brush.
- sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function
- layout: The layout of area in the chart. 'horizontal' | 'vertical'
+ sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function. Default: "index"
+ layout: The layout of area in the chart. 'horizontal' | 'vertical'. Default: "horizontal"
stack_offset: The type of offset function used to generate the lower and upper values in the series array. The four types are built-in offsets in d3-shape. 'expand' | 'none' | 'wiggle' | 'silhouette'
width: The width of chart container. String or Integer
height: The height of chart container.
@@ -492,7 +492,7 @@ class ComposedChart(CategoricalChartBase):
]
] = None,
bar_category_gap: Optional[Union[Var[Union[int, str]], int, str]] = None,
- bar_gap: Optional[Union[Var[Union[int, str]], int, str]] = None,
+ bar_gap: Optional[Union[Var[int], int]] = None,
bar_size: Optional[Union[Var[int], int]] = None,
reverse_stack_order: Optional[Union[Var[bool], bool]] = None,
data: Optional[Union[List[Dict[str, Any]], Var[List[Dict[str, Any]]]]] = None,
@@ -562,16 +562,16 @@ class ComposedChart(CategoricalChartBase):
Args:
*children: The children of the chart component.
- base_value: The base value of area. Number | 'dataMin' | 'dataMax' | 'auto'
- bar_category_gap: The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number
- bar_gap: The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number
- bar_size: The width of all the bars in the chart. Number
- reverse_stack_order: If false set, stacked items will be rendered left to right. If true set, stacked items will be rendered right to left. (Render direction affects SVG layering, not x position.)
+ base_value: The base value of area. Number | 'dataMin' | 'dataMax' | 'auto'. Default: "auto"
+ bar_category_gap: The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number. Default: "10%"
+ bar_gap: The gap between two bars in the same category. Default: 4
+ bar_size: The width or height of each bar. If the barSize is not specified, the size of the bar will be calculated by the barCategoryGap, barGap and the quantity of bar groups.
+ reverse_stack_order: If false set, stacked items will be rendered left to right. If true set, stacked items will be rendered right to left. (Render direction affects SVG layering, not x position). Default: False
data: The source data, in which each element is an object.
margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
sync_id: If any two categorical charts(rx.line_chart, rx.area_chart, rx.bar_chart, rx.composed_chart) have the same sync_id, these two charts can sync the position GraphingTooltip, and the start_index, end_index of Brush.
- sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function
- layout: The layout of area in the chart. 'horizontal' | 'vertical'
+ sync_method: When sync_id is provided, allows customisation of how the charts will synchronize GraphingTooltips and brushes. Using 'index' (default setting), other charts will reuse current datum's index within the data array. In cases where data does not have the same length, this might yield unexpected results. In that case use 'value' which will try to match other charts values, or a fully custom function which will receive tick, data as argument and should return an index. 'index' | 'value' | function. Default: "index"
+ layout: The layout of area in the chart. 'horizontal' | 'vertical'. Default: "horizontal"
stack_offset: The type of offset function used to generate the lower and upper values in the series array. The four types are built-in offsets in d3-shape. 'expand' | 'none' | 'wiggle' | 'silhouette'
width: The width of chart container. String or Integer
height: The height of chart container.
@@ -697,13 +697,13 @@ class RadarChart(ChartBase):
Args:
*children: The children of the chart component.
data: The source data, in which each element is an object.
- margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
- cx: The The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of width. Number | Percentage
- cy: The The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of height. Number | Percentage
- start_angle: The angle of first radial direction line.
- end_angle: The angle of last point in the circle which should be startAngle - 360 or startAngle + 360. We'll calculate the direction of chart by 'startAngle' and 'endAngle'.
- inner_radius: The inner radius of first circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage
- outer_radius: The outer radius of last circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage
+ margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}. Default: {"top": 0, "right": 0, "left": 0, "bottom": 0}
+ cx: The The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of width. Number | Percentage. Default: "50%"
+ cy: The The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of height. Number | Percentage. Default: "50%"
+ start_angle: The angle of first radial direction line. Default: 90
+ end_angle: The angle of last point in the circle which should be startAngle - 360 or startAngle + 360. We'll calculate the direction of chart by 'startAngle' and 'endAngle'. Default: -270
+ inner_radius: The inner radius of first circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage. Default: 0
+ outer_radius: The outer radius of last circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage. Default: "80%"
width: The width of chart container. String or Integer
height: The height of chart container.
style: The style of the component.
@@ -786,15 +786,15 @@ class RadialBarChart(ChartBase):
Args:
*children: The children of the chart component.
data: The source data which each element is an object.
- margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
- cx: The The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of width. Number | Percentage
- cy: The The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of height. Number | Percentage
- start_angle: The angle of first radial direction line.
- end_angle: The angle of last point in the circle which should be startAngle - 360 or startAngle + 360. We'll calculate the direction of chart by 'startAngle' and 'endAngle'.
- inner_radius: The inner radius of first circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage
- outer_radius: The outer radius of last circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage
- bar_category_gap: The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number
- bar_gap: The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number
+ margin: The sizes of whitespace around the chart. Default: {"top": 5, "right": 5, "left": 5 "bottom": 5}
+ cx: The The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of width. Number | Percentage. Default: "50%"
+ cy: The The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of height. Number | Percentage. Default: "50%"
+ start_angle: The angle of first radial direction line. Default: 0
+ end_angle: The angle of last point in the circle which should be startAngle - 360 or startAngle + 360. We'll calculate the direction of chart by 'startAngle' and 'endAngle'. Default: 360
+ inner_radius: The inner radius of first circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage. Default: "30%"
+ outer_radius: The outer radius of last circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy. Number | Percentage. Default: "100%"
+ bar_category_gap: The gap between two bar categories, which can be a percent value or a fixed value. Percentage | Number. Default: "10%"
+ bar_gap: The gap between two bars in the same category, which can be a percent value or a fixed value. Percentage | Number. Default: 4
bar_size: The size of each bar. If the barSize is not specified, the size of bar will be calculated by the barCategoryGap, barGap and the quantity of bar groups.
width: The width of chart container. String or Integer
height: The height of chart container.
@@ -855,7 +855,7 @@ class ScatterChart(ChartBase):
Args:
*children: The children of the chart component.
- margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
+ margin: The sizes of whitespace around the chart. Default: {"top": 5, "right": 5, "bottom": 5, "left": 5}
width: The width of chart container. String or Integer
height: The height of chart container.
style: The style of the component.
@@ -929,8 +929,8 @@ class FunnelChart(ChartBase):
Args:
*children: The children of the chart component.
- layout: The layout of bars in the chart. centeric
- margin: The sizes of whitespace around the chart, i.e. {"top": 50, "right": 30, "left": 20, "bottom": 5}.
+ layout: The layout of bars in the chart. Default: "centric"
+ margin: The sizes of whitespace around the chart. Default: {"top": 5, "right": 5, "bottom": 5, "left": 5}
stroke: The stroke color of each bar. String | Object
width: The width of chart container. String or Integer
height: The height of chart container.
@@ -957,6 +957,7 @@ class Treemap(RechartsCharts):
height: Optional[Union[Var[Union[int, str]], int, str]] = None,
data: Optional[Union[List[Dict[str, Any]], Var[List[Dict[str, Any]]]]] = None,
data_key: Optional[Union[Var[Union[int, str]], int, str]] = None,
+ name_key: Optional[Union[Var[str], str]] = None,
aspect_ratio: Optional[Union[Var[int], int]] = None,
is_animation_active: Optional[Union[Var[bool], bool]] = None,
animation_begin: Optional[Union[Var[int], int]] = None,
@@ -1020,15 +1021,16 @@ class Treemap(RechartsCharts):
Args:
*children: The children of the chart component.
- width: The width of chart container. String or Integer
- height: The height of chart container.
+ width: The width of chart container. String or Integer. Default: "100%"
+ height: The height of chart container. String or Integer. Default: "100%"
data: data of treemap. Array
- data_key: The key of a group of data which should be unique in a treemap. String | Number | Function
+ data_key: The key of a group of data which should be unique in a treemap. String | Number. Default: "value"
+ name_key: The key of each sector's name. String. Default: "name"
aspect_ratio: The treemap will try to keep every single rectangle's aspect ratio near the aspectRatio given. Number
- is_animation_active: If set false, animation of area will be disabled.
- animation_begin: Specifies when the animation should begin, the unit of this option is ms.
- animation_duration: Specifies the duration of animation, the unit of this option is ms.
- animation_easing: The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'
+ is_animation_active: If set false, animation of area will be disabled. Default: True
+ animation_begin: Specifies when the animation should begin, the unit of this option is ms. Default: 0
+ animation_duration: Specifies the duration of animation, the unit of this option is ms. Default: 1500
+ animation_easing: The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'. Default: "ease"
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
diff --git a/reflex/components/recharts/general.py b/reflex/components/recharts/general.py
index cc252de57d..641e1562ae 100644
--- a/reflex/components/recharts/general.py
+++ b/reflex/components/recharts/general.py
@@ -6,7 +6,7 @@
from reflex.components.component import MemoizationLeaf
from reflex.constants.colors import Color
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event
from reflex.vars.base import LiteralVar, Var
from .recharts import (
@@ -30,21 +30,24 @@ class ResponsiveContainer(Recharts, MemoizationLeaf):
# The aspect ratio of the container. The final aspect ratio of the SVG element will be (width / height) * aspect. Number
aspect: Var[int]
- # The width of chart container. Can be a number or string
+ # The width of chart container. Can be a number or string. Default: "100%"
width: Var[Union[int, str]]
- # The height of chart container. Number
+ # The height of chart container. Can be a number or string. Default: "100%"
height: Var[Union[int, str]]
- # The minimum width of chart container.
+ # The minimum width of chart container. Number
min_width: Var[int]
# The minimum height of chart container. Number
min_height: Var[int]
- # If specified a positive number, debounced function will be used to handle the resize event.
+ # If specified a positive number, debounced function will be used to handle the resize event. Default: 0
debounce: Var[int]
+ # If specified provides a callback providing the updated chart width and height values.
+ on_resize: EventHandler[empty_event]
+
# Valid children components
_valid_children: List[str] = [
"AreaChart",
@@ -73,21 +76,24 @@ class Legend(Recharts):
# The height of legend container. Number
height: Var[int]
- # The layout of legend items. 'horizontal' | 'vertical'
+ # The layout of legend items. 'horizontal' | 'vertical'. Default: "horizontal"
layout: Var[LiteralLayout]
- # The alignment of legend items in 'horizontal' direction, which can be 'left', 'center', 'right'.
+ # The alignment of legend items in 'horizontal' direction, which can be 'left', 'center', 'right'. Default: "center"
align: Var[LiteralLegendAlign]
- # The alignment of legend items in 'vertical' direction, which can be 'top', 'middle', 'bottom'.
+ # The alignment of legend items in 'vertical' direction, which can be 'top', 'middle', 'bottom'. Default: "bottom"
vertical_align: Var[LiteralVerticalAlign]
- # The size of icon in each legend item.
+ # The size of icon in each legend item. Default: 14
icon_size: Var[int]
# The type of icon in each legend item. 'line' | 'plainline' | 'square' | 'rect' | 'circle' | 'cross' | 'diamond' | 'star' | 'triangle' | 'wye'
icon_type: Var[LiteralIconType]
+ # The source data of the content to be displayed in the legend, usually calculated internally. Default: []
+ payload: Var[List[Dict[str, Any]]]
+
# The width of chart container, usually calculated internally.
chart_width: Var[int]
@@ -98,28 +104,28 @@ class Legend(Recharts):
margin: Var[Dict[str, Any]]
# The customized event handler of click on the items in this group
- on_click: EventHandler[lambda: []]
+ on_click: EventHandler[empty_event]
# The customized event handler of mousedown on the items in this group
- on_mouse_down: EventHandler[lambda: []]
+ on_mouse_down: EventHandler[empty_event]
# The customized event handler of mouseup on the items in this group
- on_mouse_up: EventHandler[lambda: []]
+ on_mouse_up: EventHandler[empty_event]
# The customized event handler of mousemove on the items in this group
- on_mouse_move: EventHandler[lambda: []]
+ on_mouse_move: EventHandler[empty_event]
# The customized event handler of mouseover on the items in this group
- on_mouse_over: EventHandler[lambda: []]
+ on_mouse_over: EventHandler[empty_event]
# The customized event handler of mouseout on the items in this group
- on_mouse_out: EventHandler[lambda: []]
+ on_mouse_out: EventHandler[empty_event]
# The customized event handler of mouseenter on the items in this group
- on_mouse_enter: EventHandler[lambda: []]
+ on_mouse_enter: EventHandler[empty_event]
# The customized event handler of mouseleave on the items in this group
- on_mouse_leave: EventHandler[lambda: []]
+ on_mouse_leave: EventHandler[empty_event]
class GraphingTooltip(Recharts):
@@ -224,16 +230,16 @@ class LabelList(Recharts):
# The key of a group of label values in data.
data_key: Var[Union[str, int]]
- # The position of each label relative to it view box。"Top" | "left" | "right" | "bottom" | "inside" | "outside" | "insideLeft" | "insideRight" | "insideTop" | "insideBottom" | "insideTopLeft" | "insideBottomLeft" | "insideTopRight" | "insideBottomRight" | "insideStart" | "insideEnd" | "end" | "center"
+ # The position of each label relative to it view box. "Top" | "left" | "right" | "bottom" | "inside" | "outside" | "insideLeft" | "insideRight" | "insideTop" | "insideBottom" | "insideTopLeft" | "insideBottomLeft" | "insideTopRight" | "insideBottomRight" | "insideStart" | "insideEnd" | "end" | "center"
position: Var[LiteralPosition]
- # The offset to the specified "position"
+ # The offset to the specified "position". Default: 5
offset: Var[int]
- # The fill color of each label
+ # The fill color of each label. Default: rx.color("gray", 10)
fill: Var[Union[str, Color]] = LiteralVar.create(Color("gray", 10))
- # The stroke color of each label
+ # The stroke color of each label. Default: "none"
stroke: Var[Union[str, Color]] = LiteralVar.create("none")
diff --git a/reflex/components/recharts/general.pyi b/reflex/components/recharts/general.pyi
index 0e21c8b857..9aa88a2d30 100644
--- a/reflex/components/recharts/general.pyi
+++ b/reflex/components/recharts/general.pyi
@@ -3,7 +3,7 @@
# ------------------- DO NOT EDIT ----------------------
# This file was generated by `reflex/utils/pyi_generator.py`!
# ------------------------------------------------------
-from typing import Any, Callable, Dict, Literal, Optional, Union, overload
+from typing import Any, Callable, Dict, List, Literal, Optional, Union, overload
from reflex.components.component import MemoizationLeaf
from reflex.constants.colors import Color
@@ -64,6 +64,7 @@ class ResponsiveContainer(Recharts, MemoizationLeaf):
on_mouse_up: Optional[
Union[EventHandler, EventSpec, list, Callable, Var]
] = None,
+ on_resize: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
on_scroll: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
on_unmount: Optional[
Union[EventHandler, EventSpec, list, Callable, Var]
@@ -75,11 +76,11 @@ class ResponsiveContainer(Recharts, MemoizationLeaf):
Args:
*children: The children of the component.
aspect: The aspect ratio of the container. The final aspect ratio of the SVG element will be (width / height) * aspect. Number
- width: The width of chart container. Can be a number or string
- height: The height of chart container. Number
- min_width: The minimum width of chart container.
+ width: The width of chart container. Can be a number or string. Default: "100%"
+ height: The height of chart container. Can be a number or string. Default: "100%"
+ min_width: The minimum width of chart container. Number
min_height: The minimum height of chart container. Number
- debounce: If specified a positive number, debounced function will be used to handle the resize event.
+ debounce: If specified a positive number, debounced function will be used to handle the resize event. Default: 0
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -150,6 +151,9 @@ class Legend(Recharts):
],
]
] = None,
+ payload: Optional[
+ Union[List[Dict[str, Any]], Var[List[Dict[str, Any]]]]
+ ] = None,
chart_width: Optional[Union[Var[int], int]] = None,
chart_height: Optional[Union[Var[int], int]] = None,
margin: Optional[Union[Dict[str, Any], Var[Dict[str, Any]]]] = None,
@@ -202,11 +206,12 @@ class Legend(Recharts):
*children: The children of the component.
width: The width of legend container. Number
height: The height of legend container. Number
- layout: The layout of legend items. 'horizontal' | 'vertical'
- align: The alignment of legend items in 'horizontal' direction, which can be 'left', 'center', 'right'.
- vertical_align: The alignment of legend items in 'vertical' direction, which can be 'top', 'middle', 'bottom'.
- icon_size: The size of icon in each legend item.
+ layout: The layout of legend items. 'horizontal' | 'vertical'. Default: "horizontal"
+ align: The alignment of legend items in 'horizontal' direction, which can be 'left', 'center', 'right'. Default: "center"
+ vertical_align: The alignment of legend items in 'vertical' direction, which can be 'top', 'middle', 'bottom'. Default: "bottom"
+ icon_size: The size of icon in each legend item. Default: 14
icon_type: The type of icon in each legend item. 'line' | 'plainline' | 'square' | 'rect' | 'circle' | 'cross' | 'diamond' | 'star' | 'triangle' | 'wye'
+ payload: The source data of the content to be displayed in the legend, usually calculated internally. Default: []
chart_width: The width of chart container, usually calculated internally.
chart_height: The height of chart container, usually calculated internally.
margin: The margin of chart container, usually calculated internally.
@@ -553,10 +558,10 @@ class LabelList(Recharts):
Args:
*children: The children of the component.
data_key: The key of a group of label values in data.
- position: The position of each label relative to it view box。"Top" | "left" | "right" | "bottom" | "inside" | "outside" | "insideLeft" | "insideRight" | "insideTop" | "insideBottom" | "insideTopLeft" | "insideBottomLeft" | "insideTopRight" | "insideBottomRight" | "insideStart" | "insideEnd" | "end" | "center"
- offset: The offset to the specified "position"
- fill: The fill color of each label
- stroke: The stroke color of each label
+ position: The position of each label relative to it view box. "Top" | "left" | "right" | "bottom" | "inside" | "outside" | "insideLeft" | "insideRight" | "insideTop" | "insideBottom" | "insideTopLeft" | "insideBottomLeft" | "insideTopRight" | "insideBottomRight" | "insideStart" | "insideEnd" | "end" | "center"
+ offset: The offset to the specified "position". Default: 5
+ fill: The fill color of each label. Default: rx.color("gray", 10)
+ stroke: The stroke color of each label. Default: "none"
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
diff --git a/reflex/components/recharts/polar.py b/reflex/components/recharts/polar.py
index adeb0eb910..828000447c 100644
--- a/reflex/components/recharts/polar.py
+++ b/reflex/components/recharts/polar.py
@@ -6,7 +6,7 @@
from reflex.constants import EventTriggers
from reflex.constants.colors import Color
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event
from reflex.vars.base import LiteralVar, Var
from .recharts import (
@@ -106,36 +106,50 @@ class Radar(Recharts):
# The coordinates of all the vertexes of the radar shape, like [{ x, y }].
points: Var[List[Dict[str, Any]]]
- # If false set, dots will not be drawn
+ # If false set, dots will not be drawn. Default: True
dot: Var[bool]
- # Stoke color
+ # Stoke color. Default: rx.color("accent", 9)
stroke: Var[Union[str, Color]] = LiteralVar.create(Color("accent", 9))
- # Fill color
+ # Fill color. Default: rx.color("accent", 3)
fill: Var[str] = LiteralVar.create(Color("accent", 3))
- # opacity
+ # opacity. Default: 0.6
fill_opacity: Var[float] = LiteralVar.create(0.6)
- # The type of icon in legend. If set to 'none', no legend item will be rendered.
- legend_type: Var[str]
+ # The type of icon in legend. If set to 'none', no legend item will be rendered. Default: "rect"
+ legend_type: Var[LiteralLegendType]
- # If false set, labels will not be drawn
+ # If false set, labels will not be drawn. Default: True
label: Var[bool]
- # Specifies when the animation should begin, the unit of this option is ms.
+ # If set false, animation of polygon will be disabled. Default: True in CSR, and False in SSR
+ is_animation_active: Var[bool]
+
+ # Specifies when the animation should begin, the unit of this option is ms. Default: 0
animation_begin: Var[int]
- # Specifies the duration of animation, the unit of this option is ms.
+ # Specifies the duration of animation, the unit of this option is ms. Default: 1500
animation_duration: Var[int]
- # The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'
+ # The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'. Default: "ease"
animation_easing: Var[LiteralAnimationEasing]
# Valid children components
_valid_children: List[str] = ["LabelList"]
+ def get_event_triggers(self) -> dict[str, Union[Var, Any]]:
+ """Get the event triggers that pass the component's value to the handler.
+
+ Returns:
+ A dict mapping the event trigger to the var that is passed to the handler.
+ """
+ return {
+ EventTriggers.ON_ANIMATION_START: lambda: [],
+ EventTriggers.ON_ANIMATION_END: lambda: [],
+ }
+
class RadialBar(Recharts):
"""A RadialBar chart component in Recharts."""
@@ -211,56 +225,56 @@ class PolarAngleAxis(Recharts):
# The outer radius of circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy.
radius: Var[Union[int, str]]
- # If false set, axis line will not be drawn. If true set, axis line will be drawn which have the props calculated internally. If object set, axis line will be drawn which have the props mergered by the internal calculated props and the option.
+ # If false set, axis line will not be drawn. If true set, axis line will be drawn which have the props calculated internally. If object set, axis line will be drawn which have the props mergered by the internal calculated props and the option. Default: True
axis_line: Var[Union[bool, Dict[str, Any]]]
- # The type of axis line.
- axis_line_type: Var[str]
+ # The type of axis line. Default: "polygon"
+ axis_line_type: Var[LiteralGridType]
- # If false set, tick lines will not be drawn. If true set, tick lines will be drawn which have the props calculated internally. If object set, tick lines will be drawn which have the props mergered by the internal calculated props and the option.
+ # If false set, tick lines will not be drawn. If true set, tick lines will be drawn which have the props calculated internally. If object set, tick lines will be drawn which have the props mergered by the internal calculated props and the option. Default: False
tick_line: Var[Union[bool, Dict[str, Any]]] = LiteralVar.create(False)
- # The width or height of tick.
- tick: Var[Union[int, str]]
+ # If false set, ticks will not be drawn. If true set, ticks will be drawn which have the props calculated internally. If object set, ticks will be drawn which have the props mergered by the internal calculated props and the option. Default: True
+ tick: Var[Union[bool, Dict[str, Any]]]
# The array of every tick's value and angle.
ticks: Var[List[Dict[str, Any]]]
- # The orientation of axis text.
- orient: Var[str]
+ # The orientation of axis text. Default: "outer"
+ orientation: Var[str]
- # The stroke color of axis
+ # The stroke color of axis. Default: rx.color("gray", 10)
stroke: Var[Union[str, Color]] = LiteralVar.create(Color("gray", 10))
- # Allow the axis has duplicated categorys or not when the type of axis is "category".
+ # Allow the axis has duplicated categorys or not when the type of axis is "category". Default: True
allow_duplicated_category: Var[bool]
# Valid children components.
_valid_children: List[str] = ["Label"]
# The customized event handler of click on the ticks of this axis.
- on_click: EventHandler[lambda: []]
+ on_click: EventHandler[empty_event]
# The customized event handler of mousedown on the the ticks of this axis.
- on_mouse_down: EventHandler[lambda: []]
+ on_mouse_down: EventHandler[empty_event]
# The customized event handler of mouseup on the ticks of this axis.
- on_mouse_up: EventHandler[lambda: []]
+ on_mouse_up: EventHandler[empty_event]
# The customized event handler of mousemove on the ticks of this axis.
- on_mouse_move: EventHandler[lambda: []]
+ on_mouse_move: EventHandler[empty_event]
# The customized event handler of mouseover on the ticks of this axis.
- on_mouse_over: EventHandler[lambda: []]
+ on_mouse_over: EventHandler[empty_event]
# The customized event handler of mouseout on the ticks of this axis.
- on_mouse_out: EventHandler[lambda: []]
+ on_mouse_out: EventHandler[empty_event]
# The customized event handler of moustenter on the ticks of this axis.
- on_mouse_enter: EventHandler[lambda: []]
+ on_mouse_enter: EventHandler[empty_event]
# The customized event handler of mouseleave on the ticks of this axis.
- on_mouse_leave: EventHandler[lambda: []]
+ on_mouse_leave: EventHandler[empty_event]
class PolarGrid(Recharts):
@@ -270,17 +284,17 @@ class PolarGrid(Recharts):
alias = "RechartsPolarGrid"
- # The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of container width.
- cx: Var[Union[int, str]]
+ # The x-coordinate of center.
+ cx: Var[int]
- # The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of container height.
- cy: Var[Union[int, str]]
+ # The y-coordinate of center.
+ cy: Var[int]
# The radius of the inner polar grid.
- inner_radius: Var[Union[int, str]]
+ inner_radius: Var[int]
# The radius of the outer polar grid.
- outer_radius: Var[Union[int, str]]
+ outer_radius: Var[int]
# The array of every line grid's angle.
polar_angles: Var[List[int]]
@@ -288,10 +302,10 @@ class PolarGrid(Recharts):
# The array of every line grid's radius.
polar_radius: Var[List[int]]
- # The type of polar grids. 'polygon' | 'circle'
+ # The type of polar grids. 'polygon' | 'circle'. Default: "polygon"
grid_type: Var[LiteralGridType]
- # The stroke color of grid
+ # The stroke color of grid. Default: rx.color("gray", 10)
stroke: Var[Union[str, Color]] = LiteralVar.create(Color("gray", 10))
# Valid children components
diff --git a/reflex/components/recharts/polar.pyi b/reflex/components/recharts/polar.pyi
index 9d793f3dae..32e7e5b76e 100644
--- a/reflex/components/recharts/polar.pyi
+++ b/reflex/components/recharts/polar.pyi
@@ -126,6 +126,7 @@ class Pie(Recharts):
...
class Radar(Recharts):
+ def get_event_triggers(self) -> dict[str, Union[Var, Any]]: ...
@overload
@classmethod
def create( # type: ignore
@@ -137,8 +138,40 @@ class Radar(Recharts):
stroke: Optional[Union[Color, Var[Union[Color, str]], str]] = None,
fill: Optional[Union[Var[str], str]] = None,
fill_opacity: Optional[Union[Var[float], float]] = None,
- legend_type: Optional[Union[Var[str], str]] = None,
+ legend_type: Optional[
+ Union[
+ Literal[
+ "circle",
+ "cross",
+ "diamond",
+ "line",
+ "none",
+ "plainline",
+ "rect",
+ "square",
+ "star",
+ "triangle",
+ "wye",
+ ],
+ Var[
+ Literal[
+ "circle",
+ "cross",
+ "diamond",
+ "line",
+ "none",
+ "plainline",
+ "rect",
+ "square",
+ "star",
+ "triangle",
+ "wye",
+ ]
+ ],
+ ]
+ ] = None,
label: Optional[Union[Var[bool], bool]] = None,
+ is_animation_active: Optional[Union[Var[bool], bool]] = None,
animation_begin: Optional[Union[Var[int], int]] = None,
animation_duration: Optional[Union[Var[int], int]] = None,
animation_easing: Optional[
@@ -153,39 +186,10 @@ class Radar(Recharts):
class_name: Optional[Any] = None,
autofocus: Optional[bool] = None,
custom_attrs: Optional[Dict[str, Union[Var, str]]] = None,
- on_blur: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
- on_click: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
- on_context_menu: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_double_click: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_focus: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
- on_mount: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
- on_mouse_down: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_mouse_enter: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_mouse_leave: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_mouse_move: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_mouse_out: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_mouse_over: Optional[
- Union[EventHandler, EventSpec, list, Callable, Var]
- ] = None,
- on_mouse_up: Optional[
+ on_animation_end: Optional[
Union[EventHandler, EventSpec, list, Callable, Var]
] = None,
- on_scroll: Optional[Union[EventHandler, EventSpec, list, Callable, Var]] = None,
- on_unmount: Optional[
+ on_animation_start: Optional[
Union[EventHandler, EventSpec, list, Callable, Var]
] = None,
**props,
@@ -196,15 +200,16 @@ class Radar(Recharts):
*children: The children of the component.
data_key: The key of a group of data which should be unique in a radar chart.
points: The coordinates of all the vertexes of the radar shape, like [{ x, y }].
- dot: If false set, dots will not be drawn
- stroke: Stoke color
- fill: Fill color
- fill_opacity: opacity
- legend_type: The type of icon in legend. If set to 'none', no legend item will be rendered.
- label: If false set, labels will not be drawn
- animation_begin: Specifies when the animation should begin, the unit of this option is ms.
- animation_duration: Specifies the duration of animation, the unit of this option is ms.
- animation_easing: The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'
+ dot: If false set, dots will not be drawn. Default: True
+ stroke: Stoke color. Default: rx.color("accent", 9)
+ fill: Fill color. Default: rx.color("accent", 3)
+ fill_opacity: opacity. Default: 0.6
+ legend_type: The type of icon in legend. If set to 'none', no legend item will be rendered. Default: "rect"
+ label: If false set, labels will not be drawn. Default: True
+ is_animation_active: If set false, animation of polygon will be disabled. Default: True in CSR, and False in SSR
+ animation_begin: Specifies when the animation should begin, the unit of this option is ms. Default: 0
+ animation_duration: Specifies the duration of animation, the unit of this option is ms. Default: 1500
+ animation_easing: The type of easing function. 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear'. Default: "ease"
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -312,13 +317,17 @@ class PolarAngleAxis(Recharts):
axis_line: Optional[
Union[Dict[str, Any], Var[Union[Dict[str, Any], bool]], bool]
] = None,
- axis_line_type: Optional[Union[Var[str], str]] = None,
+ axis_line_type: Optional[
+ Union[Literal["circle", "polygon"], Var[Literal["circle", "polygon"]]]
+ ] = None,
tick_line: Optional[
Union[Dict[str, Any], Var[Union[Dict[str, Any], bool]], bool]
] = None,
- tick: Optional[Union[Var[Union[int, str]], int, str]] = None,
+ tick: Optional[
+ Union[Dict[str, Any], Var[Union[Dict[str, Any], bool]], bool]
+ ] = None,
ticks: Optional[Union[List[Dict[str, Any]], Var[List[Dict[str, Any]]]]] = None,
- orient: Optional[Union[Var[str], str]] = None,
+ orientation: Optional[Union[Var[str], str]] = None,
stroke: Optional[Union[Color, Var[Union[Color, str]], str]] = None,
allow_duplicated_category: Optional[Union[Var[bool], bool]] = None,
style: Optional[Style] = None,
@@ -372,14 +381,14 @@ class PolarAngleAxis(Recharts):
cx: The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of container width.
cy: The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of container height.
radius: The outer radius of circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy.
- axis_line: If false set, axis line will not be drawn. If true set, axis line will be drawn which have the props calculated internally. If object set, axis line will be drawn which have the props mergered by the internal calculated props and the option.
- axis_line_type: The type of axis line.
- tick_line: If false set, tick lines will not be drawn. If true set, tick lines will be drawn which have the props calculated internally. If object set, tick lines will be drawn which have the props mergered by the internal calculated props and the option.
- tick: The width or height of tick.
+ axis_line: If false set, axis line will not be drawn. If true set, axis line will be drawn which have the props calculated internally. If object set, axis line will be drawn which have the props mergered by the internal calculated props and the option. Default: True
+ axis_line_type: The type of axis line. Default: "polygon"
+ tick_line: If false set, tick lines will not be drawn. If true set, tick lines will be drawn which have the props calculated internally. If object set, tick lines will be drawn which have the props mergered by the internal calculated props and the option. Default: False
+ tick: If false set, ticks will not be drawn. If true set, ticks will be drawn which have the props calculated internally. If object set, ticks will be drawn which have the props mergered by the internal calculated props and the option. Default: True
ticks: The array of every tick's value and angle.
- orient: The orientation of axis text.
- stroke: The stroke color of axis
- allow_duplicated_category: Allow the axis has duplicated categorys or not when the type of axis is "category".
+ orientation: The orientation of axis text. Default: "outer"
+ stroke: The stroke color of axis. Default: rx.color("gray", 10)
+ allow_duplicated_category: Allow the axis has duplicated categorys or not when the type of axis is "category". Default: True
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
@@ -399,10 +408,10 @@ class PolarGrid(Recharts):
def create( # type: ignore
cls,
*children,
- cx: Optional[Union[Var[Union[int, str]], int, str]] = None,
- cy: Optional[Union[Var[Union[int, str]], int, str]] = None,
- inner_radius: Optional[Union[Var[Union[int, str]], int, str]] = None,
- outer_radius: Optional[Union[Var[Union[int, str]], int, str]] = None,
+ cx: Optional[Union[Var[int], int]] = None,
+ cy: Optional[Union[Var[int], int]] = None,
+ inner_radius: Optional[Union[Var[int], int]] = None,
+ outer_radius: Optional[Union[Var[int], int]] = None,
polar_angles: Optional[Union[List[int], Var[List[int]]]] = None,
polar_radius: Optional[Union[List[int], Var[List[int]]]] = None,
grid_type: Optional[
@@ -456,14 +465,14 @@ class PolarGrid(Recharts):
Args:
*children: The children of the component.
- cx: The x-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of container width.
- cy: The y-coordinate of center. If set a percentage, the final value is obtained by multiplying the percentage of container height.
+ cx: The x-coordinate of center.
+ cy: The y-coordinate of center.
inner_radius: The radius of the inner polar grid.
outer_radius: The radius of the outer polar grid.
polar_angles: The array of every line grid's angle.
polar_radius: The array of every line grid's radius.
- grid_type: The type of polar grids. 'polygon' | 'circle'
- stroke: The stroke color of grid
+ grid_type: The type of polar grids. 'polygon' | 'circle'. Default: "polygon"
+ stroke: The stroke color of grid. Default: rx.color("gray", 10)
style: The style of the component.
key: A unique key for the component.
id: The id for the component.
diff --git a/reflex/custom_components/custom_components.py b/reflex/custom_components/custom_components.py
index 146bb12c22..ee24a7cd07 100644
--- a/reflex/custom_components/custom_components.py
+++ b/reflex/custom_components/custom_components.py
@@ -260,7 +260,7 @@ def _validate_library_name(library_name: str | None) -> NameVariants:
# Module name is the snake case.
module_name = "_".join(name_parts)
- custom_component_module_dir = f"reflex_{module_name}"
+ custom_component_module_dir = Path(f"reflex_{module_name}")
console.debug(f"Custom component source directory: {custom_component_module_dir}")
# Use the same name for the directory and the app.
diff --git a/reflex/event.py b/reflex/event.py
index 7384cf5bf2..d2bebaa3f3 100644
--- a/reflex/event.py
+++ b/reflex/event.py
@@ -24,7 +24,7 @@
from typing_extensions import get_args, get_origin
from reflex import constants
-from reflex.utils import format
+from reflex.utils import console, format
from reflex.utils.exceptions import EventFnArgMismatch, EventHandlerArgMismatch
from reflex.utils.types import ArgsSpec, GenericType
from reflex.vars import VarData
@@ -399,23 +399,63 @@ class EventChain(EventActionsMixin):
init=True,
frozen=True,
)
-class Target:
- """A Javascript event target."""
+class JavascriptHTMLInputElement:
+ """Interface for a Javascript HTMLInputElement https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement."""
- checked: bool = False
- value: Any = None
+ value: str = ""
@dataclasses.dataclass(
init=True,
frozen=True,
)
-class FrontendEvent:
- """A Javascript event."""
+class JavascriptInputEvent:
+ """Interface for a Javascript InputEvent https://developer.mozilla.org/en-US/docs/Web/API/InputEvent."""
+
+ target: JavascriptHTMLInputElement = JavascriptHTMLInputElement()
+
+
+@dataclasses.dataclass(
+ init=True,
+ frozen=True,
+)
+class JavasciptKeyboardEvent:
+ """Interface for a Javascript KeyboardEvent https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent."""
- target: Target = Target()
key: str = ""
- value: Any = None
+
+
+def input_event(e: Var[JavascriptInputEvent]) -> Tuple[str]:
+ """Get the value from an input event.
+
+ Args:
+ e: The input event.
+
+ Returns:
+ The value from the input event.
+ """
+ return (e.target.value,)
+
+
+def key_event(e: Var[JavasciptKeyboardEvent]) -> Tuple[str]:
+ """Get the key from a keyboard event.
+
+ Args:
+ e: The keyboard event.
+
+ Returns:
+ The key from the keyboard event.
+ """
+ return (e.key,)
+
+
+def empty_event() -> Tuple[()]:
+ """Empty event handler.
+
+ Returns:
+ An empty tuple.
+ """
+ return tuple() # type: ignore
@dataclasses.dataclass(
@@ -946,6 +986,28 @@ def unwrap_var_annotation(annotation: GenericType):
return annotation
+def resolve_annotation(annotations: dict[str, Any], arg_name: str):
+ """Resolve the annotation for the given argument name.
+
+ Args:
+ annotations: The annotations.
+ arg_name: The argument name.
+
+ Returns:
+ The resolved annotation.
+ """
+ annotation = annotations.get(arg_name)
+ if annotation is None:
+ console.deprecate(
+ feature_name="Unannotated event handler arguments",
+ reason="Provide type annotations for event handler arguments.",
+ deprecation_version="0.6.3",
+ removal_version="0.7.0",
+ )
+ return JavascriptInputEvent
+ return annotation
+
+
def parse_args_spec(arg_spec: ArgsSpec):
"""Parse the args provided in the ArgsSpec of an event trigger.
@@ -961,7 +1023,7 @@ def parse_args_spec(arg_spec: ArgsSpec):
return arg_spec(
*[
Var(f"_{l_arg}").to(
- unwrap_var_annotation(annotations.get(l_arg, FrontendEvent))
+ unwrap_var_annotation(resolve_annotation(annotations, l_arg))
)
for l_arg in spec.args
]
diff --git a/reflex/state.py b/reflex/state.py
index 5d1d51b913..0941dfe076 100644
--- a/reflex/state.py
+++ b/reflex/state.py
@@ -2520,7 +2520,7 @@ def create(cls, state: Type[BaseState]):
state: The state class to use.
Returns:
- The state manager (either memory or redis).
+ The state manager (either disk or redis).
"""
redis = prerequisites.get_redis()
if redis is not None:
diff --git a/reflex/utils/path_ops.py b/reflex/utils/path_ops.py
index 1de635b888..79596716ca 100644
--- a/reflex/utils/path_ops.py
+++ b/reflex/utils/path_ops.py
@@ -196,7 +196,7 @@ def get_npm_path() -> str | None:
The path to the npm binary file.
"""
npm_path = Path(constants.Node.NPM_PATH)
- if not npm_path.exists():
+ if use_system_node() or not npm_path.exists():
return str(which("npm"))
return str(npm_path)
diff --git a/reflex/utils/prerequisites.py b/reflex/utils/prerequisites.py
index 3c2875204b..34ed5f53f3 100644
--- a/reflex/utils/prerequisites.py
+++ b/reflex/utils/prerequisites.py
@@ -37,7 +37,7 @@
from reflex.utils import console, net, path_ops, processes
from reflex.utils.exceptions import GeneratedCodeHasNoFunctionDefs
from reflex.utils.format import format_library_name
-from reflex.utils.registry import _get_best_registry
+from reflex.utils.registry import _get_npm_registry
CURRENTLY_INSTALLING_NODE = False
@@ -620,7 +620,7 @@ def initialize_package_json():
code = _compile_package_json()
output_path.write_text(code)
- best_registry = _get_best_registry()
+ best_registry = _get_npm_registry()
bun_config_path = get_web_dir() / constants.Bun.CONFIG_PATH
bun_config_path.write_text(
f"""
diff --git a/reflex/utils/registry.py b/reflex/utils/registry.py
index 551292f2d4..6b87c163d8 100644
--- a/reflex/utils/registry.py
+++ b/reflex/utils/registry.py
@@ -1,8 +1,10 @@
"""Utilities for working with registries."""
+import os
+
import httpx
-from reflex.utils import console
+from reflex.utils import console, net
def latency(registry: str) -> int:
@@ -15,7 +17,7 @@ def latency(registry: str) -> int:
int: The latency of the registry in microseconds.
"""
try:
- return httpx.get(registry).elapsed.microseconds
+ return net.get(registry).elapsed.microseconds
except httpx.HTTPError:
console.info(f"Failed to connect to {registry}.")
return 10_000_000
@@ -34,7 +36,7 @@ def average_latency(registry, attempts: int = 3) -> int:
return sum(latency(registry) for _ in range(attempts)) // attempts
-def _get_best_registry() -> str:
+def get_best_registry() -> str:
"""Get the best registry based on latency.
Returns:
@@ -46,3 +48,15 @@ def _get_best_registry() -> str:
]
return min(registries, key=average_latency)
+
+
+def _get_npm_registry() -> str:
+ """Get npm registry. If environment variable is set, use it first.
+
+ Returns:
+ str:
+ """
+ if npm_registry := os.environ.get("NPM_CONFIG_REGISTRY", ""):
+ return npm_registry
+ else:
+ return get_best_registry()
diff --git a/reflex/vars/sequence.py b/reflex/vars/sequence.py
index 3374ee10fd..9b65507b7c 100644
--- a/reflex/vars/sequence.py
+++ b/reflex/vars/sequence.py
@@ -545,7 +545,7 @@ class LiteralStringVar(LiteralVar, StringVar):
def create(
cls,
value: str,
- _var_type: GenericType | None = str,
+ _var_type: GenericType | None = None,
_var_data: VarData | None = None,
) -> StringVar:
"""Create a var from a string value.
@@ -558,6 +558,9 @@ def create(
Returns:
The var.
"""
+ # Determine var type in case the value is inherited from str.
+ _var_type = _var_type or type(value) or str
+
if REFLEX_VAR_OPENING_TAG in value:
strings_and_vals: list[Var | str] = []
offset = 0
diff --git a/tests/integration/test_dynamic_routes.py b/tests/integration/test_dynamic_routes.py
index 35b83790f2..31b7fa419e 100644
--- a/tests/integration/test_dynamic_routes.py
+++ b/tests/integration/test_dynamic_routes.py
@@ -23,11 +23,15 @@ class DynamicState(rx.State):
order: List[str] = []
def on_load(self):
- self.order.append(f"{self.router.page.path}-{self.page_id or 'no page id'}")
+ page_data = f"{self.router.page.path}-{self.page_id or 'no page id'}"
+ print(f"on_load: {page_data}")
+ self.order.append(page_data)
def on_load_redir(self):
query_params = self.router.page.params
- self.order.append(f"on_load_redir-{query_params}")
+ page_data = f"on_load_redir-{query_params}"
+ print(f"on_load_redir: {page_data}")
+ self.order.append(page_data)
return rx.redirect(f"/page/{query_params['page_id']}")
@rx.var
@@ -221,8 +225,11 @@ async def _check():
dynamic_state_name
].order == exp_order
- await AppHarness._poll_for_async(_check)
- assert (await _backend_state()).substates[dynamic_state_name].order == exp_order
+ await AppHarness._poll_for_async(_check, timeout=60)
+ assert (
+ list((await _backend_state()).substates[dynamic_state_name].order)
+ == exp_order
+ )
return _poll_for_order
diff --git a/tests/units/components/test_component.py b/tests/units/components/test_component.py
index 5e94db052e..b54ce1bbe9 100644
--- a/tests/units/components/test_component.py
+++ b/tests/units/components/test_component.py
@@ -16,7 +16,13 @@
)
from reflex.components.radix.themes.layout.box import Box
from reflex.constants import EventTriggers
-from reflex.event import EventChain, EventHandler, parse_args_spec
+from reflex.event import (
+ EventChain,
+ EventHandler,
+ empty_event,
+ input_event,
+ parse_args_spec,
+)
from reflex.state import BaseState
from reflex.style import Style
from reflex.utils import imports
@@ -1778,7 +1784,7 @@ def get_event_triggers(self) -> Dict[str, Any]:
return {
**super().get_event_triggers(),
"on_a": lambda e0: [e0],
- "on_b": lambda e0: [e0.target.value],
+ "on_b": input_event,
"on_c": lambda e0: [],
"on_d": lambda: [],
"on_e": lambda: [],
@@ -1787,9 +1793,9 @@ def get_event_triggers(self) -> Dict[str, Any]:
class TestComponent(Component):
on_a: EventHandler[lambda e0: [e0]]
- on_b: EventHandler[lambda e0: [e0.target.value]]
+ on_b: EventHandler[input_event]
on_c: EventHandler[lambda e0: []]
- on_d: EventHandler[lambda: []]
+ on_d: EventHandler[empty_event]
on_e: EventHandler
on_f: EventHandler[lambda a, b, c: [c, b, a]]
diff --git a/tests/units/components/test_component_future_annotations.py b/tests/units/components/test_component_future_annotations.py
index 37aeb813a1..791fef7c99 100644
--- a/tests/units/components/test_component_future_annotations.py
+++ b/tests/units/components/test_component_future_annotations.py
@@ -3,7 +3,7 @@
from typing import Any
from reflex.components.component import Component
-from reflex.event import EventHandler
+from reflex.event import EventHandler, empty_event, input_event
# This is a repeat of its namesake in test_component.py.
@@ -25,9 +25,9 @@ def get_event_triggers(self) -> dict[str, Any]:
class TestComponent(Component):
on_a: EventHandler[lambda e0: [e0]]
- on_b: EventHandler[lambda e0: [e0.target.value]]
+ on_b: EventHandler[input_event]
on_c: EventHandler[lambda e0: []]
- on_d: EventHandler[lambda: []]
+ on_d: EventHandler[empty_event]
custom_component = ReferenceComponent.create()
test_component = TestComponent.create()
diff --git a/tests/units/test_var.py b/tests/units/test_var.py
index 8f907c24ac..c02acefe6e 100644
--- a/tests/units/test_var.py
+++ b/tests/units/test_var.py
@@ -1809,3 +1809,6 @@ class TestState(BaseState):
assert cast(Var, TestState.email)._var_type == Email
assert cast(Var, TestState.optional_email)._var_type == Optional[Email]
+
+ single_var = Var.create(Email())
+ assert single_var._var_type == Email
diff --git a/tests/units/utils/test_format.py b/tests/units/utils/test_format.py
index d7b0c791ee..17485d52e0 100644
--- a/tests/units/utils/test_format.py
+++ b/tests/units/utils/test_format.py
@@ -8,7 +8,7 @@
import pytest
from reflex.components.tags.tag import Tag
-from reflex.event import EventChain, EventHandler, EventSpec, FrontendEvent
+from reflex.event import EventChain, EventHandler, EventSpec, JavascriptInputEvent
from reflex.style import Style
from reflex.utils import format
from reflex.utils.serializers import serialize_figure
@@ -387,7 +387,7 @@ def test_format_match(
Var(
_js_expr="_e",
)
- .to(ObjectVar, FrontendEvent)
+ .to(ObjectVar, JavascriptInputEvent)
.target.value,
),
),