reflex/pynecone/components/datadisplay/code.py
Nikhil Rao 7ec4b3f8fe
Improve component docs (#35)
* Update component docstrings
* Remove transitions libs
* Add span component
* Add lock files
2022-12-07 15:04:49 -08:00

93 lines
2.4 KiB
Python

"""A code component."""
from typing import Dict
from pynecone import utils
from pynecone.components.component import Component, ImportDict
from pynecone.components.libs.chakra import ChakraComponent
from pynecone.var import Var
# Path to the prism styles.
PRISM_STYLES_PATH = "/styles/code/prism"
class CodeBlock(Component):
"""A code block."""
library = "react-syntax-highlighter"
tag = "Prism"
# The theme to use ("light" or "dark").
theme: Var[str]
# The language to use.
language: Var[str]
# If this is enabled line numbers will be shown next to the code block.
show_line_numbers: Var[bool]
# The starting line number to use.
starting_line_number: Var[int]
# Whether to wrap long lines.
wrap_long_lines: Var[bool]
# A custom style for the code block.
custom_style: Var[Dict[str, str]]
# Props passed down to the code tag.
code_tag_props: Var[Dict[str, str]]
def _get_imports(self) -> ImportDict:
imports = super()._get_imports()
if self.theme is not None:
imports = utils.merge_imports(
imports, {PRISM_STYLES_PATH: {self.theme.name}}
)
return imports
@classmethod
def create(cls, *children, **props):
"""Create a text component.
Args:
*children: The children of the component.
**props: The props to pass to the component.
Returns:
The text component.
"""
# This component handles style in a special prop.
custom_style = props.pop("custom_style", {})
# Transfer style props to the custom style prop.
for key, value in props.items():
if key not in cls.get_fields():
custom_style[key] = value
# Create the component.
return super().create(
*children,
**props,
custom_style=custom_style,
)
def _add_style(self, style):
self.custom_style = self.custom_style or {}
self.custom_style.update(style) # type: ignore
def _render(self):
out = super()._render()
if self.theme is not None:
out.add_props(
style=Var.create(self.theme.name, is_local=False)
).remove_props("theme")
return out
class Code(ChakraComponent):
"""Used to display inline code."""
tag = "Code"