That's nice.. But still too much verbose.. I think I'll try to do a micro lib myself.. It's not that hard, just a few regex to match and replace with html related to that block

Take what htm did to preact as example.. It basically took of the build step letting you run react-like components direct on the browser

Specifically relevant to Django https://mitchel.me/slippers/docs/introduction/

I wrote up a section specifically about it. The examples may help; it looks strange, but if you zoom out a bit, you'll see that the F# view definitions look a lot like HTML. The basic idea is that I return a special header from the server, and when I see that header, I fire the "click" event on the button that closes it. https://blog.bitbadger.solutions/2021/a-tour-of-myprayerjournal-v3/bootstrap-integration.html#Modal-Dialogs

Trying to hack an extension to perform client side caching of response and it looks like there are not enough hooks to stop a request and provide a stored response. Feels like the best option is to maybe look into ServiceWorker.

Very nice! Does it work with jinja? I'm using flask

Is there a reason that HTMX wouldn't swap

<style>

elements? 😐 EDIT: It looks like HTMX works if the first tag of the response is not a

<style>

tag (i.e., there's an OOB tag before it), but doesn't seem to work properly otherwise. 🤷

Question regarding animations:

html
<style>
    tr.htmx-settling {
    opacity: 0;
    transition: opacity 1s ease-in;
    }
</style>

<table>
    <caption>
        <img id="showInfo" 
             src="..."
             hx-get="..."
             hx-swap="outerHTML settle:1s"
             hx-target="#info"> ...
    </caption>
    <thead>
        <tr id="info"></tr>
    </thead>
    <tbody>...</tbody>
</table>

this settles in, but without the animation. Can someone tell me why 🙂

for those interested in the idea of server-side react-like components, that we briefly talked about earlier, i came up with this draft.. And it matches very well with the hx philosophy.. A component that is part of a bigger one, can be easily reloaded via hx-get

python
import jinja2
from jinja2 import Environment, BaseLoader

def str_render(tmpl, **context):    
    template = Environment(loader=BaseLoader).from_string(tmpl)
    return template.render(**context)

def file2str(path):
    return open(path).read()

class Component:
    tmpl_path = None
    tmpl = None
    
    def __new__(cls, **kw):
        cls._kw = kw
        return cls._render()
    
    @classmethod
    def _render(cls):
        if cls.tmpl_path:
            tmpl = file2str(cls.tmpl_path)
        if cls.tmpl:
            tmpl = cls.tmpl
        fn = getattr(cls, 'render', None)
        if fn:
            tmpl = fn(**cls._kw)
        return str_render(tmpl, **cls._kw)

class Div(Component):
    tmpl = '<div>{{content}}</div>'

class TextField(Component):
    tmpl_path = 'templates/form/textfield.html'

class App(Component):

    @classmethod
    def render(cls, **kw):
        ret = ''
        for i in range(100):
            ret += f'<div>{{data_{i+1}}}</div>\n'
        return ret

print(Div(content='test'))
print(App())

hmm, worth opening an issue on that

You aren't returning table elements are you?

sorry, the docs are a little out of date/inconsistent here. You want the `.htmx-added`class: https://htmx.org/examples/animations/

Nope, I was coloring in an SVG. I'll see if I can make a repro and file a ticket

Out of curiosity, is there a way to mock a server response for things like JSFiddle?

yes

but it kinda stinks

lol. I just saw mockjax, is there something else?

😑

hmm. yeah, but I wouldn't be able to use that with HTMX, right?

You can

But you have to send the return html up as a parameter

Pretty annoying

Hi all, I’ve created a Flask extension to work with HTMX. https://github.com/edmondchuc/flask-htmx It is inspired by the django-htmx extension for Django. For now, all the HTMX request headers are easily accessible in a Flask view context. I plan to add more features in the coming weeks and months. Please check it out and let me know your thoughts. Cheers!

Amazing, thank you! This is exactly what I ma looking for 🙂

Hi all, first day playing with htmx, just wanted to say hi

welcome! hope you find it enjoyable

Does HX-Refresh basically ignore the HTML response for a swap?

It triggers a refresh immediately, which would probably terminate any ongoing javascript logic: https://github.com/bigskysoftware/htmx/blob/c5b66dd22102bedc30eaa232454a6fe5ea51b895/src/htmx.js#L2493

Ah, this is an actual refresh rather than a GET + swap body, thanks for the clarification!