0.0.3 • Published 2 years ago

svelte-loading v0.0.3

Weekly downloads
-
License
-
Repository
-
Last release
2 years ago

svelte-loading

Simple Loading Spinner for Svelte

Usage

install

npm install svelte-loading

showLoading

<script lang='ts'>
  import { showLoading } from 'svelte-loading';

  showLoading()

</script>

if you want hide loading component you must call hideLoading method.

auto hideLoading

showLoading({ duration: 2000 })

after 2 seconds loading will auto hide

change loading color

showLoading({ color: '#FFF'})

change loading style

import { showLoading, LoadingEnum } from 'svelte-loading';

showLoading({ type: LoadingEnum.Infinity })

Loading Styles

Eclipes

Eclipse-1s-200px.png

Infinity

Infinity-1s-200px.png

Ring

Ring-1s-200px.png

Ripple

Ripple-1s-200px.png

Spinner (default)

Spinner-1s-200px.png

Svelte

App.svelte

<script lang='ts'>
  import { Loading, showLoading, LoadingEnum } from 'svelte-loading';

  showLoading()

</script>

...

<Loading />

Options

export enum LoadingEnum {
  Eclipes,
  Infinity,
  Ring,
  Ripple,
  Spinner
}

export type LoadingTypes = {
  size?: string | number
  color?: string
  duration?: number
  type?: LoadingEnum
}