@dava96/osrs-icons 1.0.15 → 1.0.17

package/dist/esm/applyCursors.d.ts

@@ -0,0 +1,64 @@
+/**
+ * Standard CSS cursor states that can be mapped to OSRS icons.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/CSS/cursor
+ */
+export type CursorState = 'default' | 'pointer' | 'wait' | 'text' | 'move' | 'crosshair' | 'grab' | 'grabbing' | 'not-allowed' | 'help' | 'progress' | 'cell' | 'copy' | 'alias' | 'no-drop' | 'col-resize' | 'row-resize' | 'n-resize' | 'e-resize' | 's-resize' | 'w-resize' | 'zoom-in' | 'zoom-out';
+/**
+ * A mapping of CSS cursor states to OSRS icon cursor strings.
+ *
+ * Only include the states you want to override — unlisted states
+ * keep their default browser cursor.
+ */
+export type CursorMapping = Partial<Record<CursorState, string>>;
+/**
+ * Applies OSRS cursor icons to CSS cursor states on a target element
+ * or globally across the entire page.
+ *
+ * Injects a `<style>` tag with CSS rules that map each specified cursor
+ * state to the given OSRS icon. Returns a cleanup function that removes
+ * the injected styles and restores the previous cursors.
+ *
+ * **Browser-only** — in non-browser environments this is a no-op that
+ * returns an empty cleanup function.
+ *
+ * @param mapping - An object mapping CSS cursor states to OSRS cursor strings.
+ * @param target  - Optional element to scope the cursors to. Defaults to the
+ *                  entire document (global).
+ * @returns A cleanup function that reverts all applied cursors.
+ *
+ * @example
+ * ```ts
+ * import { abyssalWhip, dragonScimitar, applyCursors } from '@dava96/osrs-icons';
+ *
+ * // Apply globally
+ * const remove = applyCursors({
+ *   default: abyssalWhip,
+ *   pointer: dragonScimitar,
+ * });
+ *
+ * // Later, revert to browser defaults
+ * remove();
+ * ```
+ *
+ * @example
+ * ```ts
+ * import { bucketPack, applyCursors } from '@dava96/osrs-icons';
+ *
+ * // Scope to a specific element
+ * const cleanup = applyCursors(
+ *   { wait: bucketPack.full },
+ *   document.getElementById('loading-area')!,
+ * );
+ * ```
+ *
+ * @example
+ * ```ts
+ * import { herringPack, applyCursors } from '@dava96/osrs-icons';
+ *
+ * // Use the red herring for error states!
+ * applyCursors({ not-allowed: herringPack.error });
+ * ```
+ */
+export declare function applyCursors(mapping: CursorMapping, target?: HTMLElement): () => void;
+//# sourceMappingURL=applyCursors.d.ts.map

package/dist/esm/applyCursors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"applyCursors.d.ts","sourceRoot":"","sources":["../../src/applyCursors.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,MAAM,WAAW,GACnB,SAAS,GACT,SAAS,GACT,MAAM,GACN,MAAM,GACN,MAAM,GACN,WAAW,GACX,MAAM,GACN,UAAU,GACV,aAAa,GACb,MAAM,GACN,UAAU,GACV,MAAM,GACN,MAAM,GACN,OAAO,GACP,SAAS,GACT,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,SAAS,GACT,UAAU,CAAC;AAEf;;;;;GAKG;AACH,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;AAEjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgDG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,aAAa,EAAE,MAAM,CAAC,EAAE,WAAW,GAAG,MAAM,IAAI,CA6BrF"}

package/dist/esm/applyCursors.js

@@ -0,0 +1,79 @@
+/**
+ * Applies OSRS cursor icons to CSS cursor states on a target element
+ * or globally across the entire page.
+ *
+ * Injects a `<style>` tag with CSS rules that map each specified cursor
+ * state to the given OSRS icon. Returns a cleanup function that removes
+ * the injected styles and restores the previous cursors.
+ *
+ * **Browser-only** — in non-browser environments this is a no-op that
+ * returns an empty cleanup function.
+ *
+ * @param mapping - An object mapping CSS cursor states to OSRS cursor strings.
+ * @param target  - Optional element to scope the cursors to. Defaults to the
+ *                  entire document (global).
+ * @returns A cleanup function that reverts all applied cursors.
+ *
+ * @example
+ * ```ts
+ * import { abyssalWhip, dragonScimitar, applyCursors } from '@dava96/osrs-icons';
+ *
+ * // Apply globally
+ * const remove = applyCursors({
+ *   default: abyssalWhip,
+ *   pointer: dragonScimitar,
+ * });
+ *
+ * // Later, revert to browser defaults
+ * remove();
+ * ```
+ *
+ * @example
+ * ```ts
+ * import { bucketPack, applyCursors } from '@dava96/osrs-icons';
+ *
+ * // Scope to a specific element
+ * const cleanup = applyCursors(
+ *   { wait: bucketPack.full },
+ *   document.getElementById('loading-area')!,
+ * );
+ * ```
+ *
+ * @example
+ * ```ts
+ * import { herringPack, applyCursors } from '@dava96/osrs-icons';
+ *
+ * // Use the red herring for error states!
+ * applyCursors({ not-allowed: herringPack.error });
+ * ```
+ */
+export function applyCursors(mapping, target) {
+    if (typeof document === 'undefined') {
+        return () => { };
+    }
+    const styleElement = document.createElement('style');
+    const selector = target ? `[data-osrs-cursor-id="${generateId()}"]` : '*';
+    if (target) {
+        target.setAttribute('data-osrs-cursor-id', selector.slice(22, -2));
+    }
+    const rules = Object.entries(mapping)
+        .map(([state, cursorValue]) => {
+        const fallback = state === 'default' ? 'auto' : state;
+        return `${selector} { cursor: ${cursorValue.replace(', auto', `, ${fallback}`)}; }`;
+    })
+        .join('\n');
+    styleElement.textContent = rules;
+    styleElement.setAttribute('data-osrs-cursors', 'true');
+    document.head.appendChild(styleElement);
+    return () => {
+        styleElement.remove();
+        if (target) {
+            target.removeAttribute('data-osrs-cursor-id');
+        }
+    };
+}
+/** Generates a short unique ID for scoping cursor styles to elements. */
+let idCounter = 0;
+function generateId() {
+    return `osrs-${++idCounter}-${Date.now().toString(36)}`;
+}

package/dist/esm/flip.d.ts

@@ -0,0 +1,55 @@
+/**
+ * Horizontally flips CSS cursor icons so they point in the opposite direction.
+ *
+ * Many OSRS inventory icons face right, but cursor conventions typically
+ * expect left-facing images. This helper mirrors the embedded base64 PNG
+ * using the Canvas API and returns new, ready-to-use CSS cursor strings.
+ *
+ * Results are cached internally — flipping the same icon twice returns
+ * the cached value instantly.
+ *
+ * **Browser-only** — requires the Canvas API. In non-browser environments
+ * (Node.js, SSR) the original cursor strings are returned unchanged.
+ *
+ * Supports three input shapes:
+ * - **Single string** → returns a single flipped string.
+ * - **Array of strings** → returns an array of flipped strings (same order).
+ * - **Record of strings** → returns a record with the same keys, values flipped.
+ *   Perfect for flipping an entire pack in one call.
+ *
+ * @example
+ * ```ts
+ * import { abyssalWhip, flipCursor } from '@dava96/osrs-icons';
+ *
+ * // Single icon
+ * const flipped = await flipCursor(abyssalWhip);
+ * document.body.style.cursor = flipped;
+ * ```
+ *
+ * @example
+ * ```ts
+ * import { coinsPack, flipCursor } from '@dava96/osrs-icons';
+ *
+ * // Flip an entire pack
+ * const flippedPack = await flipCursor(coinsPack);
+ * // flippedPack._1, flippedPack._2, ... are all flipped
+ * // flippedPack.stages is a flipped array
+ * ```
+ *
+ * @example
+ * ```ts
+ * import { airRune, fireRune, flipCursor } from '@dava96/osrs-icons';
+ *
+ * // Flip an array of cursors
+ * const [flippedAir, flippedFire] = await flipCursor([airRune, fireRune]);
+ * ```
+ */
+/** Flip a single CSS cursor string. */
+export declare function flipCursor(cursorValue: string): Promise<string>;
+/** Flip an array of CSS cursor strings, preserving order. */
+export declare function flipCursor(cursorValues: readonly string[]): Promise<string[]>;
+/** Flip every string value in a record (e.g. a pack object), preserving keys. */
+export declare function flipCursor<T extends Record<string, unknown>>(pack: T): Promise<{
+    [K in keyof T]: T[K] extends string ? string : T[K] extends readonly string[] ? string[] : T[K];
+}>;
+//# sourceMappingURL=flip.d.ts.map

package/dist/esm/flip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flip.d.ts","sourceRoot":"","sources":["../../src/flip.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AAUH,uCAAuC;AACvC,wBAAsB,UAAU,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;AAEvE,6DAA6D;AAC7D,wBAAsB,UAAU,CAAC,YAAY,EAAE,SAAS,MAAM,EAAE,GAAG,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC;AAErF,iFAAiF;AACjF,wBAAsB,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAChE,IAAI,EAAE,CAAC,GACN,OAAO,CAAC;KACR,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,SAAS,MAAM,EAAE,GAAG,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;CAChG,CAAC,CAAC"}

package/dist/esm/flip.js

@@ -0,0 +1,114 @@
+/**
+ * Horizontally flips CSS cursor icons so they point in the opposite direction.
+ *
+ * Many OSRS inventory icons face right, but cursor conventions typically
+ * expect left-facing images. This helper mirrors the embedded base64 PNG
+ * using the Canvas API and returns new, ready-to-use CSS cursor strings.
+ *
+ * Results are cached internally — flipping the same icon twice returns
+ * the cached value instantly.
+ *
+ * **Browser-only** — requires the Canvas API. In non-browser environments
+ * (Node.js, SSR) the original cursor strings are returned unchanged.
+ *
+ * Supports three input shapes:
+ * - **Single string** → returns a single flipped string.
+ * - **Array of strings** → returns an array of flipped strings (same order).
+ * - **Record of strings** → returns a record with the same keys, values flipped.
+ *   Perfect for flipping an entire pack in one call.
+ *
+ * @example
+ * ```ts
+ * import { abyssalWhip, flipCursor } from '@dava96/osrs-icons';
+ *
+ * // Single icon
+ * const flipped = await flipCursor(abyssalWhip);
+ * document.body.style.cursor = flipped;
+ * ```
+ *
+ * @example
+ * ```ts
+ * import { coinsPack, flipCursor } from '@dava96/osrs-icons';
+ *
+ * // Flip an entire pack
+ * const flippedPack = await flipCursor(coinsPack);
+ * // flippedPack._1, flippedPack._2, ... are all flipped
+ * // flippedPack.stages is a flipped array
+ * ```
+ *
+ * @example
+ * ```ts
+ * import { airRune, fireRune, flipCursor } from '@dava96/osrs-icons';
+ *
+ * // Flip an array of cursors
+ * const [flippedAir, flippedFire] = await flipCursor([airRune, fireRune]);
+ * ```
+ */
+/** Matches `url('...')` in a CSS cursor value. Precompiled to avoid re-creation per call. */
+const FLIP_URL_REGEX = /url\('(.*?)'\)/;
+/** Internal cache to avoid re-processing the same icon. */
+const flipCache = new Map();
+// ── Implementation ─────────────────────────────────────────────────
+export async function flipCursor(input) {
+    if (typeof input === 'string') {
+        return flipSingleCursor(input);
+    }
+    if (Array.isArray(input)) {
+        return Promise.all(input.map(flipSingleCursor));
+    }
+    const entries = Object.entries(input);
+    const flippedEntries = await Promise.all(entries.map(async ([key, value]) => {
+        if (typeof value === 'string') {
+            return [key, await flipSingleCursor(value)];
+        }
+        if (Array.isArray(value) && value.every((v) => typeof v === 'string')) {
+            return [key, await Promise.all(value.map(flipSingleCursor))];
+        }
+        return [key, value];
+    }));
+    return Object.fromEntries(flippedEntries);
+}
+// ── Internal helpers ───────────────────────────────────────────────
+/** Flips a single CSS cursor string, using the cache. */
+async function flipSingleCursor(cursorValue) {
+    if (flipCache.has(cursorValue)) {
+        return flipCache.get(cursorValue);
+    }
+    if (typeof document === 'undefined') {
+        return cursorValue;
+    }
+    const dataUrlMatch = cursorValue.match(FLIP_URL_REGEX);
+    if (!dataUrlMatch) {
+        return cursorValue;
+    }
+    const originalDataUrl = dataUrlMatch[1];
+    const flippedDataUrl = await mirrorImage(originalDataUrl);
+    const flippedCursor = cursorValue.replace(originalDataUrl, flippedDataUrl);
+    flipCache.set(cursorValue, flippedCursor);
+    return flippedCursor;
+}
+/**
+ * Loads a data URL into an off-screen canvas, mirrors it horizontally,
+ * and returns the flipped image as a new data URL.
+ */
+function mirrorImage(dataUrl) {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.onload = () => {
+            const canvas = document.createElement('canvas');
+            canvas.width = img.width;
+            canvas.height = img.height;
+            const ctx = canvas.getContext('2d');
+            if (!ctx) {
+                resolve(dataUrl);
+                return;
+            }
+            ctx.translate(canvas.width, 0);
+            ctx.scale(-1, 1);
+            ctx.drawImage(img, 0, 0);
+            resolve(canvas.toDataURL('image/png'));
+        };
+        img.onerror = () => reject(new Error('Failed to load cursor image for flipping'));
+        img.src = dataUrl;
+    });
+}

package/dist/esm/generated/icons.d.ts

@@ -17413,3 +17413,4 @@ export declare const zurielsStaff = "url('data:image/png;base64,iVBORw0KGgoAAAAN
 export declare const zurielsStaffLastManStanding = "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAeCAMAAADn2eWTAAAAulBMVEVMaXFsZGRdV1dYUlJnYGBza2tOSUgAAAFIQ0NMRkZbVVV5cXCEenpqYmI8NzdWUFBjXFs5NDSJYF1dNzWkcm9UMC50Q0KFTkqKUU6JgH8/OjpwaWlFQEBQLiyHUExUTU2PVVGTZWNnPTpxQj99V1VkOjl/SkhmMi5hOTeMUlB5SEVXNDB2OjdzOTVcPz1CPT1MJCI1MDBmbmZye3JITkh2RkOU2sS75thboIx807mK1sBwxaxrvaWP2MLZgia+AAAAAXRSTlMAQObYZgAAAAlwSFlzAAALEwAACxMBAJqcGAAAAKxJREFUeNp902cCgyAMBWCU6lPr1qrde++973+t9gBJ+PsRHgRQih2AEvD15BgK9++HUWQ4394P0IEoytOFzkWaZpV2jqRi2AByNymqK8FYAeVh959C1k6Rx3tgQcfOJts1MKKPg56eb5aDLqNGNAbAoc03GJbLNx91CeFIlRJaEgYS1niEiIaEcdQSlvXckHti8Jt2wmHbt0w2FGbgCTvSdodHs++E0r3w3+kHfw4LUj07+AMAAAAASUVORK5CYII='), auto";
 export declare const zurielsStaffBh = "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAeCAMAAADn2eWTAAAAulBMVEVMaXFsZGRdV1dYUlJnYGBza2tOSUgAAAFIQ0NMRkZbVVV5cXCEenpqYmI8NzdWUFBjXFs5NDSJYF1dNzWkcm9UMC50Q0KFTkqKUU6JgH8/OjpwaWlFQEBQLiyHUExUTU2PVVGTZWNnPTpxQj99V1VkOjl/SkhmMi5hOTeMUlB5SEVXNDB2OjdzOTVcPz1CPT1MJCI1MDBmbmZye3JITkh2RkOU2sS75thboIx807mK1sBwxaxrvaWP2MLZgia+AAAAAXRSTlMAQObYZgAAAAlwSFlzAAALEwAACxMBAJqcGAAAAKxJREFUeNp902cCgyAMBWCU6lPr1qrde++973+t9gBJ+PsRHgRQih2AEvD15BgK9++HUWQ4394P0IEoytOFzkWaZpV2jqRi2AByNymqK8FYAeVh959C1k6Rx3tgQcfOJts1MKKPg56eb5aDLqNGNAbAoc03GJbLNx91CeFIlRJaEgYS1niEiIaEcdQSlvXckHti8Jt2wmHbt0w2FGbgCTvSdodHs++E0r3w3+kHfw4LUj07+AMAAAAASUVORK5CYII='), auto";
 export declare const zurielsStaffBhinactive = "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAeCAMAAADn2eWTAAAAsVBMVEVMaXFFQEA5NDQ3IB0oJiZjXFtMRkYAAAEyLi5UTU15SEVhOTdhWlpqYmI1MDBza2ssKipYUlJCPT1bVVU/OjpRSkpMLCpIKihmMi6VZ2V4VFE8NzdWUFBIQ0MkIiJOSUh5cXB/Skh2RkNUMC5dNzVuQD1xQj9nSEZALCqAWFZnPTo/JCRUKCY0GBh0Q0JVW1UgHR1kbGQ0OTRxx65uwahDdmdWmYWW2sZvw6tcoo5mtJ6pW+hyAAAAAXRSTlMAQObYZgAAAAlwSFlzAAALEwAACxMBAJqcGAAAAK9JREFUeNp901cCgyAMBmBU9K9oa7VaR4fde+/2/gerB0jCCw8fISGAUuwAlICPH8dQeH9ejCLH9f59gk6I4HS+0XlRVbnx7Aup2DpAmerABARjB6yOm2YJGdtHmWk0E5l2uS72wJw+DmbWoTBTh9FesgDAoc03GG6Hbz7aEqIlRUoYShhL6PMIEUMJh6OusG090NwTQzRJxhy6keuxSZHFllCRlwoV+ZatpXvhv9Mfx6IK2oVBcCAAAAAASUVORK5CYII='), auto";
+//# sourceMappingURL=icons.d.ts.map