<sme-dropdown>
	<input type="checkbox" id="sme-headings" />

	<label for="sme-headings" aria-haspopup="true" title="Headings">
		<svg
			xmlns="http://www.w3.org/2000/svg"
			class="icon icon-tabler icon-tabler-heading"
			width="24"
			height="24"
			viewBox="0 0 24 24"
			stroke-width="2"
			stroke="currentColor"
			fill="none"
			stroke-linecap="round"
			stroke-linejoin="round"
		>
			<title>Headings</title>
			<path stroke="none" d="M0 0h24v24H0z" fill="none" />
			<path d="M7 12h10" />
			<path d="M7 5v14" />
			<path d="M17 5v14" />
			<path d="M15 19h4" />
			<path d="M15 5h4" />
			<path d="M5 19h4" />
			<path d="M5 5h4" />
		</svg>
	</label>

	<sme-dropdown-content aria-labelledby="sme-headings" data-sm="hide">
		<button type="button" class="sme-md-btn" data-syntax="heading1">H1</button>
		<button type="button" class="sme-md-btn" data-syntax="heading2">H2</button>
		<button type="button" class="sme-md-btn" data-syntax="heading3">H3</button>
		<button type="button" class="sme-md-btn" data-syntax="heading4">H4</button>
		<button type="button" class="sme-md-btn" data-syntax="heading5">H5</button>
		<button type="button" class="sme-md-btn" data-syntax="heading6">H6</button>
	</sme-dropdown-content>
</sme-dropdown>
