1.4.0 • Published 9 months ago

modal-svelte v1.4.0

Weekly downloads
-
License
MIT
Repository
github
Last release
9 months ago

Modal Svelte

Modal component for Svelte

NPM License NPM Downloads Test

Features:

  • Autofocus
  • Focus trapping
  • Returns focus after closing
  • Form mode

Demo

Install

npm install modal-svelte

Usage

<script>
	import Modal from 'modal-svelte'
</script>

<Modal title="Hello world!" onCancel={() => (open = false)}>
	<p>Content</p>
</Modal>

Functionality

This shows all available functionality

<Modal
	title="Hello world!"
	onCancel={() => (open = false)}
	form={() => submitMyForm()}
	noEscapeHandling
	noCloseIcon
	class="w-full"
>
	<p>Content</p>
	<input />

	<!-- If you want to bring focus to a specific element -->
	<input autofocus />

	<div slot="buttons">
		<button type="submit">Submit</button>
	</div>

</Modal>
:root {
	--modal-bg: #fff;
	color: #000;
}

Dev instructions

Get started

  1. Install Node.js
  2. Run npm install

Commands

  • npm run dev: Start in dev mode
  • npm run build: Build
  • npm run lint: Lint
  • npm run format: Format

Publish new version

  1. Update CHANGELOG.md
  2. Check for errors
    npm run lint
  3. Bump the version number
    npm version --no-git-tag <version>
  4. Generate the package
    npm run build:package
  5. Publish the package
    npm publish
  6. Commit with a tag in format "v#.#.#"
  7. Create GitHub release with release notes
1.4.0

9 months ago

1.3.1

1 year ago

1.3.0

1 year ago

1.2.0

2 years ago

1.2.1

2 years ago

1.1.1

2 years ago

1.1.0

2 years ago

1.0.2

2 years ago

1.0.3

2 years ago

1.0.1

3 years ago

1.0.0

3 years ago