Top Bar ​

<script setup lang="ts">
import { PrimaryButton, SecondaryButton, Topbar } from '@youcan/ui-vue3';
</script>

<template>
  <Topbar>
    <template #start>
      <h3>All products</h3>
    </template>
    <template #end>
      <SecondaryButton>
        <template #icon>
          <i class="i-youcan-magnifying-glass" />
        </template>
        <span>Search</span>
      </SecondaryButton>
      <PrimaryButton>
        <template #icon>
          <i class="i-youcan-plus" />
        </template>
        <span>Create product</span>
      </PrimaryButton>
    </template>
  </Topbar>
</template>