<snt-app #default="{
  theme,
  breakpoint,
  notification,
  shipnity,
  loading,
  productCategories,
  productBrands
}">

  <snt-container>
    <snt-button @click="notification.default('Default')">Default</snt-button>
    <snt-button @click="notification.success('Success')">Success</snt-button>
    <snt-button @click="notification.error('Error')">Error</snt-button>
    <snt-button @click="notification.info('Info')">Info</snt-button>
    <snt-button @click="notification.warning('Warning')">Warning</snt-button>
    {{ '10/9/2000' | formatTime }}
    <snt-footer :items="[{label: 'test'}]" />
    <snt-promo-codes />
    <snt-select />
    <snt-shipping />
    <snt-text-editor />
    <snt-tooltip />
    <snt-text-field />
    <snt-tracking order-id="0000" />
    <snt-video />
    <snt-row>
      <snt-col cols="6">
        <snt-text label="Hello World!" />
      </snt-col>
      <snt-col cols="6">
        <snt-text label="Hello World!" />
      </snt-col>
    </snt-row>
    <snt-products cols="4" limit="4" />

    {{ loading }}
    {{ productCategories }}
    {{ productBrands }}
    <snt-icon icon="mdi-plus"></snt-icon>
    <snt-icon color="primary" icon="mdi-plus"></snt-icon>
    <snt-icon color="#8dff10" icon="mdi-plus"></snt-icon>
    <snt-button color="primary" icon="mdi-account"></snt-button>
    <snt-button>account</snt-button>
    <snt-button color="primary">account</snt-button>
  </snt-container>
  <snt-container fluid>
    <snt-text label="Hello World! 2" />
  </snt-container>
</snt-app>
