diff --git a/_includes/state.html b/_includes/state.html
new file mode 100644
index 0000000..11724f4
--- /dev/null
+++ b/_includes/state.html
@@ -0,0 +1,52 @@
+{% if include.form %}
+  {%- assign name = include.field[0] | append: ']' | prepend: '[' | prepend: include.form -%}
+  {%- assign id = include.field[1].id | default: name | replace: '[', '_' | remove: ']' -%}
+{% else %}
+  {%- assign name = include.field[0] -%}
+  {%- assign id = include.field[1].id | default: name %}
+{% endif %}
+
+{%- assign label = include.field[1].label[site.locale] -%}
+{%- assign help = include.field[1].help[site.locale] -%}
+{%- assign error = include.field[1].error[site.locale] -%}
+{%- assign autocomplete = include.field[1].autocomplete -%}
+
+<div class="form-group" data-controller="state" data-state-group="{{ include.field[1].group }}">
+  <label for="{{ id }}">
+    {{ label }}
+    {% if include.field[1].required %}*{% endif %}
+  </label>
+
+  <input data-target="state.id" type="hidden" name="{{ name }}" id="{{ id }}" value="" />
+
+  <input
+    data-target="state.name"
+    {% if help %}
+      aria-describedby="help-{{ id }}"
+    {% endif %}
+    {% if include.field[1].required %}
+      required
+    {% endif %}
+    type="{{ include.field[1].type }}"
+    {% if autocomplete %}
+      autocomplete="{{ autocomplete }}"
+    {% endif %}
+    name="{{ include.form }}_ignore_{{ include.field[0] }}"
+    id="{{ include.form }}_ignore_{{ include.field[0] }}"
+    disabled
+    list="list-{{ id }}"
+    class="form-control" />
+
+  {%- if error -%}
+    <div class="invalid-feedback">{{ error }}</div>
+  {%- endif -%}
+
+  {%- if help -%}
+    <small id="help-{{ id }}" class="form-text">
+      {{ help }}
+    </small>
+  {%- endif -%}
+
+  <datalist id="list-{{ id }}" data-target="state.list">
+  </datalist>
+</div>