quirl.components.code¶
A theme-colored, horizontally-scrollable code block.
Module Contents¶
Classes¶
A theme-colored, monospace code block with horizontal scroll. |
|
An editable theme-colored, monospace code block with horizontal scroll. |
Functions¶
Returns the codeblock default style.’ |
API¶
- class quirl.components.code.CodeBlock(element: Optional[str] = None, properties: Optional[Dict[str, str]] = None, props: Optional[Dict[str, str]] = None, style: Optional[Dict[str, str]] = None, inner_html: Optional[Union[str, str, float]] = None, children: Optional[List[duck.html.components.HtmlComponent]] = None, **kwargs)[source]¶
Bases:
duck.html.components.code.CodeBlockA theme-colored, monospace code block with horizontal scroll.
Required Props: - code (str): The code text to display inside the code block.
Optional Props: - language (str): Label shown in the header, e.g. “python”. Also applied to the inner
<code>tag as alanguage-{language}class.- filename (str): Filename shown in the header, e.g. "main.py". - collapsible (bool): Renders a fixed-height preview with a bottom fade and a labeled toggle beneath the code when True. - collapsed_height (str): Preview height while collapsed, e.g. "320px". Defaults to a height that reads as a genuine preview rather than a sliver. - expand_label (str): Footer label shown while collapsed. Defaults to "Show more". - ollapse_label (str): Footer label shown while expanded. Defaults to "Show less". - code_props (dict): Extra props applied to the `<code>` tag. - code_style (dict): Extra styles applied to the `<code>` tag. - disable_copy_button (bool): Hides the copy button when True. - idle_icon (str): Raw svg shown on the copy button by default. - success_icon (str): Raw svg shown after a successful copy. - chevron_icon (str): Raw svg shown in the collapse footer.Usage:
CodeBlock(code="Button(text='Click me')", language="python")
Initialization
Initialize an HTML component.
- Parameters:
element – The HTML element tag name (e.g., textarea, input, button). Can be None, but make sure element is returned by get_element method.
accept_inner_html – Whether the HTML component accepts an inner body (e.g., inner-body-here).
inner_html – Inner html to add to the HTML component. Defaults to None.
properties – Dictionary for properties to initialize the component with.
props – Just same as properties argument (added for simplicity).
style – Dictionary for style to initialize the component with.
event_handlers – Events to automatically bind. Each dictionary maps an event name to its handler and may include additional keyword arguments forwarded to
bind(), e.g.event_handlers=[{"click": on_button_click, **extra_kwargs}].**kwargs – Extra keyword arguments
- Raises:
HtmlComponentError – If ‘element’ is not a string or ‘inner_html’ is set but ‘accept_inner_html’ is False.
- docs_preview_kwargs¶
None
- class quirl.components.code.EditableCodeBlock(element: Optional[str] = None, properties: Optional[Dict[str, str]] = None, props: Optional[Dict[str, str]] = None, style: Optional[Dict[str, str]] = None, inner_html: Optional[Union[str, str, float]] = None, children: Optional[List[duck.html.components.HtmlComponent]] = None, **kwargs)[source]¶
Bases:
duck.html.components.code.EditableCodeBlockAn editable theme-colored, monospace code block with horizontal scroll.
Required Props: - code (str): The code text to display inside the code block.
Optional Props: - language (str): Label shown in the header, e.g. “python”. Also applied to the inner
<code>tag as alanguage-{language}class.- filename (str): Filename shown in the header, e.g. "main.py". - collapsible (bool): Renders a fixed-height preview with a bottom fade and a labeled toggle beneath the code when True. - collapsed_height (str): Preview height while collapsed, e.g. "320px". Defaults to a height that reads as a genuine preview rather than a sliver. - expand_label (str): Footer label shown while collapsed. Defaults to "Show more". - ollapse_label (str): Footer label shown while expanded. Defaults to "Show less". - code_props (dict): Extra props applied to the `<code>` tag. - code_style (dict): Extra styles applied to the `<code>` tag. - disable_copy_button (bool): Hides the copy button when True. - idle_icon (str): Raw svg shown on the copy button by default. - success_icon (str): Raw svg shown after a successful copy. - chevron_icon (str): Raw svg shown in the collapse footer.Usage:
CodeBlock(code="Button(text='Click me')", lanuage="python")
Initialization
Initialize an HTML component.
- Parameters:
element – The HTML element tag name (e.g., textarea, input, button). Can be None, but make sure element is returned by get_element method.
accept_inner_html – Whether the HTML component accepts an inner body (e.g., inner-body-here).
inner_html – Inner html to add to the HTML component. Defaults to None.
properties – Dictionary for properties to initialize the component with.
props – Just same as properties argument (added for simplicity).
style – Dictionary for style to initialize the component with.
event_handlers – Events to automatically bind. Each dictionary maps an event name to its handler and may include additional keyword arguments forwarded to
bind(), e.g.event_handlers=[{"click": on_button_click, **extra_kwargs}].**kwargs – Extra keyword arguments
- Raises:
HtmlComponentError – If ‘element’ is not a string or ‘inner_html’ is set but ‘accept_inner_html’ is False.
- docs_preview_kwargs¶
None