django-components/0.112/reference/django_components/slots/index.html

275 lines
No EOL
91 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/slots/ rel=canonical><link href=../provide/ rel=prev><link href=../tag_formatter/ rel=next><link rel=icon href=../../../assets/images/favicon.png><meta name=generator content="mkdocs-1.6.1, mkdocs-material-9.5.43"><title>slots - 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="<code class=" doc-symbol doc-symbol-nav doc-symbol-module&quot;></code> slots - 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/slots/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/slots/ property=og:url><meta name=twitter:card content=summary_large_image><meta name=twitter:title content="<code class=" doc-symbol doc-symbol-nav doc-symbol-module&quot;></code> slots - 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/slots/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.slots 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> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> slots </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--nested"> <input class="md-nav__toggle md-toggle md-toggle--indeterminate" type=checkbox id=__nav_2_1_1_9> <div class="md-nav__link md-nav__container"> <a href=../components/ class="md-nav__link "> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> components </span> </a> <label class="md-nav__link " 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=false> <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=../components/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 md-nav__item--active"> <input class="md-nav__toggle md-toggle" type=checkbox id=__toc> <label class="md-nav__link md-nav__link--active" for=__toc> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> slots </span> <span class="md-nav__icon md-icon"></span> </label> <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> slots </span> </a> <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.slots.FillNode class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;FillNode </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.Slot class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;Slot </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.SlotFill class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;SlotFill </span> </a> <nav class=md-nav aria-label= SlotFill> <ul class=md-nav__list> <li class=md-nav__item> <a href=#django_components.slots.SlotFill.name class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;name </span> </a> </li> </ul> </nav> </li> <li class=md-nav__item> <a href=#django_components.slots.SlotIsFilled class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;SlotIsFilled </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.SlotNode class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;SlotNode </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.SlotRef class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;SlotRef </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.resolve_fills class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-function"></code>&nbsp;resolve_fills </span> </a> </li> </ul> </nav> </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.slots.FillNode class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;FillNode </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.Slot class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;Slot </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.SlotFill class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;SlotFill </span> </a> <nav class=md-nav aria-label= SlotFill> <ul class=md-nav__list> <li class=md-nav__item> <a href=#django_components.slots.SlotFill.name class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-attribute"></code>&nbsp;name </span> </a> </li> </ul> </nav> </li> <li class=md-nav__item> <a href=#django_components.slots.SlotIsFilled class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;SlotIsFilled </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.SlotNode class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;SlotNode </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.SlotRef class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-class"></code>&nbsp;SlotRef </span> </a> </li> <li class=md-nav__item> <a href=#django_components.slots.resolve_fills class=md-nav__link> <span class=md-ellipsis> <code class="doc-symbol doc-symbol-toc doc-symbol-function"></code>&nbsp;resolve_fills </span> </a> </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/slots.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/slots.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.slots class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-module"></code> <span class="doc doc-object-name doc-module-name">slots</span> <a href=#django_components.slots class=headerlink title="Permanent link">¤</a></h1> <div class="doc doc-contents first"> <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.slots.FillNode href=../#django_components.slots.FillNode>FillNode</a></code></b> <div class=doc-md-description> <p>Node corresponding to <code>{% fill %}</code></p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.slots.Slot href=../#django_components.slots.Slot>Slot</a></code></b> <div class=doc-md-description> <p>This class holds the slot content function along with related metadata.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.slots.SlotFill href=../#django_components.slots.SlotFill>SlotFill</a></code></b> <div class=doc-md-description> <p>SlotFill describes what WILL be rendered.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.slots.SlotIsFilled href=../#django_components.slots.SlotIsFilled>SlotIsFilled</a></code></b> <div class=doc-md-description> <p>Dictionary that returns <code>True</code> if the slot is filled (key is found), <code>False</code> otherwise.</p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.slots.SlotNode href=../#django_components.slots.SlotNode>SlotNode</a></code></b> <div class=doc-md-description> <p>Node corresponding to <code>{% slot %}</code></p> </div> </li> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.slots.SlotRef href=../#django_components.slots.SlotRef>SlotRef</a></code></b> <div class=doc-md-description> <p>SlotRef allows to treat a slot as a variable. The slot is rendered only once</p> </div> </li> </ul> <p><span class=doc-section-title>Functions:</span></p> <ul> <li class="doc-section-item field-body"> <b><code><a class="autorefs autorefs-internal" title=django_components.slots.resolve_fills href=../#django_components.slots.resolve_fills>resolve_fills</a></code></b> <div class=doc-md-description> <p>Given a component body (<code>django.template.NodeList</code>), find all slot fills,</p> </div> </li> </ul> <div class="doc doc-children"> <div class="doc doc-object doc-class"> <h2 id=django_components.slots.FillNode class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-class"></code> <span class="doc doc-object-name doc-class-name">FillNode</span> <a href=#django_components.slots.FillNode 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>FillNode</span><span class=p>(</span><span class=n>nodelist</span><span class=p>:</span> <span class=n><span title=django.template.base.NodeList>NodeList</span></span><span class=p>,</span> <span class=n>kwargs</span><span class=p>:</span> <span class=n><span title=django_components.expression.RuntimeKwargs>RuntimeKwargs</span></span><span class=p>,</span> <span class=n>trace_id</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>node_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>
</code></pre></div> <div class="doc doc-contents "> <p class="doc doc-class-bases"> Bases: <code><a class="autorefs autorefs-internal" title=django_components.node.BaseNode href=../#django_components.node.BaseNode>BaseNode</a></code></p> <p>Node corresponding to <code>{% fill %}</code></p> <details class=quote> <summary>Source code in <code>src/django_components/slots.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-376>376</a></span>
<span class=normal><a href=#__codelineno-0-377>377</a></span>
<span class=normal><a href=#__codelineno-0-378>378</a></span>
<span class=normal><a href=#__codelineno-0-379>379</a></span>
<span class=normal><a href=#__codelineno-0-380>380</a></span>
<span class=normal><a href=#__codelineno-0-381>381</a></span>
<span class=normal><a href=#__codelineno-0-382>382</a></span>
<span class=normal><a href=#__codelineno-0-383>383</a></span>
<span class=normal><a href=#__codelineno-0-384>384</a></span>
<span class=normal><a href=#__codelineno-0-385>385</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-376 name=__codelineno-0-376></a><span class=k>def</span> <span class=fm>__init__</span><span class=p>(</span>
<a id=__codelineno-0-377 name=__codelineno-0-377></a> <span class=bp>self</span><span class=p>,</span>
<a id=__codelineno-0-378 name=__codelineno-0-378></a> <span class=n>nodelist</span><span class=p>:</span> <span class=n>NodeList</span><span class=p>,</span>
<a id=__codelineno-0-379 name=__codelineno-0-379></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n>RuntimeKwargs</span><span class=p>,</span>
<a id=__codelineno-0-380 name=__codelineno-0-380></a> <span class=n>trace_id</span><span class=p>:</span> <span class=nb>str</span><span class=p>,</span>
<a id=__codelineno-0-381 name=__codelineno-0-381></a> <span class=n>node_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-382 name=__codelineno-0-382></a><span class=p>):</span>
<a id=__codelineno-0-383 name=__codelineno-0-383></a> <span class=nb>super</span><span class=p>()</span><span class=o>.</span><span class=fm>__init__</span><span class=p>(</span><span class=n>nodelist</span><span class=o>=</span><span class=n>nodelist</span><span class=p>,</span> <span class=n>args</span><span class=o>=</span><span class=kc>None</span><span class=p>,</span> <span class=n>kwargs</span><span class=o>=</span><span class=n>kwargs</span><span class=p>,</span> <span class=n>node_id</span><span class=o>=</span><span class=n>node_id</span><span class=p>)</span>
<a id=__codelineno-0-384 name=__codelineno-0-384></a>
<a id=__codelineno-0-385 name=__codelineno-0-385></a> <span class=bp>self</span><span class=o>.</span><span class=n>trace_id</span> <span class=o>=</span> <span class=n>trace_id</span>
</code></pre></div></td></tr></table></div> </details> <div class="doc doc-children"> </div> </div> </div> <div class="doc doc-object doc-class"> <h2 id=django_components.slots.Slot class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-class"></code> <span class="doc doc-object-name doc-class-name">Slot</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-dataclass"><code>dataclass</code></small> </span> <a href=#django_components.slots.Slot 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>Slot</span><span class=p>(</span><span class=n>content_func</span><span class=p>:</span> <span class=n><span title=django_components.slots.SlotFunc>SlotFunc</span></span><span class=p>[</span><span class=n><span title=django_components.slots.TSlotData>TSlotData</span></span><span class=p>])</span>
</code></pre></div> <div class="doc doc-contents "> <p class="doc doc-class-bases"> Bases: <code><a class="autorefs autorefs-external" title=typing.Generic href=https://docs.python.org/3.12/library/typing.html#typing.Generic>Generic</a>[<span title=django_components.slots.TSlotData>TSlotData</span>]</code></p> <p>This class holds the slot content function along with related metadata.</p> <div class="doc doc-children"> </div> </div> </div> <div class="doc doc-object doc-class"> <h2 id=django_components.slots.SlotFill class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-class"></code> <span class="doc doc-object-name doc-class-name">SlotFill</span> <span class="doc doc-labels"> <small class="doc doc-label doc-label-dataclass"><code>dataclass</code></small> </span> <a href=#django_components.slots.SlotFill 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>SlotFill</span><span class=p>(</span><span class=n>name</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>is_filled</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=p>,</span> <span class=n>slot</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.slots.Slot href=../#django_components.slots.Slot>Slot</a></span><span class=p>[</span><span class=n><span title=django_components.slots.TSlotData>TSlotData</span></span><span class=p>])</span>
</code></pre></div> <div class="doc doc-contents "> <p class="doc doc-class-bases"> Bases: <code><a class="autorefs autorefs-external" title=typing.Generic href=https://docs.python.org/3.12/library/typing.html#typing.Generic>Generic</a>[<span title=django_components.slots.TSlotData>TSlotData</span>]</code></p> <p>SlotFill describes what WILL be rendered.</p> <p>The fill may be provided by the user from the outside (<code>is_filled=True</code>), or it may be the default content of the slot (<code>is_filled=False</code>).</p> <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.slots.SlotFill.name href=../#django_components.slots.SlotFill.name>name</a></code></b> (<code><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>Name of the slot.</p> </div> </li> </ul> <div class="doc doc-children"> <div class="doc doc-object doc-attribute"> <h3 id=django_components.slots.SlotFill.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">name</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.slots.SlotFill.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>name</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>
</code></pre></div> <div class="doc doc-contents "> <p>Name of the slot.</p> </div> </div> </div> </div> </div> <div class="doc doc-object doc-class"> <h2 id=django_components.slots.SlotIsFilled class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-class"></code> <span class="doc doc-object-name doc-class-name">SlotIsFilled</span> <a href=#django_components.slots.SlotIsFilled 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>SlotIsFilled</span><span class=p>(</span><span class=n>fills</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=o>*</span><span class=n>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> <span class=o>**</span><span class=n>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><span class=p>)</span>
</code></pre></div> <div class="doc doc-contents "> <p class="doc doc-class-bases"> Bases: <code><a class="autorefs autorefs-external" href=https://docs.python.org/3.12/library/stdtypes.html#dict>dict</a></code></p> <p>Dictionary that returns <code>True</code> if the slot is filled (key is found), <code>False</code> otherwise.</p> <details class=quote> <summary>Source code in <code>src/django_components/slots.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-135>135</a></span>
<span class=normal><a href=#__codelineno-0-136>136</a></span>
<span class=normal><a href=#__codelineno-0-137>137</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-135 name=__codelineno-0-135></a><span class=k>def</span> <span class=fm>__init__</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>fills</span><span class=p>:</span> <span class=n>Dict</span><span class=p>,</span> <span class=o>*</span><span class=n>args</span><span class=p>:</span> <span class=n>Any</span><span class=p>,</span> <span class=o>**</span><span class=n>kwargs</span><span class=p>:</span> <span class=n>Any</span><span class=p>)</span> <span class=o>-&gt;</span> <span class=kc>None</span><span class=p>:</span>
<a id=__codelineno-0-136 name=__codelineno-0-136></a> <span class=n>escaped_fill_names</span> <span class=o>=</span> <span class=p>{</span><span class=n>_escape_slot_name</span><span class=p>(</span><span class=n>fill_name</span><span class=p>):</span> <span class=kc>True</span> <span class=k>for</span> <span class=n>fill_name</span> <span class=ow>in</span> <span class=n>fills</span><span class=o>.</span><span class=n>keys</span><span class=p>()}</span>
<a id=__codelineno-0-137 name=__codelineno-0-137></a> <span class=nb>super</span><span class=p>()</span><span class=o>.</span><span class=fm>__init__</span><span class=p>(</span><span class=n>escaped_fill_names</span><span class=p>,</span> <span class=o>*</span><span class=n>args</span><span class=p>,</span> <span class=o>**</span><span class=n>kwargs</span><span class=p>)</span>
</code></pre></div></td></tr></table></div> </details> <div class="doc doc-children"> </div> </div> </div> <div class="doc doc-object doc-class"> <h2 id=django_components.slots.SlotNode class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-class"></code> <span class="doc doc-object-name doc-class-name">SlotNode</span> <a href=#django_components.slots.SlotNode 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>SlotNode</span><span class=p>(</span>
<a id=__codelineno-0-2 name=__codelineno-0-2 href=#__codelineno-0-2></a> <span class=n>nodelist</span><span class=p>:</span> <span class=n><span title=django.template.base.NodeList>NodeList</span></span><span class=p>,</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a> <span class=n>trace_id</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>
<a id=__codelineno-0-4 name=__codelineno-0-4 href=#__codelineno-0-4></a> <span class=n>node_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-5 name=__codelineno-0-5 href=#__codelineno-0-5></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.expression.RuntimeKwargs>RuntimeKwargs</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>is_required</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>False</span><span class=p>,</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a> <span class=n>is_default</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>False</span><span class=p>,</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></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.node.BaseNode href=../#django_components.node.BaseNode>BaseNode</a></code></p> <p>Node corresponding to <code>{% slot %}</code></p> <details class=quote> <summary>Source code in <code>src/django_components/slots.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-155>155</a></span>
<span class=normal><a href=#__codelineno-0-156>156</a></span>
<span class=normal><a href=#__codelineno-0-157>157</a></span>
<span class=normal><a href=#__codelineno-0-158>158</a></span>
<span class=normal><a href=#__codelineno-0-159>159</a></span>
<span class=normal><a href=#__codelineno-0-160>160</a></span>
<span class=normal><a href=#__codelineno-0-161>161</a></span>
<span class=normal><a href=#__codelineno-0-162>162</a></span>
<span class=normal><a href=#__codelineno-0-163>163</a></span>
<span class=normal><a href=#__codelineno-0-164>164</a></span>
<span class=normal><a href=#__codelineno-0-165>165</a></span>
<span class=normal><a href=#__codelineno-0-166>166</a></span>
<span class=normal><a href=#__codelineno-0-167>167</a></span>
<span class=normal><a href=#__codelineno-0-168>168</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-155 name=__codelineno-0-155></a><span class=k>def</span> <span class=fm>__init__</span><span class=p>(</span>
<a id=__codelineno-0-156 name=__codelineno-0-156></a> <span class=bp>self</span><span class=p>,</span>
<a id=__codelineno-0-157 name=__codelineno-0-157></a> <span class=n>nodelist</span><span class=p>:</span> <span class=n>NodeList</span><span class=p>,</span>
<a id=__codelineno-0-158 name=__codelineno-0-158></a> <span class=n>trace_id</span><span class=p>:</span> <span class=nb>str</span><span class=p>,</span>
<a id=__codelineno-0-159 name=__codelineno-0-159></a> <span class=n>node_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-160 name=__codelineno-0-160></a> <span class=n>kwargs</span><span class=p>:</span> <span class=n>Optional</span><span class=p>[</span><span class=n>RuntimeKwargs</span><span class=p>]</span> <span class=o>=</span> <span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-161 name=__codelineno-0-161></a> <span class=n>is_required</span><span class=p>:</span> <span class=nb>bool</span> <span class=o>=</span> <span class=kc>False</span><span class=p>,</span>
<a id=__codelineno-0-162 name=__codelineno-0-162></a> <span class=n>is_default</span><span class=p>:</span> <span class=nb>bool</span> <span class=o>=</span> <span class=kc>False</span><span class=p>,</span>
<a id=__codelineno-0-163 name=__codelineno-0-163></a><span class=p>):</span>
<a id=__codelineno-0-164 name=__codelineno-0-164></a> <span class=nb>super</span><span class=p>()</span><span class=o>.</span><span class=fm>__init__</span><span class=p>(</span><span class=n>nodelist</span><span class=o>=</span><span class=n>nodelist</span><span class=p>,</span> <span class=n>args</span><span class=o>=</span><span class=kc>None</span><span class=p>,</span> <span class=n>kwargs</span><span class=o>=</span><span class=n>kwargs</span><span class=p>,</span> <span class=n>node_id</span><span class=o>=</span><span class=n>node_id</span><span class=p>)</span>
<a id=__codelineno-0-165 name=__codelineno-0-165></a>
<a id=__codelineno-0-166 name=__codelineno-0-166></a> <span class=bp>self</span><span class=o>.</span><span class=n>is_required</span> <span class=o>=</span> <span class=n>is_required</span>
<a id=__codelineno-0-167 name=__codelineno-0-167></a> <span class=bp>self</span><span class=o>.</span><span class=n>is_default</span> <span class=o>=</span> <span class=n>is_default</span>
<a id=__codelineno-0-168 name=__codelineno-0-168></a> <span class=bp>self</span><span class=o>.</span><span class=n>trace_id</span> <span class=o>=</span> <span class=n>trace_id</span>
</code></pre></div></td></tr></table></div> </details> <div class="doc doc-children"> </div> </div> </div> <div class="doc doc-object doc-class"> <h2 id=django_components.slots.SlotRef class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-class"></code> <span class="doc doc-object-name doc-class-name">SlotRef</span> <a href=#django_components.slots.SlotRef 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>SlotRef</span><span class=p>(</span><span class=n>slot</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.slots.SlotNode href=../#django_components.slots.SlotNode>SlotNode</a></span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=django.template.Context href=https://docs.djangoproject.com/en/5.0/ref/templates/api/#django.template.Context>Context</a></span><span class=p>)</span>
</code></pre></div> <div class="doc doc-contents "> <p>SlotRef allows to treat a slot as a variable. The slot is rendered only once the instance is coerced to string.</p> <p>This is used to access slots as variables inside the templates. When a SlotRef is rendered in the template with <code>{{ my_lazy_slot }}</code>, it will output the contents of the slot.</p> <details class=quote> <summary>Source code in <code>src/django_components/slots.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-121>121</a></span>
<span class=normal><a href=#__codelineno-0-122>122</a></span>
<span class=normal><a href=#__codelineno-0-123>123</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-121 name=__codelineno-0-121></a><span class=k>def</span> <span class=fm>__init__</span><span class=p>(</span><span class=bp>self</span><span class=p>,</span> <span class=n>slot</span><span class=p>:</span> <span class=s2>&quot;SlotNode&quot;</span><span class=p>,</span> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>):</span>
<a id=__codelineno-0-122 name=__codelineno-0-122></a> <span class=bp>self</span><span class=o>.</span><span class=n>_slot</span> <span class=o>=</span> <span class=n>slot</span>
<a id=__codelineno-0-123 name=__codelineno-0-123></a> <span class=bp>self</span><span class=o>.</span><span class=n>_context</span> <span class=o>=</span> <span class=n>context</span>
</code></pre></div></td></tr></table></div> </details> <div class="doc doc-children"> </div> </div> </div> <div class="doc doc-object doc-function"> <h2 id=django_components.slots.resolve_fills class="doc doc-heading"> <code class="doc-symbol doc-symbol-heading doc-symbol-function"></code> <span class="doc doc-object-name doc-function-name">resolve_fills</span> <a href=#django_components.slots.resolve_fills 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>resolve_fills</span><span class=p>(</span><span class=n>context</span><span class=p>:</span> <span class=n><a class="autorefs autorefs-external" title=django.template.Context href=https://docs.djangoproject.com/en/5.0/ref/templates/api/#django.template.Context>Context</a></span><span class=p>,</span> <span class=n>nodelist</span><span class=p>:</span> <span class=n><span title=django.template.base.NodeList>NodeList</span></span><span class=p>,</span> <span class=n>component_name</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.Dict href=https://docs.python.org/3.12/library/typing.html#typing.Dict>Dict</a></span><span class=p>[</span><span class=n><span title=django_components.slots.SlotName>SlotName</span></span><span class=p>,</span> <span class=n><a class="autorefs autorefs-internal" title=django_components.slots.Slot href=../#django_components.slots.Slot>Slot</a></span><span class=p>]</span>
</code></pre></div> <div class="doc doc-contents "> <p>Given a component body (<code>django.template.NodeList</code>), find all slot fills, whether defined explicitly with <code>{% fill %}</code> or implicitly.</p> <p>So if we have a component body: <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;mycomponent&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>fill</span> <span class=s2>&quot;first_fill&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-0-3 name=__codelineno-0-3 href=#__codelineno-0-3></a><span class=x> Hello!</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=x> </span><span class=cp>{%</span> <span class=k>fill</span> <span class=s2>&quot;second_fill&quot;</span> <span class=cp>%}</span>
<a id=__codelineno-0-6 name=__codelineno-0-6 href=#__codelineno-0-6></a><span class=x> Hello too!</span>
<a id=__codelineno-0-7 name=__codelineno-0-7 href=#__codelineno-0-7></a><span class=x> </span><span class=cp>{%</span> <span class=k>endfill</span> <span class=cp>%}</span>
<a id=__codelineno-0-8 name=__codelineno-0-8 href=#__codelineno-0-8></a><span class=cp>{%</span> <span class=k>endcomponent</span> <span class=cp>%}</span>
</code></pre></div></p> <p>Then this function finds 2 fill nodes: "first_fill" and "second_fill", and formats them as slot functions, returning:</p> <div class=highlight><pre><span></span><code><a id=__codelineno-1-1 name=__codelineno-1-1 href=#__codelineno-1-1></a><span class=p>{</span>
<a id=__codelineno-1-2 name=__codelineno-1-2 href=#__codelineno-1-2></a> <span class=s2>&quot;first_fill&quot;</span><span class=p>:</span> <span class=n>SlotFunc</span><span class=p>(</span><span class=o>...</span><span class=p>),</span>
<a id=__codelineno-1-3 name=__codelineno-1-3 href=#__codelineno-1-3></a> <span class=s2>&quot;second_fill&quot;</span><span class=p>:</span> <span class=n>SlotFunc</span><span class=p>(</span><span class=o>...</span><span class=p>),</span>
<a id=__codelineno-1-4 name=__codelineno-1-4 href=#__codelineno-1-4></a><span class=p>}</span>
</code></pre></div> <p>If no fill nodes are found, then the content is treated as default slot content.</p> <div class=highlight><pre><span></span><code><a id=__codelineno-2-1 name=__codelineno-2-1 href=#__codelineno-2-1></a><span class=p>{</span>
<a id=__codelineno-2-2 name=__codelineno-2-2 href=#__codelineno-2-2></a> <span class=n>DEFAULT_SLOT_KEY</span><span class=p>:</span> <span class=n>SlotFunc</span><span class=p>(</span><span class=o>...</span><span class=p>),</span>
<a id=__codelineno-2-3 name=__codelineno-2-3 href=#__codelineno-2-3></a><span class=p>}</span>
</code></pre></div> <p>This function also handles for-loops, if/else statements, or include tags to generate fill tags:</p> <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;mycomponent&quot;</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>for</span> <span class=nv>slot_name</span> <span class=k>in</span> <span class=nv>slots</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>fill</span> <span class=nv>name</span><span class=o>=</span><span class=nv>slot_name</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>slot</span> <span class=nv>name</span><span class=o>=</span><span class=nv>slot_name</span> <span class=o>/</span> <span class=cp>%}</span>
<a id=__codelineno-3-5 name=__codelineno-3-5 href=#__codelineno-3-5></a><span class=x> </span><span class=cp>{%</span> <span class=k>endfill</span> <span class=cp>%}</span>
<a id=__codelineno-3-6 name=__codelineno-3-6 href=#__codelineno-3-6></a><span class=x> </span><span class=cp>{%</span> <span class=k>endfor</span> <span class=cp>%}</span>
<a id=__codelineno-3-7 name=__codelineno-3-7 href=#__codelineno-3-7></a><span class=cp>{%</span> <span class=k>endcomponent</span> <span class=cp>%}</span>
</code></pre></div> <details class=quote> <summary>Source code in <code>src/django_components/slots.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-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>
<span class=normal><a href=#__codelineno-0-547>547</a></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>
<span class=normal><a href=#__codelineno-0-604>604</a></span>
<span class=normal><a href=#__codelineno-0-605>605</a></span>
<span class=normal><a href=#__codelineno-0-606>606</a></span>
<span class=normal><a href=#__codelineno-0-607>607</a></span>
<span class=normal><a href=#__codelineno-0-608>608</a></span>
<span class=normal><a href=#__codelineno-0-609>609</a></span>
<span class=normal><a href=#__codelineno-0-610>610</a></span>
<span class=normal><a href=#__codelineno-0-611>611</a></span>
<span class=normal><a href=#__codelineno-0-612>612</a></span>
<span class=normal><a href=#__codelineno-0-613>613</a></span>
<span class=normal><a href=#__codelineno-0-614>614</a></span>
<span class=normal><a href=#__codelineno-0-615>615</a></span>
<span class=normal><a href=#__codelineno-0-616>616</a></span>
<span class=normal><a href=#__codelineno-0-617>617</a></span>
<span class=normal><a href=#__codelineno-0-618>618</a></span>
<span class=normal><a href=#__codelineno-0-619>619</a></span>
<span class=normal><a href=#__codelineno-0-620>620</a></span>
<span class=normal><a href=#__codelineno-0-621>621</a></span>
<span class=normal><a href=#__codelineno-0-622>622</a></span>
<span class=normal><a href=#__codelineno-0-623>623</a></span>
<span class=normal><a href=#__codelineno-0-624>624</a></span>
<span class=normal><a href=#__codelineno-0-625>625</a></span></pre></div></td><td class=code><div><pre><span></span><code><a id=__codelineno-0-535 name=__codelineno-0-535></a><span class=k>def</span> <span class=nf>resolve_fills</span><span class=p>(</span>
<a id=__codelineno-0-536 name=__codelineno-0-536></a> <span class=n>context</span><span class=p>:</span> <span class=n>Context</span><span class=p>,</span>
<a id=__codelineno-0-537 name=__codelineno-0-537></a> <span class=n>nodelist</span><span class=p>:</span> <span class=n>NodeList</span><span class=p>,</span>
<a id=__codelineno-0-538 name=__codelineno-0-538></a> <span class=n>component_name</span><span class=p>:</span> <span class=nb>str</span><span class=p>,</span>
<a id=__codelineno-0-539 name=__codelineno-0-539></a><span class=p>)</span> <span class=o>-&gt;</span> <span class=n>Dict</span><span class=p>[</span><span class=n>SlotName</span><span class=p>,</span> <span class=n>Slot</span><span class=p>]:</span>
<a id=__codelineno-0-540 name=__codelineno-0-540></a><span class=w> </span><span class=sd>&quot;&quot;&quot;</span>
<a id=__codelineno-0-541 name=__codelineno-0-541></a><span class=sd> Given a component body (`django.template.NodeList`), find all slot fills,</span>
<a id=__codelineno-0-542 name=__codelineno-0-542></a><span class=sd> whether defined explicitly with `{% fill %}` or implicitly.</span>
<a id=__codelineno-0-543 name=__codelineno-0-543></a>
<a id=__codelineno-0-544 name=__codelineno-0-544></a><span class=sd> So if we have a component body:</span>
<a id=__codelineno-0-545 name=__codelineno-0-545></a><span class=sd> ```django</span>
<a id=__codelineno-0-546 name=__codelineno-0-546></a><span class=sd> {% component &quot;mycomponent&quot; %}</span>
<a id=__codelineno-0-547 name=__codelineno-0-547></a><span class=sd> {% fill &quot;first_fill&quot; %}</span>
<a id=__codelineno-0-548 name=__codelineno-0-548></a><span class=sd> Hello!</span>
<a id=__codelineno-0-549 name=__codelineno-0-549></a><span class=sd> {% endfill %}</span>
<a id=__codelineno-0-550 name=__codelineno-0-550></a><span class=sd> {% fill &quot;second_fill&quot; %}</span>
<a id=__codelineno-0-551 name=__codelineno-0-551></a><span class=sd> Hello too!</span>
<a id=__codelineno-0-552 name=__codelineno-0-552></a><span class=sd> {% endfill %}</span>
<a id=__codelineno-0-553 name=__codelineno-0-553></a><span class=sd> {% endcomponent %}</span>
<a id=__codelineno-0-554 name=__codelineno-0-554></a><span class=sd> ```</span>
<a id=__codelineno-0-555 name=__codelineno-0-555></a>
<a id=__codelineno-0-556 name=__codelineno-0-556></a><span class=sd> Then this function finds 2 fill nodes: &quot;first_fill&quot; and &quot;second_fill&quot;,</span>
<a id=__codelineno-0-557 name=__codelineno-0-557></a><span class=sd> and formats them as slot functions, returning:</span>
<a id=__codelineno-0-558 name=__codelineno-0-558></a>
<a id=__codelineno-0-559 name=__codelineno-0-559></a><span class=sd> ```python</span>
<a id=__codelineno-0-560 name=__codelineno-0-560></a><span class=sd> {</span>
<a id=__codelineno-0-561 name=__codelineno-0-561></a><span class=sd> &quot;first_fill&quot;: SlotFunc(...),</span>
<a id=__codelineno-0-562 name=__codelineno-0-562></a><span class=sd> &quot;second_fill&quot;: SlotFunc(...),</span>
<a id=__codelineno-0-563 name=__codelineno-0-563></a><span class=sd> }</span>
<a id=__codelineno-0-564 name=__codelineno-0-564></a><span class=sd> ```</span>
<a id=__codelineno-0-565 name=__codelineno-0-565></a>
<a id=__codelineno-0-566 name=__codelineno-0-566></a><span class=sd> If no fill nodes are found, then the content is treated as default slot content.</span>
<a id=__codelineno-0-567 name=__codelineno-0-567></a>
<a id=__codelineno-0-568 name=__codelineno-0-568></a><span class=sd> ```python</span>
<a id=__codelineno-0-569 name=__codelineno-0-569></a><span class=sd> {</span>
<a id=__codelineno-0-570 name=__codelineno-0-570></a><span class=sd> DEFAULT_SLOT_KEY: SlotFunc(...),</span>
<a id=__codelineno-0-571 name=__codelineno-0-571></a><span class=sd> }</span>
<a id=__codelineno-0-572 name=__codelineno-0-572></a><span class=sd> ```</span>
<a id=__codelineno-0-573 name=__codelineno-0-573></a>
<a id=__codelineno-0-574 name=__codelineno-0-574></a><span class=sd> This function also handles for-loops, if/else statements, or include tags to generate fill tags:</span>
<a id=__codelineno-0-575 name=__codelineno-0-575></a>
<a id=__codelineno-0-576 name=__codelineno-0-576></a><span class=sd> ```django</span>
<a id=__codelineno-0-577 name=__codelineno-0-577></a><span class=sd> {% component &quot;mycomponent&quot; %}</span>
<a id=__codelineno-0-578 name=__codelineno-0-578></a><span class=sd> {% for slot_name in slots %}</span>
<a id=__codelineno-0-579 name=__codelineno-0-579></a><span class=sd> {% fill name=slot_name %}</span>
<a id=__codelineno-0-580 name=__codelineno-0-580></a><span class=sd> {% slot name=slot_name / %}</span>
<a id=__codelineno-0-581 name=__codelineno-0-581></a><span class=sd> {% endfill %}</span>
<a id=__codelineno-0-582 name=__codelineno-0-582></a><span class=sd> {% endfor %}</span>
<a id=__codelineno-0-583 name=__codelineno-0-583></a><span class=sd> {% endcomponent %}</span>
<a id=__codelineno-0-584 name=__codelineno-0-584></a><span class=sd> ```</span>
<a id=__codelineno-0-585 name=__codelineno-0-585></a><span class=sd> &quot;&quot;&quot;</span>
<a id=__codelineno-0-586 name=__codelineno-0-586></a> <span class=n>slots</span><span class=p>:</span> <span class=n>Dict</span><span class=p>[</span><span class=n>SlotName</span><span class=p>,</span> <span class=n>Slot</span><span class=p>]</span> <span class=o>=</span> <span class=p>{}</span>
<a id=__codelineno-0-587 name=__codelineno-0-587></a>
<a id=__codelineno-0-588 name=__codelineno-0-588></a> <span class=k>if</span> <span class=ow>not</span> <span class=n>nodelist</span><span class=p>:</span>
<a id=__codelineno-0-589 name=__codelineno-0-589></a> <span class=k>return</span> <span class=n>slots</span>
<a id=__codelineno-0-590 name=__codelineno-0-590></a>
<a id=__codelineno-0-591 name=__codelineno-0-591></a> <span class=n>maybe_fills</span> <span class=o>=</span> <span class=n>_extract_fill_content</span><span class=p>(</span><span class=n>nodelist</span><span class=p>,</span> <span class=n>context</span><span class=p>,</span> <span class=n>component_name</span><span class=p>)</span>
<a id=__codelineno-0-592 name=__codelineno-0-592></a>
<a id=__codelineno-0-593 name=__codelineno-0-593></a> <span class=c1># The content has no fills, so treat it as default slot, e.g.:</span>
<a id=__codelineno-0-594 name=__codelineno-0-594></a> <span class=c1># {% component &quot;mycomponent&quot; %}</span>
<a id=__codelineno-0-595 name=__codelineno-0-595></a> <span class=c1># Hello!</span>
<a id=__codelineno-0-596 name=__codelineno-0-596></a> <span class=c1># {% if True %} 123 {% endif %}</span>
<a id=__codelineno-0-597 name=__codelineno-0-597></a> <span class=c1># {% endcomponent %}</span>
<a id=__codelineno-0-598 name=__codelineno-0-598></a> <span class=k>if</span> <span class=n>maybe_fills</span> <span class=ow>is</span> <span class=kc>False</span><span class=p>:</span>
<a id=__codelineno-0-599 name=__codelineno-0-599></a> <span class=c1># Ignore empty content between `{% component %} ... {% endcomponent %}` tags</span>
<a id=__codelineno-0-600 name=__codelineno-0-600></a> <span class=n>nodelist_is_empty</span> <span class=o>=</span> <span class=ow>not</span> <span class=nb>len</span><span class=p>(</span><span class=n>nodelist</span><span class=p>)</span> <span class=ow>or</span> <span class=nb>all</span><span class=p>(</span>
<a id=__codelineno-0-601 name=__codelineno-0-601></a> <span class=nb>isinstance</span><span class=p>(</span><span class=n>node</span><span class=p>,</span> <span class=n>TextNode</span><span class=p>)</span> <span class=ow>and</span> <span class=ow>not</span> <span class=n>node</span><span class=o>.</span><span class=n>s</span><span class=o>.</span><span class=n>strip</span><span class=p>()</span> <span class=k>for</span> <span class=n>node</span> <span class=ow>in</span> <span class=n>nodelist</span>
<a id=__codelineno-0-602 name=__codelineno-0-602></a> <span class=p>)</span>
<a id=__codelineno-0-603 name=__codelineno-0-603></a>
<a id=__codelineno-0-604 name=__codelineno-0-604></a> <span class=k>if</span> <span class=ow>not</span> <span class=n>nodelist_is_empty</span><span class=p>:</span>
<a id=__codelineno-0-605 name=__codelineno-0-605></a> <span class=n>slots</span><span class=p>[</span><span class=n>DEFAULT_SLOT_KEY</span><span class=p>]</span> <span class=o>=</span> <span class=n>_nodelist_to_slot_render_func</span><span class=p>(</span>
<a id=__codelineno-0-606 name=__codelineno-0-606></a> <span class=n>DEFAULT_SLOT_KEY</span><span class=p>,</span>
<a id=__codelineno-0-607 name=__codelineno-0-607></a> <span class=n>nodelist</span><span class=p>,</span>
<a id=__codelineno-0-608 name=__codelineno-0-608></a> <span class=n>data_var</span><span class=o>=</span><span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-609 name=__codelineno-0-609></a> <span class=n>default_var</span><span class=o>=</span><span class=kc>None</span><span class=p>,</span>
<a id=__codelineno-0-610 name=__codelineno-0-610></a> <span class=p>)</span>
<a id=__codelineno-0-611 name=__codelineno-0-611></a>
<a id=__codelineno-0-612 name=__codelineno-0-612></a> <span class=c1># The content has fills</span>
<a id=__codelineno-0-613 name=__codelineno-0-613></a> <span class=k>else</span><span class=p>:</span>
<a id=__codelineno-0-614 name=__codelineno-0-614></a> <span class=c1># NOTE: If slot fills are explicitly defined, we use them even if they are empty (or only whitespace).</span>
<a id=__codelineno-0-615 name=__codelineno-0-615></a> <span class=c1># This is different from the default slot, where we ignore empty content.</span>
<a id=__codelineno-0-616 name=__codelineno-0-616></a> <span class=k>for</span> <span class=n>fill</span> <span class=ow>in</span> <span class=n>maybe_fills</span><span class=p>:</span>
<a id=__codelineno-0-617 name=__codelineno-0-617></a> <span class=n>slots</span><span class=p>[</span><span class=n>fill</span><span class=o>.</span><span class=n>name</span><span class=p>]</span> <span class=o>=</span> <span class=n>_nodelist_to_slot_render_func</span><span class=p>(</span>
<a id=__codelineno-0-618 name=__codelineno-0-618></a> <span class=n>slot_name</span><span class=o>=</span><span class=n>fill</span><span class=o>.</span><span class=n>name</span><span class=p>,</span>
<a id=__codelineno-0-619 name=__codelineno-0-619></a> <span class=n>nodelist</span><span class=o>=</span><span class=n>fill</span><span class=o>.</span><span class=n>fill</span><span class=o>.</span><span class=n>nodelist</span><span class=p>,</span>
<a id=__codelineno-0-620 name=__codelineno-0-620></a> <span class=n>data_var</span><span class=o>=</span><span class=n>fill</span><span class=o>.</span><span class=n>data_var</span><span class=p>,</span>
<a id=__codelineno-0-621 name=__codelineno-0-621></a> <span class=n>default_var</span><span class=o>=</span><span class=n>fill</span><span class=o>.</span><span class=n>default_var</span><span class=p>,</span>
<a id=__codelineno-0-622 name=__codelineno-0-622></a> <span class=n>extra_context</span><span class=o>=</span><span class=n>fill</span><span class=o>.</span><span class=n>extra_context</span><span class=p>,</span>
<a id=__codelineno-0-623 name=__codelineno-0-623></a> <span class=p>)</span>
<a id=__codelineno-0-624 name=__codelineno-0-624></a>
<a id=__codelineno-0-625 name=__codelineno-0-625></a> <span class=k>return</span> <span class=n>slots</span>
</code></pre></div></td></tr></table></div> </details> </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=../provide/ class="md-footer__link md-footer__link--prev" aria-label='Previous: <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> provide'> <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> provide </div> </div> </a> <a href=../tag_formatter/ class="md-footer__link md-footer__link--next" aria-label='Next: <code class="doc-symbol doc-symbol-nav doc-symbol-module"></code> tag_formatter'> <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> tag_formatter </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>