{% from "./Node.njk" import Node %}

{% macro render(node) %}
  <div class="flex gap-4 px-4 py-2 rounded-md border-2 border-neutral-50/75 focus-within:border-primary-400 focus-within:text-primary-400 bg-transparent text-neutral-50 {{ node.class }}">
    <input type="text" placeholder="Search" class="w-full bg-transparent outline-none"/>
    {{ Node('Icon', { icon: 'search' }) }}
  </div>
{% endmacro %}