svelte-lock

Reactive lock manager for Svelte 5

Installation

npm install svelte-lock

Usage

A lock key can be a string or a symbol. You can use one or multiple keys to manage independent or shared lock conditions.

1. Initialize lock context

Call initLockContext() once at the root of your Svelte app:

<script>
    import { initLockContext } from 'svelte-lock';

    initLockContext();
</script>

2. Use useLock() inside a component

Use useLock() to observe and control the lock state for one or more keys.

Single key

<script>
    import { useLock } from 'svelte-lock';

    const task = useLock(Symbol());

    function run() {
        task.lock();

        setTimeout(() => {
            task.release();
        }, 1000);
    }
</script>

<button on:click={run} disabled={task.isLocked}>
    {#if task.isLocked}
        Running...
    {:else}
        Run
    {/if}
</button>

Multiple keys

<script>
    const lock = useLock(['saving', 'submitting']);

    if (lock.isLocked) {
        // true if either key is locked
    }
</script>

3. Use getLocker() for lower-level control

<script>
    import { getLocker } from 'svelte-lock';

    const locker = getLocker();
    const release = locker.lock(['form', 'submit']);

    // Later
    release();
</script>

API

initLockContext(): void

Initializes the internal lock state. Must be called once in a root-level component.

useLock(keys?: LockKey | LockKey[]): { ... }

Returns an object for observing and controlling a specific lock or group of locks. If no key is provided, a unique symbol will be used automatically.

• keys: LockKey[] — the list of keys used for this lock
• isLocked: boolean — reactive value; true if any of the provided keys are currently locked.
• lock(): void — locks all provided keys. Already locked keys stay locked.
• release(): void — removes the lock for all provided keys.

getLocker(): { ... }

Returns an object for low-level lock operations with the following methods:

• lock(keys: LockKey[]): () => void
  Locks the given keys. Returns a function that releases them.

• release(keys: LockKey[]): void
  Manually removes keys from the lock.

• observe(keys: LockKey[]): { isLocked: boolean }
  Creates a reactive observer for the given keys.
  The isLocked property is true if any of the specified keys are currently locked.

• isLocked(keys: LockKey[]): boolean
  Returns true if any of the given keys are currently locked.
  This is a non-reactive snapshot and does not update automatically.

License

MIT