svelora 3.0.5 → 3.0.7

package/dist/hooks/useThrottle.svelte.js

@@ -0,0 +1,72 @@
+/**
+ * Reactive throttle hook. Caps how often a callback runs to at most once per
+ * `delay`, with leading and trailing invocation.
+ *
+ * The companion to `useDebounce`: debounce waits for a pause, throttle
+ * guarantees a steady maximum rate — ideal for scroll, resize, mousemove, and
+ * drag handlers. The first call runs immediately; calls during the cooldown
+ * window are coalesced into a single trailing call (latest wins). Any pending
+ * timer is cleared on teardown.
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import { useThrottle } from 'svelora'
+ *
+ *   const throttle = useThrottle({ delay: 100 })
+ *
+ *   function onScroll() {
+ *     throttle.run(() => updatePosition(window.scrollY))
+ *   }
+ * </script>
+ *
+ * <svelte:window onscroll={onScroll} />
+ * ```
+ */
+export function useThrottle(options = {}) {
+    const { delay = 200 } = options;
+    let pending = $state(false);
+    let timeoutId;
+    let trailing;
+    function start() {
+        timeoutId = setTimeout(() => {
+            if (trailing) {
+                const callback = trailing;
+                trailing = undefined;
+                pending = false;
+                callback();
+                start();
+            }
+            else {
+                timeoutId = undefined;
+                pending = false;
+            }
+        }, delay);
+    }
+    function run(callback) {
+        if (timeoutId === undefined) {
+            callback();
+            start();
+        }
+        else {
+            trailing = callback;
+            pending = true;
+        }
+    }
+    function cancel() {
+        clearTimeout(timeoutId);
+        timeoutId = undefined;
+        trailing = undefined;
+        pending = false;
+    }
+    $effect(() => {
+        return () => clearTimeout(timeoutId);
+    });
+    return {
+        get pending() {
+            return pending;
+        },
+        run,
+        cancel
+    };
+}

package/dist/hooks/useTimers.svelte.d.ts

@@ -0,0 +1,62 @@
+type MaybeGetter<T> = T | (() => T);
+export interface UseIntervalOptions {
+    /**
+     * Whether the interval is paused. Accepts a value or a reactive getter.
+     * @default false
+     */
+    paused?: boolean | (() => boolean);
+}
+interface UseIntervalReturn {
+    /** Pause ticking. */
+    pause(): void;
+    /** Resume ticking. */
+    resume(): void;
+    /** Whether the interval is currently ticking. */
+    readonly active: boolean;
+}
+interface UseTimeoutReturn {
+    /** Cancel the pending timeout, then schedule a fresh one. */
+    restart(): void;
+    /** Cancel the pending timeout. */
+    cancel(): void;
+}
+/**
+ * Run a callback on an interval with proper runes teardown.
+ *
+ * The delay may be a value or a getter; changing it restarts the interval with
+ * the new period. A `null`/`undefined` or non-positive delay disables it, as
+ * does `pause()` or the `paused` option. SSR-safe: no timer runs on the server.
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import { useInterval } from 'svelora'
+ *
+ *   let count = $state(0)
+ *   const timer = useInterval(() => count++, 1000)
+ * </script>
+ *
+ * <button onclick={timer.pause}>Pause</button>
+ * ```
+ */
+export declare function useInterval(callback: () => void, delay: MaybeGetter<number | null | undefined>, options?: UseIntervalOptions): UseIntervalReturn;
+/**
+ * Schedule a callback to run once after a delay, with proper runes teardown.
+ *
+ * Starts on mount. The delay may be a value or a getter; changing it restarts
+ * the timer. A `null`/`undefined` or negative delay schedules nothing. SSR-safe:
+ * no timer runs on the server.
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import { useTimeout } from 'svelora'
+ *
+ *   const timer = useTimeout(() => (visible = false), 3000)
+ * </script>
+ *
+ * <button onclick={timer.restart}>Reset</button>
+ * ```
+ */
+export declare function useTimeout(callback: () => void, delay: MaybeGetter<number | null | undefined>): UseTimeoutReturn;
+export {};

package/dist/hooks/useTimers.svelte.js

@@ -0,0 +1,90 @@
+import { toGetter } from './utils.js';
+/**
+ * Run a callback on an interval with proper runes teardown.
+ *
+ * The delay may be a value or a getter; changing it restarts the interval with
+ * the new period. A `null`/`undefined` or non-positive delay disables it, as
+ * does `pause()` or the `paused` option. SSR-safe: no timer runs on the server.
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import { useInterval } from 'svelora'
+ *
+ *   let count = $state(0)
+ *   const timer = useInterval(() => count++, 1000)
+ * </script>
+ *
+ * <button onclick={timer.pause}>Pause</button>
+ * ```
+ */
+export function useInterval(callback, delay, options = {}) {
+    const resolveDelay = toGetter(delay);
+    const resolvePaused = toGetter(options.paused ?? false);
+    let manuallyPaused = $state(false);
+    const active = $derived.by(() => {
+        if (manuallyPaused || resolvePaused())
+            return false;
+        const ms = resolveDelay();
+        return typeof ms === 'number' && ms > 0;
+    });
+    $effect(() => {
+        if (!active)
+            return;
+        const ms = resolveDelay();
+        if (typeof ms !== 'number' || ms <= 0)
+            return;
+        const id = setInterval(callback, ms);
+        return () => clearInterval(id);
+    });
+    return {
+        pause() {
+            manuallyPaused = true;
+        },
+        resume() {
+            manuallyPaused = false;
+        },
+        get active() {
+            return active;
+        }
+    };
+}
+/**
+ * Schedule a callback to run once after a delay, with proper runes teardown.
+ *
+ * Starts on mount. The delay may be a value or a getter; changing it restarts
+ * the timer. A `null`/`undefined` or negative delay schedules nothing. SSR-safe:
+ * no timer runs on the server.
+ *
+ * @example
+ * ```svelte
+ * <script>
+ *   import { useTimeout } from 'svelora'
+ *
+ *   const timer = useTimeout(() => (visible = false), 3000)
+ * </script>
+ *
+ * <button onclick={timer.restart}>Reset</button>
+ * ```
+ */
+export function useTimeout(callback, delay) {
+    const resolveDelay = toGetter(delay);
+    let timeoutId;
+    let restartToken = $state(0);
+    $effect(() => {
+        void restartToken;
+        const ms = resolveDelay();
+        if (typeof ms !== 'number' || ms < 0)
+            return;
+        timeoutId = setTimeout(callback, ms);
+        return () => clearTimeout(timeoutId);
+    });
+    return {
+        restart() {
+            restartToken++;
+        },
+        cancel() {
+            clearTimeout(timeoutId);
+        }
+    };
+}

package/dist/hooks/utils.d.ts

@@ -0,0 +1 @@
+export declare function toGetter<T>(value: T | (() => T)): () => T;

package/dist/hooks/utils.js

@@ -0,0 +1,3 @@
+export function toGetter(value) {
+    return typeof value === 'function' ? value : () => value;
+}

package/dist/index.d.ts

@@ -6,11 +6,13 @@ export * from './Avatar/index.js';
 export * from './AvatarGroup/index.js';
 export * from './Badge/index.js';
 export * from './Banner/index.js';
+export * from './BentoGrid/index.js';
 export * from './Breadcrumb/index.js';
 export * from './Button/index.js';
 export * from './Calendar/index.js';
 export * from './Card/index.js';
 export * from './Carousel/index.js';
+export * from './Chat/index.js';
 export * from './Checkbox/index.js';
 export * from './CheckboxGroup/index.js';
 export * from './Chip/index.js';
@@ -21,6 +23,7 @@ export * from './Container/index.js';
 export * from './ContextMenu/index.js';
 export type { UIConfig } from './config.js';
 export { defineConfig } from './config.js';
+export * from './DateRangePicker/index.js';
 export * from './Drawer/index.js';
 export * from './DropdownMenu/index.js';
 export * from './Empty/index.js';
@@ -34,26 +37,41 @@ export * from './Icon/index.js';
 export * from './Input/index.js';
 export * from './Kbd/index.js';
 export * from './Link/index.js';
+export * from './List/index.js';
 export * from './LocaleButton/index.js';
+export * from './Marquee/index.js';
+export * from './Menu/index.js';
 export * from './Modal/index.js';
+export * from './NumberTicker/index.js';
 export * from './Pagination/index.js';
+export * from './PasswordInput/index.js';
 export * from './PinInput/index.js';
 export * from './Popover/index.js';
 export * from './Progress/index.js';
+export * from './Prose/index.js';
 export * from './RadioGroup/index.js';
+export * from './Rating/index.js';
+export * from './Resizable/index.js';
+export * from './ScrollArea/index.js';
 export * from './Select/index.js';
 export * from './SelectMenu/index.js';
 export * from './Separator/index.js';
+export * from './Sidebar/index.js';
 export * from './Skeleton/index.js';
 export * from './Slideover/index.js';
 export * from './Slider/index.js';
+export * from './Spotlight/index.js';
 export * from './Stepper/index.js';
 export * from './Switch/index.js';
 export * from './Table/index.js';
 export * from './Tabs/index.js';
+export * from './TagsInput/index.js';
 export * from './Textarea/index.js';
 export * from './ThemeModeButton/index.js';
 export * from './Timeline/index.js';
 export * from './Toast/index.js';
 export * from './Tooltip/index.js';
+export * from './TreeView/index.js';
 export * from './User/index.js';
+export * from './Chart/index.js';
+export * from './ColorPicker/index.js';

package/dist/index.js

@@ -6,11 +6,13 @@ export * from './Avatar/index.js';
 export * from './AvatarGroup/index.js';
 export * from './Badge/index.js';
 export * from './Banner/index.js';
+export * from './BentoGrid/index.js';
 export * from './Breadcrumb/index.js';
 export * from './Button/index.js';
 export * from './Calendar/index.js';
 export * from './Card/index.js';
 export * from './Carousel/index.js';
+export * from './Chat/index.js';
 export * from './Checkbox/index.js';
 export * from './CheckboxGroup/index.js';
 export * from './Chip/index.js';
@@ -21,6 +23,7 @@ export * from './Container/index.js';
 export * from './ContextMenu/index.js';
 // Configuration
 export { defineConfig } from './config.js';
+export * from './DateRangePicker/index.js';
 export * from './Drawer/index.js';
 export * from './DropdownMenu/index.js';
 export * from './Empty/index.js';
@@ -35,26 +38,41 @@ export * from './Icon/index.js';
 export * from './Input/index.js';
 export * from './Kbd/index.js';
 export * from './Link/index.js';
+export * from './List/index.js';
 export * from './LocaleButton/index.js';
+export * from './Marquee/index.js';
+export * from './Menu/index.js';
 export * from './Modal/index.js';
+export * from './NumberTicker/index.js';
 export * from './Pagination/index.js';
+export * from './PasswordInput/index.js';
 export * from './PinInput/index.js';
 export * from './Popover/index.js';
 export * from './Progress/index.js';
+export * from './Prose/index.js';
 export * from './RadioGroup/index.js';
+export * from './Rating/index.js';
+export * from './Resizable/index.js';
+export * from './ScrollArea/index.js';
 export * from './Select/index.js';
 export * from './SelectMenu/index.js';
 export * from './Separator/index.js';
+export * from './Sidebar/index.js';
 export * from './Skeleton/index.js';
 export * from './Slideover/index.js';
 export * from './Slider/index.js';
+export * from './Spotlight/index.js';
 export * from './Stepper/index.js';
 export * from './Switch/index.js';
 export * from './Table/index.js';
 export * from './Tabs/index.js';
+export * from './TagsInput/index.js';
 export * from './Textarea/index.js';
 export * from './ThemeModeButton/index.js';
 export * from './Timeline/index.js';
 export * from './Toast/index.js';
 export * from './Tooltip/index.js';
+export * from './TreeView/index.js';
 export * from './User/index.js';
+export * from './Chart/index.js';
+export * from './ColorPicker/index.js';