# EuiSplitButtonComponent

**Type:** component

<p>The EuiSplitButtonComponent is a wrapper for a button and a dropdown.
It is used to create a split button with various styles and functionalities.</p>
<h3>Basic Usage</h3>
<b>Example :</b><div><pre class="line-numbers"><code class="language-html">&lt;eui-split-button&gt;
  &lt;eui-button euiPrimary (click)=&quot;primaryAction()&quot;&gt;
    Save
  &lt;/eui-button&gt;
  &lt;eui-dropdown&gt;
    &lt;eui-dropdown-item (click)=&quot;saveAndClose()&quot;&gt;Save &amp; Close&lt;/eui-dropdown-item&gt;
    &lt;eui-dropdown-item (click)=&quot;saveAsDraft()&quot;&gt;Save as Draft&lt;/eui-dropdown-item&gt;
  &lt;/eui-dropdown&gt;
&lt;/eui-split-button&gt;</code></pre></div><h3>Accessibility</h3>
<ul>
<li>Ensure primary button has clear, action-oriented label</li>
<li>Dropdown items should have descriptive text</li>
<li>Keyboard navigation works for both button and dropdown</li>
</ul>
<h3>Notes</h3>
<ul>
<li>Combines a primary action button with a dropdown menu of related actions</li>
<li>Primary button executes the most common action</li>
<li>Dropdown provides alternative or related actions</li>
</ul>


**Selector:** `eui-split-button`

**Standalone:** false
