@kensio/colophon 2.3.0 → 2.5.0

package/dist/theme/index.js

@@ -0,0 +1,41 @@
+import { THEMES } from "./presets.js";
+export { themeNames } from "./presets.js";
+/**
+ * The palette a theme brings, or `undefined` where there is no theme.
+ *
+ * It is what a partial override merges over, so that a size asking for one
+ * darker shade keeps the rest of the look rather than dropping back to the
+ * neutral default palette.
+ */
+export function themePalette(theme) {
+    return theme === undefined ? undefined : THEMES[theme].colors;
+}
+/**
+ * Fill in the fields a theme supplies and the config did not name.
+ *
+ * A theme is applied by merging rather than by resolving, so that everything
+ * downstream sees an ordinary config and nothing else in the package has to
+ * know that themes exist. Whatever the config sets wins, field by field: this
+ * is `colors`, `background` and `texture` as defaults, not as a look that
+ * cannot be argued with.
+ *
+ * The consequence worth knowing is that a config naming its own `colors`
+ * alongside a theme keeps the theme's background as it was written, so the
+ * accent colour changes and the picture behind it does not. That follows from
+ * the merge, and it is the honest reading of a theme: the background is part
+ * of the look rather than something derived from the palette.
+ */
+export function applyTheme(config) {
+    const theme = config.theme === undefined ? undefined : THEMES[config.theme];
+    if (theme === undefined) {
+        return config;
+    }
+    return {
+        ...config,
+        ...(config.colors === undefined && { colors: theme.colors }),
+        ...(config.background === undefined && { background: theme.background }),
+        ...(config.texture === undefined &&
+            theme.texture !== undefined && { texture: theme.texture }),
+    };
+}
+//# sourceMappingURL=index.js.map

package/dist/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C;;;;;;GAMG;AACH,MAAM,UAAU,YAAY,CAC1B,KAA4B;IAE5B,OAAO,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC;AAChE,CAAC;AAED;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,UAAU,CAAC,MAAsB;IAC/C,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAE5E,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACxB,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,OAAO;QACL,GAAG,MAAM;QACT,GAAG,CAAC,MAAM,CAAC,MAAM,KAAK,SAAS,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC;QAC5D,GAAG,CAAC,MAAM,CAAC,UAAU,KAAK,SAAS,IAAI,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,CAAC;QACxE,GAAG,CAAC,MAAM,CAAC,OAAO,KAAK,SAAS;YAC9B,KAAK,CAAC,OAAO,KAAK,SAAS,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC;KAC7D,CAAC;AACJ,CAAC"}

package/dist/theme/presets.d.ts

@@ -0,0 +1,38 @@
+import type { Background, BrandColors, Texture, ThemeName } from "../types.js";
+/**
+ * What a named theme sets. Every field is an ordinary config option, because
+ * that is all a theme is: a set of defaults for fields a project could have
+ * written out itself, and would rather not.
+ */
+export interface Theme {
+    readonly colors: Required<BrandColors>;
+    readonly background: Background;
+    readonly texture?: Texture;
+}
+/**
+ * The curated set.
+ *
+ * Each one is a whole look rather than a palette, which is why the background
+ * is written out here instead of being derived from the colours: `midnight`
+ * without its mesh and `slate` without its dot grid are the same flat image in
+ * two shades of navy. Deriving would also mean a theme could only ever be the
+ * one gradient the defaults already give.
+ *
+ * Six of them are dark, since white text on a deep background is what a share
+ * image is usually asked to be, and two are light, because a site whose own
+ * pages are light has nothing to reach for otherwise.
+ *
+ * None of them turns grain on, though it is the treatment they would most
+ * obviously want. Per-pixel noise does not compress, and it takes a
+ * 1200x1200 PNG from around 600KB to a little over 2MB: a cost worth paying
+ * on purpose, and not one to hand someone who picked a theme by its name and
+ * is committing the images next to their posts.
+ */
+export declare const THEMES: Readonly<Record<ThemeName, Theme>>;
+/**
+ * The theme names, for validation and for anything listing them. Asserted
+ * rather than written out again, because `Object.keys` loses the key type and
+ * a second copy of the list is one that can drift from the set above.
+ */
+export declare const themeNames: readonly ThemeName[];
+//# sourceMappingURL=presets.d.ts.map

package/dist/theme/presets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"presets.d.ts","sourceRoot":"","sources":["../../src/theme/presets.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAE/E;;;;GAIG;AACH,MAAM,WAAW,KAAK;IACpB,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC,WAAW,CAAC,CAAC;IACvC,QAAQ,CAAC,UAAU,EAAE,UAAU,CAAC;IAChC,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAkIrD,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,UAAU,EAA0B,SAAS,SAAS,EAAE,CAAC"}

package/dist/theme/presets.js

@@ -0,0 +1,150 @@
+/**
+ * The curated set.
+ *
+ * Each one is a whole look rather than a palette, which is why the background
+ * is written out here instead of being derived from the colours: `midnight`
+ * without its mesh and `slate` without its dot grid are the same flat image in
+ * two shades of navy. Deriving would also mean a theme could only ever be the
+ * one gradient the defaults already give.
+ *
+ * Six of them are dark, since white text on a deep background is what a share
+ * image is usually asked to be, and two are light, because a site whose own
+ * pages are light has nothing to reach for otherwise.
+ *
+ * None of them turns grain on, though it is the treatment they would most
+ * obviously want. Per-pixel noise does not compress, and it takes a
+ * 1200x1200 PNG from around 600KB to a little over 2MB: a cost worth paying
+ * on purpose, and not one to hand someone who picked a theme by its name and
+ * is committing the images next to their posts.
+ */
+export const THEMES = {
+    midnight: {
+        colors: {
+            brand: "#6366f1",
+            brandDark: "#0b1020",
+            brandWarm: "#a855f7",
+            foreground: "#e6e9f5",
+        },
+        background: {
+            type: "mesh",
+            color: "#0b1020",
+            blobs: [
+                { color: "#4338ca", x: 0.12, y: 0.05, radius: 0.55, opacity: 0.85 },
+                { color: "#7c3aed", x: 0.9, y: 0.85, radius: 0.5, opacity: 0.7 },
+                { color: "#1d4ed8", x: 0.6, y: 1, radius: 0.4, opacity: 0.45 },
+            ],
+        },
+        texture: { type: "dots", opacity: 0.05 },
+    },
+    aurora: {
+        colors: {
+            brand: "#14b8a6",
+            brandDark: "#04211f",
+            brandWarm: "#8b5cf6",
+            foreground: "#ecfdf5",
+        },
+        background: {
+            type: "mesh",
+            color: "#04211f",
+            blobs: [
+                { color: "#14b8a6", x: 0.15, y: 0.85, radius: 0.7, opacity: 0.85 },
+                { color: "#22d3ee", x: 0.75, y: 0.15, radius: 0.6, opacity: 0.7 },
+                { color: "#8b5cf6", x: 1, y: 0.9, radius: 0.5, opacity: 0.55 },
+            ],
+        },
+    },
+    ember: {
+        colors: {
+            brand: "#f97316",
+            brandDark: "#1a0b06",
+            brandWarm: "#ef4444",
+            foreground: "#fff7ed",
+        },
+        background: {
+            type: "gradient",
+            stops: [
+                { offset: "0%", color: "#1a0b06" },
+                { offset: "55%", color: "#7c2d12" },
+                { offset: "100%", color: "#ea580c" },
+            ],
+        },
+    },
+    forest: {
+        colors: {
+            brand: "#22c55e",
+            brandDark: "#04140c",
+            brandWarm: "#a3e635",
+            foreground: "#ecfdf5",
+        },
+        background: {
+            type: "gradient",
+            stops: [
+                { offset: "0%", color: "#04140c" },
+                { offset: "55%", color: "#14532d" },
+                { offset: "100%", color: "#166534" },
+            ],
+        },
+        texture: { type: "rules", opacity: 0.05 },
+    },
+    bloom: {
+        colors: {
+            brand: "#ec4899",
+            brandDark: "#2e1065",
+            brandWarm: "#f59e0b",
+            foreground: "#fdf4ff",
+        },
+        background: {
+            type: "mesh",
+            color: "#2e1065",
+            blobs: [
+                { color: "#db2777", x: 0.2, y: 0.2, radius: 0.8, opacity: 0.85 },
+                { color: "#f472b6", x: 0.9, y: 0.35, radius: 0.5, opacity: 0.5 },
+                { color: "#7c3aed", x: 0.5, y: 1, radius: 0.75, opacity: 0.8 },
+            ],
+        },
+    },
+    slate: {
+        colors: {
+            brand: "#38bdf8",
+            brandDark: "#0f172a",
+            brandWarm: "#64748b",
+            foreground: "#f1f5f9",
+        },
+        background: { type: "solid", color: "#0f172a" },
+        texture: { type: "dots", opacity: 0.07 },
+    },
+    paper: {
+        colors: {
+            brand: "#b45309",
+            brandDark: "#78350f",
+            brandWarm: "#d97706",
+            foreground: "#1c1917",
+        },
+        background: { type: "solid", color: "#faf7f0" },
+        texture: { type: "rules", opacity: 0.05 },
+    },
+    sandstone: {
+        colors: {
+            brand: "#c2410c",
+            brandDark: "#9a3412",
+            brandWarm: "#f59e0b",
+            foreground: "#292524",
+        },
+        background: {
+            type: "gradient",
+            stops: [
+                { offset: "0%", color: "#fdf6ec" },
+                { offset: "55%", color: "#f7e6cf" },
+                { offset: "100%", color: "#f2d5b3" },
+            ],
+        },
+        texture: { type: "dots", opacity: 0.06 },
+    },
+};
+/**
+ * The theme names, for validation and for anything listing them. Asserted
+ * rather than written out again, because `Object.keys` loses the key type and
+ * a second copy of the list is one that can drift from the set above.
+ */
+export const themeNames = Object.keys(THEMES);
+//# sourceMappingURL=presets.js.map

package/dist/theme/presets.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presets.js","sourceRoot":"","sources":["../../src/theme/presets.ts"],"names":[],"mappings":"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"}