Security News
PyPI Now Supports iOS and Android Wheels for Mobile Python Development
PyPI now supports iOS and Android wheels, making it easier for Python developers to distribute mobile packages.
svelte-awaitable-dialog
Advanced tools
Svelte dialog modals information and confirmation from which can be awaited in functions
Js library for opening custom modal windows/dialogs/drawers and getting data from them inside a regular js function. With its help, you can get rid of adding additional variables to track the opening of a dialog and storing data from it, as well as adding the layout components themselves.
npm install svelte-awaitable-dialog
Or with Yarn
yarn add svelte-awaitable-dialog
For example, like that you can get user confirmation by the simplest dialog:
SimpleDialog.svelte
<script>
import { closeDialog, resolveDialog } from 'svelte-awaitable-dialog'
import { onMount } from 'svelte'
export let title = 'Confirm action?'
let dialog
onMount(() => {
dialog && dialog.showModal()
})
</script>
<dialog bind:this={dialog} on:close={closeDialog}>
<h1>{title}</h1>
<button on:click={resolveDialog}>Confirm</button>
<button on:click={closeDialog}>Cancel</button>
</dialog>
+page.svelte
<script lang="ts">
import { AwaitableDialog, openDialog } from 'svelte-awaitable-dialog'
import SimpleDialog from './components/dialog_examples/SimpleDialog.svelte'
async function confirm() {
// Here you can pass any custom Svelte component and its props
openDialog(SimpleDialog, { title: 'Confirm action?' })
.then(() => console.log('CONFIRMED'))
}
</script>
<button on:click={confirm}>Run action</button>
<!-- You need only one AwaitableDialog on your page (for SvelteKit it's a good idea to add it to root +layout.svelte)-->
<AwaitableDialog/>
Also there's opportunity to return data from dialog as promise result by passing data object to resolveDialog function. Check REPL for example.
openDialog
:Opens custom dialog component and returns Promise with data resolved from dialog
Parameters
ComponentType<T>
. Custom Svelte component to renderPartial<ComponentProps<T>> = {}
. Props of passed componentresolveDialog
:Resolves openDialog Promise with data and closes dialog
Parameters
object
. Arbitrary object with data which can be obtained in openDialog PromisecloseDialog
:Closes opened dialog
MIT
Give a ⭐️ if this project helped you!
FAQs
Svelte dialog modals information and confirmation from which can be awaited in functions
The npm package svelte-awaitable-dialog receives a total of 19 weekly downloads. As such, svelte-awaitable-dialog popularity was classified as not popular.
We found that svelte-awaitable-dialog demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
PyPI now supports iOS and Android wheels, making it easier for Python developers to distribute mobile packages.
Security News
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
Security News
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.