<%= render_component_tag :button,
  id: @id,
  x_ref: @ref,
  class: "whitespace-nowrap pt-2.5 pb-1.5 px-1 border-b-2 cursor-pointer",
  ":class": "{
    'border-lookbook-tabs-highlight': isSelected($el),
    'border-transparent text-lookbook-tabs-text hover:text-lookbook-tabs-text-hover': !isSelected($el),
    '!text-lookbook-tabs-text-disabled': isDisabled($el),
    'invisible pointer-events-none relative z-[-1]': visibleTabsCount < #{@position}
  }",
  "@click.prevent": "selectTab($el)",
  "@keydown.window.prevent.#{@hotkey}": @hotkey.present? ? "$el.click()" : nil,
  data: {
    disabled: @disabled
  },
  cloak: true do %>
  <%= label %>
<% end %>