npm - yummies - Versions diffs - 7.19.1 → 7.19.3 - Mend

yummies 7.19.1 → 7.19.3

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 (11) hide show

package/async.cjs CHANGED Viewed

@@ -168,7 +168,7 @@ function setAbortableInterval(callback, delayInMs, signal) {
 * Tagged template that builds an async iterable of string chunks (like a streaming template engine).
 *
 * Static template parts are yielded as-is. Each interpolated “piece” can be a primitive, a nested array of pieces,
-* a `Promise` of a piece, an async iterable of strings (e.g. another template or a line-by-line source), or a
+* a `Promise` of a piece (including a resolved primitive), an async iterable of primitives, or a
 * **zero-arg function** whose result is processed the same way (see {@link AsyncTemplatePiece} / `MaybeFn`).
 *
 * Interpolation handling matches `processTemplatePiece`: `null`, `undefined`, and `false` add nothing; any other value
@@ -240,8 +240,8 @@ async function* processTemplatePiece(piece) {
 		for (const item of piece) yield* processTemplatePiece(item);
 		return;
 	}
-	if (typeof piece === "object" && typeof piece[Symbol.asyncIterator] === "function") {
-		yield* piece;
+	if (typeof piece === "object" && piece !== null && typeof piece[Symbol.asyncIterator] === "function") {
+		for await (const item of piece) yield* processTemplatePiece(item);
 		return;
 	}
 	if (typeof piece === "function") {

package/async.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"async.cjs","names":[],"sources":["../src/async.ts"],"sourcesContent":["/*\n ---header-docs-section---\n * # yummies/async\n \n ## Description\n \n Helpers for asynchronous control flow: delays, cancellable waits, scheduling on the next frame,\n * and small utilities around `requestAnimationFrame` and `queueMicrotask`. They complement native\n * `Promise`/`AbortSignal` patterns and keep timing logic easy to test and tree-shake per call site.\n * Import only what you need from `yummies/async` so bundlers can drop unused helpers.\n \n ## Usage\n \n ```ts\n * import { sleep } from \"yummies/async\";\n * ```\n /\n\nimport type { MaybeFn, MaybePromise, Primitive } from './types.js';\n\n/\n Returns a promise that resolves after `time` milliseconds.\n \n When `signal` is passed and becomes aborted before the delay elapses, the promise\n * rejects with `signal.reason` (same as native `fetch` / `AbortController` usage).\n * The timeout is cleared on abort so no resolve happens after cancellation.\n \n @param time - Delay in milliseconds. Defaults to `0` (next macrotask tick, same idea as `setTimeout(0)`).\n * @param signal - Optional `AbortSignal` to cancel the wait early.\n * @returns A promise that resolves with `void` when the delay completes, or rejects if aborted.\n \n @example\n * Basic pause in an async function:\n * ```ts\n * await sleep(250);\n * console.log('after 250ms');\n * ```\n \n @example\n * Cancellable delay tied to component unmount or user action:\n * ```ts\n * const ac = new AbortController();\n * try {\n * await sleep(5000, ac.signal);\n * } catch (e) {\n * // aborted — e is signal.reason\n * }\n * ac.abort('user cancelled');\n * ```\n /\nexport const sleep = (time: number = 0, signal?: AbortSignal) =>\n new Promise<void>((resolve, reject) => {\n if (signal) {\n const abortListener = () => {\n clearTimeout(timerId);\n reject(signal?.reason);\n };\n const timerId = setTimeout(() => {\n signal.removeEventListener('abort', abortListener);\n resolve();\n }, time);\n signal.addEventListener('abort', abortListener, { once: true });\n } else {\n setTimeout(resolve, time);\n }\n });\n\n/\n Creates a promise that resolves after the specified number of milliseconds.\n \n @deprecated Use `sleep` instead.\n * @param ms Delay in milliseconds.\n * @returns Promise\n /\nexport const waitAsync = async (ms = 1000) =>\n new Promise((resolve) => setTimeout(resolve, ms));\n\n/\n Runs a loop driven by `requestAnimationFrame`: on each frame, `quitFunction` is called first.\n * If it returns a truthy value, the loop stops and no further frames are scheduled.\n * If it returns falsy or nothing, the next frame is scheduled recursively.\n \n Use this for per-frame work (animations, layout reads after paint) without managing\n * `cancelAnimationFrame` manually — returning `true` from `quitFunction` is the exit condition.\n \n When `asMicrotask` is `true`, scheduling the next RAF is deferred with `queueMicrotask`\n * so other microtasks can run before the frame is requested (useful when you need to\n * batch DOM updates or let reactive frameworks flush first).\n \n @param quitFunction - Invoked each animation frame. Return `true` to stop the loop.\n * @param asMicrotask - If `true`, wrap the `requestAnimationFrame` call in `queueMicrotask`.\n \n @example\n * Stop after 60 frames (~1s at 60Hz):\n * ```ts\n * let frames = 0;\n * endlessRAF(() => {\n * frames++;\n * updateSomething(frames);\n * return frames >= 60;\n * });\n * ```\n \n @example\n * Run until an element is removed or a flag is set:\n * ```ts\n * let running = true;\n * endlessRAF(() => {\n * if (!running \|\| !document.body.contains(el)) return true;\n * draw(el);\n * }, true);\n * ```\n /\nexport const endlessRAF = (\n quitFunction: () => boolean \| void,\n asMicrotask?: boolean,\n) => {\n if (quitFunction()) return;\n\n const raf = () =>\n requestAnimationFrame(() => endlessRAF(quitFunction, asMicrotask));\n\n if (asMicrotask) {\n queueMicrotask(raf);\n } else {\n raf();\n }\n};\n\n/\n Like `setTimeout`, but if `signal` aborts before the delay fires, the timer is cleared\n * and `callback` is never run. If the callback runs normally, the abort listener is removed.\n \n Does nothing special if `signal` is omitted — behaves like a plain timeout.\n \n @param callback - Function to run once after `delayInMs` (same as `setTimeout` callback).\n * @param delayInMs - Milliseconds to wait. Passed through to `setTimeout` (browser/Node semantics apply).\n * @param signal - When aborted, clears the pending timeout so `callback` is not invoked.\n \n @example\n * ```ts\n * const controller = new AbortController();\n * setAbortableTimeout(() => console.log('done'), 500, controller.signal);\n * // later: controller.abort(); // timeout cancelled, log never runs\n * ```\n \n @example\n * Zero-delay scheduling that can still be cancelled before the macrotask runs:\n * ```ts\n * const ac = new AbortController();\n * setAbortableTimeout(() => startIntro(), 0, ac.signal);\n * // e.g. on teardown: ac.abort();\n * ```\n /\nexport function setAbortableTimeout(\n callback: VoidFunction,\n delayInMs?: number,\n signal?: AbortSignal,\n) {\n let internalTimer: number \| null = null;\n\n const handleAbort = () => {\n if (internalTimer == null) {\n return;\n }\n clearTimeout(internalTimer);\n internalTimer = null;\n };\n\n signal?.addEventListener('abort', handleAbort, { once: true });\n\n internalTimer = setTimeout(() => {\n signal?.removeEventListener('abort', handleAbort);\n callback();\n }, delayInMs);\n}\n\n/\n Like `setInterval`, but when `signal` aborts, the interval is cleared with `clearInterval`\n * and `callback` stops being called. If `signal` is omitted, behaves like a normal interval\n * (you must clear it yourself).\n \n @param callback - Invoked every `delayInMs` milliseconds until aborted or cleared.\n * @param delayInMs - Interval period in milliseconds (same as `setInterval`).\n * @param signal - Aborting stops the interval and removes the abort listener path from keeping work alive.\n \n @example\n * ```ts\n * const controller = new AbortController();\n * setAbortableInterval(() => console.log('tick'), 1000, controller.signal);\n * // stop: controller.abort();\n * ```\n \n @example\n * ```ts\n * const ac = new AbortController();\n * setAbortableInterval(syncStatus, 30_000, ac.signal);\n * window.addEventListener('beforeunload', () => ac.abort());\n * ```\n /\nexport function setAbortableInterval(\n callback: VoidFunction,\n delayInMs?: number,\n signal?: AbortSignal,\n) {\n let timer: number \| null = null;\n\n const handleAbort = () => {\n if (timer == null) {\n return;\n }\n clearInterval(timer);\n timer = null;\n };\n\n signal?.addEventListener('abort', handleAbort, { once: true });\n\n timer = setInterval(callback, delayInMs);\n}\n\n/\n A single interpolated segment in {@link asyncTemplate}.\n \n - Primitives use `String(value)` for output, except that values matching\n * `value === null \|\| value === undefined \|\| value === false` yield no text (early return in `processTemplatePiece`).\n * Other falsy values such as `0` or `''` are still stringified.\n * - Arrays are flattened recursively in order.\n * - Promises are awaited; the resolved value is processed the same way.\n * - Async iterables of strings are streamed in order (`yield`).\n - Functions (thunks): if the piece is a function, it is invoked with no arguments (`piece()`), and the return\n * value is processed recursively—so you can defer work or return any other {@link AsyncTemplatePiece} shape\n * (see {@link MaybeFn}). At runtime a thunk may also return a `Promise` of a piece; that is covered by\n * {@link MaybePromise} on each template interpolation.\n /\nexport type AsyncTemplatePiece = MaybeFn<\n Primitive \| void \| AsyncIterable<string> \| AsyncTemplatePiece[]\n>;\n\n/\n Tagged template that builds an async iterable of string chunks (like a streaming template engine).\n \n Static template parts are yielded as-is. Each interpolated “piece” can be a primitive, a nested array of pieces,\n * a `Promise` of a piece, an async iterable of strings (e.g. another template or a line-by-line source), or a\n * zero-arg function whose result is processed the same way (see {@link AsyncTemplatePiece} / `MaybeFn`).\n \n Interpolation handling matches `processTemplatePiece`: `null`, `undefined`, and `false` add nothing; any other value\n * becomes text via `String(...)`; functions are called once with no arguments before further processing. Collect chunks\n * with `for await...of` or utilities like `Array.fromAsync` where available.\n \n @param strings - Cooked template segments from the tag (`strings[0]`, `strings[1]`, …).\n * @param pieces - Values between segments (`pieces[i]` sits between `strings[i]` and `strings[i + 1]`).\n * @returns An async generator yielding string fragments in document order.\n \n @example\n * Plain values and promises:\n * ```ts\n * const gen = asyncTemplate`Hello, ${'world'}! Status: ${Promise.resolve(200)}`;\n * let out = '';\n * for await (const chunk of gen) out += chunk;\n * // out === 'Hello, world! Status: 200'\n * ```\n \n @example\n * Falsy pieces are omitted (`null`, `undefined`, `false`); arrays flatten recursively:\n * ```ts\n * const gen = asyncTemplate`${null}${false}A${['B', ['C']]}`;\n * const out = await Array.fromAsync(gen).then((parts) => parts.join(''));\n * // out === 'ABC'\n * ```\n \n @example\n * Stream from an async iterable (e.g. chunked upstream text):\n * ```ts\n * async function* lines() {\n * yield 'line1\\n';\n * yield 'line2\\n';\n * }\n * const gen = asyncTemplate`Header\\n${lines()}Footer`;\n * ```\n \n @example\n * Lazy piece via a thunk (invoked as `piece()`):\n * ```ts\n * let n = 0;\n * const gen = asyncTemplate`count=${() => ++n}`;\n * // first consumption yields \"count=1\", etc.\n * ```\n /\nexport async function asyncTemplate(\n strings: TemplateStringsArray,\n ...pieces: MaybePromise<AsyncTemplatePiece>[]\n) {\n for (let i = 0; i < strings.length; i++) {\n yield strings[i];\n\n if (i < pieces.length) {\n const piece = pieces[i];\n yield* processTemplatePiece(piece);\n }\n }\n}\n\n/*\n Resolves a template piece into yielded string chunks.\n \n Skips output when `value === null \|\| value === undefined \|\| value === false`.\n * Otherwise awaits promises, flattens arrays, streams async iterables, invokes functions with no arguments and\n * recurses on the return value, and uses `String(value)` for primitives.\n /\nasync function processTemplatePiece(\n piece: MaybePromise<AsyncTemplatePiece>,\n): AsyncGenerator<string, void, unknown> {\n if (piece === null \|\| piece === undefined \|\| piece === false) {\n return;\n }\n\n if (piece instanceof Promise) {\n const resolved = await piece;\n yield* processTemplatePiece(resolved);\n return;\n }\n\n if (Array.isArray(piece)) {\n for (const item of piece) {\n yield* processTemplatePiece(item);\n }\n return;\n }\n\n if (\n typeof piece === 'object' &&\n typeof piece[Symbol.asyncIterator] === 'function'\n ) {\n yield* piece;\n return;\n }\n\n if (typeof piece === 'function') {\n yield* processTemplatePiece(piece());\n return;\n }\n\n yield String(piece);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,IAAa,SAAS,OAAe,GAAG,WACtC,IAAI,SAAe,SAAS,WAAW;AACrC,KAAI,QAAQ;EACV,MAAM,sBAAsB;AAC1B,gBAAa,QAAQ;AACrB,UAAO,QAAQ,OAAO;;EAExB,MAAM,UAAU,iBAAiB;AAC/B,UAAO,oBAAoB,SAAS,cAAc;AAClD,YAAS;KACR,KAAK;AACR,SAAO,iBAAiB,SAAS,eAAe,EAAE,MAAM,MAAM,CAAC;OAE/D,YAAW,SAAS,KAAK;EAE3B;;;;;;;;AASJ,IAAa,YAAY,OAAO,KAAK,QACnC,IAAI,SAAS,YAAY,WAAW,SAAS,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCnD,IAAa,cACX,cACA,gBACG;AACH,KAAI,cAAc,CAAE;CAEpB,MAAM,YACJ,4BAA4B,WAAW,cAAc,YAAY,CAAC;AAEpE,KAAI,YACF,gBAAe,IAAI;KAEnB,MAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BT,SAAgB,oBACd,UACA,WACA,QACA;CACA,IAAI,gBAA+B;CAEnC,MAAM,oBAAoB;AACxB,MAAI,iBAAiB,KACnB;AAEF,eAAa,cAAc;AAC3B,kBAAgB;;AAGlB,SAAQ,iBAAiB,SAAS,aAAa,EAAE,MAAM,MAAM,CAAC;AAE9D,iBAAgB,iBAAiB;AAC/B,UAAQ,oBAAoB,SAAS,YAAY;AACjD,YAAU;IACT,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;AA0Bf,SAAgB,qBACd,UACA,WACA,QACA;CACA,IAAI,QAAuB;CAE3B,MAAM,oBAAoB;AACxB,MAAI,SAAS,KACX;AAEF,gBAAc,MAAM;AACpB,UAAQ;;AAGV,SAAQ,iBAAiB,SAAS,aAAa,EAAE,MAAM,MAAM,CAAC;AAE9D,SAAQ,YAAY,UAAU,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuE1C,gBAAuB,cACrB,SACA,GAAG,QACH;AACA,MAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AACvC,QAAM,QAAQ;AAEd,MAAI,IAAI,OAAO,QAAQ;GACrB,MAAM,QAAQ,OAAO;AACrB,UAAO,qBAAqB,MAAM;;;;;;;;;;;AAYxC,gBAAgB,qBACd,OACuC;AACvC,KAAI,UAAU,QAAQ,UAAU,KAAA,KAAa,UAAU,MACrD;AAGF,KAAI,iBAAiB,SAAS;AAE5B,SAAO,qBADU,MAAM,MACc;AACrC;;AAGF,KAAI,MAAM,QAAQ,MAAM,EAAE;AACxB,OAAK,MAAM,QAAQ,MACjB,QAAO,qBAAqB,KAAK;AAEnC;;AAGF,KACE,OAAO,UAAU,YACjB,OAAO,MAAM,OAAO,mBAAmB,YACvC;AACA,SAAO;AACP;;AAGF,KAAI,OAAO,UAAU,YAAY;AAC/B,SAAO,qBAAqB,OAAO,CAAC;AACpC;;AAGF,OAAM,OAAO,MAAM"}
1	+ {"version":3,"file":"async.cjs","names":[],"sources":["../src/async.ts"],"sourcesContent":["/*\n ---header-docs-section---\n * # yummies/async\n \n ## Description\n \n Helpers for asynchronous control flow: delays, cancellable waits, scheduling on the next frame,\n * and small utilities around `requestAnimationFrame` and `queueMicrotask`. They complement native\n * `Promise`/`AbortSignal` patterns and keep timing logic easy to test and tree-shake per call site.\n * Import only what you need from `yummies/async` so bundlers can drop unused helpers.\n \n ## Usage\n \n ```ts\n * import { sleep } from \"yummies/async\";\n * ```\n /\n\nimport type { MaybeFn, MaybePromise, Primitive } from './types.js';\n\n/\n Returns a promise that resolves after `time` milliseconds.\n \n When `signal` is passed and becomes aborted before the delay elapses, the promise\n * rejects with `signal.reason` (same as native `fetch` / `AbortController` usage).\n * The timeout is cleared on abort so no resolve happens after cancellation.\n \n @param time - Delay in milliseconds. Defaults to `0` (next macrotask tick, same idea as `setTimeout(0)`).\n * @param signal - Optional `AbortSignal` to cancel the wait early.\n * @returns A promise that resolves with `void` when the delay completes, or rejects if aborted.\n \n @example\n * Basic pause in an async function:\n * ```ts\n * await sleep(250);\n * console.log('after 250ms');\n * ```\n \n @example\n * Cancellable delay tied to component unmount or user action:\n * ```ts\n * const ac = new AbortController();\n * try {\n * await sleep(5000, ac.signal);\n * } catch (e) {\n * // aborted — e is signal.reason\n * }\n * ac.abort('user cancelled');\n * ```\n /\nexport const sleep = (time: number = 0, signal?: AbortSignal) =>\n new Promise<void>((resolve, reject) => {\n if (signal) {\n const abortListener = () => {\n clearTimeout(timerId);\n reject(signal?.reason);\n };\n const timerId = setTimeout(() => {\n signal.removeEventListener('abort', abortListener);\n resolve();\n }, time);\n signal.addEventListener('abort', abortListener, { once: true });\n } else {\n setTimeout(resolve, time);\n }\n });\n\n/\n Creates a promise that resolves after the specified number of milliseconds.\n \n @deprecated Use `sleep` instead.\n * @param ms Delay in milliseconds.\n * @returns Promise\n /\nexport const waitAsync = async (ms = 1000) =>\n new Promise((resolve) => setTimeout(resolve, ms));\n\n/\n Runs a loop driven by `requestAnimationFrame`: on each frame, `quitFunction` is called first.\n * If it returns a truthy value, the loop stops and no further frames are scheduled.\n * If it returns falsy or nothing, the next frame is scheduled recursively.\n \n Use this for per-frame work (animations, layout reads after paint) without managing\n * `cancelAnimationFrame` manually — returning `true` from `quitFunction` is the exit condition.\n \n When `asMicrotask` is `true`, scheduling the next RAF is deferred with `queueMicrotask`\n * so other microtasks can run before the frame is requested (useful when you need to\n * batch DOM updates or let reactive frameworks flush first).\n \n @param quitFunction - Invoked each animation frame. Return `true` to stop the loop.\n * @param asMicrotask - If `true`, wrap the `requestAnimationFrame` call in `queueMicrotask`.\n \n @example\n * Stop after 60 frames (~1s at 60Hz):\n * ```ts\n * let frames = 0;\n * endlessRAF(() => {\n * frames++;\n * updateSomething(frames);\n * return frames >= 60;\n * });\n * ```\n \n @example\n * Run until an element is removed or a flag is set:\n * ```ts\n * let running = true;\n * endlessRAF(() => {\n * if (!running \|\| !document.body.contains(el)) return true;\n * draw(el);\n * }, true);\n * ```\n /\nexport const endlessRAF = (\n quitFunction: () => boolean \| void,\n asMicrotask?: boolean,\n) => {\n if (quitFunction()) return;\n\n const raf = () =>\n requestAnimationFrame(() => endlessRAF(quitFunction, asMicrotask));\n\n if (asMicrotask) {\n queueMicrotask(raf);\n } else {\n raf();\n }\n};\n\n/\n Like `setTimeout`, but if `signal` aborts before the delay fires, the timer is cleared\n * and `callback` is never run. If the callback runs normally, the abort listener is removed.\n \n Does nothing special if `signal` is omitted — behaves like a plain timeout.\n \n @param callback - Function to run once after `delayInMs` (same as `setTimeout` callback).\n * @param delayInMs - Milliseconds to wait. Passed through to `setTimeout` (browser/Node semantics apply).\n * @param signal - When aborted, clears the pending timeout so `callback` is not invoked.\n \n @example\n * ```ts\n * const controller = new AbortController();\n * setAbortableTimeout(() => console.log('done'), 500, controller.signal);\n * // later: controller.abort(); // timeout cancelled, log never runs\n * ```\n \n @example\n * Zero-delay scheduling that can still be cancelled before the macrotask runs:\n * ```ts\n * const ac = new AbortController();\n * setAbortableTimeout(() => startIntro(), 0, ac.signal);\n * // e.g. on teardown: ac.abort();\n * ```\n /\nexport function setAbortableTimeout(\n callback: VoidFunction,\n delayInMs?: number,\n signal?: AbortSignal,\n) {\n let internalTimer: number \| null = null;\n\n const handleAbort = () => {\n if (internalTimer == null) {\n return;\n }\n clearTimeout(internalTimer);\n internalTimer = null;\n };\n\n signal?.addEventListener('abort', handleAbort, { once: true });\n\n internalTimer = setTimeout(() => {\n signal?.removeEventListener('abort', handleAbort);\n callback();\n }, delayInMs);\n}\n\n/\n Like `setInterval`, but when `signal` aborts, the interval is cleared with `clearInterval`\n * and `callback` stops being called. If `signal` is omitted, behaves like a normal interval\n * (you must clear it yourself).\n \n @param callback - Invoked every `delayInMs` milliseconds until aborted or cleared.\n * @param delayInMs - Interval period in milliseconds (same as `setInterval`).\n * @param signal - Aborting stops the interval and removes the abort listener path from keeping work alive.\n \n @example\n * ```ts\n * const controller = new AbortController();\n * setAbortableInterval(() => console.log('tick'), 1000, controller.signal);\n * // stop: controller.abort();\n * ```\n \n @example\n * ```ts\n * const ac = new AbortController();\n * setAbortableInterval(syncStatus, 30_000, ac.signal);\n * window.addEventListener('beforeunload', () => ac.abort());\n * ```\n /\nexport function setAbortableInterval(\n callback: VoidFunction,\n delayInMs?: number,\n signal?: AbortSignal,\n) {\n let timer: number \| null = null;\n\n const handleAbort = () => {\n if (timer == null) {\n return;\n }\n clearInterval(timer);\n timer = null;\n };\n\n signal?.addEventListener('abort', handleAbort, { once: true });\n\n timer = setInterval(callback, delayInMs);\n}\n\n/\n A single interpolated segment in {@link asyncTemplate}.\n \n - Primitives use `String(value)` for output, except that values matching\n * `value === null \|\| value === undefined \|\| value === false` yield no text (early return in `processTemplatePiece`).\n * Other falsy values such as `0` or `''` are still stringified.\n * - Arrays are flattened recursively in order.\n * - Promises are awaited; the resolved value is processed the same way.\n * - Async iterables of primitives are streamed in order; each yielded value uses the same rules\n * as a standalone primitive (`String(...)`, with `null` / `undefined` / `false` omitted).\n * - Functions (thunks): if the piece is a function, it is invoked with no arguments (`piece()`), and the return\n * value is processed recursively—so you can defer work or return any other {@link AsyncTemplatePiece} shape\n * (see {@link MaybeFn}). At runtime a thunk may also return a `Promise` of a piece; that is covered by\n * {@link MaybePromise} on each template interpolation.\n /\nexport type AsyncTemplatePiece = MaybeFn<\n \| Primitive\n \| void\n \| AsyncIterable<Primitive>\n \| Promise<Primitive>\n \| AsyncTemplatePiece[]\n>;\n\n/\n Tagged template that builds an async iterable of string chunks (like a streaming template engine).\n \n Static template parts are yielded as-is. Each interpolated “piece” can be a primitive, a nested array of pieces,\n * a `Promise` of a piece (including a resolved primitive), an async iterable of primitives, or a\n * zero-arg function whose result is processed the same way (see {@link AsyncTemplatePiece} / `MaybeFn`).\n \n Interpolation handling matches `processTemplatePiece`: `null`, `undefined`, and `false` add nothing; any other value\n * becomes text via `String(...)`; functions are called once with no arguments before further processing. Collect chunks\n * with `for await...of` or utilities like `Array.fromAsync` where available.\n \n @param strings - Cooked template segments from the tag (`strings[0]`, `strings[1]`, …).\n * @param pieces - Values between segments (`pieces[i]` sits between `strings[i]` and `strings[i + 1]`).\n * @returns An async generator yielding string fragments in document order.\n \n @example\n * Plain values and promises:\n * ```ts\n * const gen = asyncTemplate`Hello, ${'world'}! Status: ${Promise.resolve(200)}`;\n * let out = '';\n * for await (const chunk of gen) out += chunk;\n * // out === 'Hello, world! Status: 200'\n * ```\n \n @example\n * Falsy pieces are omitted (`null`, `undefined`, `false`); arrays flatten recursively:\n * ```ts\n * const gen = asyncTemplate`${null}${false}A${['B', ['C']]}`;\n * const out = await Array.fromAsync(gen).then((parts) => parts.join(''));\n * // out === 'ABC'\n * ```\n \n @example\n * Stream from an async iterable (e.g. chunked upstream text):\n * ```ts\n * async function* lines() {\n * yield 'line1\\n';\n * yield 'line2\\n';\n * }\n * const gen = asyncTemplate`Header\\n${lines()}Footer`;\n * ```\n \n @example\n * Lazy piece via a thunk (invoked as `piece()`):\n * ```ts\n * let n = 0;\n * const gen = asyncTemplate`count=${() => ++n}`;\n * // first consumption yields \"count=1\", etc.\n * ```\n /\nexport async function asyncTemplate(\n strings: TemplateStringsArray,\n ...pieces: MaybePromise<AsyncTemplatePiece>[]\n) {\n for (let i = 0; i < strings.length; i++) {\n yield strings[i];\n\n if (i < pieces.length) {\n const piece = pieces[i];\n yield* processTemplatePiece(piece);\n }\n }\n}\n\n/*\n Resolves a template piece into yielded string chunks.\n \n Skips output when `value === null \|\| value === undefined \|\| value === false`.\n * Otherwise awaits promises, flattens arrays, streams async iterables, invokes functions with no arguments and\n * recurses on the return value, and uses `String(value)` for primitives.\n /\nasync function processTemplatePiece(\n piece: MaybePromise<AsyncTemplatePiece>,\n): AsyncGenerator<string, void, unknown> {\n if (piece === null \|\| piece === undefined \|\| piece === false) {\n return;\n }\n\n if (piece instanceof Promise) {\n const resolved = await piece;\n yield* processTemplatePiece(resolved);\n return;\n }\n\n if (Array.isArray(piece)) {\n for (const item of piece) {\n yield* processTemplatePiece(item);\n }\n return;\n }\n\n if (\n typeof piece === 'object' &&\n piece !== null &&\n typeof (piece as AsyncIterable<unknown>)[Symbol.asyncIterator] ===\n 'function'\n ) {\n for await (const item of piece as AsyncIterable<AsyncTemplatePiece>) {\n yield* processTemplatePiece(item);\n }\n return;\n }\n\n if (typeof piece === 'function') {\n yield* processTemplatePiece(piece());\n return;\n }\n\n yield String(piece);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,IAAa,SAAS,OAAe,GAAG,WACtC,IAAI,SAAe,SAAS,WAAW;AACrC,KAAI,QAAQ;EACV,MAAM,sBAAsB;AAC1B,gBAAa,QAAQ;AACrB,UAAO,QAAQ,OAAO;;EAExB,MAAM,UAAU,iBAAiB;AAC/B,UAAO,oBAAoB,SAAS,cAAc;AAClD,YAAS;KACR,KAAK;AACR,SAAO,iBAAiB,SAAS,eAAe,EAAE,MAAM,MAAM,CAAC;OAE/D,YAAW,SAAS,KAAK;EAE3B;;;;;;;;AASJ,IAAa,YAAY,OAAO,KAAK,QACnC,IAAI,SAAS,YAAY,WAAW,SAAS,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCnD,IAAa,cACX,cACA,gBACG;AACH,KAAI,cAAc,CAAE;CAEpB,MAAM,YACJ,4BAA4B,WAAW,cAAc,YAAY,CAAC;AAEpE,KAAI,YACF,gBAAe,IAAI;KAEnB,MAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BT,SAAgB,oBACd,UACA,WACA,QACA;CACA,IAAI,gBAA+B;CAEnC,MAAM,oBAAoB;AACxB,MAAI,iBAAiB,KACnB;AAEF,eAAa,cAAc;AAC3B,kBAAgB;;AAGlB,SAAQ,iBAAiB,SAAS,aAAa,EAAE,MAAM,MAAM,CAAC;AAE9D,iBAAgB,iBAAiB;AAC/B,UAAQ,oBAAoB,SAAS,YAAY;AACjD,YAAU;IACT,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;AA0Bf,SAAgB,qBACd,UACA,WACA,QACA;CACA,IAAI,QAAuB;CAE3B,MAAM,oBAAoB;AACxB,MAAI,SAAS,KACX;AAEF,gBAAc,MAAM;AACpB,UAAQ;;AAGV,SAAQ,iBAAiB,SAAS,aAAa,EAAE,MAAM,MAAM,CAAC;AAE9D,SAAQ,YAAY,UAAU,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4E1C,gBAAuB,cACrB,SACA,GAAG,QACH;AACA,MAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AACvC,QAAM,QAAQ;AAEd,MAAI,IAAI,OAAO,QAAQ;GACrB,MAAM,QAAQ,OAAO;AACrB,UAAO,qBAAqB,MAAM;;;;;;;;;;;AAYxC,gBAAgB,qBACd,OACuC;AACvC,KAAI,UAAU,QAAQ,UAAU,KAAA,KAAa,UAAU,MACrD;AAGF,KAAI,iBAAiB,SAAS;AAE5B,SAAO,qBADU,MAAM,MACc;AACrC;;AAGF,KAAI,MAAM,QAAQ,MAAM,EAAE;AACxB,OAAK,MAAM,QAAQ,MACjB,QAAO,qBAAqB,KAAK;AAEnC;;AAGF,KACE,OAAO,UAAU,YACjB,UAAU,QACV,OAAQ,MAAiC,OAAO,mBAC9C,YACF;AACA,aAAW,MAAM,QAAQ,MACvB,QAAO,qBAAqB,KAAK;AAEnC;;AAGF,KAAI,OAAO,UAAU,YAAY;AAC/B,SAAO,qBAAqB,OAAO,CAAC;AACpC;;AAGF,OAAM,OAAO,MAAM"}

package/async.d.ts CHANGED Viewed

@@ -173,18 +173,19 @@ declare function setAbortableInterval(callback: VoidFunction, delayInMs?: number
  *   Other falsy values such as `0` or `''` are still stringified.
  * - **Arrays** are flattened recursively in order.
  * - **Promises** are awaited; the resolved value is processed the same way.
- * - **Async iterables of strings** are streamed in order (`yield*`).
+ * - **Async iterables of primitives** are streamed in order; each yielded value uses the same rules
+ *   as a standalone primitive (`String(...)`, with `null` / `undefined` / `false` omitted).
  * - **Functions** (thunks): if the piece is a function, it is invoked with **no arguments** (`piece()`), and the return
  *   value is processed recursively—so you can defer work or return any other {@link AsyncTemplatePiece} shape
  *   (see {@link MaybeFn}). At runtime a thunk may also return a `Promise` of a piece; that is covered by
  *   {@link MaybePromise} on each template interpolation.
  */
-type AsyncTemplatePiece = MaybeFn<Primitive | void | AsyncIterable<string> | AsyncTemplatePiece[]>;
+type AsyncTemplatePiece = MaybeFn<Primitive | void | AsyncIterable<Primitive> | Promise<Primitive> | AsyncTemplatePiece[]>;
 /**
  * Tagged template that builds an async iterable of string chunks (like a streaming template engine).
  *
  * Static template parts are yielded as-is. Each interpolated “piece” can be a primitive, a nested array of pieces,
- * a `Promise` of a piece, an async iterable of strings (e.g. another template or a line-by-line source), or a
+ * a `Promise` of a piece (including a resolved primitive), an async iterable of primitives, or a
  * **zero-arg function** whose result is processed the same way (see {@link AsyncTemplatePiece} / `MaybeFn`).
  *
  * Interpolation handling matches `processTemplatePiece`: `null`, `undefined`, and `false` add nothing; any other value

package/async.js CHANGED Viewed

@@ -167,7 +167,7 @@ function setAbortableInterval(callback, delayInMs, signal) {
 * Tagged template that builds an async iterable of string chunks (like a streaming template engine).
 *
 * Static template parts are yielded as-is. Each interpolated “piece” can be a primitive, a nested array of pieces,
-* a `Promise` of a piece, an async iterable of strings (e.g. another template or a line-by-line source), or a
+* a `Promise` of a piece (including a resolved primitive), an async iterable of primitives, or a
 * **zero-arg function** whose result is processed the same way (see {@link AsyncTemplatePiece} / `MaybeFn`).
 *
 * Interpolation handling matches `processTemplatePiece`: `null`, `undefined`, and `false` add nothing; any other value
@@ -239,8 +239,8 @@ async function* processTemplatePiece(piece) {
 		for (const item of piece) yield* processTemplatePiece(item);
 		return;
 	}
-	if (typeof piece === "object" && typeof piece[Symbol.asyncIterator] === "function") {
-		yield* piece;
+	if (typeof piece === "object" && piece !== null && typeof piece[Symbol.asyncIterator] === "function") {
+		for await (const item of piece) yield* processTemplatePiece(item);
 		return;
 	}
 	if (typeof piece === "function") {

package/async.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"async.js","names":[],"sources":["../src/async.ts"],"sourcesContent":["/*\n ---header-docs-section---\n * # yummies/async\n \n ## Description\n \n Helpers for asynchronous control flow: delays, cancellable waits, scheduling on the next frame,\n * and small utilities around `requestAnimationFrame` and `queueMicrotask`. They complement native\n * `Promise`/`AbortSignal` patterns and keep timing logic easy to test and tree-shake per call site.\n * Import only what you need from `yummies/async` so bundlers can drop unused helpers.\n \n ## Usage\n \n ```ts\n * import { sleep } from \"yummies/async\";\n * ```\n /\n\nimport type { MaybeFn, MaybePromise, Primitive } from './types.js';\n\n/\n Returns a promise that resolves after `time` milliseconds.\n \n When `signal` is passed and becomes aborted before the delay elapses, the promise\n * rejects with `signal.reason` (same as native `fetch` / `AbortController` usage).\n * The timeout is cleared on abort so no resolve happens after cancellation.\n \n @param time - Delay in milliseconds. Defaults to `0` (next macrotask tick, same idea as `setTimeout(0)`).\n * @param signal - Optional `AbortSignal` to cancel the wait early.\n * @returns A promise that resolves with `void` when the delay completes, or rejects if aborted.\n \n @example\n * Basic pause in an async function:\n * ```ts\n * await sleep(250);\n * console.log('after 250ms');\n * ```\n \n @example\n * Cancellable delay tied to component unmount or user action:\n * ```ts\n * const ac = new AbortController();\n * try {\n * await sleep(5000, ac.signal);\n * } catch (e) {\n * // aborted — e is signal.reason\n * }\n * ac.abort('user cancelled');\n * ```\n /\nexport const sleep = (time: number = 0, signal?: AbortSignal) =>\n new Promise<void>((resolve, reject) => {\n if (signal) {\n const abortListener = () => {\n clearTimeout(timerId);\n reject(signal?.reason);\n };\n const timerId = setTimeout(() => {\n signal.removeEventListener('abort', abortListener);\n resolve();\n }, time);\n signal.addEventListener('abort', abortListener, { once: true });\n } else {\n setTimeout(resolve, time);\n }\n });\n\n/\n Creates a promise that resolves after the specified number of milliseconds.\n \n @deprecated Use `sleep` instead.\n * @param ms Delay in milliseconds.\n * @returns Promise\n /\nexport const waitAsync = async (ms = 1000) =>\n new Promise((resolve) => setTimeout(resolve, ms));\n\n/\n Runs a loop driven by `requestAnimationFrame`: on each frame, `quitFunction` is called first.\n * If it returns a truthy value, the loop stops and no further frames are scheduled.\n * If it returns falsy or nothing, the next frame is scheduled recursively.\n \n Use this for per-frame work (animations, layout reads after paint) without managing\n * `cancelAnimationFrame` manually — returning `true` from `quitFunction` is the exit condition.\n \n When `asMicrotask` is `true`, scheduling the next RAF is deferred with `queueMicrotask`\n * so other microtasks can run before the frame is requested (useful when you need to\n * batch DOM updates or let reactive frameworks flush first).\n \n @param quitFunction - Invoked each animation frame. Return `true` to stop the loop.\n * @param asMicrotask - If `true`, wrap the `requestAnimationFrame` call in `queueMicrotask`.\n \n @example\n * Stop after 60 frames (~1s at 60Hz):\n * ```ts\n * let frames = 0;\n * endlessRAF(() => {\n * frames++;\n * updateSomething(frames);\n * return frames >= 60;\n * });\n * ```\n \n @example\n * Run until an element is removed or a flag is set:\n * ```ts\n * let running = true;\n * endlessRAF(() => {\n * if (!running \|\| !document.body.contains(el)) return true;\n * draw(el);\n * }, true);\n * ```\n /\nexport const endlessRAF = (\n quitFunction: () => boolean \| void,\n asMicrotask?: boolean,\n) => {\n if (quitFunction()) return;\n\n const raf = () =>\n requestAnimationFrame(() => endlessRAF(quitFunction, asMicrotask));\n\n if (asMicrotask) {\n queueMicrotask(raf);\n } else {\n raf();\n }\n};\n\n/\n Like `setTimeout`, but if `signal` aborts before the delay fires, the timer is cleared\n * and `callback` is never run. If the callback runs normally, the abort listener is removed.\n \n Does nothing special if `signal` is omitted — behaves like a plain timeout.\n \n @param callback - Function to run once after `delayInMs` (same as `setTimeout` callback).\n * @param delayInMs - Milliseconds to wait. Passed through to `setTimeout` (browser/Node semantics apply).\n * @param signal - When aborted, clears the pending timeout so `callback` is not invoked.\n \n @example\n * ```ts\n * const controller = new AbortController();\n * setAbortableTimeout(() => console.log('done'), 500, controller.signal);\n * // later: controller.abort(); // timeout cancelled, log never runs\n * ```\n \n @example\n * Zero-delay scheduling that can still be cancelled before the macrotask runs:\n * ```ts\n * const ac = new AbortController();\n * setAbortableTimeout(() => startIntro(), 0, ac.signal);\n * // e.g. on teardown: ac.abort();\n * ```\n /\nexport function setAbortableTimeout(\n callback: VoidFunction,\n delayInMs?: number,\n signal?: AbortSignal,\n) {\n let internalTimer: number \| null = null;\n\n const handleAbort = () => {\n if (internalTimer == null) {\n return;\n }\n clearTimeout(internalTimer);\n internalTimer = null;\n };\n\n signal?.addEventListener('abort', handleAbort, { once: true });\n\n internalTimer = setTimeout(() => {\n signal?.removeEventListener('abort', handleAbort);\n callback();\n }, delayInMs);\n}\n\n/\n Like `setInterval`, but when `signal` aborts, the interval is cleared with `clearInterval`\n * and `callback` stops being called. If `signal` is omitted, behaves like a normal interval\n * (you must clear it yourself).\n \n @param callback - Invoked every `delayInMs` milliseconds until aborted or cleared.\n * @param delayInMs - Interval period in milliseconds (same as `setInterval`).\n * @param signal - Aborting stops the interval and removes the abort listener path from keeping work alive.\n \n @example\n * ```ts\n * const controller = new AbortController();\n * setAbortableInterval(() => console.log('tick'), 1000, controller.signal);\n * // stop: controller.abort();\n * ```\n \n @example\n * ```ts\n * const ac = new AbortController();\n * setAbortableInterval(syncStatus, 30_000, ac.signal);\n * window.addEventListener('beforeunload', () => ac.abort());\n * ```\n /\nexport function setAbortableInterval(\n callback: VoidFunction,\n delayInMs?: number,\n signal?: AbortSignal,\n) {\n let timer: number \| null = null;\n\n const handleAbort = () => {\n if (timer == null) {\n return;\n }\n clearInterval(timer);\n timer = null;\n };\n\n signal?.addEventListener('abort', handleAbort, { once: true });\n\n timer = setInterval(callback, delayInMs);\n}\n\n/\n A single interpolated segment in {@link asyncTemplate}.\n \n - Primitives use `String(value)` for output, except that values matching\n * `value === null \|\| value === undefined \|\| value === false` yield no text (early return in `processTemplatePiece`).\n * Other falsy values such as `0` or `''` are still stringified.\n * - Arrays are flattened recursively in order.\n * - Promises are awaited; the resolved value is processed the same way.\n * - Async iterables of strings are streamed in order (`yield`).\n - Functions (thunks): if the piece is a function, it is invoked with no arguments (`piece()`), and the return\n * value is processed recursively—so you can defer work or return any other {@link AsyncTemplatePiece} shape\n * (see {@link MaybeFn}). At runtime a thunk may also return a `Promise` of a piece; that is covered by\n * {@link MaybePromise} on each template interpolation.\n /\nexport type AsyncTemplatePiece = MaybeFn<\n Primitive \| void \| AsyncIterable<string> \| AsyncTemplatePiece[]\n>;\n\n/\n Tagged template that builds an async iterable of string chunks (like a streaming template engine).\n \n Static template parts are yielded as-is. Each interpolated “piece” can be a primitive, a nested array of pieces,\n * a `Promise` of a piece, an async iterable of strings (e.g. another template or a line-by-line source), or a\n * zero-arg function whose result is processed the same way (see {@link AsyncTemplatePiece} / `MaybeFn`).\n \n Interpolation handling matches `processTemplatePiece`: `null`, `undefined`, and `false` add nothing; any other value\n * becomes text via `String(...)`; functions are called once with no arguments before further processing. Collect chunks\n * with `for await...of` or utilities like `Array.fromAsync` where available.\n \n @param strings - Cooked template segments from the tag (`strings[0]`, `strings[1]`, …).\n * @param pieces - Values between segments (`pieces[i]` sits between `strings[i]` and `strings[i + 1]`).\n * @returns An async generator yielding string fragments in document order.\n \n @example\n * Plain values and promises:\n * ```ts\n * const gen = asyncTemplate`Hello, ${'world'}! Status: ${Promise.resolve(200)}`;\n * let out = '';\n * for await (const chunk of gen) out += chunk;\n * // out === 'Hello, world! Status: 200'\n * ```\n \n @example\n * Falsy pieces are omitted (`null`, `undefined`, `false`); arrays flatten recursively:\n * ```ts\n * const gen = asyncTemplate`${null}${false}A${['B', ['C']]}`;\n * const out = await Array.fromAsync(gen).then((parts) => parts.join(''));\n * // out === 'ABC'\n * ```\n \n @example\n * Stream from an async iterable (e.g. chunked upstream text):\n * ```ts\n * async function* lines() {\n * yield 'line1\\n';\n * yield 'line2\\n';\n * }\n * const gen = asyncTemplate`Header\\n${lines()}Footer`;\n * ```\n \n @example\n * Lazy piece via a thunk (invoked as `piece()`):\n * ```ts\n * let n = 0;\n * const gen = asyncTemplate`count=${() => ++n}`;\n * // first consumption yields \"count=1\", etc.\n * ```\n /\nexport async function asyncTemplate(\n strings: TemplateStringsArray,\n ...pieces: MaybePromise<AsyncTemplatePiece>[]\n) {\n for (let i = 0; i < strings.length; i++) {\n yield strings[i];\n\n if (i < pieces.length) {\n const piece = pieces[i];\n yield* processTemplatePiece(piece);\n }\n }\n}\n\n/*\n Resolves a template piece into yielded string chunks.\n \n Skips output when `value === null \|\| value === undefined \|\| value === false`.\n * Otherwise awaits promises, flattens arrays, streams async iterables, invokes functions with no arguments and\n * recurses on the return value, and uses `String(value)` for primitives.\n /\nasync function processTemplatePiece(\n piece: MaybePromise<AsyncTemplatePiece>,\n): AsyncGenerator<string, void, unknown> {\n if (piece === null \|\| piece === undefined \|\| piece === false) {\n return;\n }\n\n if (piece instanceof Promise) {\n const resolved = await piece;\n yield* processTemplatePiece(resolved);\n return;\n }\n\n if (Array.isArray(piece)) {\n for (const item of piece) {\n yield* processTemplatePiece(item);\n }\n return;\n }\n\n if (\n typeof piece === 'object' &&\n typeof piece[Symbol.asyncIterator] === 'function'\n ) {\n yield* piece;\n return;\n }\n\n if (typeof piece === 'function') {\n yield* processTemplatePiece(piece());\n return;\n }\n\n yield String(piece);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,IAAa,SAAS,OAAe,GAAG,WACtC,IAAI,SAAe,SAAS,WAAW;AACrC,KAAI,QAAQ;EACV,MAAM,sBAAsB;AAC1B,gBAAa,QAAQ;AACrB,UAAO,QAAQ,OAAO;;EAExB,MAAM,UAAU,iBAAiB;AAC/B,UAAO,oBAAoB,SAAS,cAAc;AAClD,YAAS;KACR,KAAK;AACR,SAAO,iBAAiB,SAAS,eAAe,EAAE,MAAM,MAAM,CAAC;OAE/D,YAAW,SAAS,KAAK;EAE3B;;;;;;;;AASJ,IAAa,YAAY,OAAO,KAAK,QACnC,IAAI,SAAS,YAAY,WAAW,SAAS,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCnD,IAAa,cACX,cACA,gBACG;AACH,KAAI,cAAc,CAAE;CAEpB,MAAM,YACJ,4BAA4B,WAAW,cAAc,YAAY,CAAC;AAEpE,KAAI,YACF,gBAAe,IAAI;KAEnB,MAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BT,SAAgB,oBACd,UACA,WACA,QACA;CACA,IAAI,gBAA+B;CAEnC,MAAM,oBAAoB;AACxB,MAAI,iBAAiB,KACnB;AAEF,eAAa,cAAc;AAC3B,kBAAgB;;AAGlB,SAAQ,iBAAiB,SAAS,aAAa,EAAE,MAAM,MAAM,CAAC;AAE9D,iBAAgB,iBAAiB;AAC/B,UAAQ,oBAAoB,SAAS,YAAY;AACjD,YAAU;IACT,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;AA0Bf,SAAgB,qBACd,UACA,WACA,QACA;CACA,IAAI,QAAuB;CAE3B,MAAM,oBAAoB;AACxB,MAAI,SAAS,KACX;AAEF,gBAAc,MAAM;AACpB,UAAQ;;AAGV,SAAQ,iBAAiB,SAAS,aAAa,EAAE,MAAM,MAAM,CAAC;AAE9D,SAAQ,YAAY,UAAU,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuE1C,gBAAuB,cACrB,SACA,GAAG,QACH;AACA,MAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AACvC,QAAM,QAAQ;AAEd,MAAI,IAAI,OAAO,QAAQ;GACrB,MAAM,QAAQ,OAAO;AACrB,UAAO,qBAAqB,MAAM;;;;;;;;;;;AAYxC,gBAAgB,qBACd,OACuC;AACvC,KAAI,UAAU,QAAQ,UAAU,KAAA,KAAa,UAAU,MACrD;AAGF,KAAI,iBAAiB,SAAS;AAE5B,SAAO,qBADU,MAAM,MACc;AACrC;;AAGF,KAAI,MAAM,QAAQ,MAAM,EAAE;AACxB,OAAK,MAAM,QAAQ,MACjB,QAAO,qBAAqB,KAAK;AAEnC;;AAGF,KACE,OAAO,UAAU,YACjB,OAAO,MAAM,OAAO,mBAAmB,YACvC;AACA,SAAO;AACP;;AAGF,KAAI,OAAO,UAAU,YAAY;AAC/B,SAAO,qBAAqB,OAAO,CAAC;AACpC;;AAGF,OAAM,OAAO,MAAM"}
1	+ {"version":3,"file":"async.js","names":[],"sources":["../src/async.ts"],"sourcesContent":["/*\n ---header-docs-section---\n * # yummies/async\n \n ## Description\n \n Helpers for asynchronous control flow: delays, cancellable waits, scheduling on the next frame,\n * and small utilities around `requestAnimationFrame` and `queueMicrotask`. They complement native\n * `Promise`/`AbortSignal` patterns and keep timing logic easy to test and tree-shake per call site.\n * Import only what you need from `yummies/async` so bundlers can drop unused helpers.\n \n ## Usage\n \n ```ts\n * import { sleep } from \"yummies/async\";\n * ```\n /\n\nimport type { MaybeFn, MaybePromise, Primitive } from './types.js';\n\n/\n Returns a promise that resolves after `time` milliseconds.\n \n When `signal` is passed and becomes aborted before the delay elapses, the promise\n * rejects with `signal.reason` (same as native `fetch` / `AbortController` usage).\n * The timeout is cleared on abort so no resolve happens after cancellation.\n \n @param time - Delay in milliseconds. Defaults to `0` (next macrotask tick, same idea as `setTimeout(0)`).\n * @param signal - Optional `AbortSignal` to cancel the wait early.\n * @returns A promise that resolves with `void` when the delay completes, or rejects if aborted.\n \n @example\n * Basic pause in an async function:\n * ```ts\n * await sleep(250);\n * console.log('after 250ms');\n * ```\n \n @example\n * Cancellable delay tied to component unmount or user action:\n * ```ts\n * const ac = new AbortController();\n * try {\n * await sleep(5000, ac.signal);\n * } catch (e) {\n * // aborted — e is signal.reason\n * }\n * ac.abort('user cancelled');\n * ```\n /\nexport const sleep = (time: number = 0, signal?: AbortSignal) =>\n new Promise<void>((resolve, reject) => {\n if (signal) {\n const abortListener = () => {\n clearTimeout(timerId);\n reject(signal?.reason);\n };\n const timerId = setTimeout(() => {\n signal.removeEventListener('abort', abortListener);\n resolve();\n }, time);\n signal.addEventListener('abort', abortListener, { once: true });\n } else {\n setTimeout(resolve, time);\n }\n });\n\n/\n Creates a promise that resolves after the specified number of milliseconds.\n \n @deprecated Use `sleep` instead.\n * @param ms Delay in milliseconds.\n * @returns Promise\n /\nexport const waitAsync = async (ms = 1000) =>\n new Promise((resolve) => setTimeout(resolve, ms));\n\n/\n Runs a loop driven by `requestAnimationFrame`: on each frame, `quitFunction` is called first.\n * If it returns a truthy value, the loop stops and no further frames are scheduled.\n * If it returns falsy or nothing, the next frame is scheduled recursively.\n \n Use this for per-frame work (animations, layout reads after paint) without managing\n * `cancelAnimationFrame` manually — returning `true` from `quitFunction` is the exit condition.\n \n When `asMicrotask` is `true`, scheduling the next RAF is deferred with `queueMicrotask`\n * so other microtasks can run before the frame is requested (useful when you need to\n * batch DOM updates or let reactive frameworks flush first).\n \n @param quitFunction - Invoked each animation frame. Return `true` to stop the loop.\n * @param asMicrotask - If `true`, wrap the `requestAnimationFrame` call in `queueMicrotask`.\n \n @example\n * Stop after 60 frames (~1s at 60Hz):\n * ```ts\n * let frames = 0;\n * endlessRAF(() => {\n * frames++;\n * updateSomething(frames);\n * return frames >= 60;\n * });\n * ```\n \n @example\n * Run until an element is removed or a flag is set:\n * ```ts\n * let running = true;\n * endlessRAF(() => {\n * if (!running \|\| !document.body.contains(el)) return true;\n * draw(el);\n * }, true);\n * ```\n /\nexport const endlessRAF = (\n quitFunction: () => boolean \| void,\n asMicrotask?: boolean,\n) => {\n if (quitFunction()) return;\n\n const raf = () =>\n requestAnimationFrame(() => endlessRAF(quitFunction, asMicrotask));\n\n if (asMicrotask) {\n queueMicrotask(raf);\n } else {\n raf();\n }\n};\n\n/\n Like `setTimeout`, but if `signal` aborts before the delay fires, the timer is cleared\n * and `callback` is never run. If the callback runs normally, the abort listener is removed.\n \n Does nothing special if `signal` is omitted — behaves like a plain timeout.\n \n @param callback - Function to run once after `delayInMs` (same as `setTimeout` callback).\n * @param delayInMs - Milliseconds to wait. Passed through to `setTimeout` (browser/Node semantics apply).\n * @param signal - When aborted, clears the pending timeout so `callback` is not invoked.\n \n @example\n * ```ts\n * const controller = new AbortController();\n * setAbortableTimeout(() => console.log('done'), 500, controller.signal);\n * // later: controller.abort(); // timeout cancelled, log never runs\n * ```\n \n @example\n * Zero-delay scheduling that can still be cancelled before the macrotask runs:\n * ```ts\n * const ac = new AbortController();\n * setAbortableTimeout(() => startIntro(), 0, ac.signal);\n * // e.g. on teardown: ac.abort();\n * ```\n /\nexport function setAbortableTimeout(\n callback: VoidFunction,\n delayInMs?: number,\n signal?: AbortSignal,\n) {\n let internalTimer: number \| null = null;\n\n const handleAbort = () => {\n if (internalTimer == null) {\n return;\n }\n clearTimeout(internalTimer);\n internalTimer = null;\n };\n\n signal?.addEventListener('abort', handleAbort, { once: true });\n\n internalTimer = setTimeout(() => {\n signal?.removeEventListener('abort', handleAbort);\n callback();\n }, delayInMs);\n}\n\n/\n Like `setInterval`, but when `signal` aborts, the interval is cleared with `clearInterval`\n * and `callback` stops being called. If `signal` is omitted, behaves like a normal interval\n * (you must clear it yourself).\n \n @param callback - Invoked every `delayInMs` milliseconds until aborted or cleared.\n * @param delayInMs - Interval period in milliseconds (same as `setInterval`).\n * @param signal - Aborting stops the interval and removes the abort listener path from keeping work alive.\n \n @example\n * ```ts\n * const controller = new AbortController();\n * setAbortableInterval(() => console.log('tick'), 1000, controller.signal);\n * // stop: controller.abort();\n * ```\n \n @example\n * ```ts\n * const ac = new AbortController();\n * setAbortableInterval(syncStatus, 30_000, ac.signal);\n * window.addEventListener('beforeunload', () => ac.abort());\n * ```\n /\nexport function setAbortableInterval(\n callback: VoidFunction,\n delayInMs?: number,\n signal?: AbortSignal,\n) {\n let timer: number \| null = null;\n\n const handleAbort = () => {\n if (timer == null) {\n return;\n }\n clearInterval(timer);\n timer = null;\n };\n\n signal?.addEventListener('abort', handleAbort, { once: true });\n\n timer = setInterval(callback, delayInMs);\n}\n\n/\n A single interpolated segment in {@link asyncTemplate}.\n \n - Primitives use `String(value)` for output, except that values matching\n * `value === null \|\| value === undefined \|\| value === false` yield no text (early return in `processTemplatePiece`).\n * Other falsy values such as `0` or `''` are still stringified.\n * - Arrays are flattened recursively in order.\n * - Promises are awaited; the resolved value is processed the same way.\n * - Async iterables of primitives are streamed in order; each yielded value uses the same rules\n * as a standalone primitive (`String(...)`, with `null` / `undefined` / `false` omitted).\n * - Functions (thunks): if the piece is a function, it is invoked with no arguments (`piece()`), and the return\n * value is processed recursively—so you can defer work or return any other {@link AsyncTemplatePiece} shape\n * (see {@link MaybeFn}). At runtime a thunk may also return a `Promise` of a piece; that is covered by\n * {@link MaybePromise} on each template interpolation.\n /\nexport type AsyncTemplatePiece = MaybeFn<\n \| Primitive\n \| void\n \| AsyncIterable<Primitive>\n \| Promise<Primitive>\n \| AsyncTemplatePiece[]\n>;\n\n/\n Tagged template that builds an async iterable of string chunks (like a streaming template engine).\n \n Static template parts are yielded as-is. Each interpolated “piece” can be a primitive, a nested array of pieces,\n * a `Promise` of a piece (including a resolved primitive), an async iterable of primitives, or a\n * zero-arg function whose result is processed the same way (see {@link AsyncTemplatePiece} / `MaybeFn`).\n \n Interpolation handling matches `processTemplatePiece`: `null`, `undefined`, and `false` add nothing; any other value\n * becomes text via `String(...)`; functions are called once with no arguments before further processing. Collect chunks\n * with `for await...of` or utilities like `Array.fromAsync` where available.\n \n @param strings - Cooked template segments from the tag (`strings[0]`, `strings[1]`, …).\n * @param pieces - Values between segments (`pieces[i]` sits between `strings[i]` and `strings[i + 1]`).\n * @returns An async generator yielding string fragments in document order.\n \n @example\n * Plain values and promises:\n * ```ts\n * const gen = asyncTemplate`Hello, ${'world'}! Status: ${Promise.resolve(200)}`;\n * let out = '';\n * for await (const chunk of gen) out += chunk;\n * // out === 'Hello, world! Status: 200'\n * ```\n \n @example\n * Falsy pieces are omitted (`null`, `undefined`, `false`); arrays flatten recursively:\n * ```ts\n * const gen = asyncTemplate`${null}${false}A${['B', ['C']]}`;\n * const out = await Array.fromAsync(gen).then((parts) => parts.join(''));\n * // out === 'ABC'\n * ```\n \n @example\n * Stream from an async iterable (e.g. chunked upstream text):\n * ```ts\n * async function* lines() {\n * yield 'line1\\n';\n * yield 'line2\\n';\n * }\n * const gen = asyncTemplate`Header\\n${lines()}Footer`;\n * ```\n \n @example\n * Lazy piece via a thunk (invoked as `piece()`):\n * ```ts\n * let n = 0;\n * const gen = asyncTemplate`count=${() => ++n}`;\n * // first consumption yields \"count=1\", etc.\n * ```\n /\nexport async function asyncTemplate(\n strings: TemplateStringsArray,\n ...pieces: MaybePromise<AsyncTemplatePiece>[]\n) {\n for (let i = 0; i < strings.length; i++) {\n yield strings[i];\n\n if (i < pieces.length) {\n const piece = pieces[i];\n yield* processTemplatePiece(piece);\n }\n }\n}\n\n/*\n Resolves a template piece into yielded string chunks.\n \n Skips output when `value === null \|\| value === undefined \|\| value === false`.\n * Otherwise awaits promises, flattens arrays, streams async iterables, invokes functions with no arguments and\n * recurses on the return value, and uses `String(value)` for primitives.\n /\nasync function processTemplatePiece(\n piece: MaybePromise<AsyncTemplatePiece>,\n): AsyncGenerator<string, void, unknown> {\n if (piece === null \|\| piece === undefined \|\| piece === false) {\n return;\n }\n\n if (piece instanceof Promise) {\n const resolved = await piece;\n yield* processTemplatePiece(resolved);\n return;\n }\n\n if (Array.isArray(piece)) {\n for (const item of piece) {\n yield* processTemplatePiece(item);\n }\n return;\n }\n\n if (\n typeof piece === 'object' &&\n piece !== null &&\n typeof (piece as AsyncIterable<unknown>)[Symbol.asyncIterator] ===\n 'function'\n ) {\n for await (const item of piece as AsyncIterable<AsyncTemplatePiece>) {\n yield* processTemplatePiece(item);\n }\n return;\n }\n\n if (typeof piece === 'function') {\n yield* processTemplatePiece(piece());\n return;\n }\n\n yield String(piece);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,IAAa,SAAS,OAAe,GAAG,WACtC,IAAI,SAAe,SAAS,WAAW;AACrC,KAAI,QAAQ;EACV,MAAM,sBAAsB;AAC1B,gBAAa,QAAQ;AACrB,UAAO,QAAQ,OAAO;;EAExB,MAAM,UAAU,iBAAiB;AAC/B,UAAO,oBAAoB,SAAS,cAAc;AAClD,YAAS;KACR,KAAK;AACR,SAAO,iBAAiB,SAAS,eAAe,EAAE,MAAM,MAAM,CAAC;OAE/D,YAAW,SAAS,KAAK;EAE3B;;;;;;;;AASJ,IAAa,YAAY,OAAO,KAAK,QACnC,IAAI,SAAS,YAAY,WAAW,SAAS,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCnD,IAAa,cACX,cACA,gBACG;AACH,KAAI,cAAc,CAAE;CAEpB,MAAM,YACJ,4BAA4B,WAAW,cAAc,YAAY,CAAC;AAEpE,KAAI,YACF,gBAAe,IAAI;KAEnB,MAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BT,SAAgB,oBACd,UACA,WACA,QACA;CACA,IAAI,gBAA+B;CAEnC,MAAM,oBAAoB;AACxB,MAAI,iBAAiB,KACnB;AAEF,eAAa,cAAc;AAC3B,kBAAgB;;AAGlB,SAAQ,iBAAiB,SAAS,aAAa,EAAE,MAAM,MAAM,CAAC;AAE9D,iBAAgB,iBAAiB;AAC/B,UAAQ,oBAAoB,SAAS,YAAY;AACjD,YAAU;IACT,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;AA0Bf,SAAgB,qBACd,UACA,WACA,QACA;CACA,IAAI,QAAuB;CAE3B,MAAM,oBAAoB;AACxB,MAAI,SAAS,KACX;AAEF,gBAAc,MAAM;AACpB,UAAQ;;AAGV,SAAQ,iBAAiB,SAAS,aAAa,EAAE,MAAM,MAAM,CAAC;AAE9D,SAAQ,YAAY,UAAU,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4E1C,gBAAuB,cACrB,SACA,GAAG,QACH;AACA,MAAK,IAAI,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AACvC,QAAM,QAAQ;AAEd,MAAI,IAAI,OAAO,QAAQ;GACrB,MAAM,QAAQ,OAAO;AACrB,UAAO,qBAAqB,MAAM;;;;;;;;;;;AAYxC,gBAAgB,qBACd,OACuC;AACvC,KAAI,UAAU,QAAQ,UAAU,KAAA,KAAa,UAAU,MACrD;AAGF,KAAI,iBAAiB,SAAS;AAE5B,SAAO,qBADU,MAAM,MACc;AACrC;;AAGF,KAAI,MAAM,QAAQ,MAAM,EAAE;AACxB,OAAK,MAAM,QAAQ,MACjB,QAAO,qBAAqB,KAAK;AAEnC;;AAGF,KACE,OAAO,UAAU,YACjB,UAAU,QACV,OAAQ,MAAiC,OAAO,mBAC9C,YACF;AACA,aAAW,MAAM,QAAQ,MACvB,QAAO,qBAAqB,KAAK;AAEnC;;AAGF,KAAI,OAAO,UAAU,YAAY;AAC/B,SAAO,qBAAqB,OAAO,CAAC;AACpC;;AAGF,OAAM,OAAO,MAAM"}

package/css.cjs CHANGED Viewed

@@ -28,6 +28,8 @@ let tailwind_merge = require("tailwind-merge");
 * should scale with root font size (accessibility, user zoom). `remValue` is the assumed
 * `1rem` size in px (browser default is typically `16`).
 *
+* Also you can override default rem value using `toRem.defaultRemValue = 24`
+*
 * @param px - Pixel value to convert (not rounded; stringification keeps full float).
 * @param remValue - How many pixels one `rem` equals. Defaults to `16`.
 * @returns A string like `"1.5rem"` suitable for `style` or CSS-in-JS.
@@ -43,7 +45,8 @@ let tailwind_merge = require("tailwind-merge");
 * const gap = toRem(20, 10); // '2rem'
 * ```
 */
-var toRem = (px, remValue = 16) => `${px / remValue}rem`;
+var toRem = (px, remValue) => `${px / (remValue ?? toRem.defaultRemValue)}rem`;
+toRem.defaultRemValue = 16;
 /**
 * Composes conditional class names like {@link https://github.com/lukeed/clsx | clsx}, then runs
 * the result through {@link https://github.com/dcastil/tailwind-merge | tailwind-merge} so

package/css.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"css.cjs","names":[],"sources":["../src/css.ts"],"sourcesContent":["/*\n ---header-docs-section---\n * # yummies/css\n \n ## Description\n \n Styling utilities for React and plain DOM: `rem` conversion, `clsx` + `tailwind-merge` via `cx`,\n * and a `cva` bridge for variant-driven class names. The goal is predictable class strings without\n * Tailwind conflicts and with less boilerplate than concatenating strings by hand across components.\n \n ## Usage\n \n ```ts\n * import { cx, toRem } from \"yummies/css\";\n * ```\n /\n\nimport { cva as cvaLib } from 'class-variance-authority';\nimport clsx, ~~{ type ClassValue }~~ from 'clsx';\nimport { twMerge } from 'tailwind-merge';\nimport type { Maybe } from 'yummies/types';\n~~\ntype ClassProp = {\n class?: ClassValue;\n className?: ClassValue;\n};\n\ntype StringToBoolean<T> = T extends 'true' \| 'false' ? boolean : T;\n\n~~/\n Converts a length in pixels to a CSS `rem` string (`\"<number>rem\"`).\n \n Use when authoring component styles in JS/TS where design tokens are in px but the stylesheet\n * should scale with root font size (accessibility, user zoom). `remValue` is the assumed\n * `1rem` size in px (browser default is typically `16`).\n \n @param px - Pixel value to convert (not rounded; stringification keeps full float).\n * @param remValue - How many pixels one `rem` equals. Defaults to `16`.\n * @returns A string like `\"1.5rem\"` suitable for `style` or CSS-in-JS.\n \n @example\n * ```ts\n * const width = toRem(24); // '1.5rem' with default 16px root\n * ```\n \n @example\n * ```ts\n * // Custom root / design system where 1rem === 10px\n * const gap = toRem(20, 10); // '2rem'\n * ```\n /\nexport const toRem = (px: number, remValue ~~= 16~~) => `${px / remValue}rem`;\n\n/\n Composes conditional class names like {@link https://github.com/lukeed/clsx \| clsx}, then runs\n * the result through {@link https://github.com/dcastil/tailwind-merge \| tailwind-merge} so\n * conflicting Tailwind utilities collapse to the last/intended one (e.g. two `padding-x` classes).\n \n Accepts the same argument shapes as `clsx`: strings, objects, arrays, falsy values to omit.\n \n @param args - Same as `clsx(...args)` — `ClassValue` rest parameters.\n * @returns A single merged class string, safe for `className` on DOM/React.\n \n @example\n * ```ts\n * cx('px-2 py-1 text-sm', 'px-4'); // 'py-1 text-sm px-4' — padding-x merged\n * ```\n \n @example\n * ```ts\n * cx('btn', { 'btn--active': isActive, 'btn--disabled': disabled }, className);\n * ```\n /\nexport const cx = (...args: Parameters<typeof clsx>) => twMerge(clsx(...args));\n\~~ntype ConfigSchema = Record<string, Record<string, ClassValue>>;\ntype ConfigVariants<T extends ConfigSchema> = {\~~n [Variant in keyof T]?: StringToBoolean<keyof T[Variant]> \| null \| undefined;\n};\ntype ConfigVariantsMulti<T extends ConfigSchema> = {\n [Variant in keyof T]?:\n \| StringToBoolean<keyof T[Variant]>\n \| StringToBoolean<keyof T[Variant]>[]\n \| undefined;\n};\ntype Config<T> = T extends ConfigSchema\n ? {\n variants?: T;\n defaultVariants?: ConfigVariants<T>;\n compoundVariants?: (T extends ConfigSchema\n ? (ConfigVariants<T> \| ConfigVariantsMulti<T>) & ClassProp\n : ClassProp)[];\n }\n : never;\n\ntype Props<T> = T extends ConfigSchema\n ? ConfigVariants<T> & ClassProp\n : ClassProp;\n\n/\n {@link https://cva.style/docs \| Class Variance Authority (cva)} with the same tailwind-merge\n * pass as {@link cx}: the class string produced by the variant function is merged so Tailwind\n * conflicts resolve predictably.\n \n API matches `cva` from `class-variance-authority`: optional `base` classes, `config` with\n * `variants`, `defaultVariants`, and `compoundVariants`. The returned function accepts variant\n * props plus optional `class` / `className` for one-off overrides.\n \n Use {@link VariantProps} with `typeof buttonVariants` (or similar) to type component props.\n \n @param base - Base `ClassValue`(s) always applied.\n * @param config - Variant schema and defaults (same shape as upstream `cva`).\n * @returns A function `(props?) => string` that resolves variant classes, merged with tw-merge.\n \n @example\n * ```ts\n * const button = cva('rounded font-medium', {\n * variants: {\n * tone: { primary: 'bg-blue-600 text-white', ghost: 'bg-transparent' },\n * size: { sm: 'text-sm px-2', md: 'text-base px-4' },\n * },\n * defaultVariants: { tone: 'primary', size: 'md' },\n * });\n * button({ tone: 'ghost', className: 'ml-2' });\n * ```\n \n @example\n * ```ts\n * const card = cva('border p-4', {\n * variants: { elevated: { true: 'shadow-lg', false: 'shadow-none' } },\n * defaultVariants: { elevated: false },\n * });\n * card({ elevated: true });\n * ```\n /\nexport const cva = ((...args: any[]) => {\n const schema = cvaLib(...args);\n return (...inputArgs: any[]) => twMerge(schema(...inputArgs));\n}) as ~~any~~ as ~~<T>(\n base?:~~ ~~ClassValue,\n config?: Config<T>,\n) => (props?: Props<T>) => string~~;\n\n/\n Utility type from `class-variance-authority`: infers the variant prop object from a `cva` instance.\n * Use it to type React (or other) components that forward variant props.\n \n @example\n * ```ts\n * const input = cva('border', { variants: { size: { sm: 'h-8', lg: 'h-12' } } });\n * type InputVariants = VariantProps<typeof input>;\n * // { size?: 'sm' \| 'lg' \| null }\n * ```\n /\nexport type { VariantProps } from 'class-variance-authority';\n\n/\n Re-export from `clsx`: a class name fragment — string, number, nested arrays, object map of\n * flags, or falsy nodes to skip. Used by {@link cx}, {@link cva}, and typical `className` helpers.\n \n @example\n * ```ts\n * const value: ClassValue = ['btn', false && 'hidden', { active: true }];\n * ```\n /\nexport type { ClassValue } from 'clsx';\n\n/\n Injects a stylesheet by appending a `<link rel=\"stylesheet\">` to `document.head`.\n * Resolves when the sheet fires `load`; rejects on `error` (e.g. 404 or network failure).\n \n Id replacement: if `attrubutes.id` is set, any existing element with that `id` is removed\n * first, so repeated calls with the same `id` replace the previous link (useful for theme or\n * font URLs that change).\n \n If `rel` is omitted in `attrubutes`, it defaults to `stylesheet`. Other attributes (`crossorigin`,\n * `media`, `data-`, etc.) are set via `setAttribute` from the record entries.\n \n * @param url - Stylesheet URL (`href`).\n * @param attrubutes - Optional HTML attributes for the `<link>` element (see `id` / `rel` behavior above).\n * @returns Promise that resolves to `undefined` on load, or rejects on load error.\n \n @example\n * ```ts\n * await loadCssFile('https://example.com/fonts.css', {\n * id: 'app-fonts',\n * crossOrigin: 'anonymous',\n * });\n * ```\n \n @example\n * ```ts\n * // Swap theme stylesheet without duplicate link tags\n * await loadCssFile('/themes/dark.css', { id: 'theme' });\n * await loadCssFile('/themes/light.css', { id: 'theme' });\n * ```\n */\nexport const loadCssFile = (url: string, attrubutes?: Record<string, any>) =>\n new Promise((resolve, reject) => {\n let link: Maybe<HTMLLinkElement>;\n\n if (attrubutes?.id) {\n link = document.getElementById(attrubutes.id) as HTMLLinkElement \| null;\n\n if (link) {\n link.remove();\n }\n }\n\n link = document.createElement('link');\n\n const handleLoad = () => {\n resolve(undefined);\n link!.removeEventListener('load', handleLoad);\n link!.removeEventListener('error', handleError);\n };\n\n const handleError = () => {\n reject(undefined);\n link!.removeEventListener('load', handleLoad);\n link!.removeEventListener('error', handleError);\n };\n\n link.addEventListener('load', handleLoad);\n link.addEventListener('error', handleError);\n\n link.setAttribute('href', url);\n\n if (!attrubutes?.rel) {\n link.setAttribute('rel', 'stylesheet');\n }\n\n Object.entries(attrubutes \|\| {}).forEach(([key, value]) => {\n link.setAttribute(key, value);\n });\n\n document.head.appendChild(link);\n });\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA~~,IAAa,SAAS,IAAY,~~WAAW~~,~~OAAO,~~GAAG,~~KAAK~~,~~SAAS~~;;;;;;;;;;;;;;;;;;;;;~~AAsBrE~~,IAAa,MAAM,GAAG,UAAA,GAAA,eAAA,UAAA,GAAA,KAAA,SAA+C,GAAG,KAAK,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AA8D9E~~,IAAa,QAAQ,GAAG,SAAgB;CACtC,MAAM,UAAA,GAAA,yBAAA,KAAgB,GAAG,KAAK;AAC9B,SAAQ,GAAG,eAAA,GAAA,eAAA,SAA6B,OAAO,GAAG,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AA4D~~/D,IAAa,eAAe,KAAa,eACvC,IAAI,SAAS,SAAS,WAAW;CAC/B,IAAI;AAEJ,KAAI,YAAY,IAAI;AAClB,SAAO,SAAS,eAAe,WAAW,GAAG;AAE7C,MAAI,KACF,MAAK,QAAQ;;AAIjB,QAAO,SAAS,cAAc,OAAO;CAErC,MAAM,mBAAmB;AACvB,UAAQ,KAAA,EAAU;AAClB,OAAM,oBAAoB,QAAQ,WAAW;AAC7C,OAAM,oBAAoB,SAAS,YAAY;;CAGjD,MAAM,oBAAoB;AACxB,SAAO,KAAA,EAAU;AACjB,OAAM,oBAAoB,QAAQ,WAAW;AAC7C,OAAM,oBAAoB,SAAS,YAAY;;AAGjD,MAAK,iBAAiB,QAAQ,WAAW;AACzC,MAAK,iBAAiB,SAAS,YAAY;AAE3C,MAAK,aAAa,QAAQ,IAAI;AAE9B,KAAI,CAAC,YAAY,IACf,MAAK,aAAa,OAAO,aAAa;AAGxC,QAAO,QAAQ,cAAc,EAAE,CAAC,CAAC,SAAS,CAAC,KAAK,WAAW;AACzD,OAAK,aAAa,KAAK,MAAM;GAC7B;AAEF,UAAS,KAAK,YAAY,KAAK;EAC/B"}
1	+ {"version":3,"file":"css.cjs","names":[],"sources":["../src/css.ts"],"sourcesContent":["/*\n ---header-docs-section---\n * # yummies/css\n \n ## Description\n \n Styling utilities for React and plain DOM: `rem` conversion, `clsx` + `tailwind-merge` via `cx`,\n * and a `cva` bridge for variant-driven class names. The goal is predictable class strings without\n * Tailwind conflicts and with less boilerplate than concatenating strings by hand across components.\n \n ## Usage\n \n ```ts\n * import { cx, toRem } from \"yummies/css\";\n * ```\n /\n\nimport { cva as cvaLib, VariantProps } from 'class-variance-authority';\nimport clsx from 'clsx';\nimport { twMerge } from 'tailwind-merge';\nimport type { Maybe } from 'yummies/types';\n/\n Converts a length in pixels to a CSS `rem` string (`\"<number>rem\"`).\n \n Use when authoring component styles in JS/TS where design tokens are in px but the stylesheet\n * should scale with root font size (accessibility, user zoom). `remValue` is the assumed\n * `1rem` size in px (browser default is typically `16`).\n \n Also you can override default rem value using `toRem.defaultRemValue = 24`\n \n @param px - Pixel value to convert (not rounded; stringification keeps full float).\n * @param remValue - How many pixels one `rem` equals. Defaults to `16`.\n * @returns A string like `\"1.5rem\"` suitable for `style` or CSS-in-JS.\n \n @example\n * ```ts\n * const width = toRem(24); // '1.5rem' with default 16px root\n * ```\n \n @example\n * ```ts\n * // Custom root / design system where 1rem === 10px\n * const gap = toRem(20, 10); // '2rem'\n * ```\n /\nexport const toRem = (px: number, remValue?: number): string =>\n `${px / (remValue ?? toRem.defaultRemValue)}rem`;\n\ntoRem.defaultRemValue = 16;\n\n/\n Composes conditional class names like {@link https://github.com/lukeed/clsx \| clsx}, then runs\n * the result through {@link https://github.com/dcastil/tailwind-merge \| tailwind-merge} so\n * conflicting Tailwind utilities collapse to the last/intended one (e.g. two `padding-x` classes).\n \n Accepts the same argument shapes as `clsx`: strings, objects, arrays, falsy values to omit.\n \n @param args - Same as `clsx(...args)` — `ClassValue` rest parameters.\n * @returns A single merged class string, safe for `className` on DOM/React.\n \n @example\n * ```ts\n * cx('px-2 py-1 text-sm', 'px-4'); // 'py-1 text-sm px-4' — padding-x merged\n * ```\n \n @example\n * ```ts\n * cx('btn', { 'btn--active': isActive, 'btn--disabled': disabled }, className);\n * ```\n /\nexport const cx = (...args: Parameters<typeof clsx>) => twMerge(clsx(...args));\n\n/\n {@link https://cva.style/docs \| Class Variance Authority (cva)} with the same tailwind-merge\n * pass as {@link cx}: the class string produced by the variant function is merged so Tailwind\n * conflicts resolve predictably.\n \n API matches `cva` from `class-variance-authority`: optional `base` classes, `config` with\n * `variants`, `defaultVariants`, and `compoundVariants`. The returned function accepts variant\n * props plus optional `class` / `className` for one-off overrides.\n \n Use {@link VariantProps} with `typeof buttonVariants` (or similar) to type component props.\n \n @param base - Base `ClassValue`(s) always applied.\n * @param config - Variant schema and defaults (same shape as upstream `cva`).\n * @returns A function `(props?) => string` that resolves variant classes, merged with tw-merge.\n \n @example\n * ```ts\n * const button = cva('rounded font-medium', {\n * variants: {\n * tone: { primary: 'bg-blue-600 text-white', ghost: 'bg-transparent' },\n * size: { sm: 'text-sm px-2', md: 'text-base px-4' },\n * },\n * defaultVariants: { tone: 'primary', size: 'md' },\n * });\n * button({ tone: 'ghost', className: 'ml-2' });\n * ```\n \n @example\n * ```ts\n * const card = cva('border p-4', {\n * variants: { elevated: { true: 'shadow-lg', false: 'shadow-none' } },\n * defaultVariants: { elevated: false },\n * });\n * card({ elevated: true });\n * ```\n /\nexport const cva = ((...args: any[]) => {\n const schema = cvaLib(...args);\n return (...inputArgs: any[]) => twMerge(schema(...inputArgs));\n}) as unknown as typeof cvaLib;\n\n/\n Utility type from `class-variance-authority`: infers the variant prop object from a `cva` instance.\n * Use it to type React (or other) components that forward variant props.\n \n @example\n * ```ts\n * const input = cva('border', { variants: { size: { sm: 'h-8', lg: 'h-12' } } });\n * type InputVariants = VariantProps<typeof input>;\n * // { size?: 'sm' \| 'lg' \| null }\n * ```\n /\nexport type { VariantProps } from 'class-variance-authority';\n\n/\n Re-export from `clsx`: a class name fragment — string, number, nested arrays, object map of\n * flags, or falsy nodes to skip. Used by {@link cx}, {@link cva}, and typical `className` helpers.\n \n @example\n * ```ts\n * const value: ClassValue = ['btn', false && 'hidden', { active: true }];\n * ```\n /\nexport type { ClassValue } from 'clsx';\n\n/\n Injects a stylesheet by appending a `<link rel=\"stylesheet\">` to `document.head`.\n * Resolves when the sheet fires `load`; rejects on `error` (e.g. 404 or network failure).\n \n Id replacement: if `attrubutes.id` is set, any existing element with that `id` is removed\n * first, so repeated calls with the same `id` replace the previous link (useful for theme or\n * font URLs that change).\n \n If `rel` is omitted in `attrubutes`, it defaults to `stylesheet`. Other attributes (`crossorigin`,\n * `media`, `data-`, etc.) are set via `setAttribute` from the record entries.\n \n * @param url - Stylesheet URL (`href`).\n * @param attrubutes - Optional HTML attributes for the `<link>` element (see `id` / `rel` behavior above).\n * @returns Promise that resolves to `undefined` on load, or rejects on load error.\n \n @example\n * ```ts\n * await loadCssFile('https://example.com/fonts.css', {\n * id: 'app-fonts',\n * crossOrigin: 'anonymous',\n * });\n * ```\n \n @example\n * ```ts\n * // Swap theme stylesheet without duplicate link tags\n * await loadCssFile('/themes/dark.css', { id: 'theme' });\n * await loadCssFile('/themes/light.css', { id: 'theme' });\n * ```\n */\nexport const loadCssFile = (url: string, attrubutes?: Record<string, any>) =>\n new Promise((resolve, reject) => {\n let link: Maybe<HTMLLinkElement>;\n\n if (attrubutes?.id) {\n link = document.getElementById(attrubutes.id) as HTMLLinkElement \| null;\n\n if (link) {\n link.remove();\n }\n }\n\n link = document.createElement('link');\n\n const handleLoad = () => {\n resolve(undefined);\n link!.removeEventListener('load', handleLoad);\n link!.removeEventListener('error', handleError);\n };\n\n const handleError = () => {\n reject(undefined);\n link!.removeEventListener('load', handleLoad);\n link!.removeEventListener('error', handleError);\n };\n\n link.addEventListener('load', handleLoad);\n link.addEventListener('error', handleError);\n\n link.setAttribute('href', url);\n\n if (!attrubutes?.rel) {\n link.setAttribute('rel', 'stylesheet');\n }\n\n Object.entries(attrubutes \|\| {}).forEach(([key, value]) => {\n link.setAttribute(key, value);\n });\n\n document.head.appendChild(link);\n });\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,IAAa,SAAS,IAAY,aAChC,GAAG,MAAM,YAAY,MAAM,iBAAiB;AAE9C,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;AAsBxB,IAAa,MAAM,GAAG,UAAA,GAAA,eAAA,UAAA,GAAA,KAAA,SAA+C,GAAG,KAAK,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsC9E,IAAa,QAAQ,GAAG,SAAgB;CACtC,MAAM,UAAA,GAAA,yBAAA,KAAgB,GAAG,KAAK;AAC9B,SAAQ,GAAG,eAAA,GAAA,eAAA,SAA6B,OAAO,GAAG,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyD/D,IAAa,eAAe,KAAa,eACvC,IAAI,SAAS,SAAS,WAAW;CAC/B,IAAI;AAEJ,KAAI,YAAY,IAAI;AAClB,SAAO,SAAS,eAAe,WAAW,GAAG;AAE7C,MAAI,KACF,MAAK,QAAQ;;AAIjB,QAAO,SAAS,cAAc,OAAO;CAErC,MAAM,mBAAmB;AACvB,UAAQ,KAAA,EAAU;AAClB,OAAM,oBAAoB,QAAQ,WAAW;AAC7C,OAAM,oBAAoB,SAAS,YAAY;;CAGjD,MAAM,oBAAoB;AACxB,SAAO,KAAA,EAAU;AACjB,OAAM,oBAAoB,QAAQ,WAAW;AAC7C,OAAM,oBAAoB,SAAS,YAAY;;AAGjD,MAAK,iBAAiB,QAAQ,WAAW;AACzC,MAAK,iBAAiB,SAAS,YAAY;AAE3C,MAAK,aAAa,QAAQ,IAAI;AAE9B,KAAI,CAAC,YAAY,IACf,MAAK,aAAa,OAAO,aAAa;AAGxC,QAAO,QAAQ,cAAc,EAAE,CAAC,CAAC,SAAS,CAAC,KAAK,WAAW;AACzD,OAAK,aAAa,KAAK,MAAM;GAC7B;AAEF,UAAS,KAAK,YAAY,KAAK;EAC/B"}

package/css.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
-import clsx, { ClassValue } from 'clsx';
-export { ClassValue } from 'clsx';
+import { cva as cva$1 } from 'class-variance-authority';
 export { VariantProps } from 'class-variance-authority';
+import clsx from 'clsx';
+export { ClassValue } from 'clsx';
 /**
  * ---header-docs-section---
@@ -19,11 +20,6 @@ export { VariantProps } from 'class-variance-authority';
  * ```
  */
-type ClassProp = {
-    class?: ClassValue;
-    className?: ClassValue;
-};
-type StringToBoolean<T> = T extends 'true' | 'false' ? boolean : T;
 /**
  * Converts a length in **pixels** to a CSS **`rem`** string (`"<number>rem"`).
  *
@@ -31,6 +27,8 @@ type StringToBoolean<T> = T extends 'true' | 'false' ? boolean : T;
  * should scale with root font size (accessibility, user zoom). `remValue` is the assumed
  * `1rem` size in px (browser default is typically `16`).
  *
+ * Also you can override default rem value using `toRem.defaultRemValue = 24`
+ *
  * @param px - Pixel value to convert (not rounded; stringification keeps full float).
  * @param remValue - How many pixels one `rem` equals. Defaults to `16`.
  * @returns A string like `"1.5rem"` suitable for `style` or CSS-in-JS.
@@ -46,7 +44,10 @@ type StringToBoolean<T> = T extends 'true' | 'false' ? boolean : T;
  * const gap = toRem(20, 10); // '2rem'
  * ```
  */
-declare const toRem: (px: number, remValue?: number) => string;
+declare const toRem: {
+    (px: number, remValue?: number): string;
+    defaultRemValue: number;
+};
 /**
  * Composes conditional class names like {@link https://github.com/lukeed/clsx | clsx}, then runs
  * the result through {@link https://github.com/dcastil/tailwind-merge | tailwind-merge} so
@@ -68,19 +69,6 @@ declare const toRem: (px: number, remValue?: number) => string;
  * ```
  */
 declare const cx: (...args: Parameters<typeof clsx>) => string;
-type ConfigSchema = Record<string, Record<string, ClassValue>>;
-type ConfigVariants<T extends ConfigSchema> = {
-    [Variant in keyof T]?: StringToBoolean<keyof T[Variant]> | null | undefined;
-};
-type ConfigVariantsMulti<T extends ConfigSchema> = {
-    [Variant in keyof T]?: StringToBoolean<keyof T[Variant]> | StringToBoolean<keyof T[Variant]>[] | undefined;
-};
-type Config<T> = T extends ConfigSchema ? {
-    variants?: T;
-    defaultVariants?: ConfigVariants<T>;
-    compoundVariants?: (T extends ConfigSchema ? (ConfigVariants<T> | ConfigVariantsMulti<T>) & ClassProp : ClassProp)[];
-} : never;
-type Props<T> = T extends ConfigSchema ? ConfigVariants<T> & ClassProp : ClassProp;
 /**
  * {@link https://cva.style/docs | Class Variance Authority (cva)} with the same **tailwind-merge**
  * pass as {@link cx}: the class string produced by the variant function is merged so Tailwind
@@ -117,7 +105,7 @@ type Props<T> = T extends ConfigSchema ? ConfigVariants<T> & ClassProp : ClassPr
  * card({ elevated: true });
  * ```
  */
-declare const cva: <T>(base?: ClassValue, config?: Config<T>) => (props?: Props<T>) => string;
+declare const cva: typeof cva$1;
 /**
  * Injects a stylesheet by appending a `<link rel="stylesheet">` to `document.head`.

package/css.js CHANGED Viewed

@@ -25,6 +25,8 @@ import { twMerge } from "tailwind-merge";
 * should scale with root font size (accessibility, user zoom). `remValue` is the assumed
 * `1rem` size in px (browser default is typically `16`).
 *
+* Also you can override default rem value using `toRem.defaultRemValue = 24`
+*
 * @param px - Pixel value to convert (not rounded; stringification keeps full float).
 * @param remValue - How many pixels one `rem` equals. Defaults to `16`.
 * @returns A string like `"1.5rem"` suitable for `style` or CSS-in-JS.
@@ -40,7 +42,8 @@ import { twMerge } from "tailwind-merge";
 * const gap = toRem(20, 10); // '2rem'
 * ```
 */
-var toRem = (px, remValue = 16) => `${px / remValue}rem`;
+var toRem = (px, remValue) => `${px / (remValue ?? toRem.defaultRemValue)}rem`;
+toRem.defaultRemValue = 16;
 /**
 * Composes conditional class names like {@link https://github.com/lukeed/clsx | clsx}, then runs
 * the result through {@link https://github.com/dcastil/tailwind-merge | tailwind-merge} so

package/css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"css.js","names":[],"sources":["../src/css.ts"],"sourcesContent":["/*\n ---header-docs-section---\n * # yummies/css\n \n ## Description\n \n Styling utilities for React and plain DOM: `rem` conversion, `clsx` + `tailwind-merge` via `cx`,\n * and a `cva` bridge for variant-driven class names. The goal is predictable class strings without\n * Tailwind conflicts and with less boilerplate than concatenating strings by hand across components.\n \n ## Usage\n \n ```ts\n * import { cx, toRem } from \"yummies/css\";\n * ```\n /\n\nimport { cva as cvaLib } from 'class-variance-authority';\nimport clsx, ~~{ type ClassValue }~~ from 'clsx';\nimport { twMerge } from 'tailwind-merge';\nimport type { Maybe } from 'yummies/types';\n~~\ntype ClassProp = {\n class?: ClassValue;\n className?: ClassValue;\n};\n\ntype StringToBoolean<T> = T extends 'true' \| 'false' ? boolean : T;\n\n~~/\n Converts a length in pixels to a CSS `rem` string (`\"<number>rem\"`).\n \n Use when authoring component styles in JS/TS where design tokens are in px but the stylesheet\n * should scale with root font size (accessibility, user zoom). `remValue` is the assumed\n * `1rem` size in px (browser default is typically `16`).\n \n @param px - Pixel value to convert (not rounded; stringification keeps full float).\n * @param remValue - How many pixels one `rem` equals. Defaults to `16`.\n * @returns A string like `\"1.5rem\"` suitable for `style` or CSS-in-JS.\n \n @example\n * ```ts\n * const width = toRem(24); // '1.5rem' with default 16px root\n * ```\n \n @example\n * ```ts\n * // Custom root / design system where 1rem === 10px\n * const gap = toRem(20, 10); // '2rem'\n * ```\n /\nexport const toRem = (px: number, remValue ~~= 16~~) => `${px / remValue}rem`;\n\n/\n Composes conditional class names like {@link https://github.com/lukeed/clsx \| clsx}, then runs\n * the result through {@link https://github.com/dcastil/tailwind-merge \| tailwind-merge} so\n * conflicting Tailwind utilities collapse to the last/intended one (e.g. two `padding-x` classes).\n \n Accepts the same argument shapes as `clsx`: strings, objects, arrays, falsy values to omit.\n \n @param args - Same as `clsx(...args)` — `ClassValue` rest parameters.\n * @returns A single merged class string, safe for `className` on DOM/React.\n \n @example\n * ```ts\n * cx('px-2 py-1 text-sm', 'px-4'); // 'py-1 text-sm px-4' — padding-x merged\n * ```\n \n @example\n * ```ts\n * cx('btn', { 'btn--active': isActive, 'btn--disabled': disabled }, className);\n * ```\n /\nexport const cx = (...args: Parameters<typeof clsx>) => twMerge(clsx(...args));\n\~~ntype ConfigSchema = Record<string, Record<string, ClassValue>>;\ntype ConfigVariants<T extends ConfigSchema> = {\~~n [Variant in keyof T]?: StringToBoolean<keyof T[Variant]> \| null \| undefined;\n};\ntype ConfigVariantsMulti<T extends ConfigSchema> = {\n [Variant in keyof T]?:\n \| StringToBoolean<keyof T[Variant]>\n \| StringToBoolean<keyof T[Variant]>[]\n \| undefined;\n};\ntype Config<T> = T extends ConfigSchema\n ? {\n variants?: T;\n defaultVariants?: ConfigVariants<T>;\n compoundVariants?: (T extends ConfigSchema\n ? (ConfigVariants<T> \| ConfigVariantsMulti<T>) & ClassProp\n : ClassProp)[];\n }\n : never;\n\ntype Props<T> = T extends ConfigSchema\n ? ConfigVariants<T> & ClassProp\n : ClassProp;\n\n/\n {@link https://cva.style/docs \| Class Variance Authority (cva)} with the same tailwind-merge\n * pass as {@link cx}: the class string produced by the variant function is merged so Tailwind\n * conflicts resolve predictably.\n \n API matches `cva` from `class-variance-authority`: optional `base` classes, `config` with\n * `variants`, `defaultVariants`, and `compoundVariants`. The returned function accepts variant\n * props plus optional `class` / `className` for one-off overrides.\n \n Use {@link VariantProps} with `typeof buttonVariants` (or similar) to type component props.\n \n @param base - Base `ClassValue`(s) always applied.\n * @param config - Variant schema and defaults (same shape as upstream `cva`).\n * @returns A function `(props?) => string` that resolves variant classes, merged with tw-merge.\n \n @example\n * ```ts\n * const button = cva('rounded font-medium', {\n * variants: {\n * tone: { primary: 'bg-blue-600 text-white', ghost: 'bg-transparent' },\n * size: { sm: 'text-sm px-2', md: 'text-base px-4' },\n * },\n * defaultVariants: { tone: 'primary', size: 'md' },\n * });\n * button({ tone: 'ghost', className: 'ml-2' });\n * ```\n \n @example\n * ```ts\n * const card = cva('border p-4', {\n * variants: { elevated: { true: 'shadow-lg', false: 'shadow-none' } },\n * defaultVariants: { elevated: false },\n * });\n * card({ elevated: true });\n * ```\n /\nexport const cva = ((...args: any[]) => {\n const schema = cvaLib(...args);\n return (...inputArgs: any[]) => twMerge(schema(...inputArgs));\n}) as ~~any~~ as ~~<T>(\n base?:~~ ~~ClassValue,\n config?: Config<T>,\n) => (props?: Props<T>) => string~~;\n\n/\n Utility type from `class-variance-authority`: infers the variant prop object from a `cva` instance.\n * Use it to type React (or other) components that forward variant props.\n \n @example\n * ```ts\n * const input = cva('border', { variants: { size: { sm: 'h-8', lg: 'h-12' } } });\n * type InputVariants = VariantProps<typeof input>;\n * // { size?: 'sm' \| 'lg' \| null }\n * ```\n /\nexport type { VariantProps } from 'class-variance-authority';\n\n/\n Re-export from `clsx`: a class name fragment — string, number, nested arrays, object map of\n * flags, or falsy nodes to skip. Used by {@link cx}, {@link cva}, and typical `className` helpers.\n \n @example\n * ```ts\n * const value: ClassValue = ['btn', false && 'hidden', { active: true }];\n * ```\n /\nexport type { ClassValue } from 'clsx';\n\n/\n Injects a stylesheet by appending a `<link rel=\"stylesheet\">` to `document.head`.\n * Resolves when the sheet fires `load`; rejects on `error` (e.g. 404 or network failure).\n \n Id replacement: if `attrubutes.id` is set, any existing element with that `id` is removed\n * first, so repeated calls with the same `id` replace the previous link (useful for theme or\n * font URLs that change).\n \n If `rel` is omitted in `attrubutes`, it defaults to `stylesheet`. Other attributes (`crossorigin`,\n * `media`, `data-`, etc.) are set via `setAttribute` from the record entries.\n \n * @param url - Stylesheet URL (`href`).\n * @param attrubutes - Optional HTML attributes for the `<link>` element (see `id` / `rel` behavior above).\n * @returns Promise that resolves to `undefined` on load, or rejects on load error.\n \n @example\n * ```ts\n * await loadCssFile('https://example.com/fonts.css', {\n * id: 'app-fonts',\n * crossOrigin: 'anonymous',\n * });\n * ```\n \n @example\n * ```ts\n * // Swap theme stylesheet without duplicate link tags\n * await loadCssFile('/themes/dark.css', { id: 'theme' });\n * await loadCssFile('/themes/light.css', { id: 'theme' });\n * ```\n */\nexport const loadCssFile = (url: string, attrubutes?: Record<string, any>) =>\n new Promise((resolve, reject) => {\n let link: Maybe<HTMLLinkElement>;\n\n if (attrubutes?.id) {\n link = document.getElementById(attrubutes.id) as HTMLLinkElement \| null;\n\n if (link) {\n link.remove();\n }\n }\n\n link = document.createElement('link');\n\n const handleLoad = () => {\n resolve(undefined);\n link!.removeEventListener('load', handleLoad);\n link!.removeEventListener('error', handleError);\n };\n\n const handleError = () => {\n reject(undefined);\n link!.removeEventListener('load', handleLoad);\n link!.removeEventListener('error', handleError);\n };\n\n link.addEventListener('load', handleLoad);\n link.addEventListener('error', handleError);\n\n link.setAttribute('href', url);\n\n if (!attrubutes?.rel) {\n link.setAttribute('rel', 'stylesheet');\n }\n\n Object.entries(attrubutes \|\| {}).forEach(([key, value]) => {\n link.setAttribute(key, value);\n });\n\n document.head.appendChild(link);\n });\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA~~,IAAa,SAAS,IAAY,~~WAAW~~,~~OAAO,~~GAAG,~~KAAK~~,~~SAAS~~;;;;;;;;;;;;;;;;;;;;;~~AAsBrE~~,IAAa,MAAM,GAAG,SAAkC,QAAQ,KAAK,GAAG,KAAK,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AA8D9E~~,IAAa,QAAQ,GAAG,SAAgB;CACtC,MAAM,SAAS,MAAO,GAAG,KAAK;AAC9B,SAAQ,GAAG,cAAqB,QAAQ,OAAO,GAAG,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AA4D~~/D,IAAa,eAAe,KAAa,eACvC,IAAI,SAAS,SAAS,WAAW;CAC/B,IAAI;AAEJ,KAAI,YAAY,IAAI;AAClB,SAAO,SAAS,eAAe,WAAW,GAAG;AAE7C,MAAI,KACF,MAAK,QAAQ;;AAIjB,QAAO,SAAS,cAAc,OAAO;CAErC,MAAM,mBAAmB;AACvB,UAAQ,KAAA,EAAU;AAClB,OAAM,oBAAoB,QAAQ,WAAW;AAC7C,OAAM,oBAAoB,SAAS,YAAY;;CAGjD,MAAM,oBAAoB;AACxB,SAAO,KAAA,EAAU;AACjB,OAAM,oBAAoB,QAAQ,WAAW;AAC7C,OAAM,oBAAoB,SAAS,YAAY;;AAGjD,MAAK,iBAAiB,QAAQ,WAAW;AACzC,MAAK,iBAAiB,SAAS,YAAY;AAE3C,MAAK,aAAa,QAAQ,IAAI;AAE9B,KAAI,CAAC,YAAY,IACf,MAAK,aAAa,OAAO,aAAa;AAGxC,QAAO,QAAQ,cAAc,EAAE,CAAC,CAAC,SAAS,CAAC,KAAK,WAAW;AACzD,OAAK,aAAa,KAAK,MAAM;GAC7B;AAEF,UAAS,KAAK,YAAY,KAAK;EAC/B"}
1	+ {"version":3,"file":"css.js","names":[],"sources":["../src/css.ts"],"sourcesContent":["/*\n ---header-docs-section---\n * # yummies/css\n \n ## Description\n \n Styling utilities for React and plain DOM: `rem` conversion, `clsx` + `tailwind-merge` via `cx`,\n * and a `cva` bridge for variant-driven class names. The goal is predictable class strings without\n * Tailwind conflicts and with less boilerplate than concatenating strings by hand across components.\n \n ## Usage\n \n ```ts\n * import { cx, toRem } from \"yummies/css\";\n * ```\n /\n\nimport { cva as cvaLib, VariantProps } from 'class-variance-authority';\nimport clsx from 'clsx';\nimport { twMerge } from 'tailwind-merge';\nimport type { Maybe } from 'yummies/types';\n/\n Converts a length in pixels to a CSS `rem` string (`\"<number>rem\"`).\n \n Use when authoring component styles in JS/TS where design tokens are in px but the stylesheet\n * should scale with root font size (accessibility, user zoom). `remValue` is the assumed\n * `1rem` size in px (browser default is typically `16`).\n \n Also you can override default rem value using `toRem.defaultRemValue = 24`\n \n @param px - Pixel value to convert (not rounded; stringification keeps full float).\n * @param remValue - How many pixels one `rem` equals. Defaults to `16`.\n * @returns A string like `\"1.5rem\"` suitable for `style` or CSS-in-JS.\n \n @example\n * ```ts\n * const width = toRem(24); // '1.5rem' with default 16px root\n * ```\n \n @example\n * ```ts\n * // Custom root / design system where 1rem === 10px\n * const gap = toRem(20, 10); // '2rem'\n * ```\n /\nexport const toRem = (px: number, remValue?: number): string =>\n `${px / (remValue ?? toRem.defaultRemValue)}rem`;\n\ntoRem.defaultRemValue = 16;\n\n/\n Composes conditional class names like {@link https://github.com/lukeed/clsx \| clsx}, then runs\n * the result through {@link https://github.com/dcastil/tailwind-merge \| tailwind-merge} so\n * conflicting Tailwind utilities collapse to the last/intended one (e.g. two `padding-x` classes).\n \n Accepts the same argument shapes as `clsx`: strings, objects, arrays, falsy values to omit.\n \n @param args - Same as `clsx(...args)` — `ClassValue` rest parameters.\n * @returns A single merged class string, safe for `className` on DOM/React.\n \n @example\n * ```ts\n * cx('px-2 py-1 text-sm', 'px-4'); // 'py-1 text-sm px-4' — padding-x merged\n * ```\n \n @example\n * ```ts\n * cx('btn', { 'btn--active': isActive, 'btn--disabled': disabled }, className);\n * ```\n /\nexport const cx = (...args: Parameters<typeof clsx>) => twMerge(clsx(...args));\n\n/\n {@link https://cva.style/docs \| Class Variance Authority (cva)} with the same tailwind-merge\n * pass as {@link cx}: the class string produced by the variant function is merged so Tailwind\n * conflicts resolve predictably.\n \n API matches `cva` from `class-variance-authority`: optional `base` classes, `config` with\n * `variants`, `defaultVariants`, and `compoundVariants`. The returned function accepts variant\n * props plus optional `class` / `className` for one-off overrides.\n \n Use {@link VariantProps} with `typeof buttonVariants` (or similar) to type component props.\n \n @param base - Base `ClassValue`(s) always applied.\n * @param config - Variant schema and defaults (same shape as upstream `cva`).\n * @returns A function `(props?) => string` that resolves variant classes, merged with tw-merge.\n \n @example\n * ```ts\n * const button = cva('rounded font-medium', {\n * variants: {\n * tone: { primary: 'bg-blue-600 text-white', ghost: 'bg-transparent' },\n * size: { sm: 'text-sm px-2', md: 'text-base px-4' },\n * },\n * defaultVariants: { tone: 'primary', size: 'md' },\n * });\n * button({ tone: 'ghost', className: 'ml-2' });\n * ```\n \n @example\n * ```ts\n * const card = cva('border p-4', {\n * variants: { elevated: { true: 'shadow-lg', false: 'shadow-none' } },\n * defaultVariants: { elevated: false },\n * });\n * card({ elevated: true });\n * ```\n /\nexport const cva = ((...args: any[]) => {\n const schema = cvaLib(...args);\n return (...inputArgs: any[]) => twMerge(schema(...inputArgs));\n}) as unknown as typeof cvaLib;\n\n/\n Utility type from `class-variance-authority`: infers the variant prop object from a `cva` instance.\n * Use it to type React (or other) components that forward variant props.\n \n @example\n * ```ts\n * const input = cva('border', { variants: { size: { sm: 'h-8', lg: 'h-12' } } });\n * type InputVariants = VariantProps<typeof input>;\n * // { size?: 'sm' \| 'lg' \| null }\n * ```\n /\nexport type { VariantProps } from 'class-variance-authority';\n\n/\n Re-export from `clsx`: a class name fragment — string, number, nested arrays, object map of\n * flags, or falsy nodes to skip. Used by {@link cx}, {@link cva}, and typical `className` helpers.\n \n @example\n * ```ts\n * const value: ClassValue = ['btn', false && 'hidden', { active: true }];\n * ```\n /\nexport type { ClassValue } from 'clsx';\n\n/\n Injects a stylesheet by appending a `<link rel=\"stylesheet\">` to `document.head`.\n * Resolves when the sheet fires `load`; rejects on `error` (e.g. 404 or network failure).\n \n Id replacement: if `attrubutes.id` is set, any existing element with that `id` is removed\n * first, so repeated calls with the same `id` replace the previous link (useful for theme or\n * font URLs that change).\n \n If `rel` is omitted in `attrubutes`, it defaults to `stylesheet`. Other attributes (`crossorigin`,\n * `media`, `data-`, etc.) are set via `setAttribute` from the record entries.\n \n * @param url - Stylesheet URL (`href`).\n * @param attrubutes - Optional HTML attributes for the `<link>` element (see `id` / `rel` behavior above).\n * @returns Promise that resolves to `undefined` on load, or rejects on load error.\n \n @example\n * ```ts\n * await loadCssFile('https://example.com/fonts.css', {\n * id: 'app-fonts',\n * crossOrigin: 'anonymous',\n * });\n * ```\n \n @example\n * ```ts\n * // Swap theme stylesheet without duplicate link tags\n * await loadCssFile('/themes/dark.css', { id: 'theme' });\n * await loadCssFile('/themes/light.css', { id: 'theme' });\n * ```\n */\nexport const loadCssFile = (url: string, attrubutes?: Record<string, any>) =>\n new Promise((resolve, reject) => {\n let link: Maybe<HTMLLinkElement>;\n\n if (attrubutes?.id) {\n link = document.getElementById(attrubutes.id) as HTMLLinkElement \| null;\n\n if (link) {\n link.remove();\n }\n }\n\n link = document.createElement('link');\n\n const handleLoad = () => {\n resolve(undefined);\n link!.removeEventListener('load', handleLoad);\n link!.removeEventListener('error', handleError);\n };\n\n const handleError = () => {\n reject(undefined);\n link!.removeEventListener('load', handleLoad);\n link!.removeEventListener('error', handleError);\n };\n\n link.addEventListener('load', handleLoad);\n link.addEventListener('error', handleError);\n\n link.setAttribute('href', url);\n\n if (!attrubutes?.rel) {\n link.setAttribute('rel', 'stylesheet');\n }\n\n Object.entries(attrubutes \|\| {}).forEach(([key, value]) => {\n link.setAttribute(key, value);\n });\n\n document.head.appendChild(link);\n });\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,IAAa,SAAS,IAAY,aAChC,GAAG,MAAM,YAAY,MAAM,iBAAiB;AAE9C,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;AAsBxB,IAAa,MAAM,GAAG,SAAkC,QAAQ,KAAK,GAAG,KAAK,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsC9E,IAAa,QAAQ,GAAG,SAAgB;CACtC,MAAM,SAAS,MAAO,GAAG,KAAK;AAC9B,SAAQ,GAAG,cAAqB,QAAQ,OAAO,GAAG,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyD/D,IAAa,eAAe,KAAa,eACvC,IAAI,SAAS,SAAS,WAAW;CAC/B,IAAI;AAEJ,KAAI,YAAY,IAAI;AAClB,SAAO,SAAS,eAAe,WAAW,GAAG;AAE7C,MAAI,KACF,MAAK,QAAQ;;AAIjB,QAAO,SAAS,cAAc,OAAO;CAErC,MAAM,mBAAmB;AACvB,UAAQ,KAAA,EAAU;AAClB,OAAM,oBAAoB,QAAQ,WAAW;AAC7C,OAAM,oBAAoB,SAAS,YAAY;;CAGjD,MAAM,oBAAoB;AACxB,SAAO,KAAA,EAAU;AACjB,OAAM,oBAAoB,QAAQ,WAAW;AAC7C,OAAM,oBAAoB,SAAS,YAAY;;AAGjD,MAAK,iBAAiB,QAAQ,WAAW;AACzC,MAAK,iBAAiB,SAAS,YAAY;AAE3C,MAAK,aAAa,QAAQ,IAAI;AAE9B,KAAI,CAAC,YAAY,IACf,MAAK,aAAa,OAAO,aAAa;AAGxC,QAAO,QAAQ,cAAc,EAAE,CAAC,CAAC,SAAS,CAAC,KAAK,WAAW;AACzD,OAAK,aAAa,KAAK,MAAM;GAC7B;AAEF,UAAS,KAAK,YAAY,KAAK;EAC/B"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "yummies",
-  "version": "7.19.1",
+  "version": "7.19.3",
   "keywords": [
     "javascript",
     "typescript",
@@ -34,7 +34,7 @@
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "dayjs": "^1.11.20",
-    "dompurify": "^3.3.3",
+    "dompurify": "^3.4.1",
     "nanoid": "^5.1.7",
     "tailwind-merge": "^3.5.0"
   },