mirrors/django-components
1
0
Fork 0
mirror of https://github.com/django-components/django-components.git synced 2025-08-16 12:10:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions
django-components/dev/reference/django_components/components/index.html

1207 lines
No EOL
283 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html><html lang=en class=no-js> <head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><meta name=description content="A way to create simple reusable template components in Django."><link href=https://emilstenstrom.github.io/django-components/latest/reference/django_components/components/ rel=canonical><link href=../component_registry/ rel=prev><link href=dynamic/ rel=next><link rel=icon href=../../../assets/images/favicon.png><meta name=generator content="mkdocs-1.6.1, mkdocs-material-9.5.43"><title>Index - Django-Components</title><link rel=stylesheet href=../../../assets/stylesheets/main.0253249f.min.css><link rel=stylesheet href=../../../assets/stylesheets/palette.06af60db.min.css><link rel=preconnect href=https://fonts.gstatic.com crossorigin><link rel=stylesheet href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i%7CRoboto+Mono:400,400i,700,700i&display=fallback"><style>:root{--md-text-font:"Roboto";--md-code-font:"Roboto Mono"}</style><link rel=stylesheet href=../../../assets/_markdown_exec_pyodide.css><link rel=stylesheet href=../../../assets/_mkdocstrings.css><link rel=stylesheet href=../../../css/timeago.css><script>__md_scope=new URL("../../..",location),__md_hash=e=>[...e].reduce(((e,_)=>(e<<5)-e+_.charCodeAt(0)),0),__md_get=(e,_=localStorage,t=__md_scope)=>JSON.parse(_.getItem(t.pathname+"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=>{try{t.setItem(a.pathname+"."+e,JSON.stringify(_))}catch(e){}}</script><meta property=og:type content=website><meta property=og:title content="Index - Django-Components"><meta property=og:description content="A way to create simple reusable template components in Django."><meta property=og:image content=https://emilstenstrom.github.io/django-components/latest/assets/images/social/reference/django_components/components/index.png><meta property=og:image:type content=image/png><meta property=og:image:width content=1200><meta property=og:image:height content=630><meta content=https://emilstenstrom.github.io/django-components/latest/reference/django_components/components/ property=og:url><meta name=twitter:card content=summary_large_image><meta name=twitter:title content="Index - Django-Components"><meta name=twitter:description content="A way to create simple reusable template components in Django."><meta name=twitter:image content=https://emilstenstrom.github.io/django-components/latest/assets/images/social/reference/django_components/components/index.png></head> <body dir=ltr data-md-color-scheme=default data-md-color-primary=indigo data-md-color-accent=indigo> <input class=md-toggle data-md-toggle=drawer type=checkbox id=__drawer autocomplete=off> <input class=md-toggle data-md-toggle=search type=checkbox id=__search autocomplete=off> <label class=md-overlay for=__drawer></label> <div data-md-component=skip> <a href=#django_components.components class=md-skip> Skip to content </a> </div> <div data-md-component=announce> <aside class=md-banner> <div class="md-banner__inner md-grid md-typeset"> 🚨The documentation is still a work in progress. 🚨 </div> </aside> </div> <div data-md-color-scheme=default data-md-component=outdated hidden> </div> <header class="md-header md-header--shadow" data-md-component=header> <nav class="md-header__inner md-grid" aria-label=Header> <a href=../../.. title=Django-Components class="md-header__button md-logo" aria-label=Django-Components data-md-component=logo> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 8a3 3 0 0 0 3-3 3 3 0 0 0-3-3 3 3 0 0 0-3 3 3 3 0 0 0 3 3m0 3.54C9.64 9.35 6.5 8 3 8v11c3.5 0 6.64 1.35 9 3.54 2.36-2.19 5.5-3.54 9-3.54V8c-3.5 0-6.64 1.35-9 3.54"/></svg> </a> <label class="md-header__button md-icon" for=__drawer> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z"/></svg> </label> <div class=md-header__title data-md-component=header-title> <div class=md-header__ellipsis> <div class=md-header__topic> <span class=md-ellipsis> Django-Components </span> </div> <div class=md-header__topic data-md-component=header-topic> <span class=md-ellipsis> Index </span> </div> </div> </div> <form class=md-header__option data-md-component=palette> <input class=md-option data-md-color-media=(prefers-color-scheme) data-md-color-scheme=default data-md-color-primary=indigo data-md-color-accent=indigo aria-label="Switch to light mode" type=radio name=__palette id=__palette_0> <label class="md-header__button md-icon" title="Switch to light mode" for=__palette_1 hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="m14.3 16-.7-2h-3.2l-.7 2H7.8L11 7h2l3.2 9zM20 8.69V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12zm-9.15 3.96h2.3L12 9z"/></svg> </label> <input class=md-option data-md-color-media="(prefers-color-scheme: light)" data-md-color-scheme=default data-md-color-primary=teal data-md-color-accent=indigo aria-label="Switch to dark mode" type=radio name=__palette id=__palette_1> <label class="md-header__button md-icon" title="Switch to dark mode" for=__palette_2 hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="m17.75 4.09-2.53 1.94.91 3.06-2.63-1.81-2.63 1.81.91-3.06-2.53-1.94L12.44 4l1.06-3 1.06 3zm3.5 6.91-1.64 1.25.59 1.98-1.7-1.17-1.7 1.17.59-1.98L15.75 11l2.06-.05L18.5 9l.69 1.95zm-2.28 4.95c.83-.08 1.72 1.1 1.19 1.85-.32.45-.66.87-1.08 1.27C15.17 23 8.84 23 4.94 19.07c-3.91-3.9-3.91-10.24 0-14.14.4-.4.82-.76 1.27-1.08.75-.53 1.93.36 1.85 1.19-.27 2.86.69 5.83 2.89 8.02a9.96 9.96 0 0 0 8.02 2.89m-1.64 2.02a12.08 12.08 0 0 1-7.8-3.47c-2.17-2.19-3.33-5-3.49-7.82-2.81 3.14-2.7 7.96.31 10.98 3.02 3.01 7.84 3.12 10.98.31"/></svg> </label> <input class=md-option data-md-color-media="(prefers-color-scheme: dark)" data-md-color-scheme=slate data-md-color-primary=teal data-md-color-accent=indigo aria-label="Switch to light mode" type=radio name=__palette id=__palette_2> <label class="md-header__button md-icon" title="Switch to light mode" for=__palette_0 hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 7a5 5 0 0 1 5 5 5 5 0 0 1-5 5 5 5 0 0 1-5-5 5 5 0 0 1 5-5m0 2a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3m0-7 2.39 3.42C13.65 5.15 12.84 5 12 5s-1.65.15-2.39.42zM3.34 7l4.16-.35A7.2 7.2 0 0 0 5.94 8.5c-.44.74-.69 1.5-.83 2.29zm.02 10 1.76-3.77a7.131 7.131 0 0 0 2.38 4.14zM20.65 7l-1.77 3.79a7.02 7.02 0 0 0-2.38-4.15zm-.01 10-4.14.36c.59-.51 1.12-1.14 1.54-1.86.42-.73.69-1.5.83-2.29zM12 22l-2.41-3.44c.74.27 1.55.44 2.41.44.82 0 1.63-.17 2.37-.44z"/></svg> </label> </form> <script>var palette=__md_get("__palette");if(palette&&palette.color){if("(prefers-color-scheme)"===palette.color.media){var media=matchMedia("(prefers-color-scheme: light)"),input=document.querySelector(media.matches?"[data-md-color-media='(prefers-color-scheme: light)']":"[data-md-color-media='(prefers-color-scheme: dark)']");palette.color.media=input.getAttribute("data-md-color-media"),palette.color.scheme=input.getAttribute("data-md-color-scheme"),palette.color.primary=input.getAttribute("data-md-color-primary"),palette.color.accent=input.getAttribute("data-md-color-accent")}for(var[key,value]of Object.entries(palette.color))document.body.setAttribute("data-md-color-"+key,value)}</script> <label class="md-header__button md-icon" for=__search> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.52 6.52 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5"/></svg> </label> <div class=md-search data-md-component=search role=dialog> <label class=md-search__overlay for=__search></label> <div class=md-search__inner role=search> <form class=md-search__form name=search> <input type=text class=md-search__input name=query aria-label=Search placeholder=Search autocapitalize=off autocorrect=off autocomplete=off spellcheck=false data-md-component=search-query required> <label class="md-search__icon md-icon" for=__search> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.52 6.52 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5"/></svg> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11z"/></svg> </label> <nav class=md-search__options aria-label=Search> <a href=javascript:void(0) class="md-search__icon md-icon" title=Share aria-label=Share data-clipboard data-clipboard-text data-md-component=search-share tabindex=-1> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81a3 3 0 0 0 3-3 3 3 0 0 0-3-3 3 3 0 0 0-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9a3 3 0 0 0-3 3 3 3 0 0 0 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.15c-.05.21-.08.43-.08.66 0 1.61 1.31 2.91 2.92 2.91s2.92-1.3 2.92-2.91A2.92 2.92 0 0 0 18 16.08"/></svg> </a> <button type=reset class="md-search__icon md-icon" title=Clear aria-label=Clear tabindex=-1> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg> </button> </nav> <div class=md-search__suggest data-md-component=search-suggest></div> </form> <div class=md-search__output> <div class=md-search__scrollwrap tabindex=0 data-md-scrollfix> <div class=md-search-result data-md-component=search-result> <div class=md-search-result__meta> Initializing search </div> <ol class=md-search-result__list role=presentation></ol> </div> </div> </div> </div> </div> <div class=md-header__source> <a href=https://github.com/EmilStenstrom/django-components title="Go to repository" class=md-source data-md-component=source> <div class="md-source__icon md-icon"> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 496 512"><!-- Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6m-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3m44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9M244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8M97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1m-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7m32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1m-11.4-14.7c-1.6 1-1.6 3.6 0 5.9s4.3 3.3 5.6 2.3c1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2"/></svg> </div> <div class=md-source__repository> EmilStenstrom/django-components </div> </a> </div> </nav> </header> <div class=md-container data-md-component=container> <main class=md-main data-md-component=main> <div class="md-main__inner md-grid"> <div class="md-sidebar md-sidebar--primary" data-md-component=sidebar data-md-type=navigation> <div class=md-sidebar__scrollwrap> <div class=md-sidebar__inner> <nav class="md-nav md-nav--primary" aria-label=Navigation data-md-level=0> <label class=md-nav__title for=__drawer> <a href=../../.. title=Django-Components class="md-nav__button md-logo" aria-label=Django-Components data-md-component=logo> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M12 8a3 3 0 0 0 3-3 3 3 0 0 0-3-3 3 3 0 0 0-3 3 3 3 0 0 0 3 3m0 3.54C9.64 9.35 6.5 8 3 8v11c3.5 0 6.64 1.35 9 3.54 2.36-2.19 5.5-3.54 9-3.54V8c-3.5 0-6.64 1.35-9 3.54"/></svg> </a> Django-Components </label> <div class=md-nav__source> <a href=https://github.com/EmilStenstrom/django-components title="Go to repository" class=md-source data-md-component=source> <div class="md-source__icon md-icon"> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 496 512"><!-- Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6m-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3m44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9M244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8M97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1m-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7m32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1m-11.4-14.7c-1.6 1-1.6 3.6 0 5.9s4.3 3.3 5.6 2.3c1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2"/></svg> </div> <div class=md-source__repository> EmilStenstrom/django-components </div> </a> </div> <ul class=md-nav__list data-md-scrollfix> <li class="md-nav__item md-nav__item--section md-nav__item--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_1> <div class="md-nav__link md-nav__container"> <a href=../../.. class="md-nav__link "> <span class=md-ellipsis> README </span> </a> <label class="md-nav__link " for=__nav_1 id=__nav_1_label tabindex> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=1 aria-labelledby=__nav_1_label aria-expanded=false> <label class=md-nav__title for=__nav_1> <span class="md-nav__icon md-icon"></span> README </label> <ul class=md-nav__list data-md-scrollfix> <li class=md-nav__item> <a href=../../../CHANGELOG/ class=md-nav__link> <span class=md-ellipsis> Changelog </span> </a> </li> <li class=md-nav__item> <a href=../../../CODE_OF_CONDUCT/ class=md-nav__link> <span class=md-ellipsis> Code of Conduct </span> </a> </li> <li class=md-nav__item> <a href=../../../license/ class=md-nav__link> <span class=md-ellipsis> License </span> </a> </li> </ul> </nav> </li> <li class="md-nav__item md-nav__item--active md-nav__item--section md-nav__item--nested"> <input class="md-nav__toggle md-toggle " type=checkbox id=__nav_2 checked> <label class=md-nav__link for=__nav_2 id=__nav_2_label tabindex> <span class=md-ellipsis> Reference </span> <span class="md-nav__icon md-icon"></span> </label> <nav class=md-nav data-md-level=1 aria-labelledby=__nav_2_label aria-expanded=true> <label class=md-nav__title for=__nav_2> <span class="md-nav__icon md-icon"></span> Reference </label> <ul class=md-nav__list data-md-scrollfix> <li class="md-nav__item md-nav__item--active md-nav__item--nested"> <input class="md-nav__toggle md-toggle " type=checkbox id=__nav_2_1 checked> <label class=md-nav__link for=__nav_2_1 id=__nav_2_1_label tabindex=0> <span class=md-ellipsis> API Reference </span> <span class="md-nav__icon md-icon"></span> </label> <nav class=md-nav data-md-level=2 aria-labelledby=__nav_2_1_label aria-expanded=true> <label class=md-nav__title for=__nav_2_1> <span class="md-nav__icon md-icon"></span> API Reference </label> <ul class=md-nav__list data-md-scrollfix> <li class="md-nav__item md-nav__item--active md-nav__item--nested"> <input class="md-nav__toggle md-toggle " type=checkbox id=__nav_2_1_1 checked> <div class="md-nav__link md-nav__container"> <a href=../ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> django_components </span> </a> <label class="md-nav__link " for=__nav_2_1_1 id=__nav_2_1_1_label tabindex=0> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=3 aria-labelledby=__nav_2_1_1_label aria-expanded=true> <label class=md-nav__title for=__nav_2_1_1> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> django_components </label> <ul class=md-nav__list data-md-scrollfix> <li class=md-nav__item> <a href=../app_settings/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> app_settings </span> </a> </li> <li class=md-nav__item> <a href=../apps/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> apps </span> </a> </li> <li class=md-nav__item> <a href=../attributes/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> attributes </span> </a> </li> <li class=md-nav__item> <a href=../autodiscovery/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> autodiscovery </span> </a> </li> <li class=md-nav__item> <a href=../component/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> component </span> </a> </li> <li class=md-nav__item> <a href=../component_media/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> component_media </span> </a> </li> <li class=md-nav__item> <a href=../component_registry/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> component_registry </span> </a> </li> <li class="md-nav__item md-nav__item--active md-nav__item--nested"> <input class="md-nav__toggle md-toggle " type=checkbox id=__nav_2_1_1_9 checked> <div class="md-nav__link md-nav__container"> <a href=./ class="md-nav__link md-nav__link--active"> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> components </span> </a> <label class="md-nav__link md-nav__link--active" for=__nav_2_1_1_9 id=__nav_2_1_1_9_label tabindex=0> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=4 aria-labelledby=__nav_2_1_1_9_label aria-expanded=true> <label class=md-nav__title for=__nav_2_1_1_9> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> components </label> <ul class=md-nav__list data-md-scrollfix> <li class=md-nav__item> <a href=dynamic/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> dynamic </span> </a> </li> </ul> </nav> </li> <li class=md-nav__item> <a href=../context/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> context </span> </a> </li> <li class=md-nav__item> <a href=../dependencies/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> dependencies </span> </a> </li> <li class=md-nav__item> <a href=../expression/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> expression </span> </a> </li> <li class=md-nav__item> <a href=../finders/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> finders </span> </a> </li> <li class=md-nav__item> <a href=../library/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> library </span> </a> </li> <li class="md-nav__item md-nav__item--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_2_1_1_15> <div class="md-nav__link md-nav__container"> <a href=../management/ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> management </span> </a> <label class="md-nav__link " for=__nav_2_1_1_15 id=__nav_2_1_1_15_label tabindex=0> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=4 aria-labelledby=__nav_2_1_1_15_label aria-expanded=false> <label class=md-nav__title for=__nav_2_1_1_15> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> management </label> <ul class=md-nav__list data-md-scrollfix> <li class="md-nav__item md-nav__item--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_2_1_1_15_2> <div class="md-nav__link md-nav__container"> <a href=../management/commands/ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> commands </span> </a> <label class="md-nav__link " for=__nav_2_1_1_15_2 id=__nav_2_1_1_15_2_label tabindex=0> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=5 aria-labelledby=__nav_2_1_1_15_2_label aria-expanded=false> <label class=md-nav__title for=__nav_2_1_1_15_2> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> commands </label> <ul class=md-nav__list data-md-scrollfix> <li class=md-nav__item> <a href=../management/commands/startcomponent/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> startcomponent </span> </a> </li> <li class=md-nav__item> <a href=../management/commands/upgradecomponent/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> upgradecomponent </span> </a> </li> </ul> </nav> </li> </ul> </nav> </li> <li class=md-nav__item> <a href=../middleware/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> middleware </span> </a> </li> <li class=md-nav__item> <a href=../node/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> node </span> </a> </li> <li class=md-nav__item> <a href=../provide/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> provide </span> </a> </li> <li class=md-nav__item> <a href=../slots/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> slots </span> </a> </li> <li class=md-nav__item> <a href=../tag_formatter/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> tag_formatter </span> </a> </li> <li class=md-nav__item> <a href=../template/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> template </span> </a> </li> <li class=md-nav__item> <a href=../template_loader/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> template_loader </span> </a> </li> <li class=md-nav__item> <a href=../template_parser/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> template_parser </span> </a> </li> <li class="md-nav__item md-nav__item--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_2_1_1_24> <div class="md-nav__link md-nav__container"> <a href=../templatetags/ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> templatetags </span> </a> <label class="md-nav__link " for=__nav_2_1_1_24 id=__nav_2_1_1_24_label tabindex=0> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=4 aria-labelledby=__nav_2_1_1_24_label aria-expanded=false> <label class=md-nav__title for=__nav_2_1_1_24> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> templatetags </label> <ul class=md-nav__list data-md-scrollfix> <li class=md-nav__item> <a href=../templatetags/component_tags/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> component_tags </span> </a> </li> </ul> </nav> </li> <li class=md-nav__item> <a href=../types/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> types </span> </a> </li> <li class=md-nav__item> <a href=../urls/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> urls </span> </a> </li> <li class="md-nav__item md-nav__item--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_2_1_1_27> <div class="md-nav__link md-nav__container"> <a href=../util/ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> util </span> </a> <label class="md-nav__link " for=__nav_2_1_1_27 id=__nav_2_1_1_27_label tabindex=0> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=4 aria-labelledby=__nav_2_1_1_27_label aria-expanded=false> <label class=md-nav__title for=__nav_2_1_1_27> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> util </label> <ul class=md-nav__list data-md-scrollfix> <li class=md-nav__item> <a href=../util/cache/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> cache </span> </a> </li> <li class=md-nav__item> <a href=../util/html/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> html </span> </a> </li> <li class=md-nav__item> <a href=../util/loader/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> loader </span> </a> </li> <li class=md-nav__item> <a href=../util/logger/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> logger </span> </a> </li> <li class=md-nav__item> <a href=../util/misc/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> misc </span> </a> </li> <li class=md-nav__item> <a href=../util/nanoid/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> nanoid </span> </a> </li> <li class=md-nav__item> <a href=../util/tag_parser/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> tag_parser </span> </a> </li> <li class=md-nav__item> <a href=../util/types/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> types </span> </a> </li> <li class=md-nav__item> <a href=../util/validation/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> validation </span> </a> </li> </ul> </nav> </li> </ul> </nav> </li> <li class="md-nav__item md-nav__item--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_2_1_2> <div class="md-nav__link md-nav__container"> <a href=../../django_components_js/build/ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> django_components_js </span> </a> </div> <nav class=md-nav data-md-level=3 aria-labelledby=__nav_2_1_2_label aria-expanded=false> <label class=md-nav__title for=__nav_2_1_2> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> django_components_js </label> <ul class=md-nav__list data-md-scrollfix> </ul> </nav> </li> <li class="md-nav__item md-nav__item--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_2_1_3> <div class="md-nav__link md-nav__container"> <a href=../../docs/ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> docs </span> </a> <label class="md-nav__link " for=__nav_2_1_3 id=__nav_2_1_3_label tabindex=0> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=3 aria-labelledby=__nav_2_1_3_label aria-expanded=false> <label class=md-nav__title for=__nav_2_1_3> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> docs </label> <ul class=md-nav__list data-md-scrollfix> <li class="md-nav__item md-nav__item--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_2_1_3_2> <div class="md-nav__link md-nav__container"> <a href=../../docs/scripts/ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> scripts </span> </a> <label class="md-nav__link " for=__nav_2_1_3_2 id=__nav_2_1_3_2_label tabindex=0> <span class="md-nav__icon md-icon"></span> </label> </div> <nav class=md-nav data-md-level=4 aria-labelledby=__nav_2_1_3_2_label aria-expanded=false> <label class=md-nav__title for=__nav_2_1_3_2> <span class="md-nav__icon md-icon"></span> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> scripts </label> <ul class=md-nav__list data-md-scrollfix> <li class=md-nav__item> <a href=../../docs/scripts/reference/ class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> reference </span> </a> </li> </ul> </nav> </li> </ul> </nav> </li> </ul> </nav> </li> </ul> </nav> </li> </ul> </nav> </div> </div> </div> <div class="md-sidebar md-sidebar--secondary" data-md-component=sidebar data-md-type=toc> <div class=md-sidebar__scrollwrap> <div class=md-sidebar__inner> <nav class="md-nav md-nav--secondary" aria-label="Table of contents"> <label class=md-nav__title for=__toc> <span class="md-nav__icon md-icon"></span> Table of contents </label> <ul class=md-nav__list data-md-component=toc data-md-scrollfix> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;DynamicComponent </span> </a> <nav class=md-nav aria-label= DynamicComponent> <ul class=md-nav__list> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent--use-cases class=md-nav__link> <span class=md-ellipsis> Use cases </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent--component-name class=md-nav__link> <span class=md-ellipsis> Component name </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.Media class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;Media </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.css class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;css </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.input class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;input </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.is_filled class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;is_filled </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.js class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;js </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.media class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;media </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.response_class class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;response_class </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.template_name class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;template_name </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.as_view class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;as_view </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.get_template class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;get_template </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.get_template_name class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;get_template_name </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.inject class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;inject </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.on_render_after class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;on_render_after </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.on_render_before class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;on_render_before </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.render class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;render </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.DynamicComponent.render_to_response class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;render_to_response </span> </a> </li> </ul> </nav> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-module"></code>&nbsp;dynamic </span> </a> <nav class=md-nav aria-label= dynamic> <ul class=md-nav__list> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;DynamicComponent </span> </a> <nav class=md-nav aria-label= DynamicComponent> <ul class=md-nav__list> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent--use-cases class=md-nav__link> <span class=md-ellipsis> Use cases </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent--component-name class=md-nav__link> <span class=md-ellipsis> Component name </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.Media class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;Media </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.css class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;css </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.input class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;input </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.is_filled class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;is_filled </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.js class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;js </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.media class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;media </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.response_class class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;response_class </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.template_name class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;template_name </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.as_view class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;as_view </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.get_template class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;get_template </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.get_template_name class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;get_template_name </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.inject class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;inject </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.on_render_after class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;on_render_after </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.on_render_before class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;on_render_before </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.render class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;render </span> </a> </li> <li class=md-nav__item> <a href=#django_components.components.dynamic.DynamicComponent.render_to_response class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-method"></code>&nbsp;render_to_response </span> </a> </li> </ul> </nav> </li> </ul> </nav> </li> </ul> </nav> </div> </div> </div> <div class=md-content data-md-component=content> <article class="md-content__inner md-typeset"> <a href=https://github.com/EmilStenstrom/django-components/edit/master/src/src/django_components/components/__init__.py title="Edit this page" class="md-content__button md-icon"> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M10 20H6V4h7v5h5v3.1l2-2V8l-6-6H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h4zm10.2-7c.1 0 .3.1.4.2l1.3 1.3c.2.2.2.6 0 .8l-1 1-2.1-2.1 1-1c.1-.1.2-.2.4-.2m0 3.9L14.1 23H12v-2.1l6.1-6.1z"/></svg> </a> <a href=https://github.com/EmilStenstrom/django-components/raw/master/src/src/django_components/components/__init__.py title="View source of this page" class="md-content__button md-icon"> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M17 18c.56 0 1 .44 1 1s-.44 1-1 1-1-.44-1-1 .44-1 1-1m0-3c-2.73 0-5.06 1.66-6 4 .94 2.34 3.27 4 6 4s5.06-1.66 6-4c-.94-2.34-3.27-4-6-4m0 6.5a2.5 2.5 0 0 1-2.5-2.5 2.5 2.5 0 0 1 2.5-2.5 2.5 2.5 0 0 1 2.5 2.5 2.5 2.5 0 0 1-2.5 2.5M9.27 20H6V4h7v5h5v4.07c.7.08 1.36.25 2 .49V8l-6-6H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h4.5a8.2 8.2 0 0 1-1.23-2"/></svg> </a> <div class="doc doc-object doc-module"> <h1 id=django_components.components class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-module"></code> <span class="doc doc-object-name doc-module-name">components</span> <a href=#django_components.components class=headerlink title="Permanent link">¤</a></h1> <div class="doc doc-contents first"> <p><span class=doc-section-title>Modules:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic href=../#django_components.components.dynamic>dynamic</a></code></b> – <div class=doc-md-description> </div> </li> </ul> <p><span class=doc-section-title>Classes:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent href=../#django_components.components.DynamicComponent>DynamicComponent</a></code></b> – <div class=doc-md-description> <p>This component is given a registered name or a reference to another component,</p> </div> </li> </ul> <div class="doc doc-children"> <div class="doc doc-object doc-class"> <h2 id=django_components.components.DynamicComponent class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-class"></code> <span class="doc doc-object-name doc-class-name">DynamicComponent</span> <a href=#django_components.components.DynamicComponent class=headerlink title="Permanent link">¤</a></h2> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>DynamicComponent</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>registered_name</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>component_id</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=n>outer_context</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django.template.context.Context>Context</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=n>registry</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-internal" title=django_components.component_registry.ComponentRegistry href=../#django_components.component_registry.ComponentRegistry>ComponentRegistry</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a><span class=p>)</span>
</code></pre></div> <div class="doc doc-contents "> <p class="doc doc-class-bases"> Bases: <code><a class="autorefs autorefs-internal" title=django_components.Component href=../#django_components.Component>Component</a></code></p> <p>This component is given a registered name or a reference to another component, and behaves as if the other component was in its place.</p> <p>The args, kwargs, and slot fills are all passed down to the underlying component.</p> <p><span class=doc-section-title>Parameters:</span></p> <ul> <li class="doc-section-item field-body"> <b><code>is</code></b> (<code><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a> | <a class="autorefs autorefs-external" title=typing.Type href=https://docs.python.org/3.12/library/typing.html#typing.Type>Type</a>[<a class="autorefs autorefs-internal" title=django_components.Component href=../#django_components.Component>Component</a>]</code>) – <div class=doc-md-description> <p>Component that should be rendered. Either a registered name of a component, or a <a href=../api#django_components.Component>Component</a> class directly. Required.</p> </div> </li> <li class="doc-section-item field-body"> <b><code>registry</code></b> (<code><a class="autorefs autorefs-internal" title=django_components.ComponentRegistry href=../#django_components.ComponentRegistry>ComponentRegistry</a></code>, default: <code>None</code> ) – <div class=doc-md-description> <p>Specify the <a href=../api#django_components.ComponentRegistry>registry</a> to search for the registered name. If omitted, all registries are searched until the first match.</p> </div> </li> <li class="doc-section-item field-body"> <b><code>*args</code></b> – <div class=doc-md-description> <p>Additional data passed to the component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code>**kwargs</code></b> – <div class=doc-md-description> <p>Additional data passed to the component.</p> </div> </li> </ul> <p><strong>Slots:</strong></p> <ul> <li>Any slots, depending on the actual component.</li> </ul> <p><strong>Examples:</strong></p> <p>Django <div class=highlight><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;dynamic&quot;</span> <span class=k>is</span><span class=o>=</span><span class=nv>table_comp</span> <span class=nv>data</span><span class=o>=</span><span class=nv>table_data</span> <span class=nv>headers</span><span class=o>=</span><span class=nv>table_headers</span> <span class=cp>%}</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a><span class=x> </span><span class=cp>{%</span> <span class=k>fill</span> <span class=s2>&quot;pagination&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a><span class=x> </span><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;pagination&quot;</span> <span class=o>/</span> <span class=cp>%}</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a><span class=x> </span><span class=cp>{%</span> <span class=k>endfill</span> <span class=cp>%}</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a><span class=cp>{%</span> <span class=k>endcomponent</span> <span class=cp>%}</span>
</code></pre></div></p> <p>Python <div class=highlight><pre><span></span><code><a id=__codelineno-1-1 name=__codelineno-1-1 href=#__codelineno-1-1></a><span class=kn>from</span> <span class=nn>django_components</span> <span class=kn>import</span> <span class=n>DynamicComponent</span>
<a id=__codelineno-1-2 name=__codelineno-1-2 href=#__codelineno-1-2></a>
<a id=__codelineno-1-3 name=__codelineno-1-3 href=#__codelineno-1-3></a><span class=n>DynamicComponent</span><span class=o>.</span><span class=n>render</span><span class=p>(</span>
<a id=__codelineno-1-4 name=__codelineno-1-4 href=#__codelineno-1-4></a> <span class=n>kwargs</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-1-5 name=__codelineno-1-5 href=#__codelineno-1-5></a> <span class=s2>&quot;is&quot;</span><span class=p>:</span> <span class=n>table_comp</span><span class=p>,</span>
<a id=__codelineno-1-6 name=__codelineno-1-6 href=#__codelineno-1-6></a> <span class=s2>&quot;data&quot;</span><span class=p>:</span> <span class=n>table_data</span><span class=p>,</span>
<a id=__codelineno-1-7 name=__codelineno-1-7 href=#__codelineno-1-7></a> <span class=s2>&quot;headers&quot;</span><span class=p>:</span> <span class=n>table_headers</span><span class=p>,</span>
<a id=__codelineno-1-8 name=__codelineno-1-8 href=#__codelineno-1-8></a> <span class=p>},</span>
<a id=__codelineno-1-9 name=__codelineno-1-9 href=#__codelineno-1-9></a> <span class=n>slots</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-1-10 name=__codelineno-1-10 href=#__codelineno-1-10></a> <span class=s2>&quot;pagination&quot;</span><span class=p>:</span> <span class=n>PaginationComponent</span><span class=o>.</span><span class=n>render</span><span class=p>(</span>
<a id=__codelineno-1-11 name=__codelineno-1-11 href=#__codelineno-1-11></a> <span class=n>render_dependencies</span><span class=o>=</span><span class=kc>False</span><span class=p>,</span>
<a id=__codelineno-1-12 name=__codelineno-1-12 href=#__codelineno-1-12></a> <span class=p>),</span>
<a id=__codelineno-1-13 name=__codelineno-1-13 href=#__codelineno-1-13></a> <span class=p>},</span>
<a id=__codelineno-1-14 name=__codelineno-1-14 href=#__codelineno-1-14></a><span class=p>)</span>
</code></pre></div></p> <h3 id=django_components.components.DynamicComponent--use-cases>Use cases<a class=headerlink href=#django_components.components.DynamicComponent--use-cases title="Permanent link">¤</a></h3> <p>Dynamic components are suitable if you are writing something like a form component. You may design it such that users give you a list of input types, and you render components depending on the input types.</p> <p>While you could handle this with a series of if / else statements, that's not an extensible approach. Instead, you can use the dynamic component in place of normal components.</p> <h3 id=django_components.components.DynamicComponent--component-name>Component name<a class=headerlink href=#django_components.components.DynamicComponent--component-name title="Permanent link">¤</a></h3> <p>By default, the dynamic component is registered under the name <code>"dynamic"</code>. In case of a conflict, you can set the <a href=../settings#django_components.app_settings.ComponentsSettings.dynamic_component_name><code>COMPONENTS.dynamic_component_name</code></a> setting to change the name used for the dynamic components.</p> <div class=highlight><pre><span></span><code><a id=__codelineno-2-1 name=__codelineno-2-1 href=#__codelineno-2-1></a><span class=c1># settings.py</span>
<a id=__codelineno-2-2 name=__codelineno-2-2 href=#__codelineno-2-2></a><span class=n>COMPONENTS</span> <span class=o>=</span> <span class=n>ComponentsSettings</span><span class=p>(</span>
<a id=__codelineno-2-3 name=__codelineno-2-3 href=#__codelineno-2-3></a> <span class=n>dynamic_component_name</span><span class=o>=</span><span class=s2>&quot;my_dynamic&quot;</span><span class=p>,</span>
<a id=__codelineno-2-4 name=__codelineno-2-4 href=#__codelineno-2-4></a><span class=p>)</span>
</code></pre></div> <p>After which you will be able to use the dynamic component with the new name: <div class=highlight><pre><span></span><code><a id=__codelineno-3-1 name=__codelineno-3-1 href=#__codelineno-3-1></a><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;my_dynamic&quot;</span> <span class=k>is</span><span class=o>=</span><span class=nv>table_comp</span> <span class=nv>data</span><span class=o>=</span><span class=nv>table_data</span> <span class=nv>headers</span><span class=o>=</span><span class=nv>table_headers</span> <span class=cp>%}</span>
<a id=__codelineno-3-2 name=__codelineno-3-2 href=#__codelineno-3-2></a><span class=x> </span><span class=cp>{%</span> <span class=k>fill</span> <span class=s2>&quot;pagination&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-3-3 name=__codelineno-3-3 href=#__codelineno-3-3></a><span class=x> </span><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;pagination&quot;</span> <span class=o>/</span> <span class=cp>%}</span>
<a id=__codelineno-3-4 name=__codelineno-3-4 href=#__codelineno-3-4></a><span class=x> </span><span class=cp>{%</span> <span class=k>endfill</span> <span class=cp>%}</span>
<a id=__codelineno-3-5 name=__codelineno-3-5 href=#__codelineno-3-5></a><span class=cp>{%</span> <span class=k>endcomponent</span> <span class=cp>%}</span>
</code></pre></div></p> <p><span class=doc-section-title>Methods:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.as_view href=../#django_components.components.DynamicComponent.as_view>as_view</a></code></b> – <div class=doc-md-description> <p>Shortcut for calling <code>Component.View.as_view</code> and passing component instance to it.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.get_template href=../#django_components.components.DynamicComponent.get_template>get_template</a></code></b> – <div class=doc-md-description> <p>Inlined Django template associated with this component. Can be a plain string or a Template instance.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.get_template_name href=../#django_components.components.DynamicComponent.get_template_name>get_template_name</a></code></b> – <div class=doc-md-description> <p>Filepath to the Django template associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.inject href=../#django_components.components.DynamicComponent.inject>inject</a></code></b> – <div class=doc-md-description> <p>Use this method to retrieve the data that was passed to a <code>{% provide %}</code> tag</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.on_render_after href=../#django_components.components.DynamicComponent.on_render_after>on_render_after</a></code></b> – <div class=doc-md-description> <p>Hook that runs just after the component's template was rendered.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.on_render_before href=../#django_components.components.DynamicComponent.on_render_before>on_render_before</a></code></b> – <div class=doc-md-description> <p>Hook that runs just before the component's template is rendered.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.render href=../#django_components.components.DynamicComponent.render>render</a></code></b> – <div class=doc-md-description> <p>Render the component into a string.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.render_to_response href=../#django_components.components.DynamicComponent.render_to_response>render_to_response</a></code></b> – <div class=doc-md-description> <p>Render the component and wrap the content in the response class.</p> </div> </li> </ul> <p><span class=doc-section-title>Attributes:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.Media href=../#django_components.components.DynamicComponent.Media>Media</a></code></b> – <div class=doc-md-description> <p>Defines JS and CSS media files associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.css href=../#django_components.components.DynamicComponent.css>css</a></code></b> (<code><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a>[<a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a>]</code>) – <div class=doc-md-description> <p>Inlined CSS associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.input href=../#django_components.components.DynamicComponent.input>input</a></code></b> (<code><span title=django_components.component.RenderInput>RenderInput</span>[<span title=django_components.component.ArgsType>ArgsType</span>, <span title=django_components.component.KwargsType>KwargsType</span>, <span title=django_components.component.SlotsType>SlotsType</span>]</code>) – <div class=doc-md-description> <p>Input holds the data (like arg, kwargs, slots) that were passsed to</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.is_filled href=../#django_components.components.DynamicComponent.is_filled>is_filled</a></code></b> (<code><a class="autorefs autorefs-internal" title=django_components.slots.SlotIsFilled href=../#django_components.slots.SlotIsFilled>SlotIsFilled</a></code>) – <div class=doc-md-description> <p>Dictionary describing which slots have or have not been filled.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.js href=../#django_components.components.DynamicComponent.js>js</a></code></b> (<code><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a>[<a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a>]</code>) – <div class=doc-md-description> <p>Inlined JS associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.media href=../#django_components.components.DynamicComponent.media>media</a></code></b> (<code><a class="autorefs autorefs-internal" title=django_components.component.Component.Media href=../#django_components.component.Component.Media>Media</a></code>) – <div class=doc-md-description> <p>Normalized definition of JS and CSS media files associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.response_class href=../#django_components.components.DynamicComponent.response_class>response_class</a></code></b> – <div class=doc-md-description> <p>This allows to configure what class is used to generate response from <code>render_to_response</code></p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.DynamicComponent.template_name href=../#django_components.components.DynamicComponent.template_name>template_name</a></code></b> (<code><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a>[<a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a>]</code>) – <div class=doc-md-description> <p>Filepath to the Django template associated with this component.</p> </div> </li> </ul> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-286>286</a></span>
<span class=normal><a href=#__codelineno-0-287>287</a></span>
<span class=normal><a href=#__codelineno-0-288>288</a></span>
<span class=normal><a href=#__codelineno-0-289>289</a></span>
<span class=normal><a href=#__codelineno-0-290>290</a></span>
<span class=normal><a href=#__codelineno-0-291>291</a></span>
<span class=normal><a href=#__codelineno-0-292>292</a></span>
<span class=normal><a href=#__codelineno-0-293>293</a></span>
<span class=normal><a href=#__codelineno-0-294>294</a></span>
<span class=normal><a href=#__codelineno-0-295>295</a></span>
<span class=normal><a href=#__codelineno-0-296>296</a></span>
<span class=normal><a href=#__codelineno-0-297>297</a></span>
<span class=normal><a href=#__codelineno-0-298>298</a></span>
<span class=normal><a href=#__codelineno-0-299>299</a></span>
<span class=normal><a href=#__codelineno-0-300>300</a></span>
<span class=normal><a href=#__codelineno-0-301>301</a></span>
<span class=normal><a href=#__codelineno-0-302>302</a></span>
<span class=normal><a href=#__codelineno-0-303>303</a></span>
<span class=normal><a href=#__codelineno-0-304>304</a></span>
<span class=normal><a href=#__codelineno-0-305>305</a></span>
<span class=normal><a href=#__codelineno-0-306>306</a></span>
<span class=normal><a href=#__codelineno-0-307>307</a></span>
<span class=normal><a href=#__codelineno-0-308>308</a></span>
<span class=normal><a href=#__codelineno-0-309>309</a></span>
<span class=normal><a href=#__codelineno-0-310>310</a></span>
<span class=normal><a href=#__codelineno-0-311>311</a></span>
<span class=normal><a href=#__codelineno-0-312>312</a></span>
<span class=normal><a href=#__codelineno-0-313>313</a></span>
<span class=normal><a href=#__codelineno-0-314>314</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-286 name=__codelineno-0-286></a><span class=k>def</span> <span class=fm>__init__</span><span class=p>(</span>
<a id=__codelineno-0-287 name=__codelineno-0-287></a> <span class=bp>self</span><span class=p>,</span>
<a id=__codelineno-0-288 name=__codelineno-0-288></a> <span class=n>registered_name</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=nb>str</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-289 name=__codelineno-0-289></a> <span class=n>component_id</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=nb>str</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-290 name=__codelineno-0-290></a> <span class=n>outer_context</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Context</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-291 name=__codelineno-0-291></a> <span class=n>registry</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>ComponentRegistry</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span> <span class=c1># noqa F811</span>
<a id=__codelineno-0-292 name=__codelineno-0-292></a><span class=p>):</span>
<a id=__codelineno-0-293 name=__codelineno-0-293></a> <span class=c1># When user first instantiates the component class before calling</span>
<a id=__codelineno-0-294 name=__codelineno-0-294></a> <span class=c1># `render` or `render_to_response`, then we want to allow the render</span>
<a id=__codelineno-0-295 name=__codelineno-0-295></a> <span class=c1># function to make use of the instantiated object.</span>
<a id=__codelineno-0-296 name=__codelineno-0-296></a> <span class=c1>#</span>
<a id=__codelineno-0-297 name=__codelineno-0-297></a> <span class=c1># So while `MyComp.render()` creates a new instance of MyComp internally,</span>
<a id=__codelineno-0-298 name=__codelineno-0-298></a> <span class=c1># if we do `MyComp(registered_name=&quot;abc&quot;).render()`, then we use the</span>
<a id=__codelineno-0-299 name=__codelineno-0-299></a> <span class=c1># already-instantiated object.</span>
<a id=__codelineno-0-300 name=__codelineno-0-300></a> <span class=c1>#</span>
<a id=__codelineno-0-301 name=__codelineno-0-301></a> <span class=c1># To achieve that, we want to re-assign the class methods as instance methods.</span>
<a id=__codelineno-0-302 name=__codelineno-0-302></a> <span class=c1># For that we have to &quot;unwrap&quot; the class methods via __func__.</span>
<a id=__codelineno-0-303 name=__codelineno-0-303></a> <span class=c1># See https://stackoverflow.com/a/76706399/9788634</span>
<a id=__codelineno-0-304 name=__codelineno-0-304></a> <span class=bp>self</span><span class=o>.</span><span class=n>render_to_response</span> <span class=o>=</span> <span class=n>types</span><span class=o>.</span><span class=n>MethodType</span><span class=p>(</span><span class=bp>self</span><span class=o>.</span><span class=vm>__class__</span><span class=o>.</span><span class=n>render_to_response</span><span class=o>.</span><span class=vm>__func__</span><span class=p>,</span> <span class=bp>self</span><span class=p>)</span> <span class=c1># type: ignore</span>
<a id=__codelineno-0-305 name=__codelineno-0-305></a> <span class=bp>self</span><span class=o>.</span><span class=n>render</span> <span class=o>=</span> <span class=n>types</span><span class=o>.</span><span class=n>MethodType</span><span class=p>(</span><span class=bp>self</span><span class=o>.</span><span class=vm>__class__</span><span class=o>.</span><span class=n>render</span><span class=o>.</span><span class=vm>__func__</span><span class=p>,</span> <span class=bp>self</span><span class=p>)</span> <span class=c1># type: ignore</span>
<a id=__codelineno-0-306 name=__codelineno-0-306></a> <span class=bp>self</span><span class=o>.</span><span class=n>as_view</span> <span class=o>=</span> <span class=n>types</span><span class=o>.</span><span class=n>MethodType</span><span class=p>(</span><span class=bp>self</span><span class=o>.</span><span class=vm>__class__</span><span class=o>.</span><span class=n>as_view</span><span class=o>.</span><span class=vm>__func__</span><span class=p>,</span> <span class=bp>self</span><span class=p>)</span> <span class=c1># type: ignore</span>
<a id=__codelineno-0-307 name=__codelineno-0-307></a>
<a id=__codelineno-0-308 name=__codelineno-0-308></a> <span class=bp>self</span><span class=o>.</span><span class=n>registered_name</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=nb>str</span><span class=p>]</span> <span class=o>=</span> <span class=n>registered_name</span>
<a id=__codelineno-0-309 name=__codelineno-0-309></a> <span class=bp>self</span><span class=o>.</span><span class=n>outer_context</span><span class=p>:</span> <span class=n>Context</span> <span class=o>=</span> <span class=n>outer_context</span> <span class=ow>or</span> <span class=n>Context</span><span class=p>()</span>
<a id=__codelineno-0-310 name=__codelineno-0-310></a> <span class=bp>self</span><span class=o>.</span><span class=n>component_id</span> <span class=o>=</span> <span class=n>component_id</span> <span class=ow>or</span> <span class=n>gen_id</span><span class=p>()</span>
<a id=__codelineno-0-311 name=__codelineno-0-311></a> <span class=bp>self</span><span class=o>.</span><span class=n>registry</span> <span class=o>=</span> <span class=n>registry</span> <span class=ow>or</span> <span class=n>registry_</span>
<a id=__codelineno-0-312 name=__codelineno-0-312></a> <span class=bp>self</span><span class=o>.</span><span class=n>_render_stack</span><span class=p>:</span> <span class=n>Deque</span><span class=p>[</span><span class=n>RenderStackItem</span><span class=p>[</span><span class=n>ArgsType</span><span class=p>,</span> <span class=n>KwargsType</span><span class=p>,</span> <span class=n>SlotsType</span><span class=p>]]</span> <span class=o>=</span> <span class=n>deque</span><span class=p>()</span>
<a id=__codelineno-0-313 name=__codelineno-0-313></a> <span class=c1># None == uninitialized, False == No types, Tuple == types</span>
<a id=__codelineno-0-314 name=__codelineno-0-314></a> <span class=bp>self</span><span class=o>.</span><span class=n>_types</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Union</span><span class=p>[</span><span class=n>Tuple</span><span class=p>[</span><span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>],</span> <span class=n>Literal</span><span class=p>[</span><span class=kc>False</span><span class=p>]]]</span> <span class=o>=</span> <span class=kc>None</span>
</code></pre></div></td></tr></table></div> </details> <div class="doc doc-children"> <div class="doc doc-object doc-attribute"> <h3 id=django_components.components.DynamicComponent.Media class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">Media</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.DynamicComponent.Media class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>Media</span> <span class=o>=</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.component_media.ComponentMediaInput href=../#django_components.component_media.ComponentMediaInput>ComponentMediaInput</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Defines JS and CSS media files associated with this component.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h3 id=django_components.components.DynamicComponent.css class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">css</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.DynamicComponent.css class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>css</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span>
</code></pre></div> <div class="doc doc-contents "> <p>Inlined CSS associated with this component.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h3 id=django_components.components.DynamicComponent.input class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">input</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-property"><code>property</code></small> </span> <a href=#django_components.components.DynamicComponent.input class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nb>input</span><span class=p>:</span> <span class=n><span title=django_components.component.RenderInput>RenderInput</span></span><span class=p>[</span><span class=n><span title=django_components.component.ArgsType>ArgsType</span></span><span class=p>,</span> <span class=n><span title=django_components.component.KwargsType>KwargsType</span></span><span class=p>,</span> <span class=n><span title=django_components.component.SlotsType>SlotsType</span></span><span class=p>]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Input holds the data (like arg, kwargs, slots) that were passsed to the current execution of the <code>render</code> method.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h3 id=django_components.components.DynamicComponent.is_filled class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">is_filled</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-property"><code>property</code></small> </span> <a href=#django_components.components.DynamicComponent.is_filled class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>is_filled</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.slots.SlotIsFilled href=../#django_components.slots.SlotIsFilled>SlotIsFilled</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Dictionary describing which slots have or have not been filled.</p> <p>This attribute is available for use only within the template as <code>{{ component_vars.is_filled.slot_name }}</code>, and within <code>on_render_before</code> and <code>on_render_after</code> hooks.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h3 id=django_components.components.DynamicComponent.js class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">js</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.DynamicComponent.js class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>js</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span>
</code></pre></div> <div class="doc doc-contents "> <p>Inlined JS associated with this component.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h3 id=django_components.components.DynamicComponent.media class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">media</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.DynamicComponent.media class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>media</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.component.Component.Media href=../#django_components.component.Component.Media>Media</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Normalized definition of JS and CSS media files associated with this component.</p> <p>NOTE: This field is generated from Component.Media class.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h3 id=django_components.components.DynamicComponent.response_class class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">response_class</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.DynamicComponent.response_class class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>response_class</span> <span class=o>=</span> <span class=n><a class="autorefs autorefs-external" title=django.http.HttpResponse href=https://docs.djangoproject.com/en/5.0/ref/request-response/#django.http.HttpResponse>HttpResponse</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>This allows to configure what class is used to generate response from <code>render_to_response</code></p> </div> </div> <div class="doc doc-object doc-attribute"> <h3 id=django_components.components.DynamicComponent.template_name class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">template_name</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.DynamicComponent.template_name class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>template_name</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span>
</code></pre></div> <div class="doc doc-contents "> <p>Filepath to the Django template associated with this component.</p> <p>The filepath must be relative to either the file where the component class was defined, or one of the roots of <code>STATIFILES_DIRS</code>.</p> <p>Only one of <code>template_name</code>, <code>get_template_name</code>, <code>template</code> or <code>get_template</code> must be defined.</p> </div> </div> <div class="doc doc-object doc-function"> <h3 id=django_components.components.DynamicComponent.as_view class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">as_view</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-classmethod"><code>classmethod</code></small> </span> <a href=#django_components.components.DynamicComponent.as_view class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>as_view</span><span class=p>(</span><span class=o>**</span><span class=n>initkwargs</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><span title=django_components.component.ViewFn>ViewFn</span></span>
</code></pre></div> <div class="doc doc-contents "> <p>Shortcut for calling <code>Component.View.as_view</code> and passing component instance to it.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-459>459</a></span>
<span class=normal><a href=#__codelineno-0-460>460</a></span>
<span class=normal><a href=#__codelineno-0-461>461</a></span>
<span class=normal><a href=#__codelineno-0-462>462</a></span>
<span class=normal><a href=#__codelineno-0-463>463</a></span>
<span class=normal><a href=#__codelineno-0-464>464</a></span>
<span class=normal><a href=#__codelineno-0-465>465</a></span>
<span class=normal><a href=#__codelineno-0-466>466</a></span>
<span class=normal><a href=#__codelineno-0-467>467</a></span>
<span class=normal><a href=#__codelineno-0-468>468</a></span>
<span class=normal><a href=#__codelineno-0-469>469</a></span>
<span class=normal><a href=#__codelineno-0-470>470</a></span>
<span class=normal><a href=#__codelineno-0-471>471</a></span>
<span class=normal><a href=#__codelineno-0-472>472</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-459 name=__codelineno-0-459></a><span class=nd>@classmethod</span>
<a id=__codelineno-0-460 name=__codelineno-0-460></a><span class=k>def</span> <span class=nf>as_view</span><span class=p>(</span><span class=bp>cls</span><span class=p>,</span> <span class=o>**</span><span class=n>initkwargs</span><span class=p>:</span> <span class=n>Any</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>ViewFn</span><span class=p>:</span>
<a id=__codelineno-0-461 name=__codelineno-0-461></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-462 name=__codelineno-0-462></a><span class=sd> Shortcut for calling `Component.View.as_view` and passing component instance to it.</span>
<a id=__codelineno-0-463 name=__codelineno-0-463></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-464 name=__codelineno-0-464></a> <span class=c1># This method may be called as class method or as instance method.</span>
<a id=__codelineno-0-465 name=__codelineno-0-465></a> <span class=c1># If called as class method, create a new instance.</span>
<a id=__codelineno-0-466 name=__codelineno-0-466></a> <span class=k>if</span> <span class=nb>isinstance</span><span class=p>(</span><span class=bp>cls</span><span class=p>,</span> <span class=n>Component</span><span class=p>):</span>
<a id=__codelineno-0-467 name=__codelineno-0-467></a> <span class=n>comp</span><span class=p>:</span> <span class=n>Component</span> <span class=o>=</span> <span class=bp>cls</span>
<a id=__codelineno-0-468 name=__codelineno-0-468></a> <span class=k>else</span><span class=p>:</span>
<a id=__codelineno-0-469 name=__codelineno-0-469></a> <span class=n>comp</span> <span class=o>=</span> <span class=bp>cls</span><span class=p>()</span>
<a id=__codelineno-0-470 name=__codelineno-0-470></a>
<a id=__codelineno-0-471 name=__codelineno-0-471></a> <span class=c1># Allow the View class to access this component via `self.component`</span>
<a id=__codelineno-0-472 name=__codelineno-0-472></a> <span class=k>return</span> <span class=n>comp</span><span class=o>.</span><span class=n>View</span><span class=o>.</span><span class=n>as_view</span><span class=p>(</span><span class=o>**</span><span class=n>initkwargs</span><span class=p>,</span> <span class=n>component</span><span class=o>=</span><span class=n>comp</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h3 id=django_components.components.DynamicComponent.get_template class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">get_template</span> <a href=#django_components.components.DynamicComponent.get_template class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>get_template</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Union href=https://docs.python.org/3.12/library/typing.html#typing.Union>Union</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>,</span> <span class=n><span title=django.template.base.Template>Template</span></span><span class=p>]]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Inlined Django template associated with this component. Can be a plain string or a Template instance.</p> <p>Only one of <code>template_name</code>, <code>get_template_name</code>, <code>template</code> or <code>get_template</code> must be defined.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-226>226</a></span>
<span class=normal><a href=#__codelineno-0-227>227</a></span>
<span class=normal><a href=#__codelineno-0-228>228</a></span>
<span class=normal><a href=#__codelineno-0-229>229</a></span>
<span class=normal><a href=#__codelineno-0-230>230</a></span>
<span class=normal><a href=#__codelineno-0-231>231</a></span>
<span class=normal><a href=#__codelineno-0-232>232</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-226 name=__codelineno-0-226></a><span class=k>def</span> <span class=nf>get_template</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Union</span><span class=p>[</span><span class=nb>str</span><span class=p>,</span> <span class=n>Template</span><span class=p>]]:</span>
<a id=__codelineno-0-227 name=__codelineno-0-227></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-228 name=__codelineno-0-228></a><span class=sd> Inlined Django template associated with this component. Can be a plain string or a Template instance.</span>
<a id=__codelineno-0-229 name=__codelineno-0-229></a>
<a id=__codelineno-0-230 name=__codelineno-0-230></a><span class=sd> Only one of `template_name`, `get_template_name`, `template` or `get_template` must be defined.</span>
<a id=__codelineno-0-231 name=__codelineno-0-231></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-232 name=__codelineno-0-232></a> <span class=k>return</span> <span class=kc>None</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h3 id=django_components.components.DynamicComponent.get_template_name class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">get_template_name</span> <a href=#django_components.components.DynamicComponent.get_template_name class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>get_template_name</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Filepath to the Django template associated with this component.</p> <p>The filepath must be relative to either the file where the component class was defined, or one of the roots of <code>STATIFILES_DIRS</code>.</p> <p>Only one of <code>template_name</code>, <code>get_template_name</code>, <code>template</code> or <code>get_template</code> must be defined.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-208>208</a></span>
<span class=normal><a href=#__codelineno-0-209>209</a></span>
<span class=normal><a href=#__codelineno-0-210>210</a></span>
<span class=normal><a href=#__codelineno-0-211>211</a></span>
<span class=normal><a href=#__codelineno-0-212>212</a></span>
<span class=normal><a href=#__codelineno-0-213>213</a></span>
<span class=normal><a href=#__codelineno-0-214>214</a></span>
<span class=normal><a href=#__codelineno-0-215>215</a></span>
<span class=normal><a href=#__codelineno-0-216>216</a></span>
<span class=normal><a href=#__codelineno-0-217>217</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-208 name=__codelineno-0-208></a><span class=k>def</span> <span class=nf>get_template_name</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Optional</span><span class=p>[</span><span class=nb>str</span><span class=p>]:</span>
<a id=__codelineno-0-209 name=__codelineno-0-209></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-210 name=__codelineno-0-210></a><span class=sd> Filepath to the Django template associated with this component.</span>
<a id=__codelineno-0-211 name=__codelineno-0-211></a>
<a id=__codelineno-0-212 name=__codelineno-0-212></a><span class=sd> The filepath must be relative to either the file where the component class was defined,</span>
<a id=__codelineno-0-213 name=__codelineno-0-213></a><span class=sd> or one of the roots of `STATIFILES_DIRS`.</span>
<a id=__codelineno-0-214 name=__codelineno-0-214></a>
<a id=__codelineno-0-215 name=__codelineno-0-215></a><span class=sd> Only one of `template_name`, `get_template_name`, `template` or `get_template` must be defined.</span>
<a id=__codelineno-0-216 name=__codelineno-0-216></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-217 name=__codelineno-0-217></a> <span class=k>return</span> <span class=kc>None</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h3 id=django_components.components.DynamicComponent.inject class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">inject</span> <a href=#django_components.components.DynamicComponent.inject class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>inject</span><span class=p>(</span><span class=n>key</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>,</span> <span class=n>default</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Use this method to retrieve the data that was passed to a <code>{% provide %}</code> tag with the corresponding key.</p> <p>To retrieve the data, <code>inject()</code> must be called inside a component that's inside the <code>{% provide %}</code> tag.</p> <p>You may also pass a default that will be used if the <code>provide</code> tag with given key was NOT found.</p> <p>This method mut be used inside the <code>get_context_data()</code> method and raises an error if called elsewhere.</p> <p>Example:</p> <p>Given this template: <div class=highlight><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=cp>{%</span> <span class=k>provide</span> <span class=s2>&quot;provider&quot;</span> <span class=nv>hello</span><span class=o>=</span><span class=s2>&quot;world&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a><span class=x> </span><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;my_comp&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a><span class=x> </span><span class=cp>{%</span> <span class=k>endcomponent</span> <span class=cp>%}</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a><span class=cp>{%</span> <span class=k>endprovide</span> <span class=cp>%}</span>
</code></pre></div></p> <p>And given this definition of "my_comp" component: <div class=highlight><pre><span></span><code><a id=__codelineno-1-1 name=__codelineno-1-1 href=#__codelineno-1-1></a><span class=kn>from</span> <span class=nn>django_components</span> <span class=kn>import</span> <span class=n>Component</span><span class=p>,</span> <span class=n>register</span>
<a id=__codelineno-1-2 name=__codelineno-1-2 href=#__codelineno-1-2></a>
<a id=__codelineno-1-3 name=__codelineno-1-3 href=#__codelineno-1-3></a><span class=nd>@register</span><span class=p>(</span><span class=s2>&quot;my_comp&quot;</span><span class=p>)</span>
<a id=__codelineno-1-4 name=__codelineno-1-4 href=#__codelineno-1-4></a><span class=k>class</span> <span class=nc>MyComp</span><span class=p>(</span><span class=n>Component</span><span class=p>):</span>
<a id=__codelineno-1-5 name=__codelineno-1-5 href=#__codelineno-1-5></a> <span class=n>template</span> <span class=o>=</span> <span class=s2>&quot;hi {{ data.hello }}!&quot;</span>
<a id=__codelineno-1-6 name=__codelineno-1-6 href=#__codelineno-1-6></a> <span class=k>def</span> <span class=nf>get_context_data</span><span class=p>(</span><span class=bp>self</span><span class=p>):</span>
<a id=__codelineno-1-7 name=__codelineno-1-7 href=#__codelineno-1-7></a> <span class=n>data</span> <span class=o>=</span> <span class=bp>self</span><span class=o>.</span><span class=n>inject</span><span class=p>(</span><span class=s2>&quot;provider&quot;</span><span class=p>)</span>
<a id=__codelineno-1-8 name=__codelineno-1-8 href=#__codelineno-1-8></a> <span class=k>return</span> <span class=p>{</span><span class=s2>&quot;data&quot;</span><span class=p>:</span> <span class=n>data</span><span class=p>}</span>
</code></pre></div></p> <p>This renders into: <div class=highlight><pre><span></span><code><a id=__codelineno-2-1 name=__codelineno-2-1 href=#__codelineno-2-1></a>hi world!
</code></pre></div></p> <p>As the <code>{{ data.hello }}</code> is taken from the "provider".</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-409>409</a></span>
<span class=normal><a href=#__codelineno-0-410>410</a></span>
<span class=normal><a href=#__codelineno-0-411>411</a></span>
<span class=normal><a href=#__codelineno-0-412>412</a></span>
<span class=normal><a href=#__codelineno-0-413>413</a></span>
<span class=normal><a href=#__codelineno-0-414>414</a></span>
<span class=normal><a href=#__codelineno-0-415>415</a></span>
<span class=normal><a href=#__codelineno-0-416>416</a></span>
<span class=normal><a href=#__codelineno-0-417>417</a></span>
<span class=normal><a href=#__codelineno-0-418>418</a></span>
<span class=normal><a href=#__codelineno-0-419>419</a></span>
<span class=normal><a href=#__codelineno-0-420>420</a></span>
<span class=normal><a href=#__codelineno-0-421>421</a></span>
<span class=normal><a href=#__codelineno-0-422>422</a></span>
<span class=normal><a href=#__codelineno-0-423>423</a></span>
<span class=normal><a href=#__codelineno-0-424>424</a></span>
<span class=normal><a href=#__codelineno-0-425>425</a></span>
<span class=normal><a href=#__codelineno-0-426>426</a></span>
<span class=normal><a href=#__codelineno-0-427>427</a></span>
<span class=normal><a href=#__codelineno-0-428>428</a></span>
<span class=normal><a href=#__codelineno-0-429>429</a></span>
<span class=normal><a href=#__codelineno-0-430>430</a></span>
<span class=normal><a href=#__codelineno-0-431>431</a></span>
<span class=normal><a href=#__codelineno-0-432>432</a></span>
<span class=normal><a href=#__codelineno-0-433>433</a></span>
<span class=normal><a href=#__codelineno-0-434>434</a></span>
<span class=normal><a href=#__codelineno-0-435>435</a></span>
<span class=normal><a href=#__codelineno-0-436>436</a></span>
<span class=normal><a href=#__codelineno-0-437>437</a></span>
<span class=normal><a href=#__codelineno-0-438>438</a></span>
<span class=normal><a href=#__codelineno-0-439>439</a></span>
<span class=normal><a href=#__codelineno-0-440>440</a></span>
<span class=normal><a href=#__codelineno-0-441>441</a></span>
<span class=normal><a href=#__codelineno-0-442>442</a></span>
<span class=normal><a href=#__codelineno-0-443>443</a></span>
<span class=normal><a href=#__codelineno-0-444>444</a></span>
<span class=normal><a href=#__codelineno-0-445>445</a></span>
<span class=normal><a href=#__codelineno-0-446>446</a></span>
<span class=normal><a href=#__codelineno-0-447>447</a></span>
<span class=normal><a href=#__codelineno-0-448>448</a></span>
<span class=normal><a href=#__codelineno-0-449>449</a></span>
<span class=normal><a href=#__codelineno-0-450>450</a></span>
<span class=normal><a href=#__codelineno-0-451>451</a></span>
<span class=normal><a href=#__codelineno-0-452>452</a></span>
<span class=normal><a href=#__codelineno-0-453>453</a></span>
<span class=normal><a href=#__codelineno-0-454>454</a></span>
<span class=normal><a href=#__codelineno-0-455>455</a></span>
<span class=normal><a href=#__codelineno-0-456>456</a></span>
<span class=normal><a href=#__codelineno-0-457>457</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-409 name=__codelineno-0-409></a><span class=k>def</span> <span class=nf>inject</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>key</span><span class=p>:</span> <span class=nb>str</span><span class=p>,</span> <span class=n>default</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Any</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Any</span><span class=p>:</span>
<a id=__codelineno-0-410 name=__codelineno-0-410></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-411 name=__codelineno-0-411></a><span class=sd> Use this method to retrieve the data that was passed to a `{% provide %}` tag</span>
<a id=__codelineno-0-412 name=__codelineno-0-412></a><span class=sd> with the corresponding key.</span>
<a id=__codelineno-0-413 name=__codelineno-0-413></a>
<a id=__codelineno-0-414 name=__codelineno-0-414></a><span class=sd> To retrieve the data, `inject()` must be called inside a component that&#39;s</span>
<a id=__codelineno-0-415 name=__codelineno-0-415></a><span class=sd> inside the `{% provide %}` tag.</span>
<a id=__codelineno-0-416 name=__codelineno-0-416></a>
<a id=__codelineno-0-417 name=__codelineno-0-417></a><span class=sd> You may also pass a default that will be used if the `provide` tag with given</span>
<a id=__codelineno-0-418 name=__codelineno-0-418></a><span class=sd> key was NOT found.</span>
<a id=__codelineno-0-419 name=__codelineno-0-419></a>
<a id=__codelineno-0-420 name=__codelineno-0-420></a><span class=sd> This method mut be used inside the `get_context_data()` method and raises</span>
<a id=__codelineno-0-421 name=__codelineno-0-421></a><span class=sd> an error if called elsewhere.</span>
<a id=__codelineno-0-422 name=__codelineno-0-422></a>
<a id=__codelineno-0-423 name=__codelineno-0-423></a><span class=sd> Example:</span>
<a id=__codelineno-0-424 name=__codelineno-0-424></a>
<a id=__codelineno-0-425 name=__codelineno-0-425></a><span class=sd> Given this template:</span>
<a id=__codelineno-0-426 name=__codelineno-0-426></a><span class=sd> ```django</span>
<a id=__codelineno-0-427 name=__codelineno-0-427></a><span class=sd> {% provide &quot;provider&quot; hello=&quot;world&quot; %}</span>
<a id=__codelineno-0-428 name=__codelineno-0-428></a><span class=sd> {% component &quot;my_comp&quot; %}</span>
<a id=__codelineno-0-429 name=__codelineno-0-429></a><span class=sd> {% endcomponent %}</span>
<a id=__codelineno-0-430 name=__codelineno-0-430></a><span class=sd> {% endprovide %}</span>
<a id=__codelineno-0-431 name=__codelineno-0-431></a><span class=sd> ```</span>
<a id=__codelineno-0-432 name=__codelineno-0-432></a>
<a id=__codelineno-0-433 name=__codelineno-0-433></a><span class=sd> And given this definition of &quot;my_comp&quot; component:</span>
<a id=__codelineno-0-434 name=__codelineno-0-434></a><span class=sd> ```py</span>
<a id=__codelineno-0-435 name=__codelineno-0-435></a><span class=sd> from django_components import Component, register</span>
<a id=__codelineno-0-436 name=__codelineno-0-436></a>
<a id=__codelineno-0-437 name=__codelineno-0-437></a><span class=sd> @register(&quot;my_comp&quot;)</span>
<a id=__codelineno-0-438 name=__codelineno-0-438></a><span class=sd> class MyComp(Component):</span>
<a id=__codelineno-0-439 name=__codelineno-0-439></a><span class=sd> template = &quot;hi {{ data.hello }}!&quot;</span>
<a id=__codelineno-0-440 name=__codelineno-0-440></a><span class=sd> def get_context_data(self):</span>
<a id=__codelineno-0-441 name=__codelineno-0-441></a><span class=sd> data = self.inject(&quot;provider&quot;)</span>
<a id=__codelineno-0-442 name=__codelineno-0-442></a><span class=sd> return {&quot;data&quot;: data}</span>
<a id=__codelineno-0-443 name=__codelineno-0-443></a><span class=sd> ```</span>
<a id=__codelineno-0-444 name=__codelineno-0-444></a>
<a id=__codelineno-0-445 name=__codelineno-0-445></a><span class=sd> This renders into:</span>
<a id=__codelineno-0-446 name=__codelineno-0-446></a><span class=sd> ```</span>
<a id=__codelineno-0-447 name=__codelineno-0-447></a><span class=sd> hi world!</span>
<a id=__codelineno-0-448 name=__codelineno-0-448></a><span class=sd> ```</span>
<a id=__codelineno-0-449 name=__codelineno-0-449></a>
<a id=__codelineno-0-450 name=__codelineno-0-450></a><span class=sd> As the `{{ data.hello }}` is taken from the &quot;provider&quot;.</span>
<a id=__codelineno-0-451 name=__codelineno-0-451></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-452 name=__codelineno-0-452></a> <span class=k>if</span> <span class=bp>self</span><span class=o>.</span><span class=n>input</span> <span class=ow>is</span> <span class=kc>None</span><span class=p>:</span>
<a id=__codelineno-0-453 name=__codelineno-0-453></a> <span class=k>raise</span> <span class=ne>RuntimeError</span><span class=p>(</span>
<a id=__codelineno-0-454 name=__codelineno-0-454></a> <span class=sa>f</span><span class=s2>&quot;Method &#39;inject()&#39; of component &#39;</span><span class=si>{</span><span class=bp>self</span><span class=o>.</span><span class=n>name</span><span class=si>}</span><span class=s2>&#39; was called outside of &#39;get_context_data()&#39;&quot;</span>
<a id=__codelineno-0-455 name=__codelineno-0-455></a> <span class=p>)</span>
<a id=__codelineno-0-456 name=__codelineno-0-456></a>
<a id=__codelineno-0-457 name=__codelineno-0-457></a> <span class=k>return</span> <span class=n>get_injected_context_var</span><span class=p>(</span><span class=bp>self</span><span class=o>.</span><span class=n>name</span><span class=p>,</span> <span class=bp>self</span><span class=o>.</span><span class=n>input</span><span class=o>.</span><span class=n>context</span><span class=p>,</span> <span class=n>key</span><span class=p>,</span> <span class=n>default</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h3 id=django_components.components.DynamicComponent.on_render_after class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">on_render_after</span> <a href=#django_components.components.DynamicComponent.on_render_after class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>on_render_after</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>,</span> <span class=n>template</span><span class=p>:</span> <span class=n><span title=django.template.base.Template>Template</span></span><span class=p>,</span> <span class=n>content</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.slots.SlotResult>SlotResult</span></span><span class=p>]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Hook that runs just after the component's template was rendered. It receives the rendered output as the last argument.</p> <p>You can use this hook to access the context or the template, but modifying them won't have any effect.</p> <p>To override the content that gets rendered, you can return a string or SafeString from this hook.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-267>267</a></span>
<span class=normal><a href=#__codelineno-0-268>268</a></span>
<span class=normal><a href=#__codelineno-0-269>269</a></span>
<span class=normal><a href=#__codelineno-0-270>270</a></span>
<span class=normal><a href=#__codelineno-0-271>271</a></span>
<span class=normal><a href=#__codelineno-0-272>272</a></span>
<span class=normal><a href=#__codelineno-0-273>273</a></span>
<span class=normal><a href=#__codelineno-0-274>274</a></span>
<span class=normal><a href=#__codelineno-0-275>275</a></span>
<span class=normal><a href=#__codelineno-0-276>276</a></span>
<span class=normal><a href=#__codelineno-0-277>277</a></span>
<span class=normal><a href=#__codelineno-0-278>278</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-267 name=__codelineno-0-267></a><span class=k>def</span> <span class=nf>on_render_after</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>,</span> <span class=n>template</span><span class=p>:</span> <span class=n>Template</span><span class=p>,</span> <span class=n>content</span><span class=p>:</span> <span class=nb>str</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Optional</span><span class=p>[</span><span class=n>SlotResult</span><span class=p>]:</span>
<a id=__codelineno-0-268 name=__codelineno-0-268></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-269 name=__codelineno-0-269></a><span class=sd> Hook that runs just after the component&#39;s template was rendered.</span>
<a id=__codelineno-0-270 name=__codelineno-0-270></a><span class=sd> It receives the rendered output as the last argument.</span>
<a id=__codelineno-0-271 name=__codelineno-0-271></a>
<a id=__codelineno-0-272 name=__codelineno-0-272></a><span class=sd> You can use this hook to access the context or the template, but modifying</span>
<a id=__codelineno-0-273 name=__codelineno-0-273></a><span class=sd> them won&#39;t have any effect.</span>
<a id=__codelineno-0-274 name=__codelineno-0-274></a>
<a id=__codelineno-0-275 name=__codelineno-0-275></a><span class=sd> To override the content that gets rendered, you can return a string or SafeString</span>
<a id=__codelineno-0-276 name=__codelineno-0-276></a><span class=sd> from this hook.</span>
<a id=__codelineno-0-277 name=__codelineno-0-277></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-278 name=__codelineno-0-278></a> <span class=k>pass</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h3 id=django_components.components.DynamicComponent.on_render_before class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">on_render_before</span> <a href=#django_components.components.DynamicComponent.on_render_before class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>on_render_before</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>,</span> <span class=n>template</span><span class=p>:</span> <span class=n><span title=django.template.base.Template>Template</span></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=kc>None</span>
</code></pre></div> <div class="doc doc-contents "> <p>Hook that runs just before the component's template is rendered.</p> <p>You can use this hook to access or modify the context or the template.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-259>259</a></span>
<span class=normal><a href=#__codelineno-0-260>260</a></span>
<span class=normal><a href=#__codelineno-0-261>261</a></span>
<span class=normal><a href=#__codelineno-0-262>262</a></span>
<span class=normal><a href=#__codelineno-0-263>263</a></span>
<span class=normal><a href=#__codelineno-0-264>264</a></span>
<span class=normal><a href=#__codelineno-0-265>265</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-259 name=__codelineno-0-259></a><span class=k>def</span> <span class=nf>on_render_before</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>,</span> <span class=n>template</span><span class=p>:</span> <span class=n>Template</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=kc>None</span><span class=p>:</span>
<a id=__codelineno-0-260 name=__codelineno-0-260></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-261 name=__codelineno-0-261></a><span class=sd> Hook that runs just before the component&#39;s template is rendered.</span>
<a id=__codelineno-0-262 name=__codelineno-0-262></a>
<a id=__codelineno-0-263 name=__codelineno-0-263></a><span class=sd> You can use this hook to access or modify the context or the template.</span>
<a id=__codelineno-0-264 name=__codelineno-0-264></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-265 name=__codelineno-0-265></a> <span class=k>pass</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h3 id=django_components.components.DynamicComponent.render class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">render</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-classmethod"><code>classmethod</code></small> </span> <a href=#django_components.components.DynamicComponent.render class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>render</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>context</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Union href=https://docs.python.org/3.12/library/typing.html#typing.Union>Union</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Dict href=https://docs.python.org/3.12/library/typing.html#typing.Dict>Dict</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>,</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>],</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>]]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>args</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.ArgsType>ArgsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.KwargsType>KwargsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=n>slots</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.SlotsType>SlotsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a> <span class=n>escape_slots_content</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/functions.html#bool>bool</a></span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=nb>type</span><span class=p>:</span> <span class=n><span title=django_components.dependencies.RenderType>RenderType</span></span> <span class=o>=</span> <span class=s2>&quot;document&quot;</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a> <span class=n>render_dependencies</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/functions.html#bool>bool</a></span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-9 name=__codelineno-0-9 href=#__codelineno-0-9></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Render the component into a string.</p> <p>Inputs: - <code>args</code> - Positional args for the component. This is the same as calling the component as <code>{% component "my_comp" arg1 arg2 ... %}</code> - <code>kwargs</code> - Kwargs for the component. This is the same as calling the component as <code>{% component "my_comp" key1=val1 key2=val2 ... %}</code> - <code>slots</code> - Component slot fills. This is the same as pasing <code>{% fill %}</code> tags to the component. Accepts a dictionary of <code>{ slot_name: slot_content }</code> where <code>slot_content</code> can be a string or render function. - <code>escape_slots_content</code> - Whether the content from <code>slots</code> should be escaped. - <code>context</code> - A context (dictionary or Django's Context) within which the component is rendered. The keys on the context can be accessed from within the template. - NOTE: In "isolated" mode, context is NOT accessible, and data MUST be passed via component's args and kwargs. - <code>type</code> - Configure how to handle JS and CSS dependencies. - <code>"document"</code> (default) - JS dependencies are inserted into <code>{% component_js_dependencies %}</code>, or to the end of the <code>&lt;body&gt;</code> tag. CSS dependencies are inserted into <code>{% component_css_dependencies %}</code>, or the end of the <code>&lt;head&gt;</code> tag. - <code>render_dependencies</code> - Set this to <code>False</code> if you want to insert the resulting HTML into another component.</p> <p>Example: <div class=highlight><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>MyComponent</span><span class=o>.</span><span class=n>render</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>args</span><span class=o>=</span><span class=p>[</span><span class=mi>1</span><span class=p>,</span> <span class=s2>&quot;two&quot;</span><span class=p>,</span> <span class=p>{}],</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>kwargs</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=s2>&quot;key&quot;</span><span class=p>:</span> <span class=mi>123</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=p>},</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a> <span class=n>slots</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=s2>&quot;header&quot;</span><span class=p>:</span> <span class=s1>&#39;STATIC TEXT HERE&#39;</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a> <span class=s2>&quot;footer&quot;</span><span class=p>:</span> <span class=k>lambda</span> <span class=n>ctx</span><span class=p>,</span> <span class=n>slot_kwargs</span><span class=p>,</span> <span class=n>slot_ref</span><span class=p>:</span> <span class=sa>f</span><span class=s1>&#39;CTX: </span><span class=si>{</span><span class=n>ctx</span><span class=p>[</span><span class=s1>&#39;hello&#39;</span><span class=p>]</span><span class=si>}</span><span class=s1> SLOT_DATA: </span><span class=si>{</span><span class=n>slot_kwargs</span><span class=p>[</span><span class=s1>&#39;abc&#39;</span><span class=p>]</span><span class=si>}</span><span class=s1>&#39;</span><span class=p>,</span>
<a id=__codelineno-0-9 name=__codelineno-0-9 href=#__codelineno-0-9></a> <span class=p>},</span>
<a id=__codelineno-0-10 name=__codelineno-0-10 href=#__codelineno-0-10></a> <span class=n>escape_slots_content</span><span class=o>=</span><span class=kc>False</span><span class=p>,</span>
<a id=__codelineno-0-11 name=__codelineno-0-11 href=#__codelineno-0-11></a><span class=p>)</span>
</code></pre></div></p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-548>548</a></span>
<span class=normal><a href=#__codelineno-0-549>549</a></span>
<span class=normal><a href=#__codelineno-0-550>550</a></span>
<span class=normal><a href=#__codelineno-0-551>551</a></span>
<span class=normal><a href=#__codelineno-0-552>552</a></span>
<span class=normal><a href=#__codelineno-0-553>553</a></span>
<span class=normal><a href=#__codelineno-0-554>554</a></span>
<span class=normal><a href=#__codelineno-0-555>555</a></span>
<span class=normal><a href=#__codelineno-0-556>556</a></span>
<span class=normal><a href=#__codelineno-0-557>557</a></span>
<span class=normal><a href=#__codelineno-0-558>558</a></span>
<span class=normal><a href=#__codelineno-0-559>559</a></span>
<span class=normal><a href=#__codelineno-0-560>560</a></span>
<span class=normal><a href=#__codelineno-0-561>561</a></span>
<span class=normal><a href=#__codelineno-0-562>562</a></span>
<span class=normal><a href=#__codelineno-0-563>563</a></span>
<span class=normal><a href=#__codelineno-0-564>564</a></span>
<span class=normal><a href=#__codelineno-0-565>565</a></span>
<span class=normal><a href=#__codelineno-0-566>566</a></span>
<span class=normal><a href=#__codelineno-0-567>567</a></span>
<span class=normal><a href=#__codelineno-0-568>568</a></span>
<span class=normal><a href=#__codelineno-0-569>569</a></span>
<span class=normal><a href=#__codelineno-0-570>570</a></span>
<span class=normal><a href=#__codelineno-0-571>571</a></span>
<span class=normal><a href=#__codelineno-0-572>572</a></span>
<span class=normal><a href=#__codelineno-0-573>573</a></span>
<span class=normal><a href=#__codelineno-0-574>574</a></span>
<span class=normal><a href=#__codelineno-0-575>575</a></span>
<span class=normal><a href=#__codelineno-0-576>576</a></span>
<span class=normal><a href=#__codelineno-0-577>577</a></span>
<span class=normal><a href=#__codelineno-0-578>578</a></span>
<span class=normal><a href=#__codelineno-0-579>579</a></span>
<span class=normal><a href=#__codelineno-0-580>580</a></span>
<span class=normal><a href=#__codelineno-0-581>581</a></span>
<span class=normal><a href=#__codelineno-0-582>582</a></span>
<span class=normal><a href=#__codelineno-0-583>583</a></span>
<span class=normal><a href=#__codelineno-0-584>584</a></span>
<span class=normal><a href=#__codelineno-0-585>585</a></span>
<span class=normal><a href=#__codelineno-0-586>586</a></span>
<span class=normal><a href=#__codelineno-0-587>587</a></span>
<span class=normal><a href=#__codelineno-0-588>588</a></span>
<span class=normal><a href=#__codelineno-0-589>589</a></span>
<span class=normal><a href=#__codelineno-0-590>590</a></span>
<span class=normal><a href=#__codelineno-0-591>591</a></span>
<span class=normal><a href=#__codelineno-0-592>592</a></span>
<span class=normal><a href=#__codelineno-0-593>593</a></span>
<span class=normal><a href=#__codelineno-0-594>594</a></span>
<span class=normal><a href=#__codelineno-0-595>595</a></span>
<span class=normal><a href=#__codelineno-0-596>596</a></span>
<span class=normal><a href=#__codelineno-0-597>597</a></span>
<span class=normal><a href=#__codelineno-0-598>598</a></span>
<span class=normal><a href=#__codelineno-0-599>599</a></span>
<span class=normal><a href=#__codelineno-0-600>600</a></span>
<span class=normal><a href=#__codelineno-0-601>601</a></span>
<span class=normal><a href=#__codelineno-0-602>602</a></span>
<span class=normal><a href=#__codelineno-0-603>603</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-548 name=__codelineno-0-548></a><span class=nd>@classmethod</span>
<a id=__codelineno-0-549 name=__codelineno-0-549></a><span class=k>def</span> <span class=nf>render</span><span class=p>(</span>
<a id=__codelineno-0-550 name=__codelineno-0-550></a> <span class=bp>cls</span><span class=p>,</span>
<a id=__codelineno-0-551 name=__codelineno-0-551></a> <span class=n>context</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Union</span><span class=p>[</span><span class=n>Dict</span><span class=p>[</span><span class=nb>str</span><span class=p>,</span> <span class=n>Any</span><span class=p>],</span> <span class=n>Context</span><span class=p>]]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-552 name=__codelineno-0-552></a> <span class=n>args</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>ArgsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-553 name=__codelineno-0-553></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>KwargsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-554 name=__codelineno-0-554></a> <span class=n>slots</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>SlotsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-555 name=__codelineno-0-555></a> <span class=n>escape_slots_content</span><span class=p>:</span> <span class=nb>bool</span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-556 name=__codelineno-0-556></a> <span class=nb>type</span><span class=p>:</span> <span class=n>RenderType</span> <span class=o>=</span> <span class=s2>&quot;document&quot;</span><span class=p>,</span>
<a id=__codelineno-0-557 name=__codelineno-0-557></a> <span class=n>render_dependencies</span><span class=p>:</span> <span class=nb>bool</span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-558 name=__codelineno-0-558></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=nb>str</span><span class=p>:</span>
<a id=__codelineno-0-559 name=__codelineno-0-559></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-560 name=__codelineno-0-560></a><span class=sd> Render the component into a string.</span>
<a id=__codelineno-0-561 name=__codelineno-0-561></a>
<a id=__codelineno-0-562 name=__codelineno-0-562></a><span class=sd> Inputs:</span>
<a id=__codelineno-0-563 name=__codelineno-0-563></a><span class=sd> - `args` - Positional args for the component. This is the same as calling the component</span>
<a id=__codelineno-0-564 name=__codelineno-0-564></a><span class=sd> as `{% component &quot;my_comp&quot; arg1 arg2 ... %}`</span>
<a id=__codelineno-0-565 name=__codelineno-0-565></a><span class=sd> - `kwargs` - Kwargs for the component. This is the same as calling the component</span>
<a id=__codelineno-0-566 name=__codelineno-0-566></a><span class=sd> as `{% component &quot;my_comp&quot; key1=val1 key2=val2 ... %}`</span>
<a id=__codelineno-0-567 name=__codelineno-0-567></a><span class=sd> - `slots` - Component slot fills. This is the same as pasing `{% fill %}` tags to the component.</span>
<a id=__codelineno-0-568 name=__codelineno-0-568></a><span class=sd> Accepts a dictionary of `{ slot_name: slot_content }` where `slot_content` can be a string</span>
<a id=__codelineno-0-569 name=__codelineno-0-569></a><span class=sd> or render function.</span>
<a id=__codelineno-0-570 name=__codelineno-0-570></a><span class=sd> - `escape_slots_content` - Whether the content from `slots` should be escaped.</span>
<a id=__codelineno-0-571 name=__codelineno-0-571></a><span class=sd> - `context` - A context (dictionary or Django&#39;s Context) within which the component</span>
<a id=__codelineno-0-572 name=__codelineno-0-572></a><span class=sd> is rendered. The keys on the context can be accessed from within the template.</span>
<a id=__codelineno-0-573 name=__codelineno-0-573></a><span class=sd> - NOTE: In &quot;isolated&quot; mode, context is NOT accessible, and data MUST be passed via</span>
<a id=__codelineno-0-574 name=__codelineno-0-574></a><span class=sd> component&#39;s args and kwargs.</span>
<a id=__codelineno-0-575 name=__codelineno-0-575></a><span class=sd> - `type` - Configure how to handle JS and CSS dependencies.</span>
<a id=__codelineno-0-576 name=__codelineno-0-576></a><span class=sd> - `&quot;document&quot;` (default) - JS dependencies are inserted into `{% component_js_dependencies %}`,</span>
<a id=__codelineno-0-577 name=__codelineno-0-577></a><span class=sd> or to the end of the `&lt;body&gt;` tag. CSS dependencies are inserted into</span>
<a id=__codelineno-0-578 name=__codelineno-0-578></a><span class=sd> `{% component_css_dependencies %}`, or the end of the `&lt;head&gt;` tag.</span>
<a id=__codelineno-0-579 name=__codelineno-0-579></a><span class=sd> - `render_dependencies` - Set this to `False` if you want to insert the resulting HTML into another component.</span>
<a id=__codelineno-0-580 name=__codelineno-0-580></a>
<a id=__codelineno-0-581 name=__codelineno-0-581></a><span class=sd> Example:</span>
<a id=__codelineno-0-582 name=__codelineno-0-582></a><span class=sd> ```py</span>
<a id=__codelineno-0-583 name=__codelineno-0-583></a><span class=sd> MyComponent.render(</span>
<a id=__codelineno-0-584 name=__codelineno-0-584></a><span class=sd> args=[1, &quot;two&quot;, {}],</span>
<a id=__codelineno-0-585 name=__codelineno-0-585></a><span class=sd> kwargs={</span>
<a id=__codelineno-0-586 name=__codelineno-0-586></a><span class=sd> &quot;key&quot;: 123,</span>
<a id=__codelineno-0-587 name=__codelineno-0-587></a><span class=sd> },</span>
<a id=__codelineno-0-588 name=__codelineno-0-588></a><span class=sd> slots={</span>
<a id=__codelineno-0-589 name=__codelineno-0-589></a><span class=sd> &quot;header&quot;: &#39;STATIC TEXT HERE&#39;,</span>
<a id=__codelineno-0-590 name=__codelineno-0-590></a><span class=sd> &quot;footer&quot;: lambda ctx, slot_kwargs, slot_ref: f&#39;CTX: {ctx[&#39;hello&#39;]} SLOT_DATA: {slot_kwargs[&#39;abc&#39;]}&#39;,</span>
<a id=__codelineno-0-591 name=__codelineno-0-591></a><span class=sd> },</span>
<a id=__codelineno-0-592 name=__codelineno-0-592></a><span class=sd> escape_slots_content=False,</span>
<a id=__codelineno-0-593 name=__codelineno-0-593></a><span class=sd> )</span>
<a id=__codelineno-0-594 name=__codelineno-0-594></a><span class=sd> ```</span>
<a id=__codelineno-0-595 name=__codelineno-0-595></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-596 name=__codelineno-0-596></a> <span class=c1># This method may be called as class method or as instance method.</span>
<a id=__codelineno-0-597 name=__codelineno-0-597></a> <span class=c1># If called as class method, create a new instance.</span>
<a id=__codelineno-0-598 name=__codelineno-0-598></a> <span class=k>if</span> <span class=nb>isinstance</span><span class=p>(</span><span class=bp>cls</span><span class=p>,</span> <span class=n>Component</span><span class=p>):</span>
<a id=__codelineno-0-599 name=__codelineno-0-599></a> <span class=n>comp</span><span class=p>:</span> <span class=n>Component</span> <span class=o>=</span> <span class=bp>cls</span>
<a id=__codelineno-0-600 name=__codelineno-0-600></a> <span class=k>else</span><span class=p>:</span>
<a id=__codelineno-0-601 name=__codelineno-0-601></a> <span class=n>comp</span> <span class=o>=</span> <span class=bp>cls</span><span class=p>()</span>
<a id=__codelineno-0-602 name=__codelineno-0-602></a>
<a id=__codelineno-0-603 name=__codelineno-0-603></a> <span class=k>return</span> <span class=n>comp</span><span class=o>.</span><span class=n>_render</span><span class=p>(</span><span class=n>context</span><span class=p>,</span> <span class=n>args</span><span class=p>,</span> <span class=n>kwargs</span><span class=p>,</span> <span class=n>slots</span><span class=p>,</span> <span class=n>escape_slots_content</span><span class=p>,</span> <span class=nb>type</span><span class=p>,</span> <span class=n>render_dependencies</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h3 id=django_components.components.DynamicComponent.render_to_response class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">render_to_response</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-classmethod"><code>classmethod</code></small> </span> <a href=#django_components.components.DynamicComponent.render_to_response class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>render_to_response</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>context</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Union href=https://docs.python.org/3.12/library/typing.html#typing.Union>Union</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Dict href=https://docs.python.org/3.12/library/typing.html#typing.Dict>Dict</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>,</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>],</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>]]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>slots</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.SlotsType>SlotsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=n>escape_slots_content</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/functions.html#bool>bool</a></span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=n>args</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.ArgsType>ArgsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.KwargsType>KwargsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=nb>type</span><span class=p>:</span> <span class=n><span title=django_components.dependencies.RenderType>RenderType</span></span> <span class=o>=</span> <span class=s2>&quot;document&quot;</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a> <span class=o>*</span><span class=n>response_args</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>,</span>
<a id=__codelineno-0-9 name=__codelineno-0-9 href=#__codelineno-0-9></a> <span class=o>**</span><span class=n>response_kwargs</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span>
<a id=__codelineno-0-10 name=__codelineno-0-10 href=#__codelineno-0-10></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=django.http.HttpResponse href=https://docs.djangoproject.com/en/5.0/ref/request-response/#django.http.HttpResponse>HttpResponse</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Render the component and wrap the content in the response class.</p> <p>The response class is taken from <code>Component.response_class</code>. Defaults to <code>django.http.HttpResponse</code>.</p> <p>This is the interface for the <code>django.views.View</code> class which allows us to use components as Django views with <code>component.as_view()</code>.</p> <p>Inputs: - <code>args</code> - Positional args for the component. This is the same as calling the component as <code>{% component "my_comp" arg1 arg2 ... %}</code> - <code>kwargs</code> - Kwargs for the component. This is the same as calling the component as <code>{% component "my_comp" key1=val1 key2=val2 ... %}</code> - <code>slots</code> - Component slot fills. This is the same as pasing <code>{% fill %}</code> tags to the component. Accepts a dictionary of <code>{ slot_name: slot_content }</code> where <code>slot_content</code> can be a string or render function. - <code>escape_slots_content</code> - Whether the content from <code>slots</code> should be escaped. - <code>context</code> - A context (dictionary or Django's Context) within which the component is rendered. The keys on the context can be accessed from within the template. - NOTE: In "isolated" mode, context is NOT accessible, and data MUST be passed via component's args and kwargs. - <code>type</code> - Configure how to handle JS and CSS dependencies. - <code>"document"</code> (default) - JS dependencies are inserted into <code>{% component_js_dependencies %}</code>, or to the end of the <code>&lt;body&gt;</code> tag. CSS dependencies are inserted into <code>{% component_css_dependencies %}</code>, or the end of the <code>&lt;head&gt;</code> tag.</p> <p>Any additional args and kwargs are passed to the <code>response_class</code>.</p> <p>Example: <div class=highlight><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>MyComponent</span><span class=o>.</span><span class=n>render_to_response</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>args</span><span class=o>=</span><span class=p>[</span><span class=mi>1</span><span class=p>,</span> <span class=s2>&quot;two&quot;</span><span class=p>,</span> <span class=p>{}],</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>kwargs</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=s2>&quot;key&quot;</span><span class=p>:</span> <span class=mi>123</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=p>},</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a> <span class=n>slots</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=s2>&quot;header&quot;</span><span class=p>:</span> <span class=s1>&#39;STATIC TEXT HERE&#39;</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a> <span class=s2>&quot;footer&quot;</span><span class=p>:</span> <span class=k>lambda</span> <span class=n>ctx</span><span class=p>,</span> <span class=n>slot_kwargs</span><span class=p>,</span> <span class=n>slot_ref</span><span class=p>:</span> <span class=sa>f</span><span class=s1>&#39;CTX: </span><span class=si>{</span><span class=n>ctx</span><span class=p>[</span><span class=s1>&#39;hello&#39;</span><span class=p>]</span><span class=si>}</span><span class=s1> SLOT_DATA: </span><span class=si>{</span><span class=n>slot_kwargs</span><span class=p>[</span><span class=s1>&#39;abc&#39;</span><span class=p>]</span><span class=si>}</span><span class=s1>&#39;</span><span class=p>,</span>
<a id=__codelineno-0-9 name=__codelineno-0-9 href=#__codelineno-0-9></a> <span class=p>},</span>
<a id=__codelineno-0-10 name=__codelineno-0-10 href=#__codelineno-0-10></a> <span class=n>escape_slots_content</span><span class=o>=</span><span class=kc>False</span><span class=p>,</span>
<a id=__codelineno-0-11 name=__codelineno-0-11 href=#__codelineno-0-11></a> <span class=c1># HttpResponse input</span>
<a id=__codelineno-0-12 name=__codelineno-0-12 href=#__codelineno-0-12></a> <span class=n>status</span><span class=o>=</span><span class=mi>201</span><span class=p>,</span>
<a id=__codelineno-0-13 name=__codelineno-0-13 href=#__codelineno-0-13></a> <span class=n>headers</span><span class=o>=</span><span class=p>{</span><span class=o>...</span><span class=p>},</span>
<a id=__codelineno-0-14 name=__codelineno-0-14 href=#__codelineno-0-14></a><span class=p>)</span>
<a id=__codelineno-0-15 name=__codelineno-0-15 href=#__codelineno-0-15></a><span class=c1># HttpResponse(content=..., status=201, headers=...)</span>
</code></pre></div></p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-478>478</a></span>
<span class=normal><a href=#__codelineno-0-479>479</a></span>
<span class=normal><a href=#__codelineno-0-480>480</a></span>
<span class=normal><a href=#__codelineno-0-481>481</a></span>
<span class=normal><a href=#__codelineno-0-482>482</a></span>
<span class=normal><a href=#__codelineno-0-483>483</a></span>
<span class=normal><a href=#__codelineno-0-484>484</a></span>
<span class=normal><a href=#__codelineno-0-485>485</a></span>
<span class=normal><a href=#__codelineno-0-486>486</a></span>
<span class=normal><a href=#__codelineno-0-487>487</a></span>
<span class=normal><a href=#__codelineno-0-488>488</a></span>
<span class=normal><a href=#__codelineno-0-489>489</a></span>
<span class=normal><a href=#__codelineno-0-490>490</a></span>
<span class=normal><a href=#__codelineno-0-491>491</a></span>
<span class=normal><a href=#__codelineno-0-492>492</a></span>
<span class=normal><a href=#__codelineno-0-493>493</a></span>
<span class=normal><a href=#__codelineno-0-494>494</a></span>
<span class=normal><a href=#__codelineno-0-495>495</a></span>
<span class=normal><a href=#__codelineno-0-496>496</a></span>
<span class=normal><a href=#__codelineno-0-497>497</a></span>
<span class=normal><a href=#__codelineno-0-498>498</a></span>
<span class=normal><a href=#__codelineno-0-499>499</a></span>
<span class=normal><a href=#__codelineno-0-500>500</a></span>
<span class=normal><a href=#__codelineno-0-501>501</a></span>
<span class=normal><a href=#__codelineno-0-502>502</a></span>
<span class=normal><a href=#__codelineno-0-503>503</a></span>
<span class=normal><a href=#__codelineno-0-504>504</a></span>
<span class=normal><a href=#__codelineno-0-505>505</a></span>
<span class=normal><a href=#__codelineno-0-506>506</a></span>
<span class=normal><a href=#__codelineno-0-507>507</a></span>
<span class=normal><a href=#__codelineno-0-508>508</a></span>
<span class=normal><a href=#__codelineno-0-509>509</a></span>
<span class=normal><a href=#__codelineno-0-510>510</a></span>
<span class=normal><a href=#__codelineno-0-511>511</a></span>
<span class=normal><a href=#__codelineno-0-512>512</a></span>
<span class=normal><a href=#__codelineno-0-513>513</a></span>
<span class=normal><a href=#__codelineno-0-514>514</a></span>
<span class=normal><a href=#__codelineno-0-515>515</a></span>
<span class=normal><a href=#__codelineno-0-516>516</a></span>
<span class=normal><a href=#__codelineno-0-517>517</a></span>
<span class=normal><a href=#__codelineno-0-518>518</a></span>
<span class=normal><a href=#__codelineno-0-519>519</a></span>
<span class=normal><a href=#__codelineno-0-520>520</a></span>
<span class=normal><a href=#__codelineno-0-521>521</a></span>
<span class=normal><a href=#__codelineno-0-522>522</a></span>
<span class=normal><a href=#__codelineno-0-523>523</a></span>
<span class=normal><a href=#__codelineno-0-524>524</a></span>
<span class=normal><a href=#__codelineno-0-525>525</a></span>
<span class=normal><a href=#__codelineno-0-526>526</a></span>
<span class=normal><a href=#__codelineno-0-527>527</a></span>
<span class=normal><a href=#__codelineno-0-528>528</a></span>
<span class=normal><a href=#__codelineno-0-529>529</a></span>
<span class=normal><a href=#__codelineno-0-530>530</a></span>
<span class=normal><a href=#__codelineno-0-531>531</a></span>
<span class=normal><a href=#__codelineno-0-532>532</a></span>
<span class=normal><a href=#__codelineno-0-533>533</a></span>
<span class=normal><a href=#__codelineno-0-534>534</a></span>
<span class=normal><a href=#__codelineno-0-535>535</a></span>
<span class=normal><a href=#__codelineno-0-536>536</a></span>
<span class=normal><a href=#__codelineno-0-537>537</a></span>
<span class=normal><a href=#__codelineno-0-538>538</a></span>
<span class=normal><a href=#__codelineno-0-539>539</a></span>
<span class=normal><a href=#__codelineno-0-540>540</a></span>
<span class=normal><a href=#__codelineno-0-541>541</a></span>
<span class=normal><a href=#__codelineno-0-542>542</a></span>
<span class=normal><a href=#__codelineno-0-543>543</a></span>
<span class=normal><a href=#__codelineno-0-544>544</a></span>
<span class=normal><a href=#__codelineno-0-545>545</a></span>
<span class=normal><a href=#__codelineno-0-546>546</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-478 name=__codelineno-0-478></a><span class=nd>@classmethod</span>
<a id=__codelineno-0-479 name=__codelineno-0-479></a><span class=k>def</span> <span class=nf>render_to_response</span><span class=p>(</span>
<a id=__codelineno-0-480 name=__codelineno-0-480></a> <span class=bp>cls</span><span class=p>,</span>
<a id=__codelineno-0-481 name=__codelineno-0-481></a> <span class=n>context</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Union</span><span class=p>[</span><span class=n>Dict</span><span class=p>[</span><span class=nb>str</span><span class=p>,</span> <span class=n>Any</span><span class=p>],</span> <span class=n>Context</span><span class=p>]]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-482 name=__codelineno-0-482></a> <span class=n>slots</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>SlotsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-483 name=__codelineno-0-483></a> <span class=n>escape_slots_content</span><span class=p>:</span> <span class=nb>bool</span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-484 name=__codelineno-0-484></a> <span class=n>args</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>ArgsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-485 name=__codelineno-0-485></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>KwargsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-486 name=__codelineno-0-486></a> <span class=nb>type</span><span class=p>:</span> <span class=n>RenderType</span> <span class=o>=</span> <span class=s2>&quot;document&quot;</span><span class=p>,</span>
<a id=__codelineno-0-487 name=__codelineno-0-487></a> <span class=o>*</span><span class=n>response_args</span><span class=p>:</span> <span class=n>Any</span><span class=p>,</span>
<a id=__codelineno-0-488 name=__codelineno-0-488></a> <span class=o>**</span><span class=n>response_kwargs</span><span class=p>:</span> <span class=n>Any</span><span class=p>,</span>
<a id=__codelineno-0-489 name=__codelineno-0-489></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>HttpResponse</span><span class=p>:</span>
<a id=__codelineno-0-490 name=__codelineno-0-490></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-491 name=__codelineno-0-491></a><span class=sd> Render the component and wrap the content in the response class.</span>
<a id=__codelineno-0-492 name=__codelineno-0-492></a>
<a id=__codelineno-0-493 name=__codelineno-0-493></a><span class=sd> The response class is taken from `Component.response_class`. Defaults to `django.http.HttpResponse`.</span>
<a id=__codelineno-0-494 name=__codelineno-0-494></a>
<a id=__codelineno-0-495 name=__codelineno-0-495></a><span class=sd> This is the interface for the `django.views.View` class which allows us to</span>
<a id=__codelineno-0-496 name=__codelineno-0-496></a><span class=sd> use components as Django views with `component.as_view()`.</span>
<a id=__codelineno-0-497 name=__codelineno-0-497></a>
<a id=__codelineno-0-498 name=__codelineno-0-498></a><span class=sd> Inputs:</span>
<a id=__codelineno-0-499 name=__codelineno-0-499></a><span class=sd> - `args` - Positional args for the component. This is the same as calling the component</span>
<a id=__codelineno-0-500 name=__codelineno-0-500></a><span class=sd> as `{% component &quot;my_comp&quot; arg1 arg2 ... %}`</span>
<a id=__codelineno-0-501 name=__codelineno-0-501></a><span class=sd> - `kwargs` - Kwargs for the component. This is the same as calling the component</span>
<a id=__codelineno-0-502 name=__codelineno-0-502></a><span class=sd> as `{% component &quot;my_comp&quot; key1=val1 key2=val2 ... %}`</span>
<a id=__codelineno-0-503 name=__codelineno-0-503></a><span class=sd> - `slots` - Component slot fills. This is the same as pasing `{% fill %}` tags to the component.</span>
<a id=__codelineno-0-504 name=__codelineno-0-504></a><span class=sd> Accepts a dictionary of `{ slot_name: slot_content }` where `slot_content` can be a string</span>
<a id=__codelineno-0-505 name=__codelineno-0-505></a><span class=sd> or render function.</span>
<a id=__codelineno-0-506 name=__codelineno-0-506></a><span class=sd> - `escape_slots_content` - Whether the content from `slots` should be escaped.</span>
<a id=__codelineno-0-507 name=__codelineno-0-507></a><span class=sd> - `context` - A context (dictionary or Django&#39;s Context) within which the component</span>
<a id=__codelineno-0-508 name=__codelineno-0-508></a><span class=sd> is rendered. The keys on the context can be accessed from within the template.</span>
<a id=__codelineno-0-509 name=__codelineno-0-509></a><span class=sd> - NOTE: In &quot;isolated&quot; mode, context is NOT accessible, and data MUST be passed via</span>
<a id=__codelineno-0-510 name=__codelineno-0-510></a><span class=sd> component&#39;s args and kwargs.</span>
<a id=__codelineno-0-511 name=__codelineno-0-511></a><span class=sd> - `type` - Configure how to handle JS and CSS dependencies.</span>
<a id=__codelineno-0-512 name=__codelineno-0-512></a><span class=sd> - `&quot;document&quot;` (default) - JS dependencies are inserted into `{% component_js_dependencies %}`,</span>
<a id=__codelineno-0-513 name=__codelineno-0-513></a><span class=sd> or to the end of the `&lt;body&gt;` tag. CSS dependencies are inserted into</span>
<a id=__codelineno-0-514 name=__codelineno-0-514></a><span class=sd> `{% component_css_dependencies %}`, or the end of the `&lt;head&gt;` tag.</span>
<a id=__codelineno-0-515 name=__codelineno-0-515></a>
<a id=__codelineno-0-516 name=__codelineno-0-516></a><span class=sd> Any additional args and kwargs are passed to the `response_class`.</span>
<a id=__codelineno-0-517 name=__codelineno-0-517></a>
<a id=__codelineno-0-518 name=__codelineno-0-518></a><span class=sd> Example:</span>
<a id=__codelineno-0-519 name=__codelineno-0-519></a><span class=sd> ```py</span>
<a id=__codelineno-0-520 name=__codelineno-0-520></a><span class=sd> MyComponent.render_to_response(</span>
<a id=__codelineno-0-521 name=__codelineno-0-521></a><span class=sd> args=[1, &quot;two&quot;, {}],</span>
<a id=__codelineno-0-522 name=__codelineno-0-522></a><span class=sd> kwargs={</span>
<a id=__codelineno-0-523 name=__codelineno-0-523></a><span class=sd> &quot;key&quot;: 123,</span>
<a id=__codelineno-0-524 name=__codelineno-0-524></a><span class=sd> },</span>
<a id=__codelineno-0-525 name=__codelineno-0-525></a><span class=sd> slots={</span>
<a id=__codelineno-0-526 name=__codelineno-0-526></a><span class=sd> &quot;header&quot;: &#39;STATIC TEXT HERE&#39;,</span>
<a id=__codelineno-0-527 name=__codelineno-0-527></a><span class=sd> &quot;footer&quot;: lambda ctx, slot_kwargs, slot_ref: f&#39;CTX: {ctx[&#39;hello&#39;]} SLOT_DATA: {slot_kwargs[&#39;abc&#39;]}&#39;,</span>
<a id=__codelineno-0-528 name=__codelineno-0-528></a><span class=sd> },</span>
<a id=__codelineno-0-529 name=__codelineno-0-529></a><span class=sd> escape_slots_content=False,</span>
<a id=__codelineno-0-530 name=__codelineno-0-530></a><span class=sd> # HttpResponse input</span>
<a id=__codelineno-0-531 name=__codelineno-0-531></a><span class=sd> status=201,</span>
<a id=__codelineno-0-532 name=__codelineno-0-532></a><span class=sd> headers={...},</span>
<a id=__codelineno-0-533 name=__codelineno-0-533></a><span class=sd> )</span>
<a id=__codelineno-0-534 name=__codelineno-0-534></a><span class=sd> # HttpResponse(content=..., status=201, headers=...)</span>
<a id=__codelineno-0-535 name=__codelineno-0-535></a><span class=sd> ```</span>
<a id=__codelineno-0-536 name=__codelineno-0-536></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-537 name=__codelineno-0-537></a> <span class=n>content</span> <span class=o>=</span> <span class=bp>cls</span><span class=o>.</span><span class=n>render</span><span class=p>(</span>
<a id=__codelineno-0-538 name=__codelineno-0-538></a> <span class=n>args</span><span class=o>=</span><span class=n>args</span><span class=p>,</span>
<a id=__codelineno-0-539 name=__codelineno-0-539></a> <span class=n>kwargs</span><span class=o>=</span><span class=n>kwargs</span><span class=p>,</span>
<a id=__codelineno-0-540 name=__codelineno-0-540></a> <span class=n>context</span><span class=o>=</span><span class=n>context</span><span class=p>,</span>
<a id=__codelineno-0-541 name=__codelineno-0-541></a> <span class=n>slots</span><span class=o>=</span><span class=n>slots</span><span class=p>,</span>
<a id=__codelineno-0-542 name=__codelineno-0-542></a> <span class=n>escape_slots_content</span><span class=o>=</span><span class=n>escape_slots_content</span><span class=p>,</span>
<a id=__codelineno-0-543 name=__codelineno-0-543></a> <span class=nb>type</span><span class=o>=</span><span class=nb>type</span><span class=p>,</span>
<a id=__codelineno-0-544 name=__codelineno-0-544></a> <span class=n>render_dependencies</span><span class=o>=</span><span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-545 name=__codelineno-0-545></a> <span class=p>)</span>
<a id=__codelineno-0-546 name=__codelineno-0-546></a> <span class=k>return</span> <span class=bp>cls</span><span class=o>.</span><span class=n>response_class</span><span class=p>(</span><span class=n>content</span><span class=p>,</span> <span class=o>*</span><span class=n>response_args</span><span class=p>,</span> <span class=o>**</span><span class=n>response_kwargs</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> </div> </div> </div> <div class="doc doc-object doc-module"> <h2 id=django_components.components.dynamic class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-module"></code> <span class="doc doc-object-name doc-module-name">dynamic</span> <a href=#django_components.components.dynamic class=headerlink title="Permanent link">¤</a></h2> <div class="doc doc-contents "> <p><span class=doc-section-title>Modules:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.types href=../#django_components.types>types</a></code></b> – <div class=doc-md-description> <p>Helper types for IDEs.</p> </div> </li> </ul> <p><span class=doc-section-title>Classes:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent href=../#django_components.components.dynamic.DynamicComponent>DynamicComponent</a></code></b> – <div class=doc-md-description> <p>This component is given a registered name or a reference to another component,</p> </div> </li> </ul> <div class="doc doc-children"> <div class="doc doc-object doc-class"> <h3 id=django_components.components.dynamic.DynamicComponent class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-class"></code> <span class="doc doc-object-name doc-class-name">DynamicComponent</span> <a href=#django_components.components.dynamic.DynamicComponent class=headerlink title="Permanent link">¤</a></h3> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>DynamicComponent</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>registered_name</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>component_id</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=n>outer_context</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django.template.context.Context>Context</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=n>registry</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-internal" title=django_components.component_registry.ComponentRegistry href=../#django_components.component_registry.ComponentRegistry>ComponentRegistry</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a><span class=p>)</span>
</code></pre></div> <div class="doc doc-contents "> <p class="doc doc-class-bases"> Bases: <code><a class="autorefs autorefs-internal" title=django_components.Component href=../#django_components.Component>Component</a></code></p> <p>This component is given a registered name or a reference to another component, and behaves as if the other component was in its place.</p> <p>The args, kwargs, and slot fills are all passed down to the underlying component.</p> <p><span class=doc-section-title>Parameters:</span></p> <ul> <li class="doc-section-item field-body"> <b><code>is</code></b> (<code><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a> | <a class="autorefs autorefs-external" title=typing.Type href=https://docs.python.org/3.12/library/typing.html#typing.Type>Type</a>[<a class="autorefs autorefs-internal" title=django_components.Component href=../#django_components.Component>Component</a>]</code>) – <div class=doc-md-description> <p>Component that should be rendered. Either a registered name of a component, or a <a href=../api#django_components.Component>Component</a> class directly. Required.</p> </div> </li> <li class="doc-section-item field-body"> <b><code>registry</code></b> (<code><a class="autorefs autorefs-internal" title=django_components.ComponentRegistry href=../#django_components.ComponentRegistry>ComponentRegistry</a></code>, default: <code>None</code> ) – <div class=doc-md-description> <p>Specify the <a href=../api#django_components.ComponentRegistry>registry</a> to search for the registered name. If omitted, all registries are searched until the first match.</p> </div> </li> <li class="doc-section-item field-body"> <b><code>*args</code></b> – <div class=doc-md-description> <p>Additional data passed to the component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code>**kwargs</code></b> – <div class=doc-md-description> <p>Additional data passed to the component.</p> </div> </li> </ul> <p><strong>Slots:</strong></p> <ul> <li>Any slots, depending on the actual component.</li> </ul> <p><strong>Examples:</strong></p> <p>Django <div class=highlight><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;dynamic&quot;</span> <span class=k>is</span><span class=o>=</span><span class=nv>table_comp</span> <span class=nv>data</span><span class=o>=</span><span class=nv>table_data</span> <span class=nv>headers</span><span class=o>=</span><span class=nv>table_headers</span> <span class=cp>%}</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a><span class=x> </span><span class=cp>{%</span> <span class=k>fill</span> <span class=s2>&quot;pagination&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a><span class=x> </span><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;pagination&quot;</span> <span class=o>/</span> <span class=cp>%}</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a><span class=x> </span><span class=cp>{%</span> <span class=k>endfill</span> <span class=cp>%}</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a><span class=cp>{%</span> <span class=k>endcomponent</span> <span class=cp>%}</span>
</code></pre></div></p> <p>Python <div class=highlight><pre><span></span><code><a id=__codelineno-1-1 name=__codelineno-1-1 href=#__codelineno-1-1></a><span class=kn>from</span> <span class=nn>django_components</span> <span class=kn>import</span> <span class=n>DynamicComponent</span>
<a id=__codelineno-1-2 name=__codelineno-1-2 href=#__codelineno-1-2></a>
<a id=__codelineno-1-3 name=__codelineno-1-3 href=#__codelineno-1-3></a><span class=n>DynamicComponent</span><span class=o>.</span><span class=n>render</span><span class=p>(</span>
<a id=__codelineno-1-4 name=__codelineno-1-4 href=#__codelineno-1-4></a> <span class=n>kwargs</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-1-5 name=__codelineno-1-5 href=#__codelineno-1-5></a> <span class=s2>&quot;is&quot;</span><span class=p>:</span> <span class=n>table_comp</span><span class=p>,</span>
<a id=__codelineno-1-6 name=__codelineno-1-6 href=#__codelineno-1-6></a> <span class=s2>&quot;data&quot;</span><span class=p>:</span> <span class=n>table_data</span><span class=p>,</span>
<a id=__codelineno-1-7 name=__codelineno-1-7 href=#__codelineno-1-7></a> <span class=s2>&quot;headers&quot;</span><span class=p>:</span> <span class=n>table_headers</span><span class=p>,</span>
<a id=__codelineno-1-8 name=__codelineno-1-8 href=#__codelineno-1-8></a> <span class=p>},</span>
<a id=__codelineno-1-9 name=__codelineno-1-9 href=#__codelineno-1-9></a> <span class=n>slots</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-1-10 name=__codelineno-1-10 href=#__codelineno-1-10></a> <span class=s2>&quot;pagination&quot;</span><span class=p>:</span> <span class=n>PaginationComponent</span><span class=o>.</span><span class=n>render</span><span class=p>(</span>
<a id=__codelineno-1-11 name=__codelineno-1-11 href=#__codelineno-1-11></a> <span class=n>render_dependencies</span><span class=o>=</span><span class=kc>False</span><span class=p>,</span>
<a id=__codelineno-1-12 name=__codelineno-1-12 href=#__codelineno-1-12></a> <span class=p>),</span>
<a id=__codelineno-1-13 name=__codelineno-1-13 href=#__codelineno-1-13></a> <span class=p>},</span>
<a id=__codelineno-1-14 name=__codelineno-1-14 href=#__codelineno-1-14></a><span class=p>)</span>
</code></pre></div></p> <h4 id=django_components.components.dynamic.DynamicComponent--use-cases>Use cases<a class=headerlink href=#django_components.components.dynamic.DynamicComponent--use-cases title="Permanent link">¤</a></h4> <p>Dynamic components are suitable if you are writing something like a form component. You may design it such that users give you a list of input types, and you render components depending on the input types.</p> <p>While you could handle this with a series of if / else statements, that's not an extensible approach. Instead, you can use the dynamic component in place of normal components.</p> <h4 id=django_components.components.dynamic.DynamicComponent--component-name>Component name<a class=headerlink href=#django_components.components.dynamic.DynamicComponent--component-name title="Permanent link">¤</a></h4> <p>By default, the dynamic component is registered under the name <code>"dynamic"</code>. In case of a conflict, you can set the <a href=../settings#django_components.app_settings.ComponentsSettings.dynamic_component_name><code>COMPONENTS.dynamic_component_name</code></a> setting to change the name used for the dynamic components.</p> <div class=highlight><pre><span></span><code><a id=__codelineno-2-1 name=__codelineno-2-1 href=#__codelineno-2-1></a><span class=c1># settings.py</span>
<a id=__codelineno-2-2 name=__codelineno-2-2 href=#__codelineno-2-2></a><span class=n>COMPONENTS</span> <span class=o>=</span> <span class=n>ComponentsSettings</span><span class=p>(</span>
<a id=__codelineno-2-3 name=__codelineno-2-3 href=#__codelineno-2-3></a> <span class=n>dynamic_component_name</span><span class=o>=</span><span class=s2>&quot;my_dynamic&quot;</span><span class=p>,</span>
<a id=__codelineno-2-4 name=__codelineno-2-4 href=#__codelineno-2-4></a><span class=p>)</span>
</code></pre></div> <p>After which you will be able to use the dynamic component with the new name: <div class=highlight><pre><span></span><code><a id=__codelineno-3-1 name=__codelineno-3-1 href=#__codelineno-3-1></a><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;my_dynamic&quot;</span> <span class=k>is</span><span class=o>=</span><span class=nv>table_comp</span> <span class=nv>data</span><span class=o>=</span><span class=nv>table_data</span> <span class=nv>headers</span><span class=o>=</span><span class=nv>table_headers</span> <span class=cp>%}</span>
<a id=__codelineno-3-2 name=__codelineno-3-2 href=#__codelineno-3-2></a><span class=x> </span><span class=cp>{%</span> <span class=k>fill</span> <span class=s2>&quot;pagination&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-3-3 name=__codelineno-3-3 href=#__codelineno-3-3></a><span class=x> </span><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;pagination&quot;</span> <span class=o>/</span> <span class=cp>%}</span>
<a id=__codelineno-3-4 name=__codelineno-3-4 href=#__codelineno-3-4></a><span class=x> </span><span class=cp>{%</span> <span class=k>endfill</span> <span class=cp>%}</span>
<a id=__codelineno-3-5 name=__codelineno-3-5 href=#__codelineno-3-5></a><span class=cp>{%</span> <span class=k>endcomponent</span> <span class=cp>%}</span>
</code></pre></div></p> <p><span class=doc-section-title>Methods:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.as_view href=../#django_components.components.dynamic.DynamicComponent.as_view>as_view</a></code></b> – <div class=doc-md-description> <p>Shortcut for calling <code>Component.View.as_view</code> and passing component instance to it.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.get_template href=../#django_components.components.dynamic.DynamicComponent.get_template>get_template</a></code></b> – <div class=doc-md-description> <p>Inlined Django template associated with this component. Can be a plain string or a Template instance.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.get_template_name href=../#django_components.components.dynamic.DynamicComponent.get_template_name>get_template_name</a></code></b> – <div class=doc-md-description> <p>Filepath to the Django template associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.inject href=../#django_components.components.dynamic.DynamicComponent.inject>inject</a></code></b> – <div class=doc-md-description> <p>Use this method to retrieve the data that was passed to a <code>{% provide %}</code> tag</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.on_render_after href=../#django_components.components.dynamic.DynamicComponent.on_render_after>on_render_after</a></code></b> – <div class=doc-md-description> <p>Hook that runs just after the component's template was rendered.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.on_render_before href=../#django_components.components.dynamic.DynamicComponent.on_render_before>on_render_before</a></code></b> – <div class=doc-md-description> <p>Hook that runs just before the component's template is rendered.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.render href=../#django_components.components.dynamic.DynamicComponent.render>render</a></code></b> – <div class=doc-md-description> <p>Render the component into a string.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.render_to_response href=../#django_components.components.dynamic.DynamicComponent.render_to_response>render_to_response</a></code></b> – <div class=doc-md-description> <p>Render the component and wrap the content in the response class.</p> </div> </li> </ul> <p><span class=doc-section-title>Attributes:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.Media href=../#django_components.components.dynamic.DynamicComponent.Media>Media</a></code></b> – <div class=doc-md-description> <p>Defines JS and CSS media files associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.css href=../#django_components.components.dynamic.DynamicComponent.css>css</a></code></b> (<code><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a>[<a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a>]</code>) – <div class=doc-md-description> <p>Inlined CSS associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.input href=../#django_components.components.dynamic.DynamicComponent.input>input</a></code></b> (<code><span title=django_components.component.RenderInput>RenderInput</span>[<span title=django_components.component.ArgsType>ArgsType</span>, <span title=django_components.component.KwargsType>KwargsType</span>, <span title=django_components.component.SlotsType>SlotsType</span>]</code>) – <div class=doc-md-description> <p>Input holds the data (like arg, kwargs, slots) that were passsed to</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.is_filled href=../#django_components.components.dynamic.DynamicComponent.is_filled>is_filled</a></code></b> (<code><a class="autorefs autorefs-internal" title=django_components.slots.SlotIsFilled href=../#django_components.slots.SlotIsFilled>SlotIsFilled</a></code>) – <div class=doc-md-description> <p>Dictionary describing which slots have or have not been filled.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.js href=../#django_components.components.dynamic.DynamicComponent.js>js</a></code></b> (<code><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a>[<a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a>]</code>) – <div class=doc-md-description> <p>Inlined JS associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.media href=../#django_components.components.dynamic.DynamicComponent.media>media</a></code></b> (<code><a class="autorefs autorefs-internal" title=django_components.component.Component.Media href=../#django_components.component.Component.Media>Media</a></code>) – <div class=doc-md-description> <p>Normalized definition of JS and CSS media files associated with this component.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.response_class href=../#django_components.components.dynamic.DynamicComponent.response_class>response_class</a></code></b> – <div class=doc-md-description> <p>This allows to configure what class is used to generate response from <code>render_to_response</code></p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.components.dynamic.DynamicComponent.template_name href=../#django_components.components.dynamic.DynamicComponent.template_name>template_name</a></code></b> (<code><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a>[<a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a>]</code>) – <div class=doc-md-description> <p>Filepath to the Django template associated with this component.</p> </div> </li> </ul> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-286>286</a></span>
<span class=normal><a href=#__codelineno-0-287>287</a></span>
<span class=normal><a href=#__codelineno-0-288>288</a></span>
<span class=normal><a href=#__codelineno-0-289>289</a></span>
<span class=normal><a href=#__codelineno-0-290>290</a></span>
<span class=normal><a href=#__codelineno-0-291>291</a></span>
<span class=normal><a href=#__codelineno-0-292>292</a></span>
<span class=normal><a href=#__codelineno-0-293>293</a></span>
<span class=normal><a href=#__codelineno-0-294>294</a></span>
<span class=normal><a href=#__codelineno-0-295>295</a></span>
<span class=normal><a href=#__codelineno-0-296>296</a></span>
<span class=normal><a href=#__codelineno-0-297>297</a></span>
<span class=normal><a href=#__codelineno-0-298>298</a></span>
<span class=normal><a href=#__codelineno-0-299>299</a></span>
<span class=normal><a href=#__codelineno-0-300>300</a></span>
<span class=normal><a href=#__codelineno-0-301>301</a></span>
<span class=normal><a href=#__codelineno-0-302>302</a></span>
<span class=normal><a href=#__codelineno-0-303>303</a></span>
<span class=normal><a href=#__codelineno-0-304>304</a></span>
<span class=normal><a href=#__codelineno-0-305>305</a></span>
<span class=normal><a href=#__codelineno-0-306>306</a></span>
<span class=normal><a href=#__codelineno-0-307>307</a></span>
<span class=normal><a href=#__codelineno-0-308>308</a></span>
<span class=normal><a href=#__codelineno-0-309>309</a></span>
<span class=normal><a href=#__codelineno-0-310>310</a></span>
<span class=normal><a href=#__codelineno-0-311>311</a></span>
<span class=normal><a href=#__codelineno-0-312>312</a></span>
<span class=normal><a href=#__codelineno-0-313>313</a></span>
<span class=normal><a href=#__codelineno-0-314>314</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-286 name=__codelineno-0-286></a><span class=k>def</span> <span class=fm>__init__</span><span class=p>(</span>
<a id=__codelineno-0-287 name=__codelineno-0-287></a> <span class=bp>self</span><span class=p>,</span>
<a id=__codelineno-0-288 name=__codelineno-0-288></a> <span class=n>registered_name</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=nb>str</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-289 name=__codelineno-0-289></a> <span class=n>component_id</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=nb>str</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-290 name=__codelineno-0-290></a> <span class=n>outer_context</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Context</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-291 name=__codelineno-0-291></a> <span class=n>registry</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>ComponentRegistry</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span> <span class=c1># noqa F811</span>
<a id=__codelineno-0-292 name=__codelineno-0-292></a><span class=p>):</span>
<a id=__codelineno-0-293 name=__codelineno-0-293></a> <span class=c1># When user first instantiates the component class before calling</span>
<a id=__codelineno-0-294 name=__codelineno-0-294></a> <span class=c1># `render` or `render_to_response`, then we want to allow the render</span>
<a id=__codelineno-0-295 name=__codelineno-0-295></a> <span class=c1># function to make use of the instantiated object.</span>
<a id=__codelineno-0-296 name=__codelineno-0-296></a> <span class=c1>#</span>
<a id=__codelineno-0-297 name=__codelineno-0-297></a> <span class=c1># So while `MyComp.render()` creates a new instance of MyComp internally,</span>
<a id=__codelineno-0-298 name=__codelineno-0-298></a> <span class=c1># if we do `MyComp(registered_name=&quot;abc&quot;).render()`, then we use the</span>
<a id=__codelineno-0-299 name=__codelineno-0-299></a> <span class=c1># already-instantiated object.</span>
<a id=__codelineno-0-300 name=__codelineno-0-300></a> <span class=c1>#</span>
<a id=__codelineno-0-301 name=__codelineno-0-301></a> <span class=c1># To achieve that, we want to re-assign the class methods as instance methods.</span>
<a id=__codelineno-0-302 name=__codelineno-0-302></a> <span class=c1># For that we have to &quot;unwrap&quot; the class methods via __func__.</span>
<a id=__codelineno-0-303 name=__codelineno-0-303></a> <span class=c1># See https://stackoverflow.com/a/76706399/9788634</span>
<a id=__codelineno-0-304 name=__codelineno-0-304></a> <span class=bp>self</span><span class=o>.</span><span class=n>render_to_response</span> <span class=o>=</span> <span class=n>types</span><span class=o>.</span><span class=n>MethodType</span><span class=p>(</span><span class=bp>self</span><span class=o>.</span><span class=vm>__class__</span><span class=o>.</span><span class=n>render_to_response</span><span class=o>.</span><span class=vm>__func__</span><span class=p>,</span> <span class=bp>self</span><span class=p>)</span> <span class=c1># type: ignore</span>
<a id=__codelineno-0-305 name=__codelineno-0-305></a> <span class=bp>self</span><span class=o>.</span><span class=n>render</span> <span class=o>=</span> <span class=n>types</span><span class=o>.</span><span class=n>MethodType</span><span class=p>(</span><span class=bp>self</span><span class=o>.</span><span class=vm>__class__</span><span class=o>.</span><span class=n>render</span><span class=o>.</span><span class=vm>__func__</span><span class=p>,</span> <span class=bp>self</span><span class=p>)</span> <span class=c1># type: ignore</span>
<a id=__codelineno-0-306 name=__codelineno-0-306></a> <span class=bp>self</span><span class=o>.</span><span class=n>as_view</span> <span class=o>=</span> <span class=n>types</span><span class=o>.</span><span class=n>MethodType</span><span class=p>(</span><span class=bp>self</span><span class=o>.</span><span class=vm>__class__</span><span class=o>.</span><span class=n>as_view</span><span class=o>.</span><span class=vm>__func__</span><span class=p>,</span> <span class=bp>self</span><span class=p>)</span> <span class=c1># type: ignore</span>
<a id=__codelineno-0-307 name=__codelineno-0-307></a>
<a id=__codelineno-0-308 name=__codelineno-0-308></a> <span class=bp>self</span><span class=o>.</span><span class=n>registered_name</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=nb>str</span><span class=p>]</span> <span class=o>=</span> <span class=n>registered_name</span>
<a id=__codelineno-0-309 name=__codelineno-0-309></a> <span class=bp>self</span><span class=o>.</span><span class=n>outer_context</span><span class=p>:</span> <span class=n>Context</span> <span class=o>=</span> <span class=n>outer_context</span> <span class=ow>or</span> <span class=n>Context</span><span class=p>()</span>
<a id=__codelineno-0-310 name=__codelineno-0-310></a> <span class=bp>self</span><span class=o>.</span><span class=n>component_id</span> <span class=o>=</span> <span class=n>component_id</span> <span class=ow>or</span> <span class=n>gen_id</span><span class=p>()</span>
<a id=__codelineno-0-311 name=__codelineno-0-311></a> <span class=bp>self</span><span class=o>.</span><span class=n>registry</span> <span class=o>=</span> <span class=n>registry</span> <span class=ow>or</span> <span class=n>registry_</span>
<a id=__codelineno-0-312 name=__codelineno-0-312></a> <span class=bp>self</span><span class=o>.</span><span class=n>_render_stack</span><span class=p>:</span> <span class=n>Deque</span><span class=p>[</span><span class=n>RenderStackItem</span><span class=p>[</span><span class=n>ArgsType</span><span class=p>,</span> <span class=n>KwargsType</span><span class=p>,</span> <span class=n>SlotsType</span><span class=p>]]</span> <span class=o>=</span> <span class=n>deque</span><span class=p>()</span>
<a id=__codelineno-0-313 name=__codelineno-0-313></a> <span class=c1># None == uninitialized, False == No types, Tuple == types</span>
<a id=__codelineno-0-314 name=__codelineno-0-314></a> <span class=bp>self</span><span class=o>.</span><span class=n>_types</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Union</span><span class=p>[</span><span class=n>Tuple</span><span class=p>[</span><span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>,</span> <span class=n>Any</span><span class=p>],</span> <span class=n>Literal</span><span class=p>[</span><span class=kc>False</span><span class=p>]]]</span> <span class=o>=</span> <span class=kc>None</span>
</code></pre></div></td></tr></table></div> </details> <div class="doc doc-children"> <div class="doc doc-object doc-attribute"> <h4 id=django_components.components.dynamic.DynamicComponent.Media class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">Media</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.Media class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>Media</span> <span class=o>=</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.component_media.ComponentMediaInput href=../#django_components.component_media.ComponentMediaInput>ComponentMediaInput</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Defines JS and CSS media files associated with this component.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h4 id=django_components.components.dynamic.DynamicComponent.css class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">css</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.css class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>css</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span>
</code></pre></div> <div class="doc doc-contents "> <p>Inlined CSS associated with this component.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h4 id=django_components.components.dynamic.DynamicComponent.input class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">input</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-property"><code>property</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.input class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nb>input</span><span class=p>:</span> <span class=n><span title=django_components.component.RenderInput>RenderInput</span></span><span class=p>[</span><span class=n><span title=django_components.component.ArgsType>ArgsType</span></span><span class=p>,</span> <span class=n><span title=django_components.component.KwargsType>KwargsType</span></span><span class=p>,</span> <span class=n><span title=django_components.component.SlotsType>SlotsType</span></span><span class=p>]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Input holds the data (like arg, kwargs, slots) that were passsed to the current execution of the <code>render</code> method.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h4 id=django_components.components.dynamic.DynamicComponent.is_filled class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">is_filled</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-property"><code>property</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.is_filled class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>is_filled</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.slots.SlotIsFilled href=../#django_components.slots.SlotIsFilled>SlotIsFilled</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Dictionary describing which slots have or have not been filled.</p> <p>This attribute is available for use only within the template as <code>{{ component_vars.is_filled.slot_name }}</code>, and within <code>on_render_before</code> and <code>on_render_after</code> hooks.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h4 id=django_components.components.dynamic.DynamicComponent.js class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">js</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.js class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>js</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span>
</code></pre></div> <div class="doc doc-contents "> <p>Inlined JS associated with this component.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h4 id=django_components.components.dynamic.DynamicComponent.media class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">media</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.media class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>media</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.component.Component.Media href=../#django_components.component.Component.Media>Media</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Normalized definition of JS and CSS media files associated with this component.</p> <p>NOTE: This field is generated from Component.Media class.</p> </div> </div> <div class="doc doc-object doc-attribute"> <h4 id=django_components.components.dynamic.DynamicComponent.response_class class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">response_class</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.response_class class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>response_class</span> <span class=o>=</span> <span class=n><a class="autorefs autorefs-external" title=django.http.HttpResponse href=https://docs.djangoproject.com/en/5.0/ref/request-response/#django.http.HttpResponse>HttpResponse</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>This allows to configure what class is used to generate response from <code>render_to_response</code></p> </div> </div> <div class="doc doc-object doc-attribute"> <h4 id=django_components.components.dynamic.DynamicComponent.template_name class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-attribute"></code> <span class="doc doc-object-name doc-attribute-name">template_name</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-class-attribute"><code>class-attribute</code></small> <small class="doc doc-label doc-label-instance-attribute"><code>instance-attribute</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.template_name class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>template_name</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span>
</code></pre></div> <div class="doc doc-contents "> <p>Filepath to the Django template associated with this component.</p> <p>The filepath must be relative to either the file where the component class was defined, or one of the roots of <code>STATIFILES_DIRS</code>.</p> <p>Only one of <code>template_name</code>, <code>get_template_name</code>, <code>template</code> or <code>get_template</code> must be defined.</p> </div> </div> <div class="doc doc-object doc-function"> <h4 id=django_components.components.dynamic.DynamicComponent.as_view class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">as_view</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-classmethod"><code>classmethod</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.as_view class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>as_view</span><span class=p>(</span><span class=o>**</span><span class=n>initkwargs</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><span title=django_components.component.ViewFn>ViewFn</span></span>
</code></pre></div> <div class="doc doc-contents "> <p>Shortcut for calling <code>Component.View.as_view</code> and passing component instance to it.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-459>459</a></span>
<span class=normal><a href=#__codelineno-0-460>460</a></span>
<span class=normal><a href=#__codelineno-0-461>461</a></span>
<span class=normal><a href=#__codelineno-0-462>462</a></span>
<span class=normal><a href=#__codelineno-0-463>463</a></span>
<span class=normal><a href=#__codelineno-0-464>464</a></span>
<span class=normal><a href=#__codelineno-0-465>465</a></span>
<span class=normal><a href=#__codelineno-0-466>466</a></span>
<span class=normal><a href=#__codelineno-0-467>467</a></span>
<span class=normal><a href=#__codelineno-0-468>468</a></span>
<span class=normal><a href=#__codelineno-0-469>469</a></span>
<span class=normal><a href=#__codelineno-0-470>470</a></span>
<span class=normal><a href=#__codelineno-0-471>471</a></span>
<span class=normal><a href=#__codelineno-0-472>472</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-459 name=__codelineno-0-459></a><span class=nd>@classmethod</span>
<a id=__codelineno-0-460 name=__codelineno-0-460></a><span class=k>def</span> <span class=nf>as_view</span><span class=p>(</span><span class=bp>cls</span><span class=p>,</span> <span class=o>**</span><span class=n>initkwargs</span><span class=p>:</span> <span class=n>Any</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>ViewFn</span><span class=p>:</span>
<a id=__codelineno-0-461 name=__codelineno-0-461></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-462 name=__codelineno-0-462></a><span class=sd> Shortcut for calling `Component.View.as_view` and passing component instance to it.</span>
<a id=__codelineno-0-463 name=__codelineno-0-463></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-464 name=__codelineno-0-464></a> <span class=c1># This method may be called as class method or as instance method.</span>
<a id=__codelineno-0-465 name=__codelineno-0-465></a> <span class=c1># If called as class method, create a new instance.</span>
<a id=__codelineno-0-466 name=__codelineno-0-466></a> <span class=k>if</span> <span class=nb>isinstance</span><span class=p>(</span><span class=bp>cls</span><span class=p>,</span> <span class=n>Component</span><span class=p>):</span>
<a id=__codelineno-0-467 name=__codelineno-0-467></a> <span class=n>comp</span><span class=p>:</span> <span class=n>Component</span> <span class=o>=</span> <span class=bp>cls</span>
<a id=__codelineno-0-468 name=__codelineno-0-468></a> <span class=k>else</span><span class=p>:</span>
<a id=__codelineno-0-469 name=__codelineno-0-469></a> <span class=n>comp</span> <span class=o>=</span> <span class=bp>cls</span><span class=p>()</span>
<a id=__codelineno-0-470 name=__codelineno-0-470></a>
<a id=__codelineno-0-471 name=__codelineno-0-471></a> <span class=c1># Allow the View class to access this component via `self.component`</span>
<a id=__codelineno-0-472 name=__codelineno-0-472></a> <span class=k>return</span> <span class=n>comp</span><span class=o>.</span><span class=n>View</span><span class=o>.</span><span class=n>as_view</span><span class=p>(</span><span class=o>**</span><span class=n>initkwargs</span><span class=p>,</span> <span class=n>component</span><span class=o>=</span><span class=n>comp</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h4 id=django_components.components.dynamic.DynamicComponent.get_template class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">get_template</span> <a href=#django_components.components.dynamic.DynamicComponent.get_template class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>get_template</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Union href=https://docs.python.org/3.12/library/typing.html#typing.Union>Union</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>,</span> <span class=n><span title=django.template.base.Template>Template</span></span><span class=p>]]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Inlined Django template associated with this component. Can be a plain string or a Template instance.</p> <p>Only one of <code>template_name</code>, <code>get_template_name</code>, <code>template</code> or <code>get_template</code> must be defined.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-226>226</a></span>
<span class=normal><a href=#__codelineno-0-227>227</a></span>
<span class=normal><a href=#__codelineno-0-228>228</a></span>
<span class=normal><a href=#__codelineno-0-229>229</a></span>
<span class=normal><a href=#__codelineno-0-230>230</a></span>
<span class=normal><a href=#__codelineno-0-231>231</a></span>
<span class=normal><a href=#__codelineno-0-232>232</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-226 name=__codelineno-0-226></a><span class=k>def</span> <span class=nf>get_template</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Union</span><span class=p>[</span><span class=nb>str</span><span class=p>,</span> <span class=n>Template</span><span class=p>]]:</span>
<a id=__codelineno-0-227 name=__codelineno-0-227></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-228 name=__codelineno-0-228></a><span class=sd> Inlined Django template associated with this component. Can be a plain string or a Template instance.</span>
<a id=__codelineno-0-229 name=__codelineno-0-229></a>
<a id=__codelineno-0-230 name=__codelineno-0-230></a><span class=sd> Only one of `template_name`, `get_template_name`, `template` or `get_template` must be defined.</span>
<a id=__codelineno-0-231 name=__codelineno-0-231></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-232 name=__codelineno-0-232></a> <span class=k>return</span> <span class=kc>None</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h4 id=django_components.components.dynamic.DynamicComponent.get_template_name class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">get_template_name</span> <a href=#django_components.components.dynamic.DynamicComponent.get_template_name class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>get_template_name</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Filepath to the Django template associated with this component.</p> <p>The filepath must be relative to either the file where the component class was defined, or one of the roots of <code>STATIFILES_DIRS</code>.</p> <p>Only one of <code>template_name</code>, <code>get_template_name</code>, <code>template</code> or <code>get_template</code> must be defined.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-208>208</a></span>
<span class=normal><a href=#__codelineno-0-209>209</a></span>
<span class=normal><a href=#__codelineno-0-210>210</a></span>
<span class=normal><a href=#__codelineno-0-211>211</a></span>
<span class=normal><a href=#__codelineno-0-212>212</a></span>
<span class=normal><a href=#__codelineno-0-213>213</a></span>
<span class=normal><a href=#__codelineno-0-214>214</a></span>
<span class=normal><a href=#__codelineno-0-215>215</a></span>
<span class=normal><a href=#__codelineno-0-216>216</a></span>
<span class=normal><a href=#__codelineno-0-217>217</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-208 name=__codelineno-0-208></a><span class=k>def</span> <span class=nf>get_template_name</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Optional</span><span class=p>[</span><span class=nb>str</span><span class=p>]:</span>
<a id=__codelineno-0-209 name=__codelineno-0-209></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-210 name=__codelineno-0-210></a><span class=sd> Filepath to the Django template associated with this component.</span>
<a id=__codelineno-0-211 name=__codelineno-0-211></a>
<a id=__codelineno-0-212 name=__codelineno-0-212></a><span class=sd> The filepath must be relative to either the file where the component class was defined,</span>
<a id=__codelineno-0-213 name=__codelineno-0-213></a><span class=sd> or one of the roots of `STATIFILES_DIRS`.</span>
<a id=__codelineno-0-214 name=__codelineno-0-214></a>
<a id=__codelineno-0-215 name=__codelineno-0-215></a><span class=sd> Only one of `template_name`, `get_template_name`, `template` or `get_template` must be defined.</span>
<a id=__codelineno-0-216 name=__codelineno-0-216></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-217 name=__codelineno-0-217></a> <span class=k>return</span> <span class=kc>None</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h4 id=django_components.components.dynamic.DynamicComponent.inject class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">inject</span> <a href=#django_components.components.dynamic.DynamicComponent.inject class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>inject</span><span class=p>(</span><span class=n>key</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>,</span> <span class=n>default</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Use this method to retrieve the data that was passed to a <code>{% provide %}</code> tag with the corresponding key.</p> <p>To retrieve the data, <code>inject()</code> must be called inside a component that's inside the <code>{% provide %}</code> tag.</p> <p>You may also pass a default that will be used if the <code>provide</code> tag with given key was NOT found.</p> <p>This method mut be used inside the <code>get_context_data()</code> method and raises an error if called elsewhere.</p> <p>Example:</p> <p>Given this template: <div class=highlight><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=cp>{%</span> <span class=k>provide</span> <span class=s2>&quot;provider&quot;</span> <span class=nv>hello</span><span class=o>=</span><span class=s2>&quot;world&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a><span class=x> </span><span class=cp>{%</span> <span class=k>component</span> <span class=s2>&quot;my_comp&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a><span class=x> </span><span class=cp>{%</span> <span class=k>endcomponent</span> <span class=cp>%}</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a><span class=cp>{%</span> <span class=k>endprovide</span> <span class=cp>%}</span>
</code></pre></div></p> <p>And given this definition of "my_comp" component: <div class=highlight><pre><span></span><code><a id=__codelineno-1-1 name=__codelineno-1-1 href=#__codelineno-1-1></a><span class=kn>from</span> <span class=nn>django_components</span> <span class=kn>import</span> <span class=n>Component</span><span class=p>,</span> <span class=n>register</span>
<a id=__codelineno-1-2 name=__codelineno-1-2 href=#__codelineno-1-2></a>
<a id=__codelineno-1-3 name=__codelineno-1-3 href=#__codelineno-1-3></a><span class=nd>@register</span><span class=p>(</span><span class=s2>&quot;my_comp&quot;</span><span class=p>)</span>
<a id=__codelineno-1-4 name=__codelineno-1-4 href=#__codelineno-1-4></a><span class=k>class</span> <span class=nc>MyComp</span><span class=p>(</span><span class=n>Component</span><span class=p>):</span>
<a id=__codelineno-1-5 name=__codelineno-1-5 href=#__codelineno-1-5></a> <span class=n>template</span> <span class=o>=</span> <span class=s2>&quot;hi {{ data.hello }}!&quot;</span>
<a id=__codelineno-1-6 name=__codelineno-1-6 href=#__codelineno-1-6></a> <span class=k>def</span> <span class=nf>get_context_data</span><span class=p>(</span><span class=bp>self</span><span class=p>):</span>
<a id=__codelineno-1-7 name=__codelineno-1-7 href=#__codelineno-1-7></a> <span class=n>data</span> <span class=o>=</span> <span class=bp>self</span><span class=o>.</span><span class=n>inject</span><span class=p>(</span><span class=s2>&quot;provider&quot;</span><span class=p>)</span>
<a id=__codelineno-1-8 name=__codelineno-1-8 href=#__codelineno-1-8></a> <span class=k>return</span> <span class=p>{</span><span class=s2>&quot;data&quot;</span><span class=p>:</span> <span class=n>data</span><span class=p>}</span>
</code></pre></div></p> <p>This renders into: <div class=highlight><pre><span></span><code><a id=__codelineno-2-1 name=__codelineno-2-1 href=#__codelineno-2-1></a>hi world!
</code></pre></div></p> <p>As the <code>{{ data.hello }}</code> is taken from the "provider".</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-409>409</a></span>
<span class=normal><a href=#__codelineno-0-410>410</a></span>
<span class=normal><a href=#__codelineno-0-411>411</a></span>
<span class=normal><a href=#__codelineno-0-412>412</a></span>
<span class=normal><a href=#__codelineno-0-413>413</a></span>
<span class=normal><a href=#__codelineno-0-414>414</a></span>
<span class=normal><a href=#__codelineno-0-415>415</a></span>
<span class=normal><a href=#__codelineno-0-416>416</a></span>
<span class=normal><a href=#__codelineno-0-417>417</a></span>
<span class=normal><a href=#__codelineno-0-418>418</a></span>
<span class=normal><a href=#__codelineno-0-419>419</a></span>
<span class=normal><a href=#__codelineno-0-420>420</a></span>
<span class=normal><a href=#__codelineno-0-421>421</a></span>
<span class=normal><a href=#__codelineno-0-422>422</a></span>
<span class=normal><a href=#__codelineno-0-423>423</a></span>
<span class=normal><a href=#__codelineno-0-424>424</a></span>
<span class=normal><a href=#__codelineno-0-425>425</a></span>
<span class=normal><a href=#__codelineno-0-426>426</a></span>
<span class=normal><a href=#__codelineno-0-427>427</a></span>
<span class=normal><a href=#__codelineno-0-428>428</a></span>
<span class=normal><a href=#__codelineno-0-429>429</a></span>
<span class=normal><a href=#__codelineno-0-430>430</a></span>
<span class=normal><a href=#__codelineno-0-431>431</a></span>
<span class=normal><a href=#__codelineno-0-432>432</a></span>
<span class=normal><a href=#__codelineno-0-433>433</a></span>
<span class=normal><a href=#__codelineno-0-434>434</a></span>
<span class=normal><a href=#__codelineno-0-435>435</a></span>
<span class=normal><a href=#__codelineno-0-436>436</a></span>
<span class=normal><a href=#__codelineno-0-437>437</a></span>
<span class=normal><a href=#__codelineno-0-438>438</a></span>
<span class=normal><a href=#__codelineno-0-439>439</a></span>
<span class=normal><a href=#__codelineno-0-440>440</a></span>
<span class=normal><a href=#__codelineno-0-441>441</a></span>
<span class=normal><a href=#__codelineno-0-442>442</a></span>
<span class=normal><a href=#__codelineno-0-443>443</a></span>
<span class=normal><a href=#__codelineno-0-444>444</a></span>
<span class=normal><a href=#__codelineno-0-445>445</a></span>
<span class=normal><a href=#__codelineno-0-446>446</a></span>
<span class=normal><a href=#__codelineno-0-447>447</a></span>
<span class=normal><a href=#__codelineno-0-448>448</a></span>
<span class=normal><a href=#__codelineno-0-449>449</a></span>
<span class=normal><a href=#__codelineno-0-450>450</a></span>
<span class=normal><a href=#__codelineno-0-451>451</a></span>
<span class=normal><a href=#__codelineno-0-452>452</a></span>
<span class=normal><a href=#__codelineno-0-453>453</a></span>
<span class=normal><a href=#__codelineno-0-454>454</a></span>
<span class=normal><a href=#__codelineno-0-455>455</a></span>
<span class=normal><a href=#__codelineno-0-456>456</a></span>
<span class=normal><a href=#__codelineno-0-457>457</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-409 name=__codelineno-0-409></a><span class=k>def</span> <span class=nf>inject</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>key</span><span class=p>:</span> <span class=nb>str</span><span class=p>,</span> <span class=n>default</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Any</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Any</span><span class=p>:</span>
<a id=__codelineno-0-410 name=__codelineno-0-410></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-411 name=__codelineno-0-411></a><span class=sd> Use this method to retrieve the data that was passed to a `{% provide %}` tag</span>
<a id=__codelineno-0-412 name=__codelineno-0-412></a><span class=sd> with the corresponding key.</span>
<a id=__codelineno-0-413 name=__codelineno-0-413></a>
<a id=__codelineno-0-414 name=__codelineno-0-414></a><span class=sd> To retrieve the data, `inject()` must be called inside a component that&#39;s</span>
<a id=__codelineno-0-415 name=__codelineno-0-415></a><span class=sd> inside the `{% provide %}` tag.</span>
<a id=__codelineno-0-416 name=__codelineno-0-416></a>
<a id=__codelineno-0-417 name=__codelineno-0-417></a><span class=sd> You may also pass a default that will be used if the `provide` tag with given</span>
<a id=__codelineno-0-418 name=__codelineno-0-418></a><span class=sd> key was NOT found.</span>
<a id=__codelineno-0-419 name=__codelineno-0-419></a>
<a id=__codelineno-0-420 name=__codelineno-0-420></a><span class=sd> This method mut be used inside the `get_context_data()` method and raises</span>
<a id=__codelineno-0-421 name=__codelineno-0-421></a><span class=sd> an error if called elsewhere.</span>
<a id=__codelineno-0-422 name=__codelineno-0-422></a>
<a id=__codelineno-0-423 name=__codelineno-0-423></a><span class=sd> Example:</span>
<a id=__codelineno-0-424 name=__codelineno-0-424></a>
<a id=__codelineno-0-425 name=__codelineno-0-425></a><span class=sd> Given this template:</span>
<a id=__codelineno-0-426 name=__codelineno-0-426></a><span class=sd> ```django</span>
<a id=__codelineno-0-427 name=__codelineno-0-427></a><span class=sd> {% provide &quot;provider&quot; hello=&quot;world&quot; %}</span>
<a id=__codelineno-0-428 name=__codelineno-0-428></a><span class=sd> {% component &quot;my_comp&quot; %}</span>
<a id=__codelineno-0-429 name=__codelineno-0-429></a><span class=sd> {% endcomponent %}</span>
<a id=__codelineno-0-430 name=__codelineno-0-430></a><span class=sd> {% endprovide %}</span>
<a id=__codelineno-0-431 name=__codelineno-0-431></a><span class=sd> ```</span>
<a id=__codelineno-0-432 name=__codelineno-0-432></a>
<a id=__codelineno-0-433 name=__codelineno-0-433></a><span class=sd> And given this definition of &quot;my_comp&quot; component:</span>
<a id=__codelineno-0-434 name=__codelineno-0-434></a><span class=sd> ```py</span>
<a id=__codelineno-0-435 name=__codelineno-0-435></a><span class=sd> from django_components import Component, register</span>
<a id=__codelineno-0-436 name=__codelineno-0-436></a>
<a id=__codelineno-0-437 name=__codelineno-0-437></a><span class=sd> @register(&quot;my_comp&quot;)</span>
<a id=__codelineno-0-438 name=__codelineno-0-438></a><span class=sd> class MyComp(Component):</span>
<a id=__codelineno-0-439 name=__codelineno-0-439></a><span class=sd> template = &quot;hi {{ data.hello }}!&quot;</span>
<a id=__codelineno-0-440 name=__codelineno-0-440></a><span class=sd> def get_context_data(self):</span>
<a id=__codelineno-0-441 name=__codelineno-0-441></a><span class=sd> data = self.inject(&quot;provider&quot;)</span>
<a id=__codelineno-0-442 name=__codelineno-0-442></a><span class=sd> return {&quot;data&quot;: data}</span>
<a id=__codelineno-0-443 name=__codelineno-0-443></a><span class=sd> ```</span>
<a id=__codelineno-0-444 name=__codelineno-0-444></a>
<a id=__codelineno-0-445 name=__codelineno-0-445></a><span class=sd> This renders into:</span>
<a id=__codelineno-0-446 name=__codelineno-0-446></a><span class=sd> ```</span>
<a id=__codelineno-0-447 name=__codelineno-0-447></a><span class=sd> hi world!</span>
<a id=__codelineno-0-448 name=__codelineno-0-448></a><span class=sd> ```</span>
<a id=__codelineno-0-449 name=__codelineno-0-449></a>
<a id=__codelineno-0-450 name=__codelineno-0-450></a><span class=sd> As the `{{ data.hello }}` is taken from the &quot;provider&quot;.</span>
<a id=__codelineno-0-451 name=__codelineno-0-451></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-452 name=__codelineno-0-452></a> <span class=k>if</span> <span class=bp>self</span><span class=o>.</span><span class=n>input</span> <span class=ow>is</span> <span class=kc>None</span><span class=p>:</span>
<a id=__codelineno-0-453 name=__codelineno-0-453></a> <span class=k>raise</span> <span class=ne>RuntimeError</span><span class=p>(</span>
<a id=__codelineno-0-454 name=__codelineno-0-454></a> <span class=sa>f</span><span class=s2>&quot;Method &#39;inject()&#39; of component &#39;</span><span class=si>{</span><span class=bp>self</span><span class=o>.</span><span class=n>name</span><span class=si>}</span><span class=s2>&#39; was called outside of &#39;get_context_data()&#39;&quot;</span>
<a id=__codelineno-0-455 name=__codelineno-0-455></a> <span class=p>)</span>
<a id=__codelineno-0-456 name=__codelineno-0-456></a>
<a id=__codelineno-0-457 name=__codelineno-0-457></a> <span class=k>return</span> <span class=n>get_injected_context_var</span><span class=p>(</span><span class=bp>self</span><span class=o>.</span><span class=n>name</span><span class=p>,</span> <span class=bp>self</span><span class=o>.</span><span class=n>input</span><span class=o>.</span><span class=n>context</span><span class=p>,</span> <span class=n>key</span><span class=p>,</span> <span class=n>default</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h4 id=django_components.components.dynamic.DynamicComponent.on_render_after class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">on_render_after</span> <a href=#django_components.components.dynamic.DynamicComponent.on_render_after class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>on_render_after</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>,</span> <span class=n>template</span><span class=p>:</span> <span class=n><span title=django.template.base.Template>Template</span></span><span class=p>,</span> <span class=n>content</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.slots.SlotResult>SlotResult</span></span><span class=p>]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Hook that runs just after the component's template was rendered. It receives the rendered output as the last argument.</p> <p>You can use this hook to access the context or the template, but modifying them won't have any effect.</p> <p>To override the content that gets rendered, you can return a string or SafeString from this hook.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-267>267</a></span>
<span class=normal><a href=#__codelineno-0-268>268</a></span>
<span class=normal><a href=#__codelineno-0-269>269</a></span>
<span class=normal><a href=#__codelineno-0-270>270</a></span>
<span class=normal><a href=#__codelineno-0-271>271</a></span>
<span class=normal><a href=#__codelineno-0-272>272</a></span>
<span class=normal><a href=#__codelineno-0-273>273</a></span>
<span class=normal><a href=#__codelineno-0-274>274</a></span>
<span class=normal><a href=#__codelineno-0-275>275</a></span>
<span class=normal><a href=#__codelineno-0-276>276</a></span>
<span class=normal><a href=#__codelineno-0-277>277</a></span>
<span class=normal><a href=#__codelineno-0-278>278</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-267 name=__codelineno-0-267></a><span class=k>def</span> <span class=nf>on_render_after</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>,</span> <span class=n>template</span><span class=p>:</span> <span class=n>Template</span><span class=p>,</span> <span class=n>content</span><span class=p>:</span> <span class=nb>str</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Optional</span><span class=p>[</span><span class=n>SlotResult</span><span class=p>]:</span>
<a id=__codelineno-0-268 name=__codelineno-0-268></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-269 name=__codelineno-0-269></a><span class=sd> Hook that runs just after the component&#39;s template was rendered.</span>
<a id=__codelineno-0-270 name=__codelineno-0-270></a><span class=sd> It receives the rendered output as the last argument.</span>
<a id=__codelineno-0-271 name=__codelineno-0-271></a>
<a id=__codelineno-0-272 name=__codelineno-0-272></a><span class=sd> You can use this hook to access the context or the template, but modifying</span>
<a id=__codelineno-0-273 name=__codelineno-0-273></a><span class=sd> them won&#39;t have any effect.</span>
<a id=__codelineno-0-274 name=__codelineno-0-274></a>
<a id=__codelineno-0-275 name=__codelineno-0-275></a><span class=sd> To override the content that gets rendered, you can return a string or SafeString</span>
<a id=__codelineno-0-276 name=__codelineno-0-276></a><span class=sd> from this hook.</span>
<a id=__codelineno-0-277 name=__codelineno-0-277></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-278 name=__codelineno-0-278></a> <span class=k>pass</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h4 id=django_components.components.dynamic.DynamicComponent.on_render_before class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">on_render_before</span> <a href=#django_components.components.dynamic.DynamicComponent.on_render_before class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>on_render_before</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>,</span> <span class=n>template</span><span class=p>:</span> <span class=n><span title=django.template.base.Template>Template</span></span><span class=p>)</span> <span class=o>-&gt;</span> <span class=kc>None</span>
</code></pre></div> <div class="doc doc-contents "> <p>Hook that runs just before the component's template is rendered.</p> <p>You can use this hook to access or modify the context or the template.</p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-259>259</a></span>
<span class=normal><a href=#__codelineno-0-260>260</a></span>
<span class=normal><a href=#__codelineno-0-261>261</a></span>
<span class=normal><a href=#__codelineno-0-262>262</a></span>
<span class=normal><a href=#__codelineno-0-263>263</a></span>
<span class=normal><a href=#__codelineno-0-264>264</a></span>
<span class=normal><a href=#__codelineno-0-265>265</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-259 name=__codelineno-0-259></a><span class=k>def</span> <span class=nf>on_render_before</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>,</span> <span class=n>template</span><span class=p>:</span> <span class=n>Template</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=kc>None</span><span class=p>:</span>
<a id=__codelineno-0-260 name=__codelineno-0-260></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-261 name=__codelineno-0-261></a><span class=sd> Hook that runs just before the component&#39;s template is rendered.</span>
<a id=__codelineno-0-262 name=__codelineno-0-262></a>
<a id=__codelineno-0-263 name=__codelineno-0-263></a><span class=sd> You can use this hook to access or modify the context or the template.</span>
<a id=__codelineno-0-264 name=__codelineno-0-264></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-265 name=__codelineno-0-265></a> <span class=k>pass</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h4 id=django_components.components.dynamic.DynamicComponent.render class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">render</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-classmethod"><code>classmethod</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.render class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>render</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>context</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Union href=https://docs.python.org/3.12/library/typing.html#typing.Union>Union</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Dict href=https://docs.python.org/3.12/library/typing.html#typing.Dict>Dict</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>,</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>],</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>]]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>args</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.ArgsType>ArgsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.KwargsType>KwargsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=n>slots</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.SlotsType>SlotsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a> <span class=n>escape_slots_content</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/functions.html#bool>bool</a></span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=nb>type</span><span class=p>:</span> <span class=n><span title=django_components.dependencies.RenderType>RenderType</span></span> <span class=o>=</span> <span class=s2>&quot;document&quot;</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a> <span class=n>render_dependencies</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/functions.html#bool>bool</a></span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-9 name=__codelineno-0-9 href=#__codelineno-0-9></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Render the component into a string.</p> <p>Inputs: - <code>args</code> - Positional args for the component. This is the same as calling the component as <code>{% component "my_comp" arg1 arg2 ... %}</code> - <code>kwargs</code> - Kwargs for the component. This is the same as calling the component as <code>{% component "my_comp" key1=val1 key2=val2 ... %}</code> - <code>slots</code> - Component slot fills. This is the same as pasing <code>{% fill %}</code> tags to the component. Accepts a dictionary of <code>{ slot_name: slot_content }</code> where <code>slot_content</code> can be a string or render function. - <code>escape_slots_content</code> - Whether the content from <code>slots</code> should be escaped. - <code>context</code> - A context (dictionary or Django's Context) within which the component is rendered. The keys on the context can be accessed from within the template. - NOTE: In "isolated" mode, context is NOT accessible, and data MUST be passed via component's args and kwargs. - <code>type</code> - Configure how to handle JS and CSS dependencies. - <code>"document"</code> (default) - JS dependencies are inserted into <code>{% component_js_dependencies %}</code>, or to the end of the <code>&lt;body&gt;</code> tag. CSS dependencies are inserted into <code>{% component_css_dependencies %}</code>, or the end of the <code>&lt;head&gt;</code> tag. - <code>render_dependencies</code> - Set this to <code>False</code> if you want to insert the resulting HTML into another component.</p> <p>Example: <div class=highlight><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>MyComponent</span><span class=o>.</span><span class=n>render</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>args</span><span class=o>=</span><span class=p>[</span><span class=mi>1</span><span class=p>,</span> <span class=s2>&quot;two&quot;</span><span class=p>,</span> <span class=p>{}],</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>kwargs</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=s2>&quot;key&quot;</span><span class=p>:</span> <span class=mi>123</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=p>},</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a> <span class=n>slots</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=s2>&quot;header&quot;</span><span class=p>:</span> <span class=s1>&#39;STATIC TEXT HERE&#39;</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a> <span class=s2>&quot;footer&quot;</span><span class=p>:</span> <span class=k>lambda</span> <span class=n>ctx</span><span class=p>,</span> <span class=n>slot_kwargs</span><span class=p>,</span> <span class=n>slot_ref</span><span class=p>:</span> <span class=sa>f</span><span class=s1>&#39;CTX: </span><span class=si>{</span><span class=n>ctx</span><span class=p>[</span><span class=s1>&#39;hello&#39;</span><span class=p>]</span><span class=si>}</span><span class=s1> SLOT_DATA: </span><span class=si>{</span><span class=n>slot_kwargs</span><span class=p>[</span><span class=s1>&#39;abc&#39;</span><span class=p>]</span><span class=si>}</span><span class=s1>&#39;</span><span class=p>,</span>
<a id=__codelineno-0-9 name=__codelineno-0-9 href=#__codelineno-0-9></a> <span class=p>},</span>
<a id=__codelineno-0-10 name=__codelineno-0-10 href=#__codelineno-0-10></a> <span class=n>escape_slots_content</span><span class=o>=</span><span class=kc>False</span><span class=p>,</span>
<a id=__codelineno-0-11 name=__codelineno-0-11 href=#__codelineno-0-11></a><span class=p>)</span>
</code></pre></div></p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-548>548</a></span>
<span class=normal><a href=#__codelineno-0-549>549</a></span>
<span class=normal><a href=#__codelineno-0-550>550</a></span>
<span class=normal><a href=#__codelineno-0-551>551</a></span>
<span class=normal><a href=#__codelineno-0-552>552</a></span>
<span class=normal><a href=#__codelineno-0-553>553</a></span>
<span class=normal><a href=#__codelineno-0-554>554</a></span>
<span class=normal><a href=#__codelineno-0-555>555</a></span>
<span class=normal><a href=#__codelineno-0-556>556</a></span>
<span class=normal><a href=#__codelineno-0-557>557</a></span>
<span class=normal><a href=#__codelineno-0-558>558</a></span>
<span class=normal><a href=#__codelineno-0-559>559</a></span>
<span class=normal><a href=#__codelineno-0-560>560</a></span>
<span class=normal><a href=#__codelineno-0-561>561</a></span>
<span class=normal><a href=#__codelineno-0-562>562</a></span>
<span class=normal><a href=#__codelineno-0-563>563</a></span>
<span class=normal><a href=#__codelineno-0-564>564</a></span>
<span class=normal><a href=#__codelineno-0-565>565</a></span>
<span class=normal><a href=#__codelineno-0-566>566</a></span>
<span class=normal><a href=#__codelineno-0-567>567</a></span>
<span class=normal><a href=#__codelineno-0-568>568</a></span>
<span class=normal><a href=#__codelineno-0-569>569</a></span>
<span class=normal><a href=#__codelineno-0-570>570</a></span>
<span class=normal><a href=#__codelineno-0-571>571</a></span>
<span class=normal><a href=#__codelineno-0-572>572</a></span>
<span class=normal><a href=#__codelineno-0-573>573</a></span>
<span class=normal><a href=#__codelineno-0-574>574</a></span>
<span class=normal><a href=#__codelineno-0-575>575</a></span>
<span class=normal><a href=#__codelineno-0-576>576</a></span>
<span class=normal><a href=#__codelineno-0-577>577</a></span>
<span class=normal><a href=#__codelineno-0-578>578</a></span>
<span class=normal><a href=#__codelineno-0-579>579</a></span>
<span class=normal><a href=#__codelineno-0-580>580</a></span>
<span class=normal><a href=#__codelineno-0-581>581</a></span>
<span class=normal><a href=#__codelineno-0-582>582</a></span>
<span class=normal><a href=#__codelineno-0-583>583</a></span>
<span class=normal><a href=#__codelineno-0-584>584</a></span>
<span class=normal><a href=#__codelineno-0-585>585</a></span>
<span class=normal><a href=#__codelineno-0-586>586</a></span>
<span class=normal><a href=#__codelineno-0-587>587</a></span>
<span class=normal><a href=#__codelineno-0-588>588</a></span>
<span class=normal><a href=#__codelineno-0-589>589</a></span>
<span class=normal><a href=#__codelineno-0-590>590</a></span>
<span class=normal><a href=#__codelineno-0-591>591</a></span>
<span class=normal><a href=#__codelineno-0-592>592</a></span>
<span class=normal><a href=#__codelineno-0-593>593</a></span>
<span class=normal><a href=#__codelineno-0-594>594</a></span>
<span class=normal><a href=#__codelineno-0-595>595</a></span>
<span class=normal><a href=#__codelineno-0-596>596</a></span>
<span class=normal><a href=#__codelineno-0-597>597</a></span>
<span class=normal><a href=#__codelineno-0-598>598</a></span>
<span class=normal><a href=#__codelineno-0-599>599</a></span>
<span class=normal><a href=#__codelineno-0-600>600</a></span>
<span class=normal><a href=#__codelineno-0-601>601</a></span>
<span class=normal><a href=#__codelineno-0-602>602</a></span>
<span class=normal><a href=#__codelineno-0-603>603</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-548 name=__codelineno-0-548></a><span class=nd>@classmethod</span>
<a id=__codelineno-0-549 name=__codelineno-0-549></a><span class=k>def</span> <span class=nf>render</span><span class=p>(</span>
<a id=__codelineno-0-550 name=__codelineno-0-550></a> <span class=bp>cls</span><span class=p>,</span>
<a id=__codelineno-0-551 name=__codelineno-0-551></a> <span class=n>context</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Union</span><span class=p>[</span><span class=n>Dict</span><span class=p>[</span><span class=nb>str</span><span class=p>,</span> <span class=n>Any</span><span class=p>],</span> <span class=n>Context</span><span class=p>]]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-552 name=__codelineno-0-552></a> <span class=n>args</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>ArgsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-553 name=__codelineno-0-553></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>KwargsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-554 name=__codelineno-0-554></a> <span class=n>slots</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>SlotsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-555 name=__codelineno-0-555></a> <span class=n>escape_slots_content</span><span class=p>:</span> <span class=nb>bool</span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-556 name=__codelineno-0-556></a> <span class=nb>type</span><span class=p>:</span> <span class=n>RenderType</span> <span class=o>=</span> <span class=s2>&quot;document&quot;</span><span class=p>,</span>
<a id=__codelineno-0-557 name=__codelineno-0-557></a> <span class=n>render_dependencies</span><span class=p>:</span> <span class=nb>bool</span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-558 name=__codelineno-0-558></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=nb>str</span><span class=p>:</span>
<a id=__codelineno-0-559 name=__codelineno-0-559></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-560 name=__codelineno-0-560></a><span class=sd> Render the component into a string.</span>
<a id=__codelineno-0-561 name=__codelineno-0-561></a>
<a id=__codelineno-0-562 name=__codelineno-0-562></a><span class=sd> Inputs:</span>
<a id=__codelineno-0-563 name=__codelineno-0-563></a><span class=sd> - `args` - Positional args for the component. This is the same as calling the component</span>
<a id=__codelineno-0-564 name=__codelineno-0-564></a><span class=sd> as `{% component &quot;my_comp&quot; arg1 arg2 ... %}`</span>
<a id=__codelineno-0-565 name=__codelineno-0-565></a><span class=sd> - `kwargs` - Kwargs for the component. This is the same as calling the component</span>
<a id=__codelineno-0-566 name=__codelineno-0-566></a><span class=sd> as `{% component &quot;my_comp&quot; key1=val1 key2=val2 ... %}`</span>
<a id=__codelineno-0-567 name=__codelineno-0-567></a><span class=sd> - `slots` - Component slot fills. This is the same as pasing `{% fill %}` tags to the component.</span>
<a id=__codelineno-0-568 name=__codelineno-0-568></a><span class=sd> Accepts a dictionary of `{ slot_name: slot_content }` where `slot_content` can be a string</span>
<a id=__codelineno-0-569 name=__codelineno-0-569></a><span class=sd> or render function.</span>
<a id=__codelineno-0-570 name=__codelineno-0-570></a><span class=sd> - `escape_slots_content` - Whether the content from `slots` should be escaped.</span>
<a id=__codelineno-0-571 name=__codelineno-0-571></a><span class=sd> - `context` - A context (dictionary or Django&#39;s Context) within which the component</span>
<a id=__codelineno-0-572 name=__codelineno-0-572></a><span class=sd> is rendered. The keys on the context can be accessed from within the template.</span>
<a id=__codelineno-0-573 name=__codelineno-0-573></a><span class=sd> - NOTE: In &quot;isolated&quot; mode, context is NOT accessible, and data MUST be passed via</span>
<a id=__codelineno-0-574 name=__codelineno-0-574></a><span class=sd> component&#39;s args and kwargs.</span>
<a id=__codelineno-0-575 name=__codelineno-0-575></a><span class=sd> - `type` - Configure how to handle JS and CSS dependencies.</span>
<a id=__codelineno-0-576 name=__codelineno-0-576></a><span class=sd> - `&quot;document&quot;` (default) - JS dependencies are inserted into `{% component_js_dependencies %}`,</span>
<a id=__codelineno-0-577 name=__codelineno-0-577></a><span class=sd> or to the end of the `&lt;body&gt;` tag. CSS dependencies are inserted into</span>
<a id=__codelineno-0-578 name=__codelineno-0-578></a><span class=sd> `{% component_css_dependencies %}`, or the end of the `&lt;head&gt;` tag.</span>
<a id=__codelineno-0-579 name=__codelineno-0-579></a><span class=sd> - `render_dependencies` - Set this to `False` if you want to insert the resulting HTML into another component.</span>
<a id=__codelineno-0-580 name=__codelineno-0-580></a>
<a id=__codelineno-0-581 name=__codelineno-0-581></a><span class=sd> Example:</span>
<a id=__codelineno-0-582 name=__codelineno-0-582></a><span class=sd> ```py</span>
<a id=__codelineno-0-583 name=__codelineno-0-583></a><span class=sd> MyComponent.render(</span>
<a id=__codelineno-0-584 name=__codelineno-0-584></a><span class=sd> args=[1, &quot;two&quot;, {}],</span>
<a id=__codelineno-0-585 name=__codelineno-0-585></a><span class=sd> kwargs={</span>
<a id=__codelineno-0-586 name=__codelineno-0-586></a><span class=sd> &quot;key&quot;: 123,</span>
<a id=__codelineno-0-587 name=__codelineno-0-587></a><span class=sd> },</span>
<a id=__codelineno-0-588 name=__codelineno-0-588></a><span class=sd> slots={</span>
<a id=__codelineno-0-589 name=__codelineno-0-589></a><span class=sd> &quot;header&quot;: &#39;STATIC TEXT HERE&#39;,</span>
<a id=__codelineno-0-590 name=__codelineno-0-590></a><span class=sd> &quot;footer&quot;: lambda ctx, slot_kwargs, slot_ref: f&#39;CTX: {ctx[&#39;hello&#39;]} SLOT_DATA: {slot_kwargs[&#39;abc&#39;]}&#39;,</span>
<a id=__codelineno-0-591 name=__codelineno-0-591></a><span class=sd> },</span>
<a id=__codelineno-0-592 name=__codelineno-0-592></a><span class=sd> escape_slots_content=False,</span>
<a id=__codelineno-0-593 name=__codelineno-0-593></a><span class=sd> )</span>
<a id=__codelineno-0-594 name=__codelineno-0-594></a><span class=sd> ```</span>
<a id=__codelineno-0-595 name=__codelineno-0-595></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-596 name=__codelineno-0-596></a> <span class=c1># This method may be called as class method or as instance method.</span>
<a id=__codelineno-0-597 name=__codelineno-0-597></a> <span class=c1># If called as class method, create a new instance.</span>
<a id=__codelineno-0-598 name=__codelineno-0-598></a> <span class=k>if</span> <span class=nb>isinstance</span><span class=p>(</span><span class=bp>cls</span><span class=p>,</span> <span class=n>Component</span><span class=p>):</span>
<a id=__codelineno-0-599 name=__codelineno-0-599></a> <span class=n>comp</span><span class=p>:</span> <span class=n>Component</span> <span class=o>=</span> <span class=bp>cls</span>
<a id=__codelineno-0-600 name=__codelineno-0-600></a> <span class=k>else</span><span class=p>:</span>
<a id=__codelineno-0-601 name=__codelineno-0-601></a> <span class=n>comp</span> <span class=o>=</span> <span class=bp>cls</span><span class=p>()</span>
<a id=__codelineno-0-602 name=__codelineno-0-602></a>
<a id=__codelineno-0-603 name=__codelineno-0-603></a> <span class=k>return</span> <span class=n>comp</span><span class=o>.</span><span class=n>_render</span><span class=p>(</span><span class=n>context</span><span class=p>,</span> <span class=n>args</span><span class=p>,</span> <span class=n>kwargs</span><span class=p>,</span> <span class=n>slots</span><span class=p>,</span> <span class=n>escape_slots_content</span><span class=p>,</span> <span class=nb>type</span><span class=p>,</span> <span class=n>render_dependencies</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> <div class="doc doc-object doc-function"> <h4 id=django_components.components.dynamic.DynamicComponent.render_to_response class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-method"></code> <span class="doc doc-object-name doc-function-name">render_to_response</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-classmethod"><code>classmethod</code></small> </span> <a href=#django_components.components.dynamic.DynamicComponent.render_to_response class=headerlink title="Permanent link">¤</a></h4> <div class="doc-signature highlight"><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=nf>render_to_response</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>context</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Union href=https://docs.python.org/3.12/library/typing.html#typing.Union>Union</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" title=typing.Dict href=https://docs.python.org/3.12/library/typing.html#typing.Dict>Dict</a></span><span class=p>[</span><span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#str>str</a></span><span class=p>,</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>],</span> <span class=n><span title=django.template.context.Context>Context</span></span><span class=p>]]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>slots</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.SlotsType>SlotsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=n>escape_slots_content</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/functions.html#bool>bool</a></span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=n>args</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.ArgsType>ArgsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Optional href=https://docs.python.org/3.12/library/typing.html#typing.Optional>Optional</a></span><span class=p>[</span><span class=n><span title=django_components.component.KwargsType>KwargsType</span></span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=nb>type</span><span class=p>:</span> <span class=n><span title=django_components.dependencies.RenderType>RenderType</span></span> <span class=o>=</span> <span class=s2>&quot;document&quot;</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a> <span class=o>*</span><span class=n>response_args</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span><span class=p>,</span>
<a id=__codelineno-0-9 name=__codelineno-0-9 href=#__codelineno-0-9></a> <span class=o>**</span><span class=n>response_kwargs</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=typing.Any href=https://docs.python.org/3.12/library/typing.html#typing.Any>Any</a></span>
<a id=__codelineno-0-10 name=__codelineno-0-10 href=#__codelineno-0-10></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=n><a class="autorefs autorefs-external" title=django.http.HttpResponse href=https://docs.djangoproject.com/en/5.0/ref/request-response/#django.http.HttpResponse>HttpResponse</a></span>
</code></pre></div> <div class="doc doc-contents "> <p>Render the component and wrap the content in the response class.</p> <p>The response class is taken from <code>Component.response_class</code>. Defaults to <code>django.http.HttpResponse</code>.</p> <p>This is the interface for the <code>django.views.View</code> class which allows us to use components as Django views with <code>component.as_view()</code>.</p> <p>Inputs: - <code>args</code> - Positional args for the component. This is the same as calling the component as <code>{% component "my_comp" arg1 arg2 ... %}</code> - <code>kwargs</code> - Kwargs for the component. This is the same as calling the component as <code>{% component "my_comp" key1=val1 key2=val2 ... %}</code> - <code>slots</code> - Component slot fills. This is the same as pasing <code>{% fill %}</code> tags to the component. Accepts a dictionary of <code>{ slot_name: slot_content }</code> where <code>slot_content</code> can be a string or render function. - <code>escape_slots_content</code> - Whether the content from <code>slots</code> should be escaped. - <code>context</code> - A context (dictionary or Django's Context) within which the component is rendered. The keys on the context can be accessed from within the template. - NOTE: In "isolated" mode, context is NOT accessible, and data MUST be passed via component's args and kwargs. - <code>type</code> - Configure how to handle JS and CSS dependencies. - <code>"document"</code> (default) - JS dependencies are inserted into <code>{% component_js_dependencies %}</code>, or to the end of the <code>&lt;body&gt;</code> tag. CSS dependencies are inserted into <code>{% component_css_dependencies %}</code>, or the end of the <code>&lt;head&gt;</code> tag.</p> <p>Any additional args and kwargs are passed to the <code>response_class</code>.</p> <p>Example: <div class=highlight><pre><span></span><code><a id=__codelineno-0-1 name=__codelineno-0-1 href=#__codelineno-0-1></a><span class=n>MyComponent</span><span class=o>.</span><span class=n>render_to_response</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>args</span><span class=o>=</span><span class=p>[</span><span class=mi>1</span><span class=p>,</span> <span class=s2>&quot;two&quot;</span><span class=p>,</span> <span class=p>{}],</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>kwargs</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=s2>&quot;key&quot;</span><span class=p>:</span> <span class=mi>123</span><span class=p>,</span>
<a id=__codelineno-0-5 name=__codelineno-0-5 href=#__codelineno-0-5></a> <span class=p>},</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a> <span class=n>slots</span><span class=o>=</span><span class=p>{</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=s2>&quot;header&quot;</span><span class=p>:</span> <span class=s1>&#39;STATIC TEXT HERE&#39;</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a> <span class=s2>&quot;footer&quot;</span><span class=p>:</span> <span class=k>lambda</span> <span class=n>ctx</span><span class=p>,</span> <span class=n>slot_kwargs</span><span class=p>,</span> <span class=n>slot_ref</span><span class=p>:</span> <span class=sa>f</span><span class=s1>&#39;CTX: </span><span class=si>{</span><span class=n>ctx</span><span class=p>[</span><span class=s1>&#39;hello&#39;</span><span class=p>]</span><span class=si>}</span><span class=s1> SLOT_DATA: </span><span class=si>{</span><span class=n>slot_kwargs</span><span class=p>[</span><span class=s1>&#39;abc&#39;</span><span class=p>]</span><span class=si>}</span><span class=s1>&#39;</span><span class=p>,</span>
<a id=__codelineno-0-9 name=__codelineno-0-9 href=#__codelineno-0-9></a> <span class=p>},</span>
<a id=__codelineno-0-10 name=__codelineno-0-10 href=#__codelineno-0-10></a> <span class=n>escape_slots_content</span><span class=o>=</span><span class=kc>False</span><span class=p>,</span>
<a id=__codelineno-0-11 name=__codelineno-0-11 href=#__codelineno-0-11></a> <span class=c1># HttpResponse input</span>
<a id=__codelineno-0-12 name=__codelineno-0-12 href=#__codelineno-0-12></a> <span class=n>status</span><span class=o>=</span><span class=mi>201</span><span class=p>,</span>
<a id=__codelineno-0-13 name=__codelineno-0-13 href=#__codelineno-0-13></a> <span class=n>headers</span><span class=o>=</span><span class=p>{</span><span class=o>...</span><span class=p>},</span>
<a id=__codelineno-0-14 name=__codelineno-0-14 href=#__codelineno-0-14></a><span class=p>)</span>
<a id=__codelineno-0-15 name=__codelineno-0-15 href=#__codelineno-0-15></a><span class=c1># HttpResponse(content=..., status=201, headers=...)</span>
</code></pre></div></p> <details class=quote> <summary>Source code in <code>src/django_components/component.py</code></summary> <div class=highlight><table class=highlighttable><tr><td class=linenos><div class=linenodiv><pre><span></span><span class=normal><a href=#__codelineno-0-478>478</a></span>
<span class=normal><a href=#__codelineno-0-479>479</a></span>
<span class=normal><a href=#__codelineno-0-480>480</a></span>
<span class=normal><a href=#__codelineno-0-481>481</a></span>
<span class=normal><a href=#__codelineno-0-482>482</a></span>
<span class=normal><a href=#__codelineno-0-483>483</a></span>
<span class=normal><a href=#__codelineno-0-484>484</a></span>
<span class=normal><a href=#__codelineno-0-485>485</a></span>
<span class=normal><a href=#__codelineno-0-486>486</a></span>
<span class=normal><a href=#__codelineno-0-487>487</a></span>
<span class=normal><a href=#__codelineno-0-488>488</a></span>
<span class=normal><a href=#__codelineno-0-489>489</a></span>
<span class=normal><a href=#__codelineno-0-490>490</a></span>
<span class=normal><a href=#__codelineno-0-491>491</a></span>
<span class=normal><a href=#__codelineno-0-492>492</a></span>
<span class=normal><a href=#__codelineno-0-493>493</a></span>
<span class=normal><a href=#__codelineno-0-494>494</a></span>
<span class=normal><a href=#__codelineno-0-495>495</a></span>
<span class=normal><a href=#__codelineno-0-496>496</a></span>
<span class=normal><a href=#__codelineno-0-497>497</a></span>
<span class=normal><a href=#__codelineno-0-498>498</a></span>
<span class=normal><a href=#__codelineno-0-499>499</a></span>
<span class=normal><a href=#__codelineno-0-500>500</a></span>
<span class=normal><a href=#__codelineno-0-501>501</a></span>
<span class=normal><a href=#__codelineno-0-502>502</a></span>
<span class=normal><a href=#__codelineno-0-503>503</a></span>
<span class=normal><a href=#__codelineno-0-504>504</a></span>
<span class=normal><a href=#__codelineno-0-505>505</a></span>
<span class=normal><a href=#__codelineno-0-506>506</a></span>
<span class=normal><a href=#__codelineno-0-507>507</a></span>
<span class=normal><a href=#__codelineno-0-508>508</a></span>
<span class=normal><a href=#__codelineno-0-509>509</a></span>
<span class=normal><a href=#__codelineno-0-510>510</a></span>
<span class=normal><a href=#__codelineno-0-511>511</a></span>
<span class=normal><a href=#__codelineno-0-512>512</a></span>
<span class=normal><a href=#__codelineno-0-513>513</a></span>
<span class=normal><a href=#__codelineno-0-514>514</a></span>
<span class=normal><a href=#__codelineno-0-515>515</a></span>
<span class=normal><a href=#__codelineno-0-516>516</a></span>
<span class=normal><a href=#__codelineno-0-517>517</a></span>
<span class=normal><a href=#__codelineno-0-518>518</a></span>
<span class=normal><a href=#__codelineno-0-519>519</a></span>
<span class=normal><a href=#__codelineno-0-520>520</a></span>
<span class=normal><a href=#__codelineno-0-521>521</a></span>
<span class=normal><a href=#__codelineno-0-522>522</a></span>
<span class=normal><a href=#__codelineno-0-523>523</a></span>
<span class=normal><a href=#__codelineno-0-524>524</a></span>
<span class=normal><a href=#__codelineno-0-525>525</a></span>
<span class=normal><a href=#__codelineno-0-526>526</a></span>
<span class=normal><a href=#__codelineno-0-527>527</a></span>
<span class=normal><a href=#__codelineno-0-528>528</a></span>
<span class=normal><a href=#__codelineno-0-529>529</a></span>
<span class=normal><a href=#__codelineno-0-530>530</a></span>
<span class=normal><a href=#__codelineno-0-531>531</a></span>
<span class=normal><a href=#__codelineno-0-532>532</a></span>
<span class=normal><a href=#__codelineno-0-533>533</a></span>
<span class=normal><a href=#__codelineno-0-534>534</a></span>
<span class=normal><a href=#__codelineno-0-535>535</a></span>
<span class=normal><a href=#__codelineno-0-536>536</a></span>
<span class=normal><a href=#__codelineno-0-537>537</a></span>
<span class=normal><a href=#__codelineno-0-538>538</a></span>
<span class=normal><a href=#__codelineno-0-539>539</a></span>
<span class=normal><a href=#__codelineno-0-540>540</a></span>
<span class=normal><a href=#__codelineno-0-541>541</a></span>
<span class=normal><a href=#__codelineno-0-542>542</a></span>
<span class=normal><a href=#__codelineno-0-543>543</a></span>
<span class=normal><a href=#__codelineno-0-544>544</a></span>
<span class=normal><a href=#__codelineno-0-545>545</a></span>
<span class=normal><a href=#__codelineno-0-546>546</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-478 name=__codelineno-0-478></a><span class=nd>@classmethod</span>
<a id=__codelineno-0-479 name=__codelineno-0-479></a><span class=k>def</span> <span class=nf>render_to_response</span><span class=p>(</span>
<a id=__codelineno-0-480 name=__codelineno-0-480></a> <span class=bp>cls</span><span class=p>,</span>
<a id=__codelineno-0-481 name=__codelineno-0-481></a> <span class=n>context</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>Union</span><span class=p>[</span><span class=n>Dict</span><span class=p>[</span><span class=nb>str</span><span class=p>,</span> <span class=n>Any</span><span class=p>],</span> <span class=n>Context</span><span class=p>]]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-482 name=__codelineno-0-482></a> <span class=n>slots</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>SlotsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-483 name=__codelineno-0-483></a> <span class=n>escape_slots_content</span><span class=p>:</span> <span class=nb>bool</span> <span class=o>=</span> <span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-484 name=__codelineno-0-484></a> <span class=n>args</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>ArgsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-485 name=__codelineno-0-485></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>KwargsType</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-486 name=__codelineno-0-486></a> <span class=nb>type</span><span class=p>:</span> <span class=n>RenderType</span> <span class=o>=</span> <span class=s2>&quot;document&quot;</span><span class=p>,</span>
<a id=__codelineno-0-487 name=__codelineno-0-487></a> <span class=o>*</span><span class=n>response_args</span><span class=p>:</span> <span class=n>Any</span><span class=p>,</span>
<a id=__codelineno-0-488 name=__codelineno-0-488></a> <span class=o>**</span><span class=n>response_kwargs</span><span class=p>:</span> <span class=n>Any</span><span class=p>,</span>
<a id=__codelineno-0-489 name=__codelineno-0-489></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>HttpResponse</span><span class=p>:</span>
<a id=__codelineno-0-490 name=__codelineno-0-490></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-491 name=__codelineno-0-491></a><span class=sd> Render the component and wrap the content in the response class.</span>
<a id=__codelineno-0-492 name=__codelineno-0-492></a>
<a id=__codelineno-0-493 name=__codelineno-0-493></a><span class=sd> The response class is taken from `Component.response_class`. Defaults to `django.http.HttpResponse`.</span>
<a id=__codelineno-0-494 name=__codelineno-0-494></a>
<a id=__codelineno-0-495 name=__codelineno-0-495></a><span class=sd> This is the interface for the `django.views.View` class which allows us to</span>
<a id=__codelineno-0-496 name=__codelineno-0-496></a><span class=sd> use components as Django views with `component.as_view()`.</span>
<a id=__codelineno-0-497 name=__codelineno-0-497></a>
<a id=__codelineno-0-498 name=__codelineno-0-498></a><span class=sd> Inputs:</span>
<a id=__codelineno-0-499 name=__codelineno-0-499></a><span class=sd> - `args` - Positional args for the component. This is the same as calling the component</span>
<a id=__codelineno-0-500 name=__codelineno-0-500></a><span class=sd> as `{% component &quot;my_comp&quot; arg1 arg2 ... %}`</span>
<a id=__codelineno-0-501 name=__codelineno-0-501></a><span class=sd> - `kwargs` - Kwargs for the component. This is the same as calling the component</span>
<a id=__codelineno-0-502 name=__codelineno-0-502></a><span class=sd> as `{% component &quot;my_comp&quot; key1=val1 key2=val2 ... %}`</span>
<a id=__codelineno-0-503 name=__codelineno-0-503></a><span class=sd> - `slots` - Component slot fills. This is the same as pasing `{% fill %}` tags to the component.</span>
<a id=__codelineno-0-504 name=__codelineno-0-504></a><span class=sd> Accepts a dictionary of `{ slot_name: slot_content }` where `slot_content` can be a string</span>
<a id=__codelineno-0-505 name=__codelineno-0-505></a><span class=sd> or render function.</span>
<a id=__codelineno-0-506 name=__codelineno-0-506></a><span class=sd> - `escape_slots_content` - Whether the content from `slots` should be escaped.</span>
<a id=__codelineno-0-507 name=__codelineno-0-507></a><span class=sd> - `context` - A context (dictionary or Django&#39;s Context) within which the component</span>
<a id=__codelineno-0-508 name=__codelineno-0-508></a><span class=sd> is rendered. The keys on the context can be accessed from within the template.</span>
<a id=__codelineno-0-509 name=__codelineno-0-509></a><span class=sd> - NOTE: In &quot;isolated&quot; mode, context is NOT accessible, and data MUST be passed via</span>
<a id=__codelineno-0-510 name=__codelineno-0-510></a><span class=sd> component&#39;s args and kwargs.</span>
<a id=__codelineno-0-511 name=__codelineno-0-511></a><span class=sd> - `type` - Configure how to handle JS and CSS dependencies.</span>
<a id=__codelineno-0-512 name=__codelineno-0-512></a><span class=sd> - `&quot;document&quot;` (default) - JS dependencies are inserted into `{% component_js_dependencies %}`,</span>
<a id=__codelineno-0-513 name=__codelineno-0-513></a><span class=sd> or to the end of the `&lt;body&gt;` tag. CSS dependencies are inserted into</span>
<a id=__codelineno-0-514 name=__codelineno-0-514></a><span class=sd> `{% component_css_dependencies %}`, or the end of the `&lt;head&gt;` tag.</span>
<a id=__codelineno-0-515 name=__codelineno-0-515></a>
<a id=__codelineno-0-516 name=__codelineno-0-516></a><span class=sd> Any additional args and kwargs are passed to the `response_class`.</span>
<a id=__codelineno-0-517 name=__codelineno-0-517></a>
<a id=__codelineno-0-518 name=__codelineno-0-518></a><span class=sd> Example:</span>
<a id=__codelineno-0-519 name=__codelineno-0-519></a><span class=sd> ```py</span>
<a id=__codelineno-0-520 name=__codelineno-0-520></a><span class=sd> MyComponent.render_to_response(</span>
<a id=__codelineno-0-521 name=__codelineno-0-521></a><span class=sd> args=[1, &quot;two&quot;, {}],</span>
<a id=__codelineno-0-522 name=__codelineno-0-522></a><span class=sd> kwargs={</span>
<a id=__codelineno-0-523 name=__codelineno-0-523></a><span class=sd> &quot;key&quot;: 123,</span>
<a id=__codelineno-0-524 name=__codelineno-0-524></a><span class=sd> },</span>
<a id=__codelineno-0-525 name=__codelineno-0-525></a><span class=sd> slots={</span>
<a id=__codelineno-0-526 name=__codelineno-0-526></a><span class=sd> &quot;header&quot;: &#39;STATIC TEXT HERE&#39;,</span>
<a id=__codelineno-0-527 name=__codelineno-0-527></a><span class=sd> &quot;footer&quot;: lambda ctx, slot_kwargs, slot_ref: f&#39;CTX: {ctx[&#39;hello&#39;]} SLOT_DATA: {slot_kwargs[&#39;abc&#39;]}&#39;,</span>
<a id=__codelineno-0-528 name=__codelineno-0-528></a><span class=sd> },</span>
<a id=__codelineno-0-529 name=__codelineno-0-529></a><span class=sd> escape_slots_content=False,</span>
<a id=__codelineno-0-530 name=__codelineno-0-530></a><span class=sd> # HttpResponse input</span>
<a id=__codelineno-0-531 name=__codelineno-0-531></a><span class=sd> status=201,</span>
<a id=__codelineno-0-532 name=__codelineno-0-532></a><span class=sd> headers={...},</span>
<a id=__codelineno-0-533 name=__codelineno-0-533></a><span class=sd> )</span>
<a id=__codelineno-0-534 name=__codelineno-0-534></a><span class=sd> # HttpResponse(content=..., status=201, headers=...)</span>
<a id=__codelineno-0-535 name=__codelineno-0-535></a><span class=sd> ```</span>
<a id=__codelineno-0-536 name=__codelineno-0-536></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-537 name=__codelineno-0-537></a> <span class=n>content</span> <span class=o>=</span> <span class=bp>cls</span><span class=o>.</span><span class=n>render</span><span class=p>(</span>
<a id=__codelineno-0-538 name=__codelineno-0-538></a> <span class=n>args</span><span class=o>=</span><span class=n>args</span><span class=p>,</span>
<a id=__codelineno-0-539 name=__codelineno-0-539></a> <span class=n>kwargs</span><span class=o>=</span><span class=n>kwargs</span><span class=p>,</span>
<a id=__codelineno-0-540 name=__codelineno-0-540></a> <span class=n>context</span><span class=o>=</span><span class=n>context</span><span class=p>,</span>
<a id=__codelineno-0-541 name=__codelineno-0-541></a> <span class=n>slots</span><span class=o>=</span><span class=n>slots</span><span class=p>,</span>
<a id=__codelineno-0-542 name=__codelineno-0-542></a> <span class=n>escape_slots_content</span><span class=o>=</span><span class=n>escape_slots_content</span><span class=p>,</span>
<a id=__codelineno-0-543 name=__codelineno-0-543></a> <span class=nb>type</span><span class=o>=</span><span class=nb>type</span><span class=p>,</span>
<a id=__codelineno-0-544 name=__codelineno-0-544></a> <span class=n>render_dependencies</span><span class=o>=</span><span class=kc>True</span><span class=p>,</span>
<a id=__codelineno-0-545 name=__codelineno-0-545></a> <span class=p>)</span>
<a id=__codelineno-0-546 name=__codelineno-0-546></a> <span class=k>return</span> <span class=bp>cls</span><span class=o>.</span><span class=n>response_class</span><span class=p>(</span><span class=n>content</span><span class=p>,</span> <span class=o>*</span><span class=n>response_args</span><span class=p>,</span> <span class=o>**</span><span class=n>response_kwargs</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </article> </div> <script>var tabs=__md_get("__tabs");if(Array.isArray(tabs))e:for(var set of document.querySelectorAll(".tabbed-set")){var labels=set.querySelector(".tabbed-labels");for(var tab of tabs)for(var label of labels.getElementsByTagName("label"))if(label.innerText.trim()===tab){var input=document.getElementById(label.htmlFor);input.checked=!0;continue e}}</script> <script>var target=document.getElementById(location.hash.slice(1));target&&target.name&&(target.checked=target.name.startsWith("__tabbed_"))</script> </div> <button type=button class="md-top md-icon" data-md-component=top hidden> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8z"/></svg> Back to top </button> </main> <footer class=md-footer> <nav class="md-footer__inner md-grid" aria-label=Footer> <a href=../component_registry/ class="md-footer__link md-footer__link--prev" aria-label='Previous: <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> component_registry'> <div class="md-footer__button md-icon"> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11z"/></svg> </div> <div class=md-footer__title> <span class=md-footer__direction> Previous </span> <div class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> component_registry </div> </div> </a> <a href=dynamic/ class="md-footer__link md-footer__link--next" aria-label='Next: <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> dynamic'> <div class=md-footer__title> <span class=md-footer__direction> Next </span> <div class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> dynamic </div> </div> <div class="md-footer__button md-icon"> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11z"/></svg> </div> </a> </nav> <div class="md-footer-meta md-typeset"> <div class="md-footer-meta__inner md-grid"> <div class=md-copyright> Made with <a href=https://squidfunk.github.io/mkdocs-material/ target=_blank rel=noopener> Material for MkDocs </a> </div> <div class=md-social> <a href=https://github.com/EmilStenstrom/django-components target=_blank rel=noopener title=github.com class=md-social__link> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 496 512"><!-- Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6m-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3m44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9M244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8M97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1m-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7m32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1m-11.4-14.7c-1.6 1-1.6 3.6 0 5.9s4.3 3.3 5.6 2.3c1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2"/></svg> </a> <a href=https://pypi.org/project/django-components/ target=_blank rel=noopener title=pypi.org class=md-social__link> <svg xmlns=http://www.w3.org/2000/svg viewbox="0 0 448 512"><!-- Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2024 Fonticons, Inc.--><path d="M439.8 200.5c-7.7-30.9-22.3-54.2-53.4-54.2h-40.1v47.4c0 36.8-31.2 67.8-66.8 67.8H172.7c-29.2 0-53.4 25-53.4 54.3v101.8c0 29 25.2 46 53.4 54.3 33.8 9.9 66.3 11.7 106.8 0 26.9-7.8 53.4-23.5 53.4-54.3v-40.7H226.2v-13.6h160.2c31.1 0 42.6-21.7 53.4-54.2 11.2-33.5 10.7-65.7 0-108.6M286.2 404c11.1 0 20.1 9.1 20.1 20.3 0 11.3-9 20.4-20.1 20.4-11 0-20.1-9.2-20.1-20.4.1-11.3 9.1-20.3 20.1-20.3M167.8 248.1h106.8c29.7 0 53.4-24.5 53.4-54.3V91.9c0-29-24.4-50.7-53.4-55.6-35.8-5.9-74.7-5.6-106.8.1-45.2 8-53.4 24.7-53.4 55.6v40.7h106.9v13.6h-147c-31.1 0-58.3 18.7-66.8 54.2-9.8 40.7-10.2 66.1 0 108.6 7.6 31.6 25.7 54.2 56.8 54.2H101v-48.8c0-35.3 30.5-66.4 66.8-66.4m-6.7-142.6c-11.1 0-20.1-9.1-20.1-20.3.1-11.3 9-20.4 20.1-20.4 11 0 20.1 9.2 20.1 20.4s-9 20.3-20.1 20.3"/></svg> </a> </div> </div> </div> </footer> </div> <div class=md-dialog data-md-component=dialog> <div class="md-dialog__inner md-typeset"></div> </div> <div class=md-progress data-md-component=progress role=progressbar></div> <script id=__config type=application/json>{"base": "../../..", "features": ["content.action.edit", "content.action.view", "content.code.annotate", "content.code.copy", "content.tabs.link", "navigation.expand", "navigation.footer", "navigation.instant", "navigation.instant.progress", "navigation.indexes", "navigation.sections", "navigation.tracking", "navigation.top", "search.highlight", "search.share", "search.suggest", "toc.follow"], "search": "../../../assets/javascripts/workers/search.6ce7567c.min.js", "translations": {"clipboard.copied": "Copied to clipboard", "clipboard.copy": "Copy to clipboard", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.placeholder": "Type to start searching", "search.result.term.missing": "Missing", "select.version": "Select version"}, "version": {"alias": true, "default": ["dev"], "provider": "mike"}}</script> <script src=../../../assets/javascripts/bundle.83f73b43.min.js></script> <script src=../../../assets/_markdown_exec_pyodide.js></script> <script src=../../../js/timeago.min.js></script> <script src=../../../js/timeago_mkdocs_material.js></script> </body> </html>
Reference in a new issue View git blame Copy permalink