MazPullToRefresh

MazPullToRefresh is a standalone component to add pull to refresh feature

Demo

Basic usage

Wrap your app inside this component

<script lang="ts" setup>
import MazPullToRefresh from 'maz-ui/components/MazPullToRefresh'

async function pullToRefreshAction() {
  // do promise or just `window.location.reload()`
}
</script>

<template>
  <MazPullToRefresh
    header-class="maz-bg-bg-dark maz-text-foreground-light"
    class="maz-flex maz-min-h-screen maz-w-full maz-flex-col"
    :action="pullToRefreshAction"
    spinner-color="contrast"
    standalone-mode
    :disabled="false"
  >
    <div>
      App Content
    </div>
  </MazPullToRefresh>
</template>

WARNING

More documentation to come

Props

Name	Description	Type	Required	Default
distance		number	No	100
offset		number	No	0
on-click		TSFunctionType	No	undefined
container-selector		string	No	undefined
header-class		string	No	undefined
spinner-color		MazColor	No	'contrast'
disabled		boolean	No	false
standalone-mode		boolean	No	false

Events

Event name	Properties	Description
loaded
start
error
finish
response

Slots

Name	Description	Bindings
pull-before
pull-ready
pull-loading
default