colorino 0.15.4 → 0.16.0

package/README.md

@@ -5,6 +5,7 @@
 Colorino automatically adapts its palette to your terminal or browser DevTools theme, and degrades colors gracefully so your logs stay readable and on‑brand even in limited environments
 
 ![Demo](https://github.com/simwai/colorino/blob/master/demo-ps.png?raw=true)
+![Demo 2](https://github.com/simwai/colorino/blob/master/demo-ps-2.png?raw=true)
 
 # <a id="0"></a><a id="0"></a>
 
@@ -137,14 +138,11 @@ Use the factory to create as many loggers as you want (each with its own palette
 ```typescript
 import { createColorino } from 'colorino'
 
-const myLogger = createColorino(
-  {
-    // Palette (partial)
-    error: '#ff007b',
-    info: '#3498db',
-  },
-  { disableWarnings: true } // Options (see below)
-)
+const myLogger = createColorino({
+  // Palette (partial)
+  error: '#ff007b',
+  info: '#3498db',
+})
 myLogger.error('Critical!')
 myLogger.info('Rebranded info!')
 ```
@@ -155,7 +153,6 @@ myLogger.info('Rebranded info!')
 
 | Option            | Type                      | Default  | Description                                                                |
 | ----------------- | ------------------------- | -------- | -------------------------------------------------------------------------- |
-| `disableWarnings` | `boolean`                 | `false`  | Suppress warnings when color support can't be detected or is disabled.     |
 | `theme`           | `ThemeOption` (see below) | `'auto'` | Control the active color theme or force a specific mode.                   |
 | `disableOscProbe` | `boolean`                 | `false`  | Disable OSC 11 terminal theme probing (use only env heuristics for theme). |
 | `maxDepth`        | `number`                  | `5`      | Maximum depth when pretty-printing objects in log output.                  |
@@ -269,7 +266,7 @@ Colorino auto-detects your environment and color support, but you can override b
 | `WT_SESSION`     | Enables color detection for Windows Terminal                          |                                |
 | `CI`             | Many CI platforms default to no color                                 | `CI=1 node app.js`             |
 
-### <a id="5-6"></a>Colorize Helper (Manual Overrides)
+### <a id="5-6"></a>Colorize Helper (Manual Overrides) (`colorize(text, hex)`)
 
 Sometimes you want full control over a single piece of text without changing your global palette, e.g. when you use a mostly neutral theme but still want to highlight a keyword.
 
@@ -284,7 +281,7 @@ colorino.info(important, 'Something happened')
 
 When color is disabled (for example via `NO_COLOR=1` or lack of support), `colorize` returns the plain input string, so your logs stay readable.
 
-### <a id="5-7"></a>Browser‑only CSS Helper (`css()`)
+### <a id="5-7"></a>Browser‑only CSS Helper (`css(text, style)`)
 
 In the browser, Colorino also exposes a `css(text, style)` helper that lets you apply arbitrary CSS to a single segment in DevTools using the `%c` formatter.
 
@@ -303,6 +300,19 @@ const badge = colorino.css('NEW', {
 colorino.info('Release status:', badge, 'shipped')
 ```
 
+### <a id="5-7"></a>Gradient Text (`gradient(text, startHex, endHex)`)
+
+Create smooth color transitions across text with the `gradient(text, startHex, endHex)` method, available on all logger instances. Like the css and colorize helper.
+
+```ts
+import { colorino } from 'colorino'
+
+const rainbow = colorino.gradient('Hello Gradient!', '#ff0000', '#0000ff')
+colorino.log(rainbow)
+```
+
+Requires ANSI-256 or Truecolor support (most modern terminals). Degrades gracefully to palette colors on older terminals.
+
 ## <a id="6"></a>Colorino vs. Chalk
 
 | Feature                 | 🎨 **Colorino**          | 🖍️ **Chalk**      |
@@ -334,7 +344,6 @@ A factory function to create your own customized logger instances.
 
 - `palette` (`Partial<Palette>`): An object to override default colors for specific log levels (e.g., `{ error: '#ff007b' }`).
 - `options` (`ColorinoOptions`): An object to control behavior:
-  - `disableWarnings: boolean` (default `false`): Suppress warnings on environments with no color support.
   - `theme: 'dark' | 'light'` (default `auto`): Force a specific theme instead of auto-detecting.
 
 ## <a id="8"></a>Extending Colorino

package/dist/browser.d.mts

@@ -14,7 +14,6 @@ interface BrowserCssArg {
 declare const themePalettes: Record<ThemeName, Palette>;
 
 interface ColorinoOptions {
-    disableWarnings?: boolean;
     theme?: TerminalTheme | ThemeName | 'auto';
     disableOscProbe?: boolean;
     maxDepth?: number;
@@ -27,6 +26,7 @@ interface Colorino {
     debug(...args: unknown[]): void;
     trace(...args: unknown[]): void;
     colorize(text: string, hex: string): void;
+    gradient(text: string, startHex: string, endHex: string): void;
 }
 interface ColorinoBrowserInterface extends Colorino {
     css(text: string, style: CssConsoleStyle): string | BrowserCssArg;

package/dist/browser.d.ts

@@ -14,7 +14,6 @@ interface BrowserCssArg {
 declare const themePalettes: Record<ThemeName, Palette>;
 
 interface ColorinoOptions {
-    disableWarnings?: boolean;
     theme?: TerminalTheme | ThemeName | 'auto';
     disableOscProbe?: boolean;
     maxDepth?: number;
@@ -27,6 +26,7 @@ interface Colorino {
     debug(...args: unknown[]): void;
     trace(...args: unknown[]): void;
     colorize(text: string, hex: string): void;
+    gradient(text: string, startHex: string, endHex: string): void;
 }
 interface ColorinoBrowserInterface extends Colorino {
     css(text: string, style: CssConsoleStyle): string | BrowserCssArg;

package/dist/browser.mjs

@@ -97,21 +97,9 @@ class AbstractColorino {
       };
     }
     const ansiPrefix = this._toAnsiPrefix(hex);
-    if (!ansiPrefix) {
-      return text;
-    }
+    if (!ansiPrefix) return text;
     return `${ansiPrefix}${text}\x1B[0m`;
   }
-  _out(level, args) {
-    const consoleMethod = TypeValidator.isConsoleMethod(level) ? level : "log";
-    const processedArgs = this._processArgs(args);
-    if (this._colorLevel === ColorLevel.NO_COLOR || this._colorLevel === "UnknownEnv") {
-      this._output(consoleMethod, processedArgs);
-      return;
-    }
-    const coloredArgs = this._applyColors(consoleMethod, processedArgs);
-    this._output(consoleMethod, coloredArgs);
-  }
   _toAnsiPrefix(_hex) {
     return "";
   }
@@ -163,12 +151,33 @@ ${cleanStack}`);
       console.log(...args);
     }
   }
+  _out(level, args) {
+    const consoleMethod = TypeValidator.isConsoleMethod(level) ? level : "log";
+    const processedArgs = this._processArgs(args);
+    if (this._colorLevel === ColorLevel.NO_COLOR || this._colorLevel === "UnknownEnv") {
+      this._output(consoleMethod, processedArgs);
+      return;
+    }
+    const coloredArgs = this._applyColors(consoleMethod, processedArgs);
+    this._output(consoleMethod, coloredArgs);
+  }
 }
 
 class ColorinoBrowser extends AbstractColorino {
   constructor(initialPalette, userPalette, validator, colorLevel, options = {}) {
     super(initialPalette, userPalette, validator, colorLevel, options);
   }
+  gradient(text, startHex, endHex) {
+    if (this._colorLevel === ColorLevel.NO_COLOR || this._colorLevel === "UnknownEnv") {
+      return text;
+    }
+    const css = `background: linear-gradient(to right, ${startHex}, ${endHex}); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;`;
+    return {
+      [ColorinoBrowserCss]: true,
+      text,
+      css
+    };
+  }
   css(text, style) {
     if (this._colorLevel === ColorLevel.NO_COLOR || this._colorLevel === "UnknownEnv") {
       return text;
@@ -261,13 +270,11 @@ ${arg}` : arg
 }
 
 class BrowserColorSupportDetector {
-  constructor(_areWarningsDisabled, _window, _navigator, _overrideTheme) {
-    this._areWarningsDisabled = _areWarningsDisabled;
+  constructor(_window, _navigator, _overrideTheme) {
     this._window = _window;
     this._navigator = _navigator;
     this._overrideTheme = _overrideTheme;
   }
-  _alreadyWarned;
   isBrowserEnv() {
     return !!this._window && !!this._navigator?.userAgent;
   }
@@ -279,7 +286,6 @@ class BrowserColorSupportDetector {
       return this._overrideTheme;
     }
     if (typeof this._window.matchMedia !== "function") {
-      this._maybeWarnUser();
       return "unknown";
     }
     const isDarkTheme = this._window.matchMedia(
@@ -290,16 +296,8 @@ class BrowserColorSupportDetector {
     if (this._window.matchMedia(isLightTheme).matches) {
       return "light";
     }
-    this._maybeWarnUser();
     return "unknown";
   }
-  _maybeWarnUser() {
-    if (this._alreadyWarned || this._areWarningsDisabled) return;
-    this._alreadyWarned = true;
-    console.warn(
-      "Consider switching the browser. You browser doesn't have a window.matchMedia() Web API."
-    );
-  }
 }
 
 class InputValidationError extends Error {
@@ -421,7 +419,6 @@ function createColorino(userPalette = {}, options = {}) {
     detectorThemeOverride = options.theme;
   }
   const browserDetector = new BrowserColorSupportDetector(
-    !!options.disableWarnings,
     window,
     navigator,
     detectorThemeOverride

package/dist/cdn.js

@@ -101,21 +101,9 @@
         };
       }
       const ansiPrefix = this._toAnsiPrefix(hex);
-      if (!ansiPrefix) {
-        return text;
-      }
+      if (!ansiPrefix) return text;
       return `${ansiPrefix}${text}\x1B[0m`;
     }
-    _out(level, args) {
-      const consoleMethod = TypeValidator.isConsoleMethod(level) ? level : "log";
-      const processedArgs = this._processArgs(args);
-      if (this._colorLevel === ColorLevel.NO_COLOR || this._colorLevel === "UnknownEnv") {
-        this._output(consoleMethod, processedArgs);
-        return;
-      }
-      const coloredArgs = this._applyColors(consoleMethod, processedArgs);
-      this._output(consoleMethod, coloredArgs);
-    }
     _toAnsiPrefix(_hex) {
       return "";
     }
@@ -167,12 +155,33 @@ ${cleanStack}`);
         console.log(...args);
       }
     }
+    _out(level, args) {
+      const consoleMethod = TypeValidator.isConsoleMethod(level) ? level : "log";
+      const processedArgs = this._processArgs(args);
+      if (this._colorLevel === ColorLevel.NO_COLOR || this._colorLevel === "UnknownEnv") {
+        this._output(consoleMethod, processedArgs);
+        return;
+      }
+      const coloredArgs = this._applyColors(consoleMethod, processedArgs);
+      this._output(consoleMethod, coloredArgs);
+    }
   }
 
   class ColorinoBrowser extends AbstractColorino {
     constructor(initialPalette, userPalette, validator, colorLevel, options = {}) {
       super(initialPalette, userPalette, validator, colorLevel, options);
     }
+    gradient(text, startHex, endHex) {
+      if (this._colorLevel === ColorLevel.NO_COLOR || this._colorLevel === "UnknownEnv") {
+        return text;
+      }
+      const css = `background: linear-gradient(to right, ${startHex}, ${endHex}); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;`;
+      return {
+        [ColorinoBrowserCss]: true,
+        text,
+        css
+      };
+    }
     css(text, style) {
       if (this._colorLevel === ColorLevel.NO_COLOR || this._colorLevel === "UnknownEnv") {
         return text;
@@ -265,13 +274,11 @@ ${arg}` : arg
   }
 
   class BrowserColorSupportDetector {
-    constructor(_areWarningsDisabled, _window, _navigator, _overrideTheme) {
-      this._areWarningsDisabled = _areWarningsDisabled;
+    constructor(_window, _navigator, _overrideTheme) {
       this._window = _window;
       this._navigator = _navigator;
       this._overrideTheme = _overrideTheme;
     }
-    _alreadyWarned;
     isBrowserEnv() {
       return !!this._window && !!this._navigator?.userAgent;
     }
@@ -283,7 +290,6 @@ ${arg}` : arg
         return this._overrideTheme;
       }
       if (typeof this._window.matchMedia !== "function") {
-        this._maybeWarnUser();
         return "unknown";
       }
       const isDarkTheme = this._window.matchMedia(
@@ -294,16 +300,8 @@ ${arg}` : arg
       if (this._window.matchMedia(isLightTheme).matches) {
         return "light";
       }
-      this._maybeWarnUser();
       return "unknown";
     }
-    _maybeWarnUser() {
-      if (this._alreadyWarned || this._areWarningsDisabled) return;
-      this._alreadyWarned = true;
-      console.warn(
-        "Consider switching the browser. You browser doesn't have a window.matchMedia() Web API."
-      );
-    }
   }
 
   const defaultErrorConfig = {
@@ -907,7 +905,6 @@ ${arg}` : arg
       detectorThemeOverride = options.theme;
     }
     const browserDetector = new BrowserColorSupportDetector(
-      !!options.disableWarnings,
       window,
       navigator,
       detectorThemeOverride