{ "info": { "author": "Andrey Fedoseev", "author_email": "andrey.fedoseev@gmail.com", "bugtrack_url": null, "classifiers": [ "Development Status :: 4 - Beta", "Framework :: Django", "Intended Audience :: Developers", "License :: OSI Approved :: BSD License", "Operating System :: OS Independent", "Programming Language :: Python", "Programming Language :: Python :: 3", "Topic :: Internet :: WWW/HTTP" ], "description": "======================\ndjango-page-components\n======================\n\n\"Page component\" is a unit of a user interface (think ReactJS components). ``django-page-components`` provide\na minimalistic framework for creating page components and using them in your Django views and templates.\n\nTo define a page component you need to create a sub-class of ``page_components.PageComponent``\nand implement ``render`` method like so:\n\n.. code-block:: python\n\n import page_components\n import django.utils.html\n\n\n class AddToCartButton(page_components.PageComponent):\n\n def __init__(self, product):\n self.product = product\n\n class Media:\n js = (\n \"add-to-cart.js\", # this is where addToCart is defined\n )\n css = {\n \"all\": (\n \"add-to-cart.css\" # this is where `.add-to-card` styles are defined\n )\n }\n\n def render(self):\n return django.utils.html.format_html(\n \"\"\"\"\"\",\n product_id=self.product.id\n )\n\n\nYou can also use a ``TemplatePageComponent`` base class to implement page components based on templates.\nIn that case you may want to implement ``get_context_data`` method:\n\n.. code-block:: python\n\n class AddToCartButton(page_components.TemplatePageComponent):\n\n template_name = \"add-to-cart-button.html\"\n\n ...\n\n def get_context_data(self, **kwargs):\n kwargs[\"product_id\"] = self.product_id\n return super(AddToCartButton, self).get_context_data(**kwargs)\n\nNote that it's up to you to decide how to implement the ``render`` method and what additional methods should be added\nto your page components. One general recommendation is to keep the ``__init__`` method as lightweight as possible and do\nall the heavy lifting in the ``render`` method.\n\nA proposed convention is to store your page components classes in ``page_components`` package/module inside your app::\n\n myapp.page_components.AddToCartButton\n\nNow, when we have some page components defined it is time to use them in views:\n\n.. code-block:: python\n\n import django.views.generic\n import page_components\n\n import myapp.models\n import myapp.page_components\n\n class ProductPage(\n page_components.PageComponentsView,\n django.views.generic.DetailView,\n ):\n\n model = myapp.models.Product\n template_name = \"product.html\"\n\n def get_page_components(self):\n return {\n \"add_to_cart_button\": myapp.page_components.AddToCartButton(self.object)\n }\n\n\nand templates:\n\n.. code-block:: html\n\n \n
\n /* this will include CSS files for all page components on that page */\n {{ view.media.css.render }}\n \n \n