Lelectrolux

<form>
  <input name="foo" id="foo">
  <input name="bar" id="bar" requiredwith="foo,baz">
  <input name="baz" id="baz">
</form>

Simply add a comma separated list of ids of inputs.

Hooks into native required support, so as is, it won't display a more specialised error message than the default required one.

	export default {
	render () {},

	mounted () {
	Object.keys(this.$listeners)
	.foreach(event => {
	window.addEventListener(event, this.$listeners[event])
	})
	},

	.wrapper {
	--gap: 32px;
	display: grid;
	grid-column-gap: var(--gap);
	grid-template-columns: 1fr min(65ch, calc(100% - 2 * var(--gap))) 1fr;
	}

	.wrapper > * {
	grid-column: 2;
	}

	<div class="flex !md:flex-col items-center !md:space-y-6 md:space-x-6">
	<button>Menu button 1</button>
	<button>Menu button 2</button>
	<button>Menu button 3</button>
	</div>

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title>Prototype</title>

	<!-- https://tailwindcss.com/docs/installation -->
	<script src="https://cdn.tailwindcss.com" defer></script>

	<?php
	//
	$exceptions->context(function (Throwable $e, array $context) {
	try {
	if (app()->runningUnitTests()) {
	$context['isRunningTest'] ??= true;
	}

	if (app()->runningInConsole()) {
	$context['runningIn'] ??= 'console';