@thi.ng/color-palettes 0.9.9 → 1.0.2

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@thi.ng/color-palettes",
-  "version": "0.9.9",
-  "description": "Collection of 190+ image based color palettes",
+  "version": "1.0.2",
+  "description": "Collection of 200+ image based color themes & composable theme query filters",
   "type": "module",
   "module": "./index.js",
   "typings": "./index.d.ts",
@@ -32,11 +32,20 @@
     "doc:stats": "tools:module-stats",
     "pub": "yarn npm publish --access public",
     "test": "testament test",
-    "tool:swatches": "tools:node-esm tools/index.ts"
+    "build:binary": "tools:node-esm tools/encode.ts",
+    "tool:swatches": "tools:node-esm tools/swatches.ts"
+  },
+  "dependencies": {
+    "@thi.ng/api": "^8.7.2",
+    "@thi.ng/base-n": "^2.4.1",
+    "@thi.ng/checks": "^3.3.9",
+    "@thi.ng/color": "^5.3.2",
+    "@thi.ng/errors": "^2.2.11",
+    "@thi.ng/hex": "^2.3.6"
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.34.2",
-    "@thi.ng/testament": "^0.3.10",
+    "@thi.ng/testament": "^0.3.11",
     "rimraf": "^4.1.2",
     "tools": "^0.0.1",
     "typedoc": "^0.23.24",
@@ -66,11 +75,20 @@
   "exports": {
     ".": {
       "default": "./index.js"
+    },
+    "./api": {
+      "default": "./api.js"
+    },
+    "./filter": {
+      "default": "./filter.js"
+    },
+    "./theme": {
+      "default": "./theme.js"
     }
   },
   "thi.ng": {
     "parent": "@thi.ng/color",
     "year": 2021
   },
-  "gitHead": "50ba9c87676fac60c46d2bc0e4d2c7711a374a68\n"
+  "gitHead": "7896250248d960109253215c75b115c46626293e\n"
 }

package/query.d.ts

@@ -0,0 +1,106 @@
+import type { ColorPredicate, ThemeColor, ThemePredicate } from "./api.js";
+/**
+ * Higher order theme filter. Takes a predicate function which will be applied
+ * to a single {@link ThemeColor}. Returns a new function which accepts a single
+ * {@link Theme} and returns true iff the given predicate succeeds for at least
+ * `threshold` colors in the theme (all colors by default).
+ *
+ * @param pred
+ * @param threshold
+ */
+export declare const defFilter: (pred: ColorPredicate, threshold?: number) => ThemePredicate;
+/**
+ * Higher order theme filter. Takes a number of theme predicate (e.g. those
+ * provided by this package) and returns new predicate function which only
+ * succeeds if *all* given predicates pass.
+ *
+ * @example
+ * ```ts
+ * // compose combined query filter
+ * const pastels = comp(
+ *   // require all theme colors to max 25% chroma
+ *   filterChroma(0, 0.25),
+ *   // require at least 3 theme colors to be min 50% luma
+ *   filterLuma(0.5, 1, 3)
+ * );
+ *
+ * [...cssThemes()].filter(pastels)
+ * // [
+ * //   [ '#453f38', '#746b5d', '#b39777', '#c1c2b2', '#e3dccf', '#f1ede7' ],
+ * //   [ '#857b84', '#b1a7b0', '#d0c7d0', '#e7e0e8', '#faeceb', '#e4e9fa' ]
+ * // ]
+ * ```
+ *
+ * @param filters
+= */
+export declare const comp: (...filters: ThemePredicate[]) => ThemePredicate;
+/**
+ * Theme predicate which ensures colors are within the given normalized hue
+ * range ([0..1] interval). See {@link defFilter} for more details.
+ *
+ * @remarks
+ * Internally converts colors to LCH (unless already the case). Therefore also
+ * uses LCH hues (which are slightly offset compared to HSV/HSL).
+ *
+ * If `max < min`, the filter will consider hues in both the `[min..1] and
+ * [0..max]` intervals (i.e. angular wraparound on color wheel).
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export declare const filterHue: (min: number, max: number, threshold?: number) => ThemePredicate;
+/**
+ * Theme predicate which ensures colors are within the given normalized chroma
+ * range ([0..1] interval). See {@link defFilter} for more details.
+ *
+ * @remarks
+ * Internally converts colors to LCH (unless already the case).
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export declare const filterChroma: (min: number, max: number, threshold?: number) => ThemePredicate;
+/**
+ * Theme predicate which ensures colors are within the given normalized
+ * luminance range ([0..1] interval). See {@link defFilter} for more details.
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export declare const filterLuma: (min: number, max: number, threshold?: number) => ThemePredicate;
+/**
+ * Theme predicate which ensures colors are within the given normalized distance
+ * in LCH space.
+ *
+ * @remarks
+ * Internally converts colors to LCH (unless already the case).
+ *
+ * See {@link defFilter} &
+ * [`distLch()`](https://docs.thi.ng/umbrella/color/functions/distLch.html) for
+ * more details.
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export declare const filterProximityLCH: (color: ThemeColor, eps: number, threshold?: number) => ThemePredicate;
+/**
+ * Theme predicate which ensures colors are within the given normalized distance
+ * in RGB space.
+ *
+ * @remarks
+ * Internally converts colors to sRGB (unless already the case).
+ *
+ * See {@link defFilter} &
+ * [`distEucledian3()`](https://docs.thi.ng/umbrella/color/functions/distEucledian3.html)
+ * for more details.
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export declare const filterProximityRGB: (color: ThemeColor, eps: number, threshold?: number) => ThemePredicate;
+//# sourceMappingURL=query.d.ts.map

package/query.js

@@ -0,0 +1,135 @@
+import { distEucledian3, distLch } from "@thi.ng/color/distance";
+import { lch } from "@thi.ng/color/lch/lch";
+import { luminance } from "@thi.ng/color/luminance";
+import { srgb } from "@thi.ng/color/srgb/srgb";
+/**
+ * Higher order theme filter. Takes a predicate function which will be applied
+ * to a single {@link ThemeColor}. Returns a new function which accepts a single
+ * {@link Theme} and returns true iff the given predicate succeeds for at least
+ * `threshold` colors in the theme (all colors by default).
+ *
+ * @param pred
+ * @param threshold
+ */
+export const defFilter = (pred, threshold) => (theme) => {
+    const $thresh = threshold ?? theme.length;
+    for (let i = theme.length, n = 0; i-- > 0;) {
+        if (pred(theme[i])) {
+            if (++n >= $thresh)
+                return true;
+        }
+    }
+    return false;
+};
+/**
+ * Higher order theme filter. Takes a number of theme predicate (e.g. those
+ * provided by this package) and returns new predicate function which only
+ * succeeds if *all* given predicates pass.
+ *
+ * @example
+ * ```ts
+ * // compose combined query filter
+ * const pastels = comp(
+ *   // require all theme colors to max 25% chroma
+ *   filterChroma(0, 0.25),
+ *   // require at least 3 theme colors to be min 50% luma
+ *   filterLuma(0.5, 1, 3)
+ * );
+ *
+ * [...cssThemes()].filter(pastels)
+ * // [
+ * //   [ '#453f38', '#746b5d', '#b39777', '#c1c2b2', '#e3dccf', '#f1ede7' ],
+ * //   [ '#857b84', '#b1a7b0', '#d0c7d0', '#e7e0e8', '#faeceb', '#e4e9fa' ]
+ * // ]
+ * ```
+ *
+ * @param filters
+= */
+export const comp = (...filters) => (theme) => filters.every((f) => f(theme));
+/**
+ * Theme predicate which ensures colors are within the given normalized hue
+ * range ([0..1] interval). See {@link defFilter} for more details.
+ *
+ * @remarks
+ * Internally converts colors to LCH (unless already the case). Therefore also
+ * uses LCH hues (which are slightly offset compared to HSV/HSL).
+ *
+ * If `max < min`, the filter will consider hues in both the `[min..1] and
+ * [0..max]` intervals (i.e. angular wraparound on color wheel).
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export const filterHue = (min, max, threshold) => defFilter((col) => {
+    let hue = __isLCH(col) ? col[2] : lch(col)[2];
+    hue = hue - Math.floor(hue);
+    return min <= max ? hue >= min && hue <= max : hue >= min || hue <= max;
+}, threshold);
+/**
+ * Theme predicate which ensures colors are within the given normalized chroma
+ * range ([0..1] interval). See {@link defFilter} for more details.
+ *
+ * @remarks
+ * Internally converts colors to LCH (unless already the case).
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export const filterChroma = (min, max, threshold) => defFilter((col) => {
+    const sat = __isLCH(col) ? col[1] : lch(col)[1];
+    return sat >= min && sat <= max;
+}, threshold);
+/**
+ * Theme predicate which ensures colors are within the given normalized
+ * luminance range ([0..1] interval). See {@link defFilter} for more details.
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export const filterLuma = (min, max, threshold) => defFilter((col) => {
+    const l = luminance(col);
+    return l >= min && l <= max;
+}, threshold);
+/**
+ * Theme predicate which ensures colors are within the given normalized distance
+ * in LCH space.
+ *
+ * @remarks
+ * Internally converts colors to LCH (unless already the case).
+ *
+ * See {@link defFilter} &
+ * [`distLch()`](https://docs.thi.ng/umbrella/color/functions/distLch.html) for
+ * more details.
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export const filterProximityLCH = (color, eps, threshold) => {
+    const $color = __isLCH(color) ? color : lch(color);
+    return defFilter((x) => distLch($color, __isLCH(x) ? x : lch(x)) < eps, threshold);
+};
+/**
+ * Theme predicate which ensures colors are within the given normalized distance
+ * in RGB space.
+ *
+ * @remarks
+ * Internally converts colors to sRGB (unless already the case).
+ *
+ * See {@link defFilter} &
+ * [`distEucledian3()`](https://docs.thi.ng/umbrella/color/functions/distEucledian3.html)
+ * for more details.
+ *
+ * @param min
+ * @param max
+ * @param threshold
+ */
+export const filterProximityRGB = (color, eps, threshold) => {
+    const $color = __isRGB(color) ? color : srgb(color);
+    return defFilter((x) => distEucledian3($color, __isRGB(x) ? x : srgb(x)) < eps, threshold);
+};
+const __isLCH = (x) => typeof x !== "string" && x.mode === "lch";
+const __isRGB = (x) => typeof x !== "string" && x.mode === "srgb";

package/theme.d.ts

@@ -0,0 +1,55 @@
+import type { CSSTheme, IntTheme, LCHTheme, RGBTheme, ThemePredicate } from "./api.js";
+/**
+ * Returns theme for given ID as CSS hex colors.
+ *
+ * @param id
+ */
+export declare const asCSS: (id: number) => CSSTheme;
+/**
+ * Returns theme for given ID as packed ARGB integers (alpha channel will always
+ * be set to 0xff).
+ *
+ * @param id
+ */
+export declare const asInt: (id: number) => IntTheme;
+/**
+ * Returns theme for given ID as thi.ng/color LCH color vectors.
+ *
+ * @param id
+ */
+export declare const asLCH: (id: number) => LCHTheme;
+/**
+ * Returns theme for given ID as thi.ng/color sRGB color vectors.
+ *
+ * @param id
+ */
+export declare const asRGB: (id: number) => RGBTheme;
+/**
+ * Yields iterator of CSS themes (via {@link asCSS}). Yields all
+ * themes unless specific theme IDs or filter predicates are provided.
+ *
+ * @param preds
+ */
+export declare const cssThemes: (...preds: ThemePredicate[] | number[]) => Generator<CSSTheme, void, unknown>;
+/**
+ * Yields iterator of packed ARGB integer themes (via {@link asInt}). Yields all
+ * themes unless specific theme IDs or filter predicates are provided.
+ *
+ * @param preds
+ */
+export declare const intThemes: (...preds: ThemePredicate[] | number[]) => Generator<IntTheme, void, unknown>;
+/**
+ * Yields iterator of LCH themes (via {@link asLCH}). Yields all
+ * themes unless specific theme IDs or filter predicates are provided.
+ *
+ * @param preds
+ */
+export declare const lchThemes: (...preds: ThemePredicate[] | number[]) => Generator<LCHTheme, void, unknown>;
+/**
+ * Yields iterator of RGB themes (via {@link asRGB}). Yields all
+ * themes unless specific theme IDs or filter predicates are provided.
+ *
+ * @param preds
+ */
+export declare const rgbThemes: (...preds: ThemePredicate[] | number[]) => Generator<RGBTheme, void, unknown>;
+//# sourceMappingURL=theme.d.ts.map

package/theme.js

@@ -0,0 +1,111 @@
+import { lch } from "@thi.ng/color/lch/lch";
+import { srgb } from "@thi.ng/color/srgb/srgb";
+import { assert } from "@thi.ng/errors/assert";
+import { U24 } from "@thi.ng/hex";
+import { BINARY, NUM_THEMES } from "./binary.js";
+import { compFilter } from "./filter.js";
+/**
+ * Returns theme for given ID as CSS hex colors.
+ *
+ * @param id
+ */
+export const asCSS = (id) => {
+    __ensureID(id);
+    const theme = [];
+    // (<any>theme).__id = id;
+    id *= 18;
+    for (let i = 0; i < 6; i++, id += 3) {
+        theme.push("#" +
+            U24((BINARY[id] << 16) | (BINARY[id + 1] << 8) | BINARY[id + 2]));
+    }
+    return theme;
+};
+/**
+ * Returns theme for given ID as packed ARGB integers (alpha channel will always
+ * be set to 0xff).
+ *
+ * @param id
+ */
+export const asInt = (id) => {
+    __ensureID(id);
+    const theme = [];
+    id *= 18;
+    for (let i = 0; i < 6; i++, id += 3) {
+        theme.push((0xff000000 |
+            (BINARY[id] << 16) |
+            (BINARY[id + 1] << 8) |
+            BINARY[id + 2]) >>>
+            0);
+    }
+    return theme;
+};
+/**
+ * Returns theme for given ID as thi.ng/color LCH color vectors.
+ *
+ * @param id
+ */
+export const asLCH = (id) => asRGB(id).map((x) => lch(x));
+/**
+ * Returns theme for given ID as thi.ng/color sRGB color vectors.
+ *
+ * @param id
+ */
+export const asRGB = (id) => {
+    __ensureID(id);
+    const theme = [];
+    // (<any>theme).__id = id;
+    id *= 18;
+    for (let i = 0; i < 6; i++, id += 3) {
+        theme.push(srgb(BINARY[id] / 255, BINARY[id + 1] / 255, BINARY[id + 2] / 255, 1));
+    }
+    return theme;
+};
+/**
+ * Yields iterator of CSS themes (via {@link asCSS}). Yields all
+ * themes unless specific theme IDs or filter predicates are provided.
+ *
+ * @param preds
+ */
+export const cssThemes = (...preds) => __themes(asCSS, preds);
+/**
+ * Yields iterator of packed ARGB integer themes (via {@link asInt}). Yields all
+ * themes unless specific theme IDs or filter predicates are provided.
+ *
+ * @param preds
+ */
+export const intThemes = (...preds) => __themes(asInt, preds);
+/**
+ * Yields iterator of LCH themes (via {@link asLCH}). Yields all
+ * themes unless specific theme IDs or filter predicates are provided.
+ *
+ * @param preds
+ */
+export const lchThemes = (...preds) => __themes(asLCH, preds);
+/**
+ * Yields iterator of RGB themes (via {@link asRGB}). Yields all
+ * themes unless specific theme IDs or filter predicates are provided.
+ *
+ * @param preds
+ */
+export const rgbThemes = (...preds) => __themes(asRGB, preds);
+/** @internal */
+function* __themes(fn, preds) {
+    if (preds.length && typeof preds[0] === "function") {
+        const pred = compFilter(...preds);
+        for (let i = 0; i < NUM_THEMES; i++) {
+            const theme = fn(i);
+            if (pred(theme))
+                yield theme;
+        }
+    }
+    else if (preds.length) {
+        for (let id of preds)
+            yield fn(id);
+    }
+    else {
+        for (let i = 0; i < NUM_THEMES; i++)
+            yield fn(i);
+    }
+}
+/** @internal */
+const __ensureID = (id) => assert(id >= 0 && id < NUM_THEMES, `invalid theme ID`);

package/themes.d.ts

@@ -0,0 +1,3 @@
+export declare const themeAsSRGB: (id: number) => number[][];
+export declare const themeAsCSS: (id: number) => string[];
+//# sourceMappingURL=themes.d.ts.map

package/themes.js

@@ -0,0 +1,24 @@
+import { U24 } from "@thi.ng/hex";
+import { BINARY } from "./binary.js";
+export const themeAsSRGB = (id) => {
+    const theme = [];
+    id *= 18;
+    for (let i = 0; i < 6; i++, id += 3) {
+        theme.push([
+            BINARY[id] / 255,
+            BINARY[id + 1] / 255,
+            BINARY[id + 2] / 255,
+            1,
+        ]);
+    }
+    return theme;
+};
+export const themeAsCSS = (id) => {
+    const theme = [];
+    id *= 18;
+    for (let i = 0; i < 6; i++, id += 3) {
+        theme.push("#" +
+            U24((BINARY[id] << 16) | (BINARY[id + 1] << 8) | BINARY[id + 2]));
+    }
+    return theme;
+};