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

copy event chain

Browse Source
This commit is contained in:
Carlos 2024-10-18 12:06:39 +02:00 committed by Elijah
parent d692a055b9
commit 9f6c26637a
2 changed files with 21 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -13,7 +13,7 @@ from reflex.components.core.cond import color_mode_cond
from reflex.components.el.elements.forms import Button from reflex.components.el.elements.forms import Button
from reflex.components.lucide.icon import Icon from reflex.components.lucide.icon import Icon
from reflex.components.radix.themes.layout.box import Box from reflex.components.radix.themes.layout.box import Box
from reflex.event import call_script from reflex.event import call_script, set_clipboard
from reflex.style import Style from reflex.style import Style
from reflex.utils.exceptions import VarTypeError from reflex.utils.exceptions import VarTypeError
from reflex.utils.imports import ImportVar from reflex.utils.imports import ImportVar
@ -22,11 +22,9 @@ from reflex.vars.function import FunctionStringVar
from reflex.vars.sequence import StringVar, string_replace_operation from reflex.vars.sequence import StringVar, string_replace_operation
def copy_script(code: StringVar | str) -> Any: def copy_script() -> Any:
"""Copy script for the code block and modify the child SVG element. """Copy script for the code block and modify the child SVG element.
Args:
code (str): The code to be copied.
Returns: Returns:
Any: The result of calling the script. Any: The result of calling the script.
@ -49,30 +47,25 @@ document.addEventListener('click', function(event) {{
element.style.transform = `scale(${{scale}})`; element.style.transform = `scale(${{scale}})`;
element.style.opacity = opacity; element.style.opacity = opacity;
}} }}
// Copy the code to clipboard // Animate the SVG
navigator.clipboard.writeText(`{code}`).then(() => {{ transition(svgIcon, 0, '0');
// Animate the SVG setTimeout(() => {{
transition(svgIcon, 0, '0'); svgIcon.innerHTML = checkmarkPath; // Replace content with checkmark
svgIcon.setAttribute('viewBox', '0 0 24 24'); // Adjust viewBox if necessary
transition(svgIcon, 1, '1');
setTimeout(() => {{ setTimeout(() => {{
svgIcon.innerHTML = checkmarkPath; // Replace content with checkmark transition(svgIcon, 0, '0');
svgIcon.setAttribute('viewBox', '0 0 24 24'); // Adjust viewBox if necessary
transition(svgIcon, 1, '1');
setTimeout(() => {{ setTimeout(() => {{
transition(svgIcon, 0, '0'); svgIcon.innerHTML = originalPath; // Restore original SVG content
setTimeout(() => {{ transition(svgIcon, 1, '1');
svgIcon.innerHTML = originalPath; // Restore original SVG content }}, 125);
transition(svgIcon, 1, '1'); }}, 600);
}}, 125); }}, 125);
}}, 600);
}}, 125);
}}).catch(err => {{
console.error('Failed to copy text: ', err);
}});
}} else {{ }} else {{
console.error('SVG element not found within the parent.'); // console.error('SVG element not found within the parent.');
}} }}
}} else {{ }} else {{
console.error('Parent element not found.'); // console.error('Parent element not found.');
}} }}
}}); }});
""" """
@ -736,7 +729,10 @@ class ShikiHighLevelCodeBlock(ShikiCodeBlock):
if copy_button is not None if copy_button is not None
else Button.create( else Button.create(
Icon.create(tag="copy", size=16, color=color("gray", 11)), Icon.create(tag="copy", size=16, color=color("gray", 11)),
on_click=copy_script(cls._strip_transformer_triggers(code)), on_click=[
set_clipboard(cls._strip_transformer_triggers(code)), # type: ignore
copy_script(),
],
style=Style( style=Style(
{ {
"position": "absolute", "position": "absolute",

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

@ -11,9 +11,8 @@ from reflex.event import EventType
from reflex.style import Style from reflex.style import Style
from reflex.vars.base import Var from reflex.vars.base import Var
from reflex.vars.function import FunctionStringVar from reflex.vars.function import FunctionStringVar
from reflex.vars.sequence import StringVar
def copy_script(code: StringVar | str) -> Any: ... def copy_script() -> Any: ...
SHIKIJS_TRANSFORMER_FNS = { SHIKIJS_TRANSFORMER_FNS = {
"transformerNotationDiff", "transformerNotationDiff",