Etat Pur Design System

Blog Item Comment 

<!-- Error rendering component -->
<!-- RangeError: Maximum call stack size exceeded -->
<!-- Error: RangeError: Maximum call stack size exceeded
    at /var/www/vhosts/ati4.group/etatpur.design-system.ati4.group/node_modules/@frctl/twig/src/adapter.js:156:24
    at new Promise (<anonymous>)
    at TwigAdapter.render (/var/www/vhosts/ati4.group/etatpur.design-system.ati4.group/node_modules/@frctl/twig/src/adapter.js:134:16)
    at ComponentSource._renderVariant (/var/www/vhosts/ati4.group/etatpur.design-system.ati4.group/node_modules/@frctl/fractal/src/api/components/source.js:212:30)
    at _renderVariant.next (<anonymous>)
    at onFulfilled (/var/www/vhosts/ati4.group/etatpur.design-system.ati4.group/node_modules/co/index.js:65:19) -->
 
<li class="flex flex-col gap-2 py-3 {{ class }}">
    <div class="text-body-sm font-bold">
        <span>{{ user }}</span>
    </div>
    <div class="text-body-base">
        <p>{{ comment }}</p>
    </div>
    <div class="flex flex-row gap-4">
        <div class="flex flex-row gap-4">
            <a class="hover:text-black/64">
                {% render "@icons-heroicons--likebis-outline" %}
                <span class="sr-only">like</span>
            </a>
            {% render "@template-link" with {
                label: "Répondre",
                type: "dark",
                underlined:true
            } %}
        </div>
        <div class="text-body-sm self-center">
            <span>{{ date }}</span>
        </div>
    </div>
    {% if showError %}
        <div class="messages">
            {% render "@template-push" with {
                color: "danger",
                title: false,
                description: 'Vous devez être <a class="link-base link-dark underline" href="#">connecté</a> ou <a class="link-base link-dark underline" href="#">créer un compte</a> afin de pouvoir répondre ou aimer',
                icon: false,
                showCross: false
            } %}
        </div>
    {% endif %}

    {# reply #}
    {% if reply %}
        <ul class="adjusted-marg-l-sm">
            {% for comment in reply %}
                {% render "@blog-item-comment" with {
                    reply: comment.reply,
                    showError: false,
                    class: "",
                    user: comment.user,
                    comment: comment.comment,
                    date: comment.date
                } %}
            {% endfor %}
        </ul>
    {% endif %}

    {% if showForm %}
        <form class="flex flex-col gap-2"
              action="#"
              x-data="Object.assign(hyva.formValidation($el), initForm())"
              @submit.prevent="submitForm()"
              method="post"
              enctype="multipart/form-data"
              id="form-validate"
        >
            {% render "@template-input" with {
                id: 'reply-comment',
                name: 'reply-comment',
                type: 'text',
                label: 'Votre commentaire...',
                label_floating: true,
                required: true
            } %}
        </form>
    {% endif %}
</li>
 
{
  "class": "border-b border-black/16",
  "showError": true,
  "user": "Jeanne (Invité)",
  "comment": "Denique Antiochensis ordinis vertices sub uno elogio iussit occidi ideo efferatus, quod ei celebrari vilitatem intempestivam urgenti, cum inpenderet inopia, gravius rationabili responderunt; et perissent ad unum ni comes orientis tunc Honoratus fixa constantia restitisset.",
  "date": "Le 23/05/2025",
  "reply": [
    {
      "class": "",
      "showError": false,
      "user": "Etat Pur",
      "comment": "Denique Antiochensis ordinis vertices sub uno elogio iussit occidi ideo efferatus, quod ei celebrari vilitatem intempestivam urgenti, cum inpenderet inopia, gravius rationabili responderunt.",
      "date": "Le 23/05/2025"
    }
  ]
}

No notes defined.