solid-tiny-utils 0.7.1 → 0.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (132) hide show
  1. package/LICENSE +21 -21
  2. package/dist/color/{hex-rgb.d.ts → hex-rgb.d.mts} +5 -3
  3. package/dist/color/hex-rgb.mjs +62 -0
  4. package/dist/color/{oklch-rgb.d.ts → oklch-rgb.d.mts} +9 -8
  5. package/dist/color/oklch-rgb.mjs +101 -0
  6. package/dist/color/{validation.d.ts → validation.d.mts} +5 -3
  7. package/dist/color/validation.mjs +35 -0
  8. package/dist/dom/{css.d.ts → css.d.mts} +5 -3
  9. package/dist/dom/css.mjs +51 -0
  10. package/dist/event/create-click-outside.d.mts +9 -0
  11. package/dist/event/create-click-outside.mjs +33 -0
  12. package/dist/event/{create-event-listener.d.ts → create-event-listener.d.mts} +7 -6
  13. package/dist/event/create-event-listener.mjs +34 -0
  14. package/dist/event/{create-intersection-observer.d.ts → create-intersection-observer.d.mts} +5 -4
  15. package/dist/event/create-intersection-observer.mjs +29 -0
  16. package/dist/event/{create-visibility-observer.d.ts → create-visibility-observer.d.mts} +7 -5
  17. package/dist/event/create-visibility-observer.mjs +46 -0
  18. package/dist/event/index.d.mts +11 -0
  19. package/dist/event/index.mjs +14 -0
  20. package/dist/event/{make-event-listener.d.ts → make-event-listener.d.mts} +8 -7
  21. package/dist/event/make-event-listener.mjs +35 -0
  22. package/dist/fn/create-debounce.d.mts +7 -0
  23. package/dist/fn/create-debounce.mjs +20 -0
  24. package/dist/fn/{create-loop-exec.d.ts → create-loop-exec.d.mts} +7 -6
  25. package/dist/fn/create-loop-exec.mjs +59 -0
  26. package/dist/fn/create-throttle.d.mts +7 -0
  27. package/dist/fn/create-throttle.mjs +21 -0
  28. package/dist/fn/index.d.mts +8 -0
  29. package/dist/fn/index.mjs +9 -0
  30. package/dist/index.d.mts +29 -0
  31. package/dist/index.mjs +26 -0
  32. package/dist/jsx/{attrs.d.ts → attrs.d.mts} +3 -2
  33. package/dist/jsx/attrs.mjs +26 -0
  34. package/dist/reactive/access.d.mts +6 -0
  35. package/dist/reactive/access.mjs +9 -0
  36. package/dist/reactive/{create-debounce-watch.d.ts → create-debounce-watch.d.mts} +6 -4
  37. package/dist/reactive/create-debounce-watch.mjs +15 -0
  38. package/dist/reactive/{create-watch.d.ts → create-watch.d.mts} +4 -3
  39. package/dist/reactive/create-watch.mjs +9 -0
  40. package/dist/reactive/index.d.mts +3 -0
  41. package/dist/types/{fn.d.ts → fn.d.mts} +3 -2
  42. package/dist/types/index.d.mts +2 -0
  43. package/dist/types/{maybe.d.ts → maybe.d.mts} +4 -3
  44. package/dist/utils/{array.d.ts → array.d.mts} +3 -2
  45. package/dist/utils/array.mjs +66 -0
  46. package/dist/utils/async.d.mts +8 -0
  47. package/dist/utils/async.mjs +17 -0
  48. package/dist/utils/{is.d.ts → is.d.mts} +3 -2
  49. package/dist/utils/is.mjs +72 -0
  50. package/dist/utils/{number.d.ts → number.d.mts} +3 -2
  51. package/dist/utils/number.mjs +127 -0
  52. package/dist/utils/{random.d.ts → random.d.mts} +3 -2
  53. package/dist/utils/random.mjs +33 -0
  54. package/dist/utils/{str.d.ts → str.d.mts} +4 -3
  55. package/dist/utils/str.mjs +120 -0
  56. package/package.json +25 -22
  57. package/dist/chunk-4L6FK7MF.js +0 -9
  58. package/dist/chunk-6G7GFZV2.js +0 -93
  59. package/dist/chunk-6OVLJ45M.js +0 -51
  60. package/dist/chunk-ACZGS7DG.js +0 -72
  61. package/dist/chunk-AZAXMGEB.js +0 -0
  62. package/dist/chunk-BLX3XSA6.js +0 -0
  63. package/dist/chunk-BT47ISVC.js +0 -36
  64. package/dist/chunk-EZML2DEC.js +0 -0
  65. package/dist/chunk-FFBJP5FE.js +0 -0
  66. package/dist/chunk-II6INKPZ.js +0 -8
  67. package/dist/chunk-KFLH3AZ6.js +0 -40
  68. package/dist/chunk-KKFGUHFR.js +0 -8
  69. package/dist/chunk-KM4Q6THD.js +0 -50
  70. package/dist/chunk-LEWF7QAQ.js +0 -47
  71. package/dist/chunk-LUFOWTRW.js +0 -0
  72. package/dist/chunk-PD6VHMH6.js +0 -26
  73. package/dist/chunk-QPEF6LHH.js +0 -111
  74. package/dist/chunk-QQVSG76Z.js +0 -36
  75. package/dist/chunk-S7U3LZNS.js +0 -23
  76. package/dist/chunk-SK6Y2YH6.js +0 -0
  77. package/dist/chunk-TDJLPDJF.js +0 -66
  78. package/dist/chunk-TGWWPUWD.js +0 -55
  79. package/dist/chunk-U5LQ2AS5.js +0 -0
  80. package/dist/chunk-WJHRONQU.js +0 -54
  81. package/dist/chunk-Y4GYGFIT.js +0 -85
  82. package/dist/chunk-YK5QQQ43.js +0 -12
  83. package/dist/chunk-YXRZ2KMJ.js +0 -0
  84. package/dist/color/hex-rgb.js +0 -15
  85. package/dist/color/index.d.ts +0 -3
  86. package/dist/color/index.js +0 -30
  87. package/dist/color/oklch-rgb.js +0 -15
  88. package/dist/color/validation.js +0 -18
  89. package/dist/dom/css.js +0 -19
  90. package/dist/dom/index.d.ts +0 -2
  91. package/dist/dom/index.js +0 -20
  92. package/dist/event/create-click-outside.d.ts +0 -8
  93. package/dist/event/create-click-outside.js +0 -17
  94. package/dist/event/create-event-listener.js +0 -17
  95. package/dist/event/create-intersection-observer.js +0 -16
  96. package/dist/event/create-visibility-observer.js +0 -16
  97. package/dist/event/index.d.ts +0 -8
  98. package/dist/event/index.js +0 -33
  99. package/dist/event/make-event-listener.js +0 -16
  100. package/dist/fn/create-debounce.d.ts +0 -6
  101. package/dist/fn/create-debounce.js +0 -15
  102. package/dist/fn/create-loop-exec.js +0 -15
  103. package/dist/fn/create-throttle.d.ts +0 -6
  104. package/dist/fn/create-throttle.js +0 -15
  105. package/dist/fn/index.d.ts +0 -9
  106. package/dist/fn/index.js +0 -21
  107. package/dist/index.d.ts +0 -27
  108. package/dist/index.js +0 -166
  109. package/dist/jsx/attrs.js +0 -6
  110. package/dist/jsx/index.d.ts +0 -1
  111. package/dist/jsx/index.js +0 -7
  112. package/dist/reactive/access.d.ts +0 -6
  113. package/dist/reactive/access.js +0 -13
  114. package/dist/reactive/create-debounce-watch.js +0 -15
  115. package/dist/reactive/create-watch.js +0 -6
  116. package/dist/reactive/index.d.ts +0 -5
  117. package/dist/reactive/index.js +0 -21
  118. package/dist/types/fn.js +0 -1
  119. package/dist/types/index.d.ts +0 -3
  120. package/dist/types/index.js +0 -3
  121. package/dist/types/maybe.js +0 -1
  122. package/dist/utils/array.js +0 -13
  123. package/dist/utils/async.d.ts +0 -6
  124. package/dist/utils/async.js +0 -6
  125. package/dist/utils/index.d.ts +0 -6
  126. package/dist/utils/index.js +0 -85
  127. package/dist/utils/is.js +0 -30
  128. package/dist/utils/number.js +0 -14
  129. package/dist/utils/object.d.ts +0 -10
  130. package/dist/utils/object.js +0 -7
  131. package/dist/utils/random.js +0 -14
  132. package/dist/utils/str.js +0 -20
