diff --git a/reflex/__init__.py b/reflex/__init__.py index d9f638c34..554057357 100644 --- a/reflex/__init__.py +++ b/reflex/__init__.py @@ -26,6 +26,7 @@ _ALL_COMPONENTS = [ "debounce_input", # Base "fragment", + "Fragment", "image", "script", # Responsive @@ -68,11 +69,12 @@ _ALL_COMPONENTS = [ # "icon" (lucide) "icon_button", "inset", + "input", "kbd", "link", "popover", "progress", - # "quote", + "quote", "radio_group", "scroll_area", "section", @@ -82,19 +84,21 @@ _ALL_COMPONENTS = [ "slider", "spacer", # "strong" (bold?) + "stack", "switch", "table", "tabs", "text", "text_area", - # "text_field" (input) "theme", "theme_panel", "tooltip", "vstack", # Other + "code_block", "data_editor", "data_editor_theme", + "data_table", "plotly", "audio", "video", @@ -102,6 +106,7 @@ _ALL_COMPONENTS = [ "EditorButtonList", "EditorOptions", "icon", + "markdown", ] _MAPPING = { diff --git a/reflex/__init__.pyi b/reflex/__init__.pyi index d69fe5012..1794abbc6 100644 --- a/reflex/__init__.pyi +++ b/reflex/__init__.pyi @@ -15,6 +15,7 @@ from reflex.components import connection_banner as connection_banner from reflex.components import connection_modal as connection_modal from reflex.components import debounce_input as debounce_input from reflex.components import fragment as fragment +from reflex.components import Fragment as Fragment from reflex.components import image as image from reflex.components import script as script from reflex.components import desktop_only as desktop_only @@ -52,10 +53,12 @@ from reflex.components import hover_card as hover_card from reflex.components import hstack as hstack from reflex.components import icon_button as icon_button from reflex.components import inset as inset +from reflex.components import input as input from reflex.components import kbd as kbd from reflex.components import link as link from reflex.components import popover as popover from reflex.components import progress as progress +from reflex.components import quote as quote from reflex.components import radio_group as radio_group from reflex.components import scroll_area as scroll_area from reflex.components import section as section @@ -63,6 +66,7 @@ from reflex.components import select as select from reflex.components import separator as separator from reflex.components import slider as slider from reflex.components import spacer as spacer +from reflex.components import stack as stack from reflex.components import switch as switch from reflex.components import table as table from reflex.components import tabs as tabs @@ -72,8 +76,10 @@ from reflex.components import theme as theme from reflex.components import theme_panel as theme_panel from reflex.components import tooltip as tooltip from reflex.components import vstack as vstack +from reflex.components import code_block as code_block from reflex.components import data_editor as data_editor from reflex.components import data_editor_theme as data_editor_theme +from reflex.components import data_table as data_table from reflex.components import plotly as plotly from reflex.components import audio as audio from reflex.components import video as video @@ -81,6 +87,7 @@ from reflex.components import editor as editor from reflex.components import EditorButtonList as EditorButtonList from reflex.components import EditorOptions as EditorOptions from reflex.components import icon as icon +from reflex.components import markdown as markdown from reflex.components.component import Component as Component from reflex.components.component import NoSSRComponent as NoSSRComponent from reflex.components.component import memo as memo diff --git a/reflex/components/__init__.py b/reflex/components/__init__.py index 872a267d3..ca6c8b0cd 100644 --- a/reflex/components/__init__.py +++ b/reflex/components/__init__.py @@ -1,13 +1,13 @@ """Import all the components.""" from __future__ import annotations +from . import lucide from .base import Fragment, Script, fragment, script from .component import Component from .component import NoSSRComponent as NoSSRComponent from .core import * from .datadisplay import * from .gridjs import * -from .lucide import icon from .markdown import * from .moment import * from .next import NextLink, image, next_link @@ -15,3 +15,5 @@ from .plotly import * from .radix import * from .react_player import * from .suneditor import * + +icon = lucide.icon diff --git a/reflex/components/chakra/__init__.py b/reflex/components/chakra/__init__.py index f1b2e7440..ea0976f8c 100644 --- a/reflex/components/chakra/__init__.py +++ b/reflex/components/chakra/__init__.py @@ -49,7 +49,6 @@ circle = Circle.create circular_progress = CircularProgress.create circular_progress_label = CircularProgressLabel.create code = Code.create -code_block = CodeBlock.create collapse = Collapse.create color_mode_button = ColorModeButton.create color_mode_icon = ColorModeIcon.create diff --git a/reflex/components/chakra/datadisplay/__init__.py b/reflex/components/chakra/datadisplay/__init__.py index 64d0d370d..b20d17248 100644 --- a/reflex/components/chakra/datadisplay/__init__.py +++ b/reflex/components/chakra/datadisplay/__init__.py @@ -1,9 +1,7 @@ """Data display components.""" from .badge import Badge -from .code import Code, CodeBlock -from .code import LiteralCodeBlockTheme as LiteralCodeBlockTheme -from .code import LiteralCodeLanguage as LiteralCodeLanguage +from .code import Code from .divider import Divider from .keyboard_key import KeyboardKey as Kbd from .list import List, ListItem, OrderedList, UnorderedList diff --git a/reflex/components/chakra/datadisplay/code.py b/reflex/components/chakra/datadisplay/code.py index 9bec7271f..fe1016b7a 100644 --- a/reflex/components/chakra/datadisplay/code.py +++ b/reflex/components/chakra/datadisplay/code.py @@ -1,518 +1,7 @@ """A code component.""" -import re -from typing import Dict, Literal, Optional, Union - from reflex.components.chakra import ( ChakraComponent, ) -from reflex.components.chakra.forms import Button, color_mode_cond -from reflex.components.chakra.layout import Box -from reflex.components.chakra.media import Icon -from reflex.components.component import Component -from reflex.event import set_clipboard -from reflex.style import Style -from reflex.utils import format, imports -from reflex.utils.imports import ImportVar -from reflex.vars import Var - -LiteralCodeBlockTheme = Literal[ - "a11y-dark", - "atom-dark", - "cb", - "coldark-cold", - "coldark-dark", - "coy", - "coy-without-shadows", - "darcula", - "dark", - "dracula", - "duotone-dark", - "duotone-earth", - "duotone-forest", - "duotone-light", - "duotone-sea", - "duotone-space", - "funky", - "ghcolors", - "gruvbox-dark", - "gruvbox-light", - "holi-theme", - "hopscotch", - "light", # not present in react-syntax-highlighter styles - "lucario", - "material-dark", - "material-light", - "material-oceanic", - "night-owl", - "nord", - "okaidia", - "one-dark", - "one-light", - "pojoaque", - "prism", - "shades-of-purple", - "solarized-dark-atom", - "solarizedlight", - "synthwave84", - "tomorrow", - "twilight", - "vs", - "vs-dark", - "vsc-dark-plus", - "xonokai", - "z-touch", -] - - -LiteralCodeLanguage = Literal[ - "abap", - "abnf", - "actionscript", - "ada", - "agda", - "al", - "antlr4", - "apacheconf", - "apex", - "apl", - "applescript", - "aql", - "arduino", - "arff", - "asciidoc", - "asm6502", - "asmatmel", - "aspnet", - "autohotkey", - "autoit", - "avisynth", - "avro-idl", - "bash", - "basic", - "batch", - "bbcode", - "bicep", - "birb", - "bison", - "bnf", - "brainfuck", - "brightscript", - "bro", - "bsl", - "c", - "cfscript", - "chaiscript", - "cil", - "clike", - "clojure", - "cmake", - "cobol", - "coffeescript", - "concurnas", - "coq", - "core", - "cpp", - "crystal", - "csharp", - "cshtml", - "csp", - "css", - "css-extras", - "csv", - "cypher", - "d", - "dart", - "dataweave", - "dax", - "dhall", - "diff", - "django", - "dns-zone-file", - "docker", - "dot", - "ebnf", - "editorconfig", - "eiffel", - "ejs", - "elixir", - "elm", - "erb", - "erlang", - "etlua", - "excel-formula", - "factor", - "false", - "firestore-security-rules", - "flow", - "fortran", - "fsharp", - "ftl", - "gap", - "gcode", - "gdscript", - "gedcom", - "gherkin", - "git", - "glsl", - "gml", - "gn", - "go", - "go-module", - "graphql", - "groovy", - "haml", - "handlebars", - "haskell", - "haxe", - "hcl", - "hlsl", - "hoon", - "hpkp", - "hsts", - "http", - "ichigojam", - "icon", - "icu-message-format", - "idris", - "iecst", - "ignore", - "index", - "inform7", - "ini", - "io", - "j", - "java", - "javadoc", - "javadoclike", - "javascript", - "javastacktrace", - "jexl", - "jolie", - "jq", - "js-extras", - "js-templates", - "jsdoc", - "json", - "json5", - "jsonp", - "jsstacktrace", - "jsx", - "julia", - "keepalived", - "keyman", - "kotlin", - "kumir", - "kusto", - "latex", - "latte", - "less", - "lilypond", - "liquid", - "lisp", - "livescript", - "llvm", - "log", - "lolcode", - "lua", - "magma", - "makefile", - "markdown", - "markup", - "markup-templating", - "matlab", - "maxscript", - "mel", - "mermaid", - "mizar", - "mongodb", - "monkey", - "moonscript", - "n1ql", - "n4js", - "nand2tetris-hdl", - "naniscript", - "nasm", - "neon", - "nevod", - "nginx", - "nim", - "nix", - "nsis", - "objectivec", - "ocaml", - "opencl", - "openqasm", - "oz", - "parigp", - "parser", - "pascal", - "pascaligo", - "pcaxis", - "peoplecode", - "perl", - "php", - "php-extras", - "phpdoc", - "plsql", - "powerquery", - "powershell", - "processing", - "prolog", - "promql", - "properties", - "protobuf", - "psl", - "pug", - "puppet", - "pure", - "purebasic", - "purescript", - "python", - "q", - "qml", - "qore", - "qsharp", - "r", - "racket", - "reason", - "regex", - "rego", - "renpy", - "rest", - "rip", - "roboconf", - "robotframework", - "ruby", - "rust", - "sas", - "sass", - "scala", - "scheme", - "scss", - "shell-session", - "smali", - "smalltalk", - "smarty", - "sml", - "solidity", - "solution-file", - "soy", - "sparql", - "splunk-spl", - "sqf", - "sql", - "squirrel", - "stan", - "stylus", - "swift", - "systemd", - "t4-cs", - "t4-templating", - "t4-vb", - "tap", - "tcl", - "textile", - "toml", - "tremor", - "tsx", - "tt2", - "turtle", - "twig", - "typescript", - "typoscript", - "unrealscript", - "uorazor", - "uri", - "v", - "vala", - "vbnet", - "velocity", - "verilog", - "vhdl", - "vim", - "visual-basic", - "warpscript", - "wasm", - "web-idl", - "wiki", - "wolfram", - "wren", - "xeora", - "xml-doc", - "xojo", - "xquery", - "yaml", - "yang", - "zig", -] - - -class CodeBlock(Component): - """A code block.""" - - library = "react-syntax-highlighter@15.5.0" - - tag = "PrismAsyncLight" - - alias = "SyntaxHighlighter" - - # The theme to use ("light" or "dark"). - theme: Var[LiteralCodeBlockTheme] = "one-light" # type: ignore - - # The language to use. - language: Var[LiteralCodeLanguage] = "python" # type: ignore - - # The code to display. - code: 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: Dict[str, str] = {} - - # Props passed down to the code tag. - code_tag_props: Var[Dict[str, str]] - - def _get_imports(self) -> imports.ImportDict: - merged_imports = super()._get_imports() - # Get all themes from a cond literal - themes = re.findall(r"`(.*?)`", self.theme._var_name) - if not themes: - themes = [self.theme._var_name] - merged_imports = imports.merge_imports( - merged_imports, - { - f"react-syntax-highlighter/dist/cjs/styles/prism/{theme}": { - ImportVar( - tag=format.to_camel_case(theme), - is_default=True, - install=False, - ) - } - for theme in themes - }, - ) - if ( - self.language is not None - and self.language._var_name in LiteralCodeLanguage.__args__ # type: ignore - ): - merged_imports = imports.merge_imports( - merged_imports, - { - f"react-syntax-highlighter/dist/cjs/languages/prism/{self.language._var_name}": { - ImportVar( - tag=format.to_camel_case(self.language._var_name), - is_default=True, - install=False, - ) - } - }, - ) - return merged_imports - - def _get_custom_code(self) -> Optional[str]: - if ( - self.language is not None - and self.language._var_name in LiteralCodeLanguage.__args__ # type: ignore - ): - return f"{self.alias}.registerLanguage('{self.language._var_name}', {format.to_camel_case(self.language._var_name)})" - - @classmethod - def create( - cls, - *children, - can_copy: Optional[bool] = False, - copy_button: Optional[Union[bool, Component]] = None, - **props, - ): - """Create a text component. - - Args: - *children: The children of the component. - can_copy: Whether a copy button should appears. - copy_button: A custom copy button to override the default one. - **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", {}) - - if "theme" not in props: - # Default color scheme responds to global color mode. - props["theme"] = color_mode_cond(light="one-light", dark="one-dark") - - # react-syntax-highlighter doesnt have an explicit "light" or "dark" theme so we use one-light and one-dark - # themes respectively to ensure code compatibility. - if "theme" in props and not isinstance(props["theme"], Var): - props["theme"] = ( - "one-light" - if props["theme"] == "light" - else "one-dark" - if props["theme"] == "dark" - else props["theme"] - ) - - if can_copy: - code = children[0] - copy_button = ( # type: ignore - copy_button - if copy_button is not None - else Button.create( - Icon.create(tag="copy"), - on_click=set_clipboard(code), - style=Style({"position": "absolute", "top": "0.5em", "right": "0"}), - ) - ) - custom_style.update({"padding": "1em 3.2em 1em 1em"}) - else: - copy_button = None - - # 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 - - # Carry the children (code) via props - if children: - props["code"] = children[0] - if not isinstance(props["code"], Var): - props["code"] = Var.create(props["code"], _var_is_string=True) - - # Create the component. - code_block = super().create( - **props, - custom_style=Style(custom_style), - ) - - if copy_button: - return Box.create(code_block, copy_button, position="relative") - else: - return code_block - - def _add_style(self, style): - self.custom_style.update(style) # type: ignore - - def _render(self): - out = super()._render() - predicate, qmark, value = self.theme._var_name.partition("?") - out.add_props( - style=Var.create( - format.to_camel_case(f"{predicate}{qmark}{value.replace('`', '')}"), - _var_is_local=False, - ) - ).remove_props("theme", "code") - if self.code is not None: - out.special_props.add(Var.create_safe(f"children={str(self.code)}")) - return out class Code(ChakraComponent): diff --git a/reflex/components/chakra/datadisplay/code.pyi b/reflex/components/chakra/datadisplay/code.pyi index 0c13fe0e9..6252eafc6 100644 --- a/reflex/components/chakra/datadisplay/code.pyi +++ b/reflex/components/chakra/datadisplay/code.pyi @@ -7,1111 +7,7 @@ from typing import Any, Dict, Literal, Optional, Union, overload from reflex.vars import Var, BaseVar, ComputedVar from reflex.event import EventChain, EventHandler, EventSpec from reflex.style import Style -import re -from typing import Dict, Literal, Optional, Union from reflex.components.chakra import ChakraComponent -from reflex.components.chakra.forms import Button, color_mode_cond -from reflex.components.chakra.layout import Box -from reflex.components.chakra.media import Icon -from reflex.components.component import Component -from reflex.event import set_clipboard -from reflex.style import Style -from reflex.utils import format, imports -from reflex.utils.imports import ImportVar -from reflex.vars import Var - -LiteralCodeBlockTheme = Literal[ - "a11y-dark", - "atom-dark", - "cb", - "coldark-cold", - "coldark-dark", - "coy", - "coy-without-shadows", - "darcula", - "dark", - "dracula", - "duotone-dark", - "duotone-earth", - "duotone-forest", - "duotone-light", - "duotone-sea", - "duotone-space", - "funky", - "ghcolors", - "gruvbox-dark", - "gruvbox-light", - "holi-theme", - "hopscotch", - "light", - "lucario", - "material-dark", - "material-light", - "material-oceanic", - "night-owl", - "nord", - "okaidia", - "one-dark", - "one-light", - "pojoaque", - "prism", - "shades-of-purple", - "solarized-dark-atom", - "solarizedlight", - "synthwave84", - "tomorrow", - "twilight", - "vs", - "vs-dark", - "vsc-dark-plus", - "xonokai", - "z-touch", -] -LiteralCodeLanguage = Literal[ - "abap", - "abnf", - "actionscript", - "ada", - "agda", - "al", - "antlr4", - "apacheconf", - "apex", - "apl", - "applescript", - "aql", - "arduino", - "arff", - "asciidoc", - "asm6502", - "asmatmel", - "aspnet", - "autohotkey", - "autoit", - "avisynth", - "avro-idl", - "bash", - "basic", - "batch", - "bbcode", - "bicep", - "birb", - "bison", - "bnf", - "brainfuck", - "brightscript", - "bro", - "bsl", - "c", - "cfscript", - "chaiscript", - "cil", - "clike", - "clojure", - "cmake", - "cobol", - "coffeescript", - "concurnas", - "coq", - "core", - "cpp", - "crystal", - "csharp", - "cshtml", - "csp", - "css", - "css-extras", - "csv", - "cypher", - "d", - "dart", - "dataweave", - "dax", - "dhall", - "diff", - "django", - "dns-zone-file", - "docker", - "dot", - "ebnf", - "editorconfig", - "eiffel", - "ejs", - "elixir", - "elm", - "erb", - "erlang", - "etlua", - "excel-formula", - "factor", - "false", - "firestore-security-rules", - "flow", - "fortran", - "fsharp", - "ftl", - "gap", - "gcode", - "gdscript", - "gedcom", - "gherkin", - "git", - "glsl", - "gml", - "gn", - "go", - "go-module", - "graphql", - "groovy", - "haml", - "handlebars", - "haskell", - "haxe", - "hcl", - "hlsl", - "hoon", - "hpkp", - "hsts", - "http", - "ichigojam", - "icon", - "icu-message-format", - "idris", - "iecst", - "ignore", - "index", - "inform7", - "ini", - "io", - "j", - "java", - "javadoc", - "javadoclike", - "javascript", - "javastacktrace", - "jexl", - "jolie", - "jq", - "js-extras", - "js-templates", - "jsdoc", - "json", - "json5", - "jsonp", - "jsstacktrace", - "jsx", - "julia", - "keepalived", - "keyman", - "kotlin", - "kumir", - "kusto", - "latex", - "latte", - "less", - "lilypond", - "liquid", - "lisp", - "livescript", - "llvm", - "log", - "lolcode", - "lua", - "magma", - "makefile", - "markdown", - "markup", - "markup-templating", - "matlab", - "maxscript", - "mel", - "mermaid", - "mizar", - "mongodb", - "monkey", - "moonscript", - "n1ql", - "n4js", - "nand2tetris-hdl", - "naniscript", - "nasm", - "neon", - "nevod", - "nginx", - "nim", - "nix", - "nsis", - "objectivec", - "ocaml", - "opencl", - "openqasm", - "oz", - "parigp", - "parser", - "pascal", - "pascaligo", - "pcaxis", - "peoplecode", - "perl", - "php", - "php-extras", - "phpdoc", - "plsql", - "powerquery", - "powershell", - "processing", - "prolog", - "promql", - "properties", - "protobuf", - "psl", - "pug", - "puppet", - "pure", - "purebasic", - "purescript", - "python", - "q", - "qml", - "qore", - "qsharp", - "r", - "racket", - "reason", - "regex", - "rego", - "renpy", - "rest", - "rip", - "roboconf", - "robotframework", - "ruby", - "rust", - "sas", - "sass", - "scala", - "scheme", - "scss", - "shell-session", - "smali", - "smalltalk", - "smarty", - "sml", - "solidity", - "solution-file", - "soy", - "sparql", - "splunk-spl", - "sqf", - "sql", - "squirrel", - "stan", - "stylus", - "swift", - "systemd", - "t4-cs", - "t4-templating", - "t4-vb", - "tap", - "tcl", - "textile", - "toml", - "tremor", - "tsx", - "tt2", - "turtle", - "twig", - "typescript", - "typoscript", - "unrealscript", - "uorazor", - "uri", - "v", - "vala", - "vbnet", - "velocity", - "verilog", - "vhdl", - "vim", - "visual-basic", - "warpscript", - "wasm", - "web-idl", - "wiki", - "wolfram", - "wren", - "xeora", - "xml-doc", - "xojo", - "xquery", - "yaml", - "yang", - "zig", -] - -class CodeBlock(Component): - @overload - @classmethod - def create( # type: ignore - cls, - *children, - can_copy: Optional[bool] = False, - copy_button: Optional[Union[bool, Component]] = None, - theme: Optional[ - Union[ - Var[ - Literal[ - "a11y-dark", - "atom-dark", - "cb", - "coldark-cold", - "coldark-dark", - "coy", - "coy-without-shadows", - "darcula", - "dark", - "dracula", - "duotone-dark", - "duotone-earth", - "duotone-forest", - "duotone-light", - "duotone-sea", - "duotone-space", - "funky", - "ghcolors", - "gruvbox-dark", - "gruvbox-light", - "holi-theme", - "hopscotch", - "light", - "lucario", - "material-dark", - "material-light", - "material-oceanic", - "night-owl", - "nord", - "okaidia", - "one-dark", - "one-light", - "pojoaque", - "prism", - "shades-of-purple", - "solarized-dark-atom", - "solarizedlight", - "synthwave84", - "tomorrow", - "twilight", - "vs", - "vs-dark", - "vsc-dark-plus", - "xonokai", - "z-touch", - ] - ], - Literal[ - "a11y-dark", - "atom-dark", - "cb", - "coldark-cold", - "coldark-dark", - "coy", - "coy-without-shadows", - "darcula", - "dark", - "dracula", - "duotone-dark", - "duotone-earth", - "duotone-forest", - "duotone-light", - "duotone-sea", - "duotone-space", - "funky", - "ghcolors", - "gruvbox-dark", - "gruvbox-light", - "holi-theme", - "hopscotch", - "light", - "lucario", - "material-dark", - "material-light", - "material-oceanic", - "night-owl", - "nord", - "okaidia", - "one-dark", - "one-light", - "pojoaque", - "prism", - "shades-of-purple", - "solarized-dark-atom", - "solarizedlight", - "synthwave84", - "tomorrow", - "twilight", - "vs", - "vs-dark", - "vsc-dark-plus", - "xonokai", - "z-touch", - ], - ] - ] = None, - language: Optional[ - Union[ - Var[ - Literal[ - "abap", - "abnf", - "actionscript", - "ada", - "agda", - "al", - "antlr4", - "apacheconf", - "apex", - "apl", - "applescript", - "aql", - "arduino", - "arff", - "asciidoc", - "asm6502", - "asmatmel", - "aspnet", - "autohotkey", - "autoit", - "avisynth", - "avro-idl", - "bash", - "basic", - "batch", - "bbcode", - "bicep", - "birb", - "bison", - "bnf", - "brainfuck", - "brightscript", - "bro", - "bsl", - "c", - "cfscript", - "chaiscript", - "cil", - "clike", - "clojure", - "cmake", - "cobol", - "coffeescript", - "concurnas", - "coq", - "core", - "cpp", - "crystal", - "csharp", - "cshtml", - "csp", - "css", - "css-extras", - "csv", - "cypher", - "d", - "dart", - "dataweave", - "dax", - "dhall", - "diff", - "django", - "dns-zone-file", - "docker", - "dot", - "ebnf", - "editorconfig", - "eiffel", - "ejs", - "elixir", - "elm", - "erb", - "erlang", - "etlua", - "excel-formula", - "factor", - "false", - "firestore-security-rules", - "flow", - "fortran", - "fsharp", - "ftl", - "gap", - "gcode", - "gdscript", - "gedcom", - "gherkin", - "git", - "glsl", - "gml", - "gn", - "go", - "go-module", - "graphql", - "groovy", - "haml", - "handlebars", - "haskell", - "haxe", - "hcl", - "hlsl", - "hoon", - "hpkp", - "hsts", - "http", - "ichigojam", - "icon", - "icu-message-format", - "idris", - "iecst", - "ignore", - "index", - "inform7", - "ini", - "io", - "j", - "java", - "javadoc", - "javadoclike", - "javascript", - "javastacktrace", - "jexl", - "jolie", - "jq", - "js-extras", - "js-templates", - "jsdoc", - "json", - "json5", - "jsonp", - "jsstacktrace", - "jsx", - "julia", - "keepalived", - "keyman", - "kotlin", - "kumir", - "kusto", - "latex", - "latte", - "less", - "lilypond", - "liquid", - "lisp", - "livescript", - "llvm", - "log", - "lolcode", - "lua", - "magma", - "makefile", - "markdown", - "markup", - "markup-templating", - "matlab", - "maxscript", - "mel", - "mermaid", - "mizar", - "mongodb", - "monkey", - "moonscript", - "n1ql", - "n4js", - "nand2tetris-hdl", - "naniscript", - "nasm", - "neon", - "nevod", - "nginx", - "nim", - "nix", - "nsis", - "objectivec", - "ocaml", - "opencl", - "openqasm", - "oz", - "parigp", - "parser", - "pascal", - "pascaligo", - "pcaxis", - "peoplecode", - "perl", - "php", - "php-extras", - "phpdoc", - "plsql", - "powerquery", - "powershell", - "processing", - "prolog", - "promql", - "properties", - "protobuf", - "psl", - "pug", - "puppet", - "pure", - "purebasic", - "purescript", - "python", - "q", - "qml", - "qore", - "qsharp", - "r", - "racket", - "reason", - "regex", - "rego", - "renpy", - "rest", - "rip", - "roboconf", - "robotframework", - "ruby", - "rust", - "sas", - "sass", - "scala", - "scheme", - "scss", - "shell-session", - "smali", - "smalltalk", - "smarty", - "sml", - "solidity", - "solution-file", - "soy", - "sparql", - "splunk-spl", - "sqf", - "sql", - "squirrel", - "stan", - "stylus", - "swift", - "systemd", - "t4-cs", - "t4-templating", - "t4-vb", - "tap", - "tcl", - "textile", - "toml", - "tremor", - "tsx", - "tt2", - "turtle", - "twig", - "typescript", - "typoscript", - "unrealscript", - "uorazor", - "uri", - "v", - "vala", - "vbnet", - "velocity", - "verilog", - "vhdl", - "vim", - "visual-basic", - "warpscript", - "wasm", - "web-idl", - "wiki", - "wolfram", - "wren", - "xeora", - "xml-doc", - "xojo", - "xquery", - "yaml", - "yang", - "zig", - ] - ], - Literal[ - "abap", - "abnf", - "actionscript", - "ada", - "agda", - "al", - "antlr4", - "apacheconf", - "apex", - "apl", - "applescript", - "aql", - "arduino", - "arff", - "asciidoc", - "asm6502", - "asmatmel", - "aspnet", - "autohotkey", - "autoit", - "avisynth", - "avro-idl", - "bash", - "basic", - "batch", - "bbcode", - "bicep", - "birb", - "bison", - "bnf", - "brainfuck", - "brightscript", - "bro", - "bsl", - "c", - "cfscript", - "chaiscript", - "cil", - "clike", - "clojure", - "cmake", - "cobol", - "coffeescript", - "concurnas", - "coq", - "core", - "cpp", - "crystal", - "csharp", - "cshtml", - "csp", - "css", - "css-extras", - "csv", - "cypher", - "d", - "dart", - "dataweave", - "dax", - "dhall", - "diff", - "django", - "dns-zone-file", - "docker", - "dot", - "ebnf", - "editorconfig", - "eiffel", - "ejs", - "elixir", - "elm", - "erb", - "erlang", - "etlua", - "excel-formula", - "factor", - "false", - "firestore-security-rules", - "flow", - "fortran", - "fsharp", - "ftl", - "gap", - "gcode", - "gdscript", - "gedcom", - "gherkin", - "git", - "glsl", - "gml", - "gn", - "go", - "go-module", - "graphql", - "groovy", - "haml", - "handlebars", - "haskell", - "haxe", - "hcl", - "hlsl", - "hoon", - "hpkp", - "hsts", - "http", - "ichigojam", - "icon", - "icu-message-format", - "idris", - "iecst", - "ignore", - "index", - "inform7", - "ini", - "io", - "j", - "java", - "javadoc", - "javadoclike", - "javascript", - "javastacktrace", - "jexl", - "jolie", - "jq", - "js-extras", - "js-templates", - "jsdoc", - "json", - "json5", - "jsonp", - "jsstacktrace", - "jsx", - "julia", - "keepalived", - "keyman", - "kotlin", - "kumir", - "kusto", - "latex", - "latte", - "less", - "lilypond", - "liquid", - "lisp", - "livescript", - "llvm", - "log", - "lolcode", - "lua", - "magma", - "makefile", - "markdown", - "markup", - "markup-templating", - "matlab", - "maxscript", - "mel", - "mermaid", - "mizar", - "mongodb", - "monkey", - "moonscript", - "n1ql", - "n4js", - "nand2tetris-hdl", - "naniscript", - "nasm", - "neon", - "nevod", - "nginx", - "nim", - "nix", - "nsis", - "objectivec", - "ocaml", - "opencl", - "openqasm", - "oz", - "parigp", - "parser", - "pascal", - "pascaligo", - "pcaxis", - "peoplecode", - "perl", - "php", - "php-extras", - "phpdoc", - "plsql", - "powerquery", - "powershell", - "processing", - "prolog", - "promql", - "properties", - "protobuf", - "psl", - "pug", - "puppet", - "pure", - "purebasic", - "purescript", - "python", - "q", - "qml", - "qore", - "qsharp", - "r", - "racket", - "reason", - "regex", - "rego", - "renpy", - "rest", - "rip", - "roboconf", - "robotframework", - "ruby", - "rust", - "sas", - "sass", - "scala", - "scheme", - "scss", - "shell-session", - "smali", - "smalltalk", - "smarty", - "sml", - "solidity", - "solution-file", - "soy", - "sparql", - "splunk-spl", - "sqf", - "sql", - "squirrel", - "stan", - "stylus", - "swift", - "systemd", - "t4-cs", - "t4-templating", - "t4-vb", - "tap", - "tcl", - "textile", - "toml", - "tremor", - "tsx", - "tt2", - "turtle", - "twig", - "typescript", - "typoscript", - "unrealscript", - "uorazor", - "uri", - "v", - "vala", - "vbnet", - "velocity", - "verilog", - "vhdl", - "vim", - "visual-basic", - "warpscript", - "wasm", - "web-idl", - "wiki", - "wolfram", - "wren", - "xeora", - "xml-doc", - "xojo", - "xquery", - "yaml", - "yang", - "zig", - ], - ] - ] = None, - code: Optional[Union[Var[str], str]] = None, - show_line_numbers: Optional[Union[Var[bool], bool]] = None, - starting_line_number: Optional[Union[Var[int], int]] = None, - wrap_long_lines: Optional[Union[Var[bool], bool]] = None, - custom_style: Optional[Dict[str, str]] = None, - code_tag_props: Optional[Union[Var[Dict[str, str]], Dict[str, str]]] = None, - style: Optional[Style] = None, - key: Optional[Any] = None, - id: Optional[Any] = None, - class_name: Optional[Any] = None, - autofocus: Optional[bool] = None, - _rename_props: Optional[Dict[str, str]] = None, - custom_attrs: Optional[Dict[str, Union[Var, str]]] = None, - on_blur: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_click: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_context_menu: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_double_click: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_focus: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_mount: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_mouse_down: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_mouse_enter: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_mouse_leave: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_mouse_move: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_mouse_out: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_mouse_over: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_mouse_up: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_scroll: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - on_unmount: Optional[ - Union[EventHandler, EventSpec, list, function, BaseVar] - ] = None, - **props - ) -> "CodeBlock": - """Create a text component. - - Args: - *children: The children of the component. - can_copy: Whether a copy button should appears. - copy_button: A custom copy button to override the default one. - theme: The theme to use ("light" or "dark"). - language: The language to use. - code: The code to display. - show_line_numbers: If this is enabled line numbers will be shown next to the code block. - starting_line_number: The starting line number to use. - wrap_long_lines: Whether to wrap long lines. - custom_style: A custom style for the code block. - code_tag_props: Props passed down to the code tag. - style: The style of the component. - key: A unique key for the component. - id: The id for the component. - class_name: The class name for the component. - autofocus: Whether the component should take the focus once the page is loaded - _rename_props: props to change the name of - custom_attrs: custom attribute - **props: The props to pass to the component. - - Returns: - The text component. - """ - ... class Code(ChakraComponent): @overload diff --git a/reflex/components/datadisplay/__init__.py b/reflex/components/datadisplay/__init__.py index 0ef1619d1..ba40d9f59 100644 --- a/reflex/components/datadisplay/__init__.py +++ b/reflex/components/datadisplay/__init__.py @@ -1,6 +1,10 @@ """Data grid components.""" +from .code import CodeBlock +from .code import LiteralCodeBlockTheme as LiteralCodeBlockTheme +from .code import LiteralCodeLanguage as LiteralCodeLanguage from .dataeditor import DataEditor, DataEditorTheme +code_block = CodeBlock.create data_editor = DataEditor.create data_editor_theme = DataEditorTheme diff --git a/reflex/components/datadisplay/code.py b/reflex/components/datadisplay/code.py new file mode 100644 index 000000000..ec9633399 --- /dev/null +++ b/reflex/components/datadisplay/code.py @@ -0,0 +1,512 @@ +"""A code component.""" +import re +from typing import Dict, Literal, Optional, Union + +from reflex.components.chakra.forms import Button, color_mode_cond +from reflex.components.chakra.layout import Box +from reflex.components.chakra.media import Icon +from reflex.components.component import Component +from reflex.event import set_clipboard +from reflex.style import Style +from reflex.utils import format, imports +from reflex.utils.imports import ImportVar +from reflex.vars import Var + +LiteralCodeBlockTheme = Literal[ + "a11y-dark", + "atom-dark", + "cb", + "coldark-cold", + "coldark-dark", + "coy", + "coy-without-shadows", + "darcula", + "dark", + "dracula", + "duotone-dark", + "duotone-earth", + "duotone-forest", + "duotone-light", + "duotone-sea", + "duotone-space", + "funky", + "ghcolors", + "gruvbox-dark", + "gruvbox-light", + "holi-theme", + "hopscotch", + "light", # not present in react-syntax-highlighter styles + "lucario", + "material-dark", + "material-light", + "material-oceanic", + "night-owl", + "nord", + "okaidia", + "one-dark", + "one-light", + "pojoaque", + "prism", + "shades-of-purple", + "solarized-dark-atom", + "solarizedlight", + "synthwave84", + "tomorrow", + "twilight", + "vs", + "vs-dark", + "vsc-dark-plus", + "xonokai", + "z-touch", +] + + +LiteralCodeLanguage = Literal[ + "abap", + "abnf", + "actionscript", + "ada", + "agda", + "al", + "antlr4", + "apacheconf", + "apex", + "apl", + "applescript", + "aql", + "arduino", + "arff", + "asciidoc", + "asm6502", + "asmatmel", + "aspnet", + "autohotkey", + "autoit", + "avisynth", + "avro-idl", + "bash", + "basic", + "batch", + "bbcode", + "bicep", + "birb", + "bison", + "bnf", + "brainfuck", + "brightscript", + "bro", + "bsl", + "c", + "cfscript", + "chaiscript", + "cil", + "clike", + "clojure", + "cmake", + "cobol", + "coffeescript", + "concurnas", + "coq", + "core", + "cpp", + "crystal", + "csharp", + "cshtml", + "csp", + "css", + "css-extras", + "csv", + "cypher", + "d", + "dart", + "dataweave", + "dax", + "dhall", + "diff", + "django", + "dns-zone-file", + "docker", + "dot", + "ebnf", + "editorconfig", + "eiffel", + "ejs", + "elixir", + "elm", + "erb", + "erlang", + "etlua", + "excel-formula", + "factor", + "false", + "firestore-security-rules", + "flow", + "fortran", + "fsharp", + "ftl", + "gap", + "gcode", + "gdscript", + "gedcom", + "gherkin", + "git", + "glsl", + "gml", + "gn", + "go", + "go-module", + "graphql", + "groovy", + "haml", + "handlebars", + "haskell", + "haxe", + "hcl", + "hlsl", + "hoon", + "hpkp", + "hsts", + "http", + "ichigojam", + "icon", + "icu-message-format", + "idris", + "iecst", + "ignore", + "index", + "inform7", + "ini", + "io", + "j", + "java", + "javadoc", + "javadoclike", + "javascript", + "javastacktrace", + "jexl", + "jolie", + "jq", + "js-extras", + "js-templates", + "jsdoc", + "json", + "json5", + "jsonp", + "jsstacktrace", + "jsx", + "julia", + "keepalived", + "keyman", + "kotlin", + "kumir", + "kusto", + "latex", + "latte", + "less", + "lilypond", + "liquid", + "lisp", + "livescript", + "llvm", + "log", + "lolcode", + "lua", + "magma", + "makefile", + "markdown", + "markup", + "markup-templating", + "matlab", + "maxscript", + "mel", + "mermaid", + "mizar", + "mongodb", + "monkey", + "moonscript", + "n1ql", + "n4js", + "nand2tetris-hdl", + "naniscript", + "nasm", + "neon", + "nevod", + "nginx", + "nim", + "nix", + "nsis", + "objectivec", + "ocaml", + "opencl", + "openqasm", + "oz", + "parigp", + "parser", + "pascal", + "pascaligo", + "pcaxis", + "peoplecode", + "perl", + "php", + "php-extras", + "phpdoc", + "plsql", + "powerquery", + "powershell", + "processing", + "prolog", + "promql", + "properties", + "protobuf", + "psl", + "pug", + "puppet", + "pure", + "purebasic", + "purescript", + "python", + "q", + "qml", + "qore", + "qsharp", + "r", + "racket", + "reason", + "regex", + "rego", + "renpy", + "rest", + "rip", + "roboconf", + "robotframework", + "ruby", + "rust", + "sas", + "sass", + "scala", + "scheme", + "scss", + "shell-session", + "smali", + "smalltalk", + "smarty", + "sml", + "solidity", + "solution-file", + "soy", + "sparql", + "splunk-spl", + "sqf", + "sql", + "squirrel", + "stan", + "stylus", + "swift", + "systemd", + "t4-cs", + "t4-templating", + "t4-vb", + "tap", + "tcl", + "textile", + "toml", + "tremor", + "tsx", + "tt2", + "turtle", + "twig", + "typescript", + "typoscript", + "unrealscript", + "uorazor", + "uri", + "v", + "vala", + "vbnet", + "velocity", + "verilog", + "vhdl", + "vim", + "visual-basic", + "warpscript", + "wasm", + "web-idl", + "wiki", + "wolfram", + "wren", + "xeora", + "xml-doc", + "xojo", + "xquery", + "yaml", + "yang", + "zig", +] + + +class CodeBlock(Component): + """A code block.""" + + library = "react-syntax-highlighter@15.5.0" + + tag = "PrismAsyncLight" + + alias = "SyntaxHighlighter" + + # The theme to use ("light" or "dark"). + theme: Var[LiteralCodeBlockTheme] = "one-light" # type: ignore + + # The language to use. + language: Var[LiteralCodeLanguage] = "python" # type: ignore + + # The code to display. + code: 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: Dict[str, str] = {} + + # Props passed down to the code tag. + code_tag_props: Var[Dict[str, str]] + + def _get_imports(self) -> imports.ImportDict: + merged_imports = super()._get_imports() + # Get all themes from a cond literal + themes = re.findall(r"`(.*?)`", self.theme._var_name) + if not themes: + themes = [self.theme._var_name] + merged_imports = imports.merge_imports( + merged_imports, + { + f"react-syntax-highlighter/dist/cjs/styles/prism/{theme}": { + ImportVar( + tag=format.to_camel_case(theme), + is_default=True, + install=False, + ) + } + for theme in themes + }, + ) + if ( + self.language is not None + and self.language._var_name in LiteralCodeLanguage.__args__ # type: ignore + ): + merged_imports = imports.merge_imports( + merged_imports, + { + f"react-syntax-highlighter/dist/cjs/languages/prism/{self.language._var_name}": { + ImportVar( + tag=format.to_camel_case(self.language._var_name), + is_default=True, + install=False, + ) + } + }, + ) + return merged_imports + + def _get_custom_code(self) -> Optional[str]: + if ( + self.language is not None + and self.language._var_name in LiteralCodeLanguage.__args__ # type: ignore + ): + return f"{self.alias}.registerLanguage('{self.language._var_name}', {format.to_camel_case(self.language._var_name)})" + + @classmethod + def create( + cls, + *children, + can_copy: Optional[bool] = False, + copy_button: Optional[Union[bool, Component]] = None, + **props, + ): + """Create a text component. + + Args: + *children: The children of the component. + can_copy: Whether a copy button should appears. + copy_button: A custom copy button to override the default one. + **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", {}) + + if "theme" not in props: + # Default color scheme responds to global color mode. + props["theme"] = color_mode_cond(light="one-light", dark="one-dark") + + # react-syntax-highlighter doesnt have an explicit "light" or "dark" theme so we use one-light and one-dark + # themes respectively to ensure code compatibility. + if "theme" in props and not isinstance(props["theme"], Var): + props["theme"] = ( + "one-light" + if props["theme"] == "light" + else "one-dark" + if props["theme"] == "dark" + else props["theme"] + ) + + if can_copy: + code = children[0] + copy_button = ( # type: ignore + copy_button + if copy_button is not None + else Button.create( + Icon.create(tag="copy"), + on_click=set_clipboard(code), + style=Style({"position": "absolute", "top": "0.5em", "right": "0"}), + ) + ) + custom_style.update({"padding": "1em 3.2em 1em 1em"}) + else: + copy_button = None + + # 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 + + # Carry the children (code) via props + if children: + props["code"] = children[0] + if not isinstance(props["code"], Var): + props["code"] = Var.create(props["code"], _var_is_string=True) + + # Create the component. + code_block = super().create( + **props, + custom_style=Style(custom_style), + ) + + if copy_button: + return Box.create(code_block, copy_button, position="relative") + else: + return code_block + + def _add_style(self, style): + self.custom_style.update(style) # type: ignore + + def _render(self): + out = super()._render() + predicate, qmark, value = self.theme._var_name.partition("?") + out.add_props( + style=Var.create( + format.to_camel_case(f"{predicate}{qmark}{value.replace('`', '')}"), + _var_is_local=False, + ) + ).remove_props("theme", "code") + if self.code is not None: + out.special_props.add(Var.create_safe(f"children={str(self.code)}")) + return out diff --git a/reflex/components/datadisplay/code.pyi b/reflex/components/datadisplay/code.pyi new file mode 100644 index 000000000..e398da463 --- /dev/null +++ b/reflex/components/datadisplay/code.pyi @@ -0,0 +1,1113 @@ +"""Stub file for reflex/components/datadisplay/code.py""" +# ------------------- DO NOT EDIT ---------------------- +# This file was generated by `scripts/pyi_generator.py`! +# ------------------------------------------------------ + +from typing import Any, Dict, Literal, Optional, Union, overload +from reflex.vars import Var, BaseVar, ComputedVar +from reflex.event import EventChain, EventHandler, EventSpec +from reflex.style import Style +import re +from typing import Dict, Literal, Optional, Union +from reflex.components.chakra.forms import Button, color_mode_cond +from reflex.components.chakra.layout import Box +from reflex.components.chakra.media import Icon +from reflex.components.component import Component +from reflex.event import set_clipboard +from reflex.style import Style +from reflex.utils import format, imports +from reflex.utils.imports import ImportVar +from reflex.vars import Var + +LiteralCodeBlockTheme = Literal[ + "a11y-dark", + "atom-dark", + "cb", + "coldark-cold", + "coldark-dark", + "coy", + "coy-without-shadows", + "darcula", + "dark", + "dracula", + "duotone-dark", + "duotone-earth", + "duotone-forest", + "duotone-light", + "duotone-sea", + "duotone-space", + "funky", + "ghcolors", + "gruvbox-dark", + "gruvbox-light", + "holi-theme", + "hopscotch", + "light", + "lucario", + "material-dark", + "material-light", + "material-oceanic", + "night-owl", + "nord", + "okaidia", + "one-dark", + "one-light", + "pojoaque", + "prism", + "shades-of-purple", + "solarized-dark-atom", + "solarizedlight", + "synthwave84", + "tomorrow", + "twilight", + "vs", + "vs-dark", + "vsc-dark-plus", + "xonokai", + "z-touch", +] +LiteralCodeLanguage = Literal[ + "abap", + "abnf", + "actionscript", + "ada", + "agda", + "al", + "antlr4", + "apacheconf", + "apex", + "apl", + "applescript", + "aql", + "arduino", + "arff", + "asciidoc", + "asm6502", + "asmatmel", + "aspnet", + "autohotkey", + "autoit", + "avisynth", + "avro-idl", + "bash", + "basic", + "batch", + "bbcode", + "bicep", + "birb", + "bison", + "bnf", + "brainfuck", + "brightscript", + "bro", + "bsl", + "c", + "cfscript", + "chaiscript", + "cil", + "clike", + "clojure", + "cmake", + "cobol", + "coffeescript", + "concurnas", + "coq", + "core", + "cpp", + "crystal", + "csharp", + "cshtml", + "csp", + "css", + "css-extras", + "csv", + "cypher", + "d", + "dart", + "dataweave", + "dax", + "dhall", + "diff", + "django", + "dns-zone-file", + "docker", + "dot", + "ebnf", + "editorconfig", + "eiffel", + "ejs", + "elixir", + "elm", + "erb", + "erlang", + "etlua", + "excel-formula", + "factor", + "false", + "firestore-security-rules", + "flow", + "fortran", + "fsharp", + "ftl", + "gap", + "gcode", + "gdscript", + "gedcom", + "gherkin", + "git", + "glsl", + "gml", + "gn", + "go", + "go-module", + "graphql", + "groovy", + "haml", + "handlebars", + "haskell", + "haxe", + "hcl", + "hlsl", + "hoon", + "hpkp", + "hsts", + "http", + "ichigojam", + "icon", + "icu-message-format", + "idris", + "iecst", + "ignore", + "index", + "inform7", + "ini", + "io", + "j", + "java", + "javadoc", + "javadoclike", + "javascript", + "javastacktrace", + "jexl", + "jolie", + "jq", + "js-extras", + "js-templates", + "jsdoc", + "json", + "json5", + "jsonp", + "jsstacktrace", + "jsx", + "julia", + "keepalived", + "keyman", + "kotlin", + "kumir", + "kusto", + "latex", + "latte", + "less", + "lilypond", + "liquid", + "lisp", + "livescript", + "llvm", + "log", + "lolcode", + "lua", + "magma", + "makefile", + "markdown", + "markup", + "markup-templating", + "matlab", + "maxscript", + "mel", + "mermaid", + "mizar", + "mongodb", + "monkey", + "moonscript", + "n1ql", + "n4js", + "nand2tetris-hdl", + "naniscript", + "nasm", + "neon", + "nevod", + "nginx", + "nim", + "nix", + "nsis", + "objectivec", + "ocaml", + "opencl", + "openqasm", + "oz", + "parigp", + "parser", + "pascal", + "pascaligo", + "pcaxis", + "peoplecode", + "perl", + "php", + "php-extras", + "phpdoc", + "plsql", + "powerquery", + "powershell", + "processing", + "prolog", + "promql", + "properties", + "protobuf", + "psl", + "pug", + "puppet", + "pure", + "purebasic", + "purescript", + "python", + "q", + "qml", + "qore", + "qsharp", + "r", + "racket", + "reason", + "regex", + "rego", + "renpy", + "rest", + "rip", + "roboconf", + "robotframework", + "ruby", + "rust", + "sas", + "sass", + "scala", + "scheme", + "scss", + "shell-session", + "smali", + "smalltalk", + "smarty", + "sml", + "solidity", + "solution-file", + "soy", + "sparql", + "splunk-spl", + "sqf", + "sql", + "squirrel", + "stan", + "stylus", + "swift", + "systemd", + "t4-cs", + "t4-templating", + "t4-vb", + "tap", + "tcl", + "textile", + "toml", + "tremor", + "tsx", + "tt2", + "turtle", + "twig", + "typescript", + "typoscript", + "unrealscript", + "uorazor", + "uri", + "v", + "vala", + "vbnet", + "velocity", + "verilog", + "vhdl", + "vim", + "visual-basic", + "warpscript", + "wasm", + "web-idl", + "wiki", + "wolfram", + "wren", + "xeora", + "xml-doc", + "xojo", + "xquery", + "yaml", + "yang", + "zig", +] + +class CodeBlock(Component): + @overload + @classmethod + def create( # type: ignore + cls, + *children, + can_copy: Optional[bool] = False, + copy_button: Optional[Union[bool, Component]] = None, + theme: Optional[ + Union[ + Var[ + Literal[ + "a11y-dark", + "atom-dark", + "cb", + "coldark-cold", + "coldark-dark", + "coy", + "coy-without-shadows", + "darcula", + "dark", + "dracula", + "duotone-dark", + "duotone-earth", + "duotone-forest", + "duotone-light", + "duotone-sea", + "duotone-space", + "funky", + "ghcolors", + "gruvbox-dark", + "gruvbox-light", + "holi-theme", + "hopscotch", + "light", + "lucario", + "material-dark", + "material-light", + "material-oceanic", + "night-owl", + "nord", + "okaidia", + "one-dark", + "one-light", + "pojoaque", + "prism", + "shades-of-purple", + "solarized-dark-atom", + "solarizedlight", + "synthwave84", + "tomorrow", + "twilight", + "vs", + "vs-dark", + "vsc-dark-plus", + "xonokai", + "z-touch", + ] + ], + Literal[ + "a11y-dark", + "atom-dark", + "cb", + "coldark-cold", + "coldark-dark", + "coy", + "coy-without-shadows", + "darcula", + "dark", + "dracula", + "duotone-dark", + "duotone-earth", + "duotone-forest", + "duotone-light", + "duotone-sea", + "duotone-space", + "funky", + "ghcolors", + "gruvbox-dark", + "gruvbox-light", + "holi-theme", + "hopscotch", + "light", + "lucario", + "material-dark", + "material-light", + "material-oceanic", + "night-owl", + "nord", + "okaidia", + "one-dark", + "one-light", + "pojoaque", + "prism", + "shades-of-purple", + "solarized-dark-atom", + "solarizedlight", + "synthwave84", + "tomorrow", + "twilight", + "vs", + "vs-dark", + "vsc-dark-plus", + "xonokai", + "z-touch", + ], + ] + ] = None, + language: Optional[ + Union[ + Var[ + Literal[ + "abap", + "abnf", + "actionscript", + "ada", + "agda", + "al", + "antlr4", + "apacheconf", + "apex", + "apl", + "applescript", + "aql", + "arduino", + "arff", + "asciidoc", + "asm6502", + "asmatmel", + "aspnet", + "autohotkey", + "autoit", + "avisynth", + "avro-idl", + "bash", + "basic", + "batch", + "bbcode", + "bicep", + "birb", + "bison", + "bnf", + "brainfuck", + "brightscript", + "bro", + "bsl", + "c", + "cfscript", + "chaiscript", + "cil", + "clike", + "clojure", + "cmake", + "cobol", + "coffeescript", + "concurnas", + "coq", + "core", + "cpp", + "crystal", + "csharp", + "cshtml", + "csp", + "css", + "css-extras", + "csv", + "cypher", + "d", + "dart", + "dataweave", + "dax", + "dhall", + "diff", + "django", + "dns-zone-file", + "docker", + "dot", + "ebnf", + "editorconfig", + "eiffel", + "ejs", + "elixir", + "elm", + "erb", + "erlang", + "etlua", + "excel-formula", + "factor", + "false", + "firestore-security-rules", + "flow", + "fortran", + "fsharp", + "ftl", + "gap", + "gcode", + "gdscript", + "gedcom", + "gherkin", + "git", + "glsl", + "gml", + "gn", + "go", + "go-module", + "graphql", + "groovy", + "haml", + "handlebars", + "haskell", + "haxe", + "hcl", + "hlsl", + "hoon", + "hpkp", + "hsts", + "http", + "ichigojam", + "icon", + "icu-message-format", + "idris", + "iecst", + "ignore", + "index", + "inform7", + "ini", + "io", + "j", + "java", + "javadoc", + "javadoclike", + "javascript", + "javastacktrace", + "jexl", + "jolie", + "jq", + "js-extras", + "js-templates", + "jsdoc", + "json", + "json5", + "jsonp", + "jsstacktrace", + "jsx", + "julia", + "keepalived", + "keyman", + "kotlin", + "kumir", + "kusto", + "latex", + "latte", + "less", + "lilypond", + "liquid", + "lisp", + "livescript", + "llvm", + "log", + "lolcode", + "lua", + "magma", + "makefile", + "markdown", + "markup", + "markup-templating", + "matlab", + "maxscript", + "mel", + "mermaid", + "mizar", + "mongodb", + "monkey", + "moonscript", + "n1ql", + "n4js", + "nand2tetris-hdl", + "naniscript", + "nasm", + "neon", + "nevod", + "nginx", + "nim", + "nix", + "nsis", + "objectivec", + "ocaml", + "opencl", + "openqasm", + "oz", + "parigp", + "parser", + "pascal", + "pascaligo", + "pcaxis", + "peoplecode", + "perl", + "php", + "php-extras", + "phpdoc", + "plsql", + "powerquery", + "powershell", + "processing", + "prolog", + "promql", + "properties", + "protobuf", + "psl", + "pug", + "puppet", + "pure", + "purebasic", + "purescript", + "python", + "q", + "qml", + "qore", + "qsharp", + "r", + "racket", + "reason", + "regex", + "rego", + "renpy", + "rest", + "rip", + "roboconf", + "robotframework", + "ruby", + "rust", + "sas", + "sass", + "scala", + "scheme", + "scss", + "shell-session", + "smali", + "smalltalk", + "smarty", + "sml", + "solidity", + "solution-file", + "soy", + "sparql", + "splunk-spl", + "sqf", + "sql", + "squirrel", + "stan", + "stylus", + "swift", + "systemd", + "t4-cs", + "t4-templating", + "t4-vb", + "tap", + "tcl", + "textile", + "toml", + "tremor", + "tsx", + "tt2", + "turtle", + "twig", + "typescript", + "typoscript", + "unrealscript", + "uorazor", + "uri", + "v", + "vala", + "vbnet", + "velocity", + "verilog", + "vhdl", + "vim", + "visual-basic", + "warpscript", + "wasm", + "web-idl", + "wiki", + "wolfram", + "wren", + "xeora", + "xml-doc", + "xojo", + "xquery", + "yaml", + "yang", + "zig", + ] + ], + Literal[ + "abap", + "abnf", + "actionscript", + "ada", + "agda", + "al", + "antlr4", + "apacheconf", + "apex", + "apl", + "applescript", + "aql", + "arduino", + "arff", + "asciidoc", + "asm6502", + "asmatmel", + "aspnet", + "autohotkey", + "autoit", + "avisynth", + "avro-idl", + "bash", + "basic", + "batch", + "bbcode", + "bicep", + "birb", + "bison", + "bnf", + "brainfuck", + "brightscript", + "bro", + "bsl", + "c", + "cfscript", + "chaiscript", + "cil", + "clike", + "clojure", + "cmake", + "cobol", + "coffeescript", + "concurnas", + "coq", + "core", + "cpp", + "crystal", + "csharp", + "cshtml", + "csp", + "css", + "css-extras", + "csv", + "cypher", + "d", + "dart", + "dataweave", + "dax", + "dhall", + "diff", + "django", + "dns-zone-file", + "docker", + "dot", + "ebnf", + "editorconfig", + "eiffel", + "ejs", + "elixir", + "elm", + "erb", + "erlang", + "etlua", + "excel-formula", + "factor", + "false", + "firestore-security-rules", + "flow", + "fortran", + "fsharp", + "ftl", + "gap", + "gcode", + "gdscript", + "gedcom", + "gherkin", + "git", + "glsl", + "gml", + "gn", + "go", + "go-module", + "graphql", + "groovy", + "haml", + "handlebars", + "haskell", + "haxe", + "hcl", + "hlsl", + "hoon", + "hpkp", + "hsts", + "http", + "ichigojam", + "icon", + "icu-message-format", + "idris", + "iecst", + "ignore", + "index", + "inform7", + "ini", + "io", + "j", + "java", + "javadoc", + "javadoclike", + "javascript", + "javastacktrace", + "jexl", + "jolie", + "jq", + "js-extras", + "js-templates", + "jsdoc", + "json", + "json5", + "jsonp", + "jsstacktrace", + "jsx", + "julia", + "keepalived", + "keyman", + "kotlin", + "kumir", + "kusto", + "latex", + "latte", + "less", + "lilypond", + "liquid", + "lisp", + "livescript", + "llvm", + "log", + "lolcode", + "lua", + "magma", + "makefile", + "markdown", + "markup", + "markup-templating", + "matlab", + "maxscript", + "mel", + "mermaid", + "mizar", + "mongodb", + "monkey", + "moonscript", + "n1ql", + "n4js", + "nand2tetris-hdl", + "naniscript", + "nasm", + "neon", + "nevod", + "nginx", + "nim", + "nix", + "nsis", + "objectivec", + "ocaml", + "opencl", + "openqasm", + "oz", + "parigp", + "parser", + "pascal", + "pascaligo", + "pcaxis", + "peoplecode", + "perl", + "php", + "php-extras", + "phpdoc", + "plsql", + "powerquery", + "powershell", + "processing", + "prolog", + "promql", + "properties", + "protobuf", + "psl", + "pug", + "puppet", + "pure", + "purebasic", + "purescript", + "python", + "q", + "qml", + "qore", + "qsharp", + "r", + "racket", + "reason", + "regex", + "rego", + "renpy", + "rest", + "rip", + "roboconf", + "robotframework", + "ruby", + "rust", + "sas", + "sass", + "scala", + "scheme", + "scss", + "shell-session", + "smali", + "smalltalk", + "smarty", + "sml", + "solidity", + "solution-file", + "soy", + "sparql", + "splunk-spl", + "sqf", + "sql", + "squirrel", + "stan", + "stylus", + "swift", + "systemd", + "t4-cs", + "t4-templating", + "t4-vb", + "tap", + "tcl", + "textile", + "toml", + "tremor", + "tsx", + "tt2", + "turtle", + "twig", + "typescript", + "typoscript", + "unrealscript", + "uorazor", + "uri", + "v", + "vala", + "vbnet", + "velocity", + "verilog", + "vhdl", + "vim", + "visual-basic", + "warpscript", + "wasm", + "web-idl", + "wiki", + "wolfram", + "wren", + "xeora", + "xml-doc", + "xojo", + "xquery", + "yaml", + "yang", + "zig", + ], + ] + ] = None, + code: Optional[Union[Var[str], str]] = None, + show_line_numbers: Optional[Union[Var[bool], bool]] = None, + starting_line_number: Optional[Union[Var[int], int]] = None, + wrap_long_lines: Optional[Union[Var[bool], bool]] = None, + custom_style: Optional[Dict[str, str]] = None, + code_tag_props: Optional[Union[Var[Dict[str, str]], Dict[str, str]]] = None, + style: Optional[Style] = None, + key: Optional[Any] = None, + id: Optional[Any] = None, + class_name: Optional[Any] = None, + autofocus: Optional[bool] = None, + _rename_props: Optional[Dict[str, str]] = None, + custom_attrs: Optional[Dict[str, Union[Var, str]]] = None, + on_blur: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_click: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_context_menu: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_double_click: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_focus: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_mount: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_mouse_down: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_mouse_enter: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_mouse_leave: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_mouse_move: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_mouse_out: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_mouse_over: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_mouse_up: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_scroll: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + on_unmount: Optional[ + Union[EventHandler, EventSpec, list, function, BaseVar] + ] = None, + **props + ) -> "CodeBlock": + """Create a text component. + + Args: + *children: The children of the component. + can_copy: Whether a copy button should appears. + copy_button: A custom copy button to override the default one. + theme: The theme to use ("light" or "dark"). + language: The language to use. + code: The code to display. + show_line_numbers: If this is enabled line numbers will be shown next to the code block. + starting_line_number: The starting line number to use. + wrap_long_lines: Whether to wrap long lines. + custom_style: A custom style for the code block. + code_tag_props: Props passed down to the code tag. + style: The style of the component. + key: A unique key for the component. + id: The id for the component. + class_name: The class name for the component. + autofocus: Whether the component should take the focus once the page is loaded + _rename_props: props to change the name of + custom_attrs: custom attribute + **props: The props to pass to the component. + + Returns: + The text component. + """ + ... diff --git a/reflex/components/markdown/markdown.py b/reflex/components/markdown/markdown.py index 1c2b7746c..62a35e74e 100644 --- a/reflex/components/markdown/markdown.py +++ b/reflex/components/markdown/markdown.py @@ -50,7 +50,8 @@ def get_base_component_map() -> dict[str, Callable]: Returns: The base component map. """ - from reflex.components.chakra.datadisplay.code import Code, CodeBlock + from reflex.components.chakra.datadisplay.code import Code + from reflex.components.datadisplay.code import CodeBlock return { "h1": lambda value: Heading.create( @@ -164,7 +165,8 @@ class Markdown(Component): def _get_imports(self) -> imports.ImportDict: # Import here to avoid circular imports. - from reflex.components.chakra.datadisplay.code import Code, CodeBlock + from reflex.components.chakra.datadisplay.code import Code + from reflex.components.datadisplay.code import CodeBlock imports = super()._get_imports() diff --git a/reflex/components/radix/themes/components/__init__.py b/reflex/components/radix/themes/components/__init__.py index c4beba8f1..462e2e88a 100644 --- a/reflex/components/radix/themes/components/__init__.py +++ b/reflex/components/radix/themes/components/__init__.py @@ -28,6 +28,8 @@ from .textarea import text_area as text_area from .textfield import text_field as text_field from .tooltip import tooltip as tooltip +input = text_field + __all__ = [ "alert_dialog", "aspect_ratio", @@ -43,6 +45,7 @@ __all__ = [ "hover_card", "icon_button", "icon", + "input", "inset", "popover", "radio_group", diff --git a/reflex/components/radix/themes/layout/__init__.py b/reflex/components/radix/themes/layout/__init__.py index ae8688460..c6201f30a 100644 --- a/reflex/components/radix/themes/layout/__init__.py +++ b/reflex/components/radix/themes/layout/__init__.py @@ -7,7 +7,7 @@ from .flex import Flex from .grid import Grid from .section import Section from .spacer import Spacer -from .stack import HStack, VStack +from .stack import HStack, Stack, VStack box = Box.create center = Center.create @@ -16,6 +16,7 @@ flex = Flex.create grid = Grid.create section = Section.create spacer = Spacer.create +stack = Stack.create hstack = HStack.create vstack = VStack.create @@ -27,6 +28,7 @@ __all__ = [ "grid", "section", "spacer", + "stack", "hstack", "vstack", ] diff --git a/scripts/pyi_generator.py b/scripts/pyi_generator.py index 4e4fb9341..2ce0ae61f 100644 --- a/scripts/pyi_generator.py +++ b/scripts/pyi_generator.py @@ -914,7 +914,11 @@ if __name__ == "__main__": logging.basicConfig(level=logging.DEBUG) logging.getLogger("blib2to3.pgen2.driver").setLevel(logging.INFO) - targets = sys.argv[1:] if len(sys.argv) > 1 else ["reflex/components"] + targets = ( + [arg for arg in sys.argv[1:] if not arg.startswith("tests")] + if len(sys.argv) > 1 + else ["reflex/components"] + ) logger.info(f"Running .pyi generator for {targets}") changed_files = _get_changed_files() diff --git a/tests/components/datadisplay/test_code.py b/tests/components/datadisplay/test_code.py index 1557cef84..64452e90c 100644 --- a/tests/components/datadisplay/test_code.py +++ b/tests/components/datadisplay/test_code.py @@ -1,6 +1,6 @@ import pytest -from reflex.components.chakra.datadisplay.code import CodeBlock +from reflex.components.datadisplay.code import CodeBlock @pytest.mark.parametrize(