<div class="onboarding-header">
  <IconTile @icon="download" />
  <div class="onboarding-header-content">
    <h1>Install the Waypoint CLI</h1>
    <p>First, you'll need to install the Waypoint CLI.</p>
  </div>
</div>

<div class="onboarding-step">
  <p>Anyone using Waypoint to deploy from their workstation needs to install it locally. The below
    instructions guide you through that for various operating systems.
  </p>

  <h2>Install Waypoint</h2>

  <Pds::TabNav>
    <LinkTo @route="onboarding.install.manual">Manual installation</LinkTo>
    <LinkTo @route="onboarding.install.homebrew">Homebrew on OS X</LinkTo>
    <LinkTo @route="onboarding.install.linux">Linux</LinkTo>
  </Pds::TabNav>

  {{outlet}}

  <h2>Verify the installation</h2>

  <p>After installing Waypoint, verify that the installation worked by opening a new terminal session and running the
    command <code>waypoint</code>.</p>

  <CopyableCode @ref="verify-waypoint">
    <pre><code id="verify-waypoint">waypoint</code></pre>
  </CopyableCode>

  <pre><code class="output">usage: waypoint [-version] [-help] [-autocomplete-(un)install] &lt;command&gt; [&lt;args&gt;]

Common commands:
    build        Build a new versioned artifact from source.
    deploy       Deploy a pushed artifact.
  ...</code></pre>

  <p>If you get an error that <code>waypoint</code> could not be found, your <code>PATH</code> environment variable was
    not set up properly. Make sure that your <code>PATH</code> variable contains the directory where you installed
    Waypoint.</p>
</div>

<hr />

<div class="onboarding-footer">
  <LinkTo @route="onboarding.connect" data-test-next-step class="button button--secondary">Continue to Next Step
  </LinkTo>
</div>