@@ -0,0 +1,35 @@
1
+ import { isArray } from "../utils/is.mjs";
2
+ import { clearArray } from "../utils/array.mjs";
3
+ import { noop } from "../fn/index.mjs";
4
+ import { onCleanup } from "solid-js";
5
+
6
+ //#region src/event/make-event-listener.ts
7
+ /** biome-ignore-all lint/suspicious/noExplicitAny: I need any */
8
+ function makeEventListener(...args) {
9
+ let target;
10
+ let events;
11
+ let listeners;
12
+ let options;
13
+ if (typeof args[0] === "string" || isArray(args[0])) {
14
+ [events, listeners, options] = args;
15
+ target = window;
16
+ } else [target, events, listeners, options] = args;
17
+ if (!target) return noop;
18
+ if (!isArray(events)) events = [events];
19
+ if (!isArray(listeners)) listeners = [listeners];
20
+ const cleanups = [];
21
+ const cleanup = () => {
22
+ for (const c of cleanups) c();
23
+ clearArray(cleanups);
24
+ };
25
+ const register = (el, event, listener, opts) => {
26
+ el.addEventListener(event, listener, opts);
27
+ return () => el.removeEventListener(event, listener, opts);
28
+ };
29
+ cleanups.push(...events.flatMap((event) => listeners.map((listener) => register(target, event, listener, options))));
30
+ onCleanup(cleanup);
31
+ return cleanup;
32
+ }
33
+
34
+ //#endregion
35
+ export { makeEventListener };
@@ -0,0 +1,7 @@
1
+ import { MaybeAccessor } from "../types/maybe.mjs";
2
+ import "../types/index.mjs";
3
+
4
+ //#region src/fn/create-debounce.d.ts
5
+ declare function createDebounce<Args extends unknown[]>(callback: (...args: Args) => void, delay: MaybeAccessor<number>): (...args: Args) => void;
6
+ //#endregion
7
+ export { createDebounce };
@@ -0,0 +1,20 @@
1
+ import { access } from "../reactive/access.mjs";
2
+ import { onCleanup } from "solid-js";
3
+
4
+ //#region src/fn/create-debounce.ts
5
+ function createDebounce(callback, delay) {
6
+ let timeoutId;
7
+ onCleanup(() => {
8
+ clearTimeout(timeoutId);
9
+ });
10
+ const run = (...args) => {
11
+ clearTimeout(timeoutId);
12
+ timeoutId = setTimeout(() => {
13
+ callback(...args);
14
+ }, access(delay));
15
+ };
16
+ return run;
17
+ }
18
+
19
+ //#endregion
20
+ export { createDebounce };
@@ -1,5 +1,6 @@
1
- import { MaybePromise, MaybeAccessor } from '../types/maybe.js';
2
- import 'solid-js';
1
+ import { MaybeAccessor, MaybePromise } from "../types/maybe.mjs";
2
+
3
+ //#region src/fn/create-loop-exec.d.ts
3
4
 
