svelte-popup

introduce

Popup components，Support pop-up from top to bottom, left and right

demo page

install

npm i svelte-popup
// or
yarn add svelte-popup
// or
pnpm i svelte-popup

Basic use

<script lang="ts">
  import { Popup } from "svelte-popup"; // 4kb
  let show = true
  function toggle() {
    show = !show;
  }
</script>
<main>
  <button on:click={toggle}>center:{show ? "hide" : "show"}</button>
  <Popup show={show} on:change={toggle}>
    <div class="center box">popup</div>
  </Popup>
</main>

Prop

name	explain	type	default
show	show or not	boolean	-
position	eject direction	center | top | right | bottom | left	center
duration	transition attribute duration	number	300
delay	transition attribute delay	number	0

slot

name	explain
-	content