<.render_variation primary>
  Button
</.render_variation>
<.render_variation primary icon="plus">
  with icon
</.render_variation>
<.render_variation primary icon="calendar-blank" icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled primary>
  Disabled
</.render_variation>
<.render_variation disabled primary icon="calendar-blank">
  Disabled with icon
</.render_variation>

<.render_variation >
  Button
</.render_variation>
<.render_variation icon="plus">
  with icon
</.render_variation>
<.render_variation icon="calendar-blank" icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled>
  Disabled
</.render_variation>
<.render_variation disabled icon="calendar-blank">
  Disabled with icon
</.render_variation>

<.render_variation ghost>
  Button
</.render_variation>
<.render_variation icon="plus" ghost>
  with icon
</.render_variation>
<.render_variation icon="calendar-blank" ghost icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled ghost>
  Disabled
</.render_variation>
<.render_variation disabled icon="calendar-blank" ghost>
  Disabled with icon
</.render_variation>

<.render_variation danger>
  Button
</.render_variation>
<.render_variation icon="plus" danger>
  with icon
</.render_variation>
<.render_variation icon="calendar-blank" danger icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled danger>
  Disabled
</.render_variation>
<.render_variation disabled icon="calendar-blank" danger>
  Disabled with icon
</.render_variation>

<.render_variation ghost danger>
  Button
</.render_variation>
<.render_variation icon="plus" ghost danger>
  with icon
</.render_variation>
<.render_variation icon="calendar-blank" ghost danger icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled ghost danger>
  Disabled
</.render_variation>
<.render_variation disabled icon="calendar-blank" ghost danger>
  Disabled with icon
</.render_variation>

<.render_variation compact>
  Button
</.render_variation>
<.render_variation compact icon="plus">
  with icon
</.render_variation>
<.render_variation compact icon="calendar-blank" icon_weight="bold">
  with icon
</.render_variation>
<.render_variation compact disabled>
  Disabled
</.render_variation>
<.render_variation compact disabled icon="calendar-blank">
  Disabled with icon
</.render_variation>

<.render_variation size="sm" primary>
  Button
</.render_variation>
<.render_variation size="sm" primary icon="plus">
  with icon
</.render_variation>
<.render_variation size="sm" primary icon="calendar-blank" icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled size="sm" primary>
  Disabled
</.render_variation>
<.render_variation disabled size="sm" primary icon="calendar-blank">
  Disabled with icon
</.render_variation>

<.render_variation size="sm">
  Button
</.render_variation>
<.render_variation size="sm" icon="plus">
  with icon
</.render_variation>
<.render_variation size="sm" icon="calendar-blank" icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled size="sm">
  Disabled
</.render_variation>
<.render_variation disabled size="sm" icon="calendar-blank">
  Disabled with icon
</.render_variation>

<.render_variation size="sm" ghost>
  Button
</.render_variation>
<.render_variation size="sm" icon="plus" ghost>
  with icon
</.render_variation>
<.render_variation size="sm" icon="calendar-blank" ghost icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled size="sm" ghost>
  Disabled
</.render_variation>
<.render_variation disabled size="sm" icon="calendar-blank" ghost>
  Disabled with icon
</.render_variation>

<.render_variation size="sm" danger>
  Button
</.render_variation>
<.render_variation size="sm" icon="plus" danger>
  with icon
</.render_variation>
<.render_variation size="sm" icon="calendar-blank" danger icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled size="sm" danger>
  Disabled
</.render_variation>
<.render_variation disabled size="sm" icon="calendar-blank" danger>
  Disabled with icon
</.render_variation>

<.render_variation size="sm" ghost danger>
  Button
</.render_variation>
<.render_variation size="sm" icon="plus" ghost danger>
  with icon
</.render_variation>
<.render_variation size="sm" icon="calendar-blank" ghost danger icon_weight="bold">
  with icon
</.render_variation>
<.render_variation disabled size="sm" ghost danger>
  Disabled
</.render_variation>
<.render_variation disabled size="sm" icon="calendar-blank" ghost danger>
  Disabled with icon
</.render_variation>

<.render_variation compact size="sm">
  Button
</.render_variation>
<.render_variation compact size="sm" icon="plus">
  with icon
</.render_variation>
<.render_variation compact size="sm" icon="calendar-blank" icon_weight="bold">
  with icon
</.render_variation>
<.render_variation compact disabled size="sm">
  Disabled
</.render_variation>
<.render_variation compact disabled size="sm" icon="calendar-blank">
  Disabled with icon
</.render_variation>

<.render_variation link>
  Add service
</.render_variation>
<.render_variation size="sm" link>
  Add service
</.render_variation>
<.render_variation disabled link>
  Add service
</.render_variation>

<form class="gc-full-width">
  <.render_variation
    label="Search"
    name="search"
    type="live_search"
    value=""
    search_func={&Storybook.Buttons.Button.no_results_search/1}
  >
    <:no_results_content>
      No results found.
      <span><.button link>Add service</.button></span>
    </:no_results_content>
  </.render_variation>
</form>