4
5
  /**
5
6
  * Repeatedly executes an asynchronous function with a specified delay between each execution.
@@ -15,8 +16,8 @@ import 'solid-js';
15
16
  * - Uses `setTimeout` for scheduling and `onCleanup` for resource management.
16
17
  */
17
18
  declare function createLoopExec(fn: () => MaybePromise<void>, delay: MaybeAccessor<number | false>): {
18
- stop: () => void;
19
- start: () => void;
19
+ stop: () => void;
20
+ start: () => void;
20
21
  };
21
-
22
- export { createLoopExec };
22
+ //#endregion
23
+ export { createLoopExec };
@@ -0,0 +1,59 @@
1
+ import { isNumber } from "../utils/is.mjs";
2
+ import { access } from "../reactive/access.mjs";
3
+ import { createWatch } from "../reactive/create-watch.mjs";
4
+ import { onCleanup } from "solid-js";
5
+
6
+ //#region src/fn/create-loop-exec.ts
7
+ /**
8
+ * Repeatedly executes an asynchronous function with a specified delay between each execution.
9
+ * The loop continues until the surrounding SolidJS effect is cleaned up.
10
+ *
11
+ * @param fn - The asynchronous function to execute in a loop. Can return a promise or void.
12
+ * @param delay - The delay (in milliseconds) between each execution. Can be a number or a reactive accessor.
13
+ * If `false` or < 0, the loop will not execute.
14
+ *
15
+ * @remarks
16
+ * - The loop is automatically stopped when cleanup.
17
+ * - `fn`'s error will not stop scheduling.
18
+ * - Uses `setTimeout` for scheduling and `onCleanup` for resource management.
19
+ */
20
+ function createLoopExec(fn, delay) {
21
+ let shouldStop = false;
22
+ let isCleanedUp = false;
23
+ let timer;
24
+ const execFn = async () => {
25
+ clearTimeout(timer);
26
+ const d = access(delay);
27
+ if (shouldStop || !isNumber(d) || d < 0) return;
28
+ try {
29
+ await fn();
30
+ } finally {
31
+ timer = setTimeout(() => {
32
+ execFn();
33
+ }, d);
34
+ }
35
+ };
36
+ createWatch(() => access(delay), () => {
37
+ execFn();
38
+ });
39
+ const stop = () => {
40
+ shouldStop = true;
41
+ clearTimeout(timer);
42
+ };
43
+ const start = () => {
44
+ if (isCleanedUp) return;
45
+ shouldStop = false;
46
+ execFn();
47
+ };
48
+ onCleanup(() => {
49
+ isCleanedUp = true;
50
+ stop();
51
+ });
52
+ return {
53
+ stop,
54
+ start
55
+ };
56
+ }
57
+
58
+ //#endregion
59
+ export { createLoopExec };
@@ -0,0 +1,7 @@
1
+ import { MaybeAccessor } from "../types/maybe.mjs";
2
+ import "../types/index.mjs";
3
+
4
+ //#region src/fn/create-throttle.d.ts
5
+ declare function createThrottle<Args extends unknown[]>(callback: (...args: Args) => void, delay: MaybeAccessor<number>): (...args: Args) => void;
6
+ //#endregion
7
+ export { createThrottle };
@@ -0,0 +1,21 @@
1
+ import { access } from "../reactive/access.mjs";
2
+ import { onCleanup } from "solid-js";
3
+
4
+ //#region src/fn/create-throttle.ts
5
+ function createThrottle(callback, delay) {
6
+ let timeoutId;
7
+ onCleanup(() => {
8
+ clearTimeout(timeoutId);
9
+ });
10
+ const run = (...args) => {
11
+ if (timeoutId) return;
12
+ timeoutId = setTimeout(() => {
13
+ callback(...args);
14
+ timeoutId = void 0;
15
+ }, access(delay));
16
+ };
17
+ return run;
18
+ }
19
+
20
+ //#endregion
21
+ export { createThrottle };
@@ -0,0 +1,8 @@
1
+ import { createDebounce } from "./create-debounce.mjs";
2
+ import { createLoopExec } from "./create-loop-exec.mjs";
3
+ import { createThrottle } from "./create-throttle.mjs";
4
+
5
+ //#region src/fn/index.d.ts
6
+ declare const noop: () => void;
7
+ //#endregion
8
+ export { noop };
@@ -0,0 +1,9 @@
1
+ import { createDebounce } from "./create-debounce.mjs";
2
+ import { createLoopExec } from "./create-loop-exec.mjs";
3
+ import { createThrottle } from "./create-throttle.mjs";
4
+
5
+ //#region src/fn/index.ts
6
+ const noop = () => {};
7
+
8
+ //#endregion
9
+ export { noop };
@@ -0,0 +1,29 @@
1
+ import { OKLCH, RGB, oklchToRgb, rgbToOklch } from "./color/oklch-rgb.mjs";
2
+ import { hexToRgb, rgbToHex } from "./color/hex-rgb.mjs";
3
+ import { isValidHex, isValidOKLCH, isValidRGB } from "./color/validation.mjs";
4
+ import { combineClass, combineStyle, mountStyle, stringStyleToObject } from "./dom/css.mjs";
5
+ import { AnyFn, Fn } from "./types/fn.mjs";
6
+ import { MaybeAccessor, MaybeArray, MaybeNullableAccessor, MaybePromise } from "./types/maybe.mjs";
7
+ import "./types/index.mjs";
8
+ import { createClickOutside } from "./event/create-click-outside.mjs";
9
+ import { DocumentEventName, GeneralEventListener, WindowEventName, makeEventListener } from "./event/make-event-listener.mjs";
10
+ import { createEventListener } from "./event/create-event-listener.mjs";
11
+ import { createIntersectionObserver } from "./event/create-intersection-observer.mjs";
12
+ import { CreateVisibilityObserverOption, EntryCallback, UseVisibilityObserverFn, createVisibilityObserver } from "./event/create-visibility-observer.mjs";
13
+ import { runSolidEventHandler } from "./event/index.mjs";
14
+ import { createDebounce } from "./fn/create-debounce.mjs";
15
+ import { createLoopExec } from "./fn/create-loop-exec.mjs";
16
+ import { createThrottle } from "./fn/create-throttle.mjs";
17
+ import { noop } from "./fn/index.mjs";
18
+ import { dataIf } from "./jsx/attrs.mjs";
19
+ import { access } from "./reactive/access.mjs";
20
+ import { createDebouncedWatch } from "./reactive/create-debounce-watch.mjs";
21
+ import { createWatch } from "./reactive/create-watch.mjs";
22
+ import "./reactive/index.mjs";
23
+ import { clearArray, iterate, list, range } from "./utils/array.mjs";
24
+ import { runAtNextAnimationFrame, sleep } from "./utils/async.mjs";
25
+ import { isArray, isClient, isDate, isEmpty, isFloat, isFn, isInt, isNumber, isObject, isPrimitive, isPromise, isString, isSymbol } from "./utils/is.mjs";
26
+ import { clamp, inRange, max, min, toHex } from "./utils/number.mjs";
27
+ import { draw, random, shuffle, uid } from "./utils/random.mjs";
28
+ import { camel, capitalize, dash, pascal, snake, template, title, trim } from "./utils/str.mjs";
29
+ export { AnyFn, CreateVisibilityObserverOption, DocumentEventName, EntryCallback, Fn, GeneralEventListener, MaybeAccessor, MaybeArray, MaybeNullableAccessor, MaybePromise, OKLCH, RGB, UseVisibilityObserverFn, WindowEventName, access, camel, capitalize, clamp, clearArray, combineClass, combineStyle, createClickOutside, createDebounce, createDebouncedWatch, createEventListener, createIntersectionObserver, createLoopExec, createThrottle, createVisibilityObserver, createWatch, dash, dataIf, draw, hexToRgb, inRange, isArray, isClient, isDate, isEmpty, isFloat, isFn, isInt, isNumber, isObject, isPrimitive, isPromise, isString, isSymbol, isValidHex, isValidOKLCH, isValidRGB, iterate, list, makeEventListener, max, min, mountStyle, noop, oklchToRgb, pascal, random, range, rgbToHex, rgbToOklch, runAtNextAnimationFrame, runSolidEventHandler, shuffle, sleep, snake, stringStyleToObject, template, title, toHex, trim, uid };
package/dist/index.mjs ADDED
@@ -0,0 +1,26 @@
1
+ import { isArray, isClient, isDate, isEmpty, isFloat, isFn, isInt, isNumber, isObject, isPrimitive, isPromise, isString, isSymbol } from "./utils/is.mjs";
2
+ import { clearArray, iterate, list, range } from "./utils/array.mjs";
3
+ import { runAtNextAnimationFrame, sleep } from "./utils/async.mjs";
4
+ import { clamp, inRange, max, min, toHex } from "./utils/number.mjs";
5
+ import { draw, random, shuffle, uid } from "./utils/random.mjs";
6
+ import { camel, capitalize, dash, pascal, snake, template, title, trim } from "./utils/str.mjs";
7
+ import { hexToRgb, rgbToHex } from "./color/hex-rgb.mjs";
8
+ import { oklchToRgb, rgbToOklch } from "./color/oklch-rgb.mjs";
9
+ import { isValidHex, isValidOKLCH, isValidRGB } from "./color/validation.mjs";
10
+ import { combineClass, combineStyle, mountStyle, stringStyleToObject } from "./dom/css.mjs";
11
+ import { access } from "./reactive/access.mjs";
12
+ import { createDebounce } from "./fn/create-debounce.mjs";
13
+ import { createLoopExec } from "./fn/create-loop-exec.mjs";
14
+ import { createThrottle } from "./fn/create-throttle.mjs";
15
+ import { noop } from "./fn/index.mjs";
16
+ import { createWatch } from "./reactive/create-watch.mjs";
17
+ import { createDebouncedWatch } from "./reactive/create-debounce-watch.mjs";
18
+ import { makeEventListener } from "./event/make-event-listener.mjs";
19
+ import { createClickOutside } from "./event/create-click-outside.mjs";
20
+ import { createEventListener } from "./event/create-event-listener.mjs";
21
+ import { createIntersectionObserver } from "./event/create-intersection-observer.mjs";
22
+ import { createVisibilityObserver } from "./event/create-visibility-observer.mjs";
23
+ import { runSolidEventHandler } from "./event/index.mjs";
24
+ import { dataIf } from "./jsx/attrs.mjs";
25
+
26
+ export { access, camel, capitalize, clamp, clearArray, combineClass, combineStyle, createClickOutside, createDebounce, createDebouncedWatch, createEventListener, createIntersectionObserver, createLoopExec, createThrottle, createVisibilityObserver, createWatch, dash, dataIf, draw, hexToRgb, inRange, isArray, isClient, isDate, isEmpty, isFloat, isFn, isInt, isNumber, isObject, isPrimitive, isPromise, isString, isSymbol, isValidHex, isValidOKLCH, isValidRGB, iterate, list, makeEventListener, max, min, mountStyle, noop, oklchToRgb, pascal, random, range, rgbToHex, rgbToOklch, runAtNextAnimationFrame, runSolidEventHandler, shuffle, sleep, snake, stringStyleToObject, template, title, toHex, trim, uid };
@@ -1,3 +1,4 @@
1
+ //#region src/jsx/attrs.d.ts
1
2
  /**
2
3
  * return '' if show is true
3
4
  *
@@ -18,5 +19,5 @@
18
19
  * ```
19
20
  */
20
21
  declare function dataIf(show: boolean): "" | undefined;
21
-
22
- export { dataIf };
22
+ //#endregion
23
+ export { dataIf };
@@ -0,0 +1,26 @@
1
+ //#region src/jsx/attrs.ts
2
+ /**
3
+ * return '' if show is true
4
+ *
5
+ * suitable when you want to conditionally apply data attributes
6
+ *
7
+ * @example
8
+ *
9
+ * ```tsx
10
+ *
11
+ * function MyComponent(props:{size:'small'|'medium'|'large'}) {
12
+ * return <div
13
+ * data-size-small={dataIf(props.size === 'small')}
14
+ * data-size-medium={dataIf(props.size === 'medium')}
15
+ * data-size-large={dataIf(props.size === 'large')}
16
+ * >Hello</div>;
17
+ * }
18
+ *
19
+ * ```
20
+ */
21
+ function dataIf(show) {
22
+ return show ? "" : void 0;
23
+ }
24
+
25
+ //#endregion
26
+ export { dataIf };
@@ -0,0 +1,6 @@
1
+ import { MaybeAccessor } from "../types/maybe.mjs";
2
+
3
+ //#region src/reactive/access.d.ts
4
+ declare function access<T>(value: MaybeAccessor<T>): T;
5
+ //#endregion
6
+ export { access };
@@ -0,0 +1,9 @@
1
+ import { isFn } from "../utils/is.mjs";
2
+
3
+ //#region src/reactive/access.ts
4
+ function access(value) {
5
+ return isFn(value) ? value() : value;
6
+ }
7
+
8
+ //#endregion
9
+ export { access };
@@ -1,4 +1,6 @@
1
- import { AccessorArray, Accessor, OnOptions } from 'solid-js';
1
+ import { Accessor, AccessorArray, OnOptions } from "solid-js";
2
+
3
+ //#region src/reactive/create-debounce-watch.d.ts
2
4
 
3
5
  /**
4
6
  * Creates a debounced watch effect.
@@ -6,7 +8,7 @@ import { AccessorArray, Accessor, OnOptions } from 'solid-js';
6
8
  * opt.delay - The debounce delay in milliseconds. Default is 10ms.
7
9
  */
8
10
  declare function createDebouncedWatch<S, Next extends Prev, Prev = Next>(targets: AccessorArray<S> | Accessor<S>, fn: (input: S, prevInput?: S) => void, opt?: OnOptions & {
9
- delay?: number;
11
+ delay?: number;
10
12
  }): void;
11
-
12
- export { createDebouncedWatch };
13
+ //#endregion
14
+ export { createDebouncedWatch };
@@ -0,0 +1,15 @@
1
+ import { createDebounce } from "../fn/create-debounce.mjs";
2
+ import { createWatch } from "./create-watch.mjs";
3
+
4
+ //#region src/reactive/create-debounce-watch.ts
5
+ /**
6
+ * Creates a debounced watch effect.
7
+ *
8
+ * opt.delay - The debounce delay in milliseconds. Default is 10ms.
9
+ */
10
+ function createDebouncedWatch(targets, fn, opt) {
11
+ createWatch(targets, createDebounce(fn, opt?.delay ?? 10), opt);
12
+ }
13
+
14
+ //#endregion
15
+ export { createDebouncedWatch };
@@ -1,5 +1,6 @@
1
- import { AccessorArray, Accessor, OnEffectFunction, OnOptions } from 'solid-js';
1
+ import { Accessor, AccessorArray, OnEffectFunction, OnOptions } from "solid-js";
2
2
 
3
+ //#region src/reactive/create-watch.d.ts
3
4
  declare function createWatch<S, Next extends Prev, Prev = Next>(targets: AccessorArray<S> | Accessor<S>, fn: OnEffectFunction<S, undefined | NoInfer<Prev>, Next>, opt?: OnOptions): void;
4
-
5
- export { createWatch };
5
+ //#endregion
6
+ export { createWatch };
@@ -0,0 +1,9 @@
1
+ import { createEffect, on } from "solid-js";
2
+
3
+ //#region src/reactive/create-watch.ts
4
+ function createWatch(targets, fn, opt) {
5
+ createEffect(on(targets, fn, opt));
6
+ }
7
+
8
+ //#endregion
9
+ export { createWatch };
@@ -0,0 +1,3 @@
1
+ import { access } from "./access.mjs";
2
+ import { createDebouncedWatch } from "./create-debounce-watch.mjs";
3
+ import { createWatch } from "./create-watch.mjs";
@@ -1,4 +1,5 @@
1
+ //#region src/types/fn.d.ts
1
2
  type AnyFn<R = any> = (...args: any[]) => R;
2
3
  type Fn = () => void;
3
-
4
- export type { AnyFn, Fn };
4
+ //#endregion
5
+ export { AnyFn, Fn };
@@ -0,0 +1,2 @@
1
+ import { AnyFn, Fn } from "./fn.mjs";
2
+ import { MaybeAccessor, MaybeArray, MaybeNullableAccessor, MaybePromise } from "./maybe.mjs";
@@ -1,8 +1,9 @@
1
- import { Accessor } from 'solid-js';
1
+ import { Accessor } from "solid-js";
2
2
 
3
+ //#region src/types/maybe.d.ts
3
4
  type MaybeArray<T> = T | T[];
4
5
  type MaybePromise<T> = T | Promise<T>;
5
6
  type MaybeAccessor<T> = T | Accessor<T>;
6
7
  type MaybeNullableAccessor<T> = T | Accessor<T | null | undefined>;
7
-
8
- export type { MaybeAccessor, MaybeArray, MaybeNullableAccessor, MaybePromise };
8
+ //#endregion
9
+ export { MaybeAccessor, MaybeArray, MaybeNullableAccessor, MaybePromise };
@@ -1,3 +1,4 @@
1
+ //#region src/utils/array.d.ts
1
2
  /**
2
3
  * Like a reduce but does not require an array.
3
4
  * Only need a number and will iterate the function
@@ -42,5 +43,5 @@ declare const list: <T = number>(startOrLength: number, end?: number, valueOrMap
42
43
  * set arr.length to 0
43
44
  */
44
45
  declare function clearArray<T>(arr: T[]): void;
45
-
46
- export { clearArray, iterate, list, range };
46
+ //#endregion
47
+ export { clearArray, iterate, list, range };
@@ -0,0 +1,66 @@
1
+ import { isFn } from "./is.mjs";
2
+
3
+ //#region src/utils/array.ts
4
+ /**
5
+ * Like a reduce but does not require an array.
6
+ * Only need a number and will iterate the function
7
+ * as many times as specified.
8
+ *
9
+ * NOTE: This is NOT zero indexed. If you pass count=5
10
+ * you will get 1, 2, 3, 4, 5 iteration in the callback
11
+ * function
12
+ */
13
+ const iterate = (count, func, initValue) => {
14
+ let value = initValue;
15
+ for (let i = 1; i <= count; i++) value = func(value, i);
16
+ return value;
17
+ };
18
+ /**
19
+ * Creates a generator that will produce an iteration through
20
+ * the range of number as requested.
21
+ *
22
+ * @example
23
+ * range(3) // yields 0, 1, 2, 3
24
+ * range(0, 3) // yields 0, 1, 2, 3
25
+ * range(0, 3, 'y') // yields y, y, y, y
26
+ * range(0, 3, () => 'y') // yields y, y, y, y
27
+ * range(0, 3, i => i) // yields 0, 1, 2, 3
28
+ * range(0, 3, i => `y${i}`) // yields y0, y1, y2, y3
29
+ * range(0, 3, obj) // yields obj, obj, obj, obj
30
+ * range(0, 6, i => i, 2) // yields 0, 2, 4, 6
31
+ */
32
+ function* range(startOrLength, end, valueOrMapper = (i) => i, step = 1) {
33
+ const mapper = isFn(valueOrMapper) ? valueOrMapper : () => valueOrMapper;
34
+ const start = end ? startOrLength : 0;
35
+ const final = end ?? startOrLength;
36
+ for (let i = start; i <= final; i += step) {
37
+ yield mapper(i);
38
+ if (i + step > final) break;
39
+ }
40
+ }
41
+ /**
42
+ * Creates a list of given start, end, value, and
43
+ * step parameters.
44
+ *
45
+ * @example
46
+ * list(3) // 0, 1, 2, 3
47
+ * list(0, 3) // 0, 1, 2, 3
48
+ * list(0, 3, 'y') // y, y, y, y
49
+ * list(0, 3, () => 'y') // y, y, y, y
50
+ * list(0, 3, i => i) // 0, 1, 2, 3
51
+ * list(0, 3, i => `y${i}`) // y0, y1, y2, y3
52
+ * list(0, 3, obj) // obj, obj, obj, obj
53
+ * list(0, 6, i => i, 2) // 0, 2, 4, 6
54
+ */
55
+ const list = (startOrLength, end, valueOrMapper, step) => {
56
+ return Array.from(range(startOrLength, end, valueOrMapper, step));
57
+ };
58
+ /**
59
+ * set arr.length to 0
60
+ */
61
+ function clearArray(arr) {
62
+ arr.length = 0;
63
+ }
64
+
65
+ //#endregion
66
+ export { clearArray, iterate, list, range };
@@ -0,0 +1,8 @@
1
+ //#region src/utils/async.d.ts
2
+ /**
3
+ * Async wait
4
+ */
5
+ declare const sleep: (milliseconds: number) => Promise<unknown>;
6
+ declare const runAtNextAnimationFrame: (cb: () => void) => number;
7
+ //#endregion
8
+ export { runAtNextAnimationFrame, sleep };
@@ -0,0 +1,17 @@
1
+ //#region src/utils/async.ts
2
+ /**
3
+ * Async wait
4
+ */
5
+ const sleep = (milliseconds) => {
6
+ return new Promise((res) => setTimeout(res, milliseconds));
7
+ };
8
+ const runAtNextAnimationFrame = (cb) => {
9
+ return requestAnimationFrame(() => {
10
+ requestAnimationFrame(() => {
11
+ cb();
12
+ });
13
+ });
14
+ };
15
+
16
+ //#endregion
17
+ export { runAtNextAnimationFrame, sleep };
@@ -1,3 +1,4 @@
1
+ //#region src/utils/is.d.ts
1
2
  declare const isSymbol: (value: any) => value is symbol;
2
3
  declare const isArray: (arg: any) => arg is any[];
3
4
  declare const isObject: (value: any) => value is object;
@@ -24,5 +25,5 @@ declare const isDate: (value: any) => value is Date;
24
25
  declare const isPromise: (value: any) => value is Promise<any>;
25
26
  declare const isEmpty: (value: any) => boolean;
26
27
  declare const isClient: boolean;
27
-
28
- export { isArray, isClient, isDate, isEmpty, isFloat, isFn, isInt, isNumber, isObject, isPrimitive, isPromise, isString, isSymbol };
28
+ //#endregion
29
+ export { isArray, isClient, isDate, isEmpty, isFloat, isFn, isInt, isNumber, isObject, isPrimitive, isPromise, isString, isSymbol };
@@ -0,0 +1,72 @@
1
+ import { isServer } from "solid-js/web";
2
+
3
+ //#region src/utils/is.ts
4
+ /** biome-ignore-all lint/suspicious/noExplicitAny: need any */
5
+ const isSymbol = (value) => {
6
+ return !!value && value.constructor === Symbol;
7
+ };
8
+ const isArray = Array.isArray;
9
+ const isObject = (value) => {
10
+ return !!value && value.constructor === Object;
11
+ };
12
+ /**
13
+ * Checks if the given value is primitive.
14
+ *
15
+ * Primitive Types: number , string , boolean , symbol, bigint, undefined, null
16
+ *
17
+ * @param {*} value value to check
18
+ * @returns {boolean} result
19
+ */
20
+ const isPrimitive = (value) => {
21
+ return value === void 0 || value === null || typeof value !== "object" && typeof value !== "function";
22
+ };
23
+ const isFn = (value) => {
24
+ return !!(value && value.constructor && value.call && value.apply);
25
+ };
26
+ const isString = (value) => {
27
+ return typeof value === "string" || value instanceof String;
28
+ };
29
+ const isInt = (value) => {
30
+ return isNumber(value) && value % 1 === 0;
31
+ };
32
+ const isFloat = (value) => {
33
+ return isNumber(value) && value % 1 !== 0;
34
+ };
35
+ const isNumber = (value) => {
36
+ try {
37
+ return Number(value) === value;
38
+ } catch {
39
+ return false;
40
+ }
41
+ };
42
+ const isDate = (value) => {
43
+ return Object.prototype.toString.call(value) === "[object Date]";
44
+ };
45
+ /**
46
+ * This is really a _best guess_ promise checking. You
47
+ * should probably use Promise.resolve(value) to be 100%
48
+ * sure you're handling it correctly.
49
+ */
50
+ const isPromise = (value) => {
51
+ if (!value) return false;
52
+ if (!value.then) return false;
53
+ if (!isFn(value.then)) return false;
54
+ return true;
55
+ };
56
+ const isEmpty = (value) => {
57
+ if (value === true || value === false) return true;
58
+ if (value === null || value === void 0) return true;
59
+ if (isNumber(value)) return value === 0;
60
+ if (isDate(value)) return isNaN(value.getTime());
61
+ if (isFn(value)) return false;
62
+ if (isSymbol(value)) return false;
63
+ const length = value.length;
64
+ if (isNumber(length)) return length === 0;
65
+ const size = value.size;
66
+ if (isNumber(size)) return size === 0;
67
+ return Object.keys(value).length === 0;
68
+ };
69
+ const isClient = !isServer;
70
+
71
+ //#endregion
72
+ export { isArray, isClient, isDate, isEmpty, isFloat, isFn, isInt, isNumber, isObject, isPrimitive, isPromise, isString, isSymbol };
@@ -1,3 +1,4 @@
1
+ //#region src/utils/number.d.ts
1
2
  /**
2
3
  * Returns the smallest of the given numbers.
3
4
  *
@@ -109,5 +110,5 @@ declare function inRange(x: number, minimum?: number, maximum?: number, inclusiv
109
110
  * ```
110
111
  */
111
112
  declare function toHex(x: number, pad?: number): string;
112
-
113
- export { clamp, inRange, max, min, toHex };
113
+ //#endregion
114
+ export { clamp, inRange, max, min, toHex };