inertia-bootstrap-forms 2.1.3 → 2.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "inertia-bootstrap-forms",
3
- "version": "2.1.3",
3
+ "version": "2.1.4",
4
4
  "description": "Create bootstrap forms with inertia and twitter bootstrap",
5
5
  "main": "dist/inertia-bootstrap-forms.cjs.js",
6
6
  "module": "dist/inertia-bootstrap-forms.es.js",
@@ -90,6 +90,37 @@ export default defineComponent({
90
90
  }
91
91
  },
92
92
  methods: {
93
+ handleAutoTab(event) {
94
+ const el = event.target;
95
+
96
+ if (!['INPUT', 'TEXTAREA'].includes(el.tagName)) return;
97
+
98
+ const maxLength = el.maxLength;
99
+ if (maxLength > 0 && el.value.length >= maxLength) {
100
+ this.focusNextField(el);
101
+ }
102
+ },
103
+ focusNextField(current) {
104
+ const focusable = Array.from(
105
+ this.formEl.querySelectorAll('input, select, textarea')
106
+ ).filter(el =>
107
+ !el.disabled &&
108
+ el.tabIndex !== -1 &&
109
+ el.type !== 'hidden' &&
110
+ el.offsetParent !== null
111
+ );
112
+
113
+ const index = focusable.indexOf(current);
114
+ const next = focusable[index + 1];
115
+
116
+ if (next) {
117
+ next.focus();
118
+
119
+ if (next.tagName !== 'SELECT' && typeof next.select === 'function') {
120
+ next.select();
121
+ }
122
+ }
123
+ },
93
124
  reset() {
94
125
  this.form.reset();
95
126
  },
@@ -161,6 +192,7 @@ export default defineComponent({
161
192
  <form ref="formEl"
162
193
  :action="url"
163
194
  :method="method"
195
+ @input="handleAutoTab"
164
196
  @submit.prevent="submit"
165
197
  @reset="$emit('reset')"
166
198
  :class="{'form-processing': form.processing}"