laipeng/reflex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

minimal update of theme and language map

Browse Source
This commit is contained in:
Elijah 2024-10-02 14:38:57 +00:00
parent cdad1f9432
commit c3dbfc0f62
2 changed files with 35 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
reflex/components/datadisplay/shiki_code_block.py
View File

@ -44,7 +44,12 @@ LINE_NUMBER_STYLING = {
}, },
} }
THEME_MAPPING = {"light": "one-light", "dark": "one-dark-pro"} THEME_MAPPING = {
"light": "one-light",
"dark": "one-dark-pro",
"a11y-dark": "github-dark",
}
LANGUAGE_MAPPING = {"bash": "shellscript"}
LiteralCodeLanguage = Literal[ LiteralCodeLanguage = Literal[
"abap", "abap",
"actionscript-3", "actionscript-3",
@ -372,9 +377,13 @@ class ShikiCodeBlock(Component):
"""A Code block.""" """A Code block."""
library = "/components/shiki/code" library = "/components/shiki/code"
tag = "Code" tag = "Code"
alias = "ShikiCode" alias = "ShikiCode"
lib_dependencies: list[str] = ["shiki"]
# The language to use. # The language to use.
language: Var[LiteralCodeLanguage] = Var.create("python") language: Var[LiteralCodeLanguage] = Var.create("python")
@ -522,8 +531,8 @@ class ShikiCodeBlock(Component):
class ShikiHighLevelCodeBlock(ShikiCodeBlock): class ShikiHighLevelCodeBlock(ShikiCodeBlock):
"""High level component for the shiki syntax highlighter.""" """High level component for the shiki syntax highlighter."""
# If this is enabled, the default transformer(shikijs transformer) will be used. # If this is enabled, the default transformers(shikijs transformer) will be used.
use_transformer: Var[bool] use_transformers: Var[bool]
# If this is enabled line numbers will be shown next to the code block. # If this is enabled line numbers will be shown next to the code block.
show_line_numbers: Var[bool] show_line_numbers: Var[bool]
@ -547,12 +556,17 @@ class ShikiHighLevelCodeBlock(ShikiCodeBlock):
Returns: Returns:
The code block component. The code block component.
""" """
use_transformer = props.pop("use_transformer", False) use_transformers = props.pop("use_transformers", False)
show_line_numbers = props.pop("show_line_numbers", False) show_line_numbers = props.pop("show_line_numbers", False)
language = props.pop("language", None)
if use_transformer: if use_transformers:
props["transformers"] = [ShikiJsTransformer()] props["transformers"] = [ShikiJsTransformer()]
if language is not None:
props["language"] = cls._map_languages(language)
# line numbers are generated via css
if show_line_numbers: if show_line_numbers:
props["style"] = {**LINE_NUMBER_STYLING, **props.get("style", {})} props["style"] = {**LINE_NUMBER_STYLING, **props.get("style", {})}
@ -593,6 +607,12 @@ class ShikiHighLevelCodeBlock(ShikiCodeBlock):
return THEME_MAPPING[theme] return THEME_MAPPING[theme]
return theme return theme
@staticmethod
def _map_languages(language: str) -> str:
if isinstance(language, str) and language in LANGUAGE_MAPPING:
return LANGUAGE_MAPPING[language]
return language
class TransformerNamespace(ComponentNamespace): class TransformerNamespace(ComponentNamespace):
"""Namespace for the Transformers.""" """Namespace for the Transformers."""

15
reflex/components/datadisplay/shiki_code_block.pyi
View File

@ -36,7 +36,12 @@ LINE_NUMBER_STYLING = {
"color": "rgba(115,138,148,.4)", "color": "rgba(115,138,148,.4)",
}, },
} }
THEME_MAPPING = {"light": "one-light", "dark": "one-dark-pro"} THEME_MAPPING = {
"light": "one-light",
"dark": "one-dark-pro",
"a11y-dark": "github-dark",
}
LANGUAGE_MAPPING = {"bash": "shellscript"}
LiteralCodeLanguage = Literal[ LiteralCodeLanguage = Literal[
"abap", "abap",
"actionscript-3", "actionscript-3",
@ -960,7 +965,7 @@ class ShikiHighLevelCodeBlock(ShikiCodeBlock):
*children, *children,
can_copy: Optional[bool] = False, can_copy: Optional[bool] = False,
copy_button: Optional[Union[Component, bool]] = None, copy_button: Optional[Union[Component, bool]] = None,
use_transformer: Optional[Union[Var[bool], bool]] = None, use_transformers: Optional[Union[Var[bool], bool]] = None,
show_line_numbers: Optional[Union[Var[bool], bool]] = None, show_line_numbers: Optional[Union[Var[bool], bool]] = None,
language: Optional[ language: Optional[
Union[ Union[
@ -1571,7 +1576,7 @@ class ShikiHighLevelCodeBlock(ShikiCodeBlock):
*children: The children of the component. *children: The children of the component.
can_copy: Whether a copy button should appear. can_copy: Whether a copy button should appear.
copy_button: A custom copy button to override the default one. copy_button: A custom copy button to override the default one.
use_transformer: If this is enabled, the default transformer(shikijs transformer) will be used. use_transformers: If this is enabled, the default transformers(shikijs transformer) will be used.
show_line_numbers: If this is enabled line numbers will be shown next to the code block. show_line_numbers: If this is enabled line numbers will be shown next to the code block.
language: The language to use. language: The language to use.
theme: The theme to use ("light" or "dark"). theme: The theme to use ("light" or "dark").
@ -1604,7 +1609,7 @@ class CodeblockNamespace(ComponentNamespace):
*children, *children,
can_copy: Optional[bool] = False, can_copy: Optional[bool] = False,
copy_button: Optional[Union[Component, bool]] = None, copy_button: Optional[Union[Component, bool]] = None,
use_transformer: Optional[Union[Var[bool], bool]] = None, use_transformers: Optional[Union[Var[bool], bool]] = None,
show_line_numbers: Optional[Union[Var[bool], bool]] = None, show_line_numbers: Optional[Union[Var[bool], bool]] = None,
language: Optional[ language: Optional[
Union[ Union[
@ -2215,7 +2220,7 @@ class CodeblockNamespace(ComponentNamespace):
*children: The children of the component. *children: The children of the component.
can_copy: Whether a copy button should appear. can_copy: Whether a copy button should appear.
copy_button: A custom copy button to override the default one. copy_button: A custom copy button to override the default one.
use_transformer: If this is enabled, the default transformer(shikijs transformer) will be used. use_transformers: If this is enabled, the default transformers(shikijs transformer) will be used.
show_line_numbers: If this is enabled line numbers will be shown next to the code block. show_line_numbers: If this is enabled line numbers will be shown next to the code block.
language: The language to use. language: The language to use.
theme: The theme to use ("light" or "dark"). theme: The theme to use ("light" or "dark").