@tenphi/glaze 0.10.1 → 0.11.0
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.
- package/README.md +15 -9
- package/dist/index.cjs +41 -25
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +19 -12
- package/dist/index.d.mts +19 -12
- package/dist/index.mjs +41 -25
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -376,16 +376,17 @@ interface GlazeColorOverrides {
|
|
|
376
376
|
/** Saturation multiplier on the seed (0–1). Default: 1. */
|
|
377
377
|
saturationFactor?: number;
|
|
378
378
|
/**
|
|
379
|
-
* Adaptation mode. Defaults
|
|
380
|
-
*
|
|
381
|
-
*
|
|
382
|
-
*
|
|
383
|
-
*
|
|
384
|
-
*
|
|
379
|
+
* Adaptation mode. Defaults to `'auto'` for every input form, so
|
|
380
|
+
* colors automatically adapt between light and dark like an ordinary
|
|
381
|
+
* theme color. The default *scaling* snapshot differs by input form:
|
|
382
|
+
* string inputs preserve their light lightness and extend the dark
|
|
383
|
+
* window to `[lo, 100]` (`#000` ↔ `#fff` flip), while `OkhslColor`
|
|
384
|
+
* and `[r, g, b]` tuple inputs snapshot the full `globalConfig.
|
|
385
|
+
* lightLightness` / `globalConfig.darkLightness` windows.
|
|
385
386
|
*
|
|
386
|
-
* Pass `'fixed'` explicitly to opt
|
|
387
|
-
*
|
|
388
|
-
*
|
|
387
|
+
* Pass `'fixed'` explicitly to opt back into the legacy linear, non-
|
|
388
|
+
* inverting mapping; pass `'static'` to pin the same lightness
|
|
389
|
+
* across every variant.
|
|
389
390
|
*/
|
|
390
391
|
mode?: AdaptationMode;
|
|
391
392
|
/**
|
|
@@ -442,8 +443,9 @@ interface GlazeColorOverrides {
|
|
|
442
443
|
* the way up to white.
|
|
443
444
|
*
|
|
444
445
|
* - **`OkhslColor` / `[r, g, b]` tuple / structured inputs**:
|
|
445
|
-
* - `lightLightness:
|
|
446
|
-
*
|
|
446
|
+
* - `lightLightness: globalConfig.lightLightness` — same light window
|
|
447
|
+
* theme colors use, snapshotted at create time.
|
|
448
|
+
* - `darkLightness: globalConfig.darkLightness` — same dark window
|
|
447
449
|
* theme colors use, snapshotted at create time.
|
|
448
450
|
*
|
|
449
451
|
* Passing this object replaces both fields at once. To keep one
|
|
@@ -451,7 +453,12 @@ interface GlazeColorOverrides {
|
|
|
451
453
|
* explicitly.
|
|
452
454
|
*/
|
|
453
455
|
interface GlazeColorScaling {
|
|
454
|
-
/**
|
|
456
|
+
/**
|
|
457
|
+
* Light-mode lightness window. Snapshotted from `globalConfig` at
|
|
458
|
+
* create time: `false` (preserve input) for string inputs, plain
|
|
459
|
+
* `globalConfig.lightLightness` for object / tuple / structured
|
|
460
|
+
* inputs. Pass `false` to preserve input lightness in light mode.
|
|
461
|
+
*/
|
|
455
462
|
lightLightness?: false | [number, number];
|
|
456
463
|
/**
|
|
457
464
|
* Dark-mode lightness window. Snapshotted from `globalConfig` at
|
package/dist/index.d.mts
CHANGED
|
@@ -376,16 +376,17 @@ interface GlazeColorOverrides {
|
|
|
376
376
|
/** Saturation multiplier on the seed (0–1). Default: 1. */
|
|
377
377
|
saturationFactor?: number;
|
|
378
378
|
/**
|
|
379
|
-
* Adaptation mode. Defaults
|
|
380
|
-
*
|
|
381
|
-
*
|
|
382
|
-
*
|
|
383
|
-
*
|
|
384
|
-
*
|
|
379
|
+
* Adaptation mode. Defaults to `'auto'` for every input form, so
|
|
380
|
+
* colors automatically adapt between light and dark like an ordinary
|
|
381
|
+
* theme color. The default *scaling* snapshot differs by input form:
|
|
382
|
+
* string inputs preserve their light lightness and extend the dark
|
|
383
|
+
* window to `[lo, 100]` (`#000` ↔ `#fff` flip), while `OkhslColor`
|
|
384
|
+
* and `[r, g, b]` tuple inputs snapshot the full `globalConfig.
|
|
385
|
+
* lightLightness` / `globalConfig.darkLightness` windows.
|
|
385
386
|
*
|
|
386
|
-
* Pass `'fixed'` explicitly to opt
|
|
387
|
-
*
|
|
388
|
-
*
|
|
387
|
+
* Pass `'fixed'` explicitly to opt back into the legacy linear, non-
|
|
388
|
+
* inverting mapping; pass `'static'` to pin the same lightness
|
|
389
|
+
* across every variant.
|
|
389
390
|
*/
|
|
390
391
|
mode?: AdaptationMode;
|
|
391
392
|
/**
|
|
@@ -442,8 +443,9 @@ interface GlazeColorOverrides {
|
|
|
442
443
|
* the way up to white.
|
|
443
444
|
*
|
|
444
445
|
* - **`OkhslColor` / `[r, g, b]` tuple / structured inputs**:
|
|
445
|
-
* - `lightLightness:
|
|
446
|
-
*
|
|
446
|
+
* - `lightLightness: globalConfig.lightLightness` — same light window
|
|
447
|
+
* theme colors use, snapshotted at create time.
|
|
448
|
+
* - `darkLightness: globalConfig.darkLightness` — same dark window
|
|
447
449
|
* theme colors use, snapshotted at create time.
|
|
448
450
|
*
|
|
449
451
|
* Passing this object replaces both fields at once. To keep one
|
|
@@ -451,7 +453,12 @@ interface GlazeColorOverrides {
|
|
|
451
453
|
* explicitly.
|
|
452
454
|
*/
|
|
453
455
|
interface GlazeColorScaling {
|
|
454
|
-
/**
|
|
456
|
+
/**
|
|
457
|
+
* Light-mode lightness window. Snapshotted from `globalConfig` at
|
|
458
|
+
* create time: `false` (preserve input) for string inputs, plain
|
|
459
|
+
* `globalConfig.lightLightness` for object / tuple / structured
|
|
460
|
+
* inputs. Pass `false` to preserve input lightness in light mode.
|
|
461
|
+
*/
|
|
455
462
|
lightLightness?: false | [number, number];
|
|
456
463
|
/**
|
|
457
464
|
* Dark-mode lightness window. Snapshotted from `globalConfig` at
|
package/dist/index.mjs
CHANGED
|
@@ -908,16 +908,25 @@ const STANDALONE_BASE = "externalBase";
|
|
|
908
908
|
* retroactively change the resolved variants of an already-created
|
|
909
909
|
* token (matches the documented "frozen at create time" semantics).
|
|
910
910
|
*
|
|
911
|
-
* String value-shorthand inputs
|
|
911
|
+
* String value-shorthand inputs preserve their light lightness exactly
|
|
912
|
+
* (`lightLightness: false`) and use an extended dark window
|
|
912
913
|
* `[globalConfig.darkLightness[0], 100]` so a totally-black input can
|
|
913
|
-
* Möbius-invert to totally-white in dark mode
|
|
914
|
-
* structured inputs
|
|
914
|
+
* Möbius-invert to totally-white in dark mode. Object / tuple /
|
|
915
|
+
* structured inputs snapshot both windows from `globalConfig` verbatim
|
|
916
|
+
* so they behave like an ordinary theme color (auto-adapted on both
|
|
917
|
+
* sides).
|
|
915
918
|
*/
|
|
916
|
-
function defaultStandaloneScaling(
|
|
917
|
-
|
|
919
|
+
function defaultStandaloneScaling(isString) {
|
|
920
|
+
if (isString) {
|
|
921
|
+
const [darkLo] = globalConfig.darkLightness;
|
|
922
|
+
return {
|
|
923
|
+
lightLightness: false,
|
|
924
|
+
darkLightness: [darkLo, 100]
|
|
925
|
+
};
|
|
926
|
+
}
|
|
918
927
|
return {
|
|
919
|
-
lightLightness:
|
|
920
|
-
darkLightness:
|
|
928
|
+
lightLightness: globalConfig.lightLightness,
|
|
929
|
+
darkLightness: globalConfig.darkLightness
|
|
921
930
|
};
|
|
922
931
|
}
|
|
923
932
|
/** Reserved internal names that user-supplied `name` must not collide with. */
|
|
@@ -1946,17 +1955,18 @@ function extractOkhslFromValue(value) {
|
|
|
1946
1955
|
* Build the `ColorMap` for a value-shorthand `glaze.color()` call.
|
|
1947
1956
|
*
|
|
1948
1957
|
* The user-facing color (`STANDALONE_VALUE`) defaults to `mode: 'auto'`
|
|
1949
|
-
*
|
|
1958
|
+
* across every value-shorthand form. String inputs pair with the
|
|
1950
1959
|
* extended dark window so a totally-black input renders as totally-white
|
|
1951
|
-
* in dark mode
|
|
1952
|
-
*
|
|
1960
|
+
* in dark mode; `OkhslColor` / RGB-tuple inputs auto-adapt into the
|
|
1961
|
+
* snapshotted `globalConfig.lightLightness` / `globalConfig.darkLightness`
|
|
1962
|
+
* windows.
|
|
1953
1963
|
*
|
|
1954
1964
|
* When the user requests `contrast` or relative `lightness`, a hidden
|
|
1955
1965
|
* `STANDALONE_SEED` def is synthesized at `mode: 'static'`. That keeps
|
|
1956
1966
|
* the seed pinned to the literal user-provided color across all four
|
|
1957
1967
|
* variants, so the contrast solver always anchors against it.
|
|
1958
1968
|
*/
|
|
1959
|
-
function buildStandaloneValueDefs(main, options
|
|
1969
|
+
function buildStandaloneValueDefs(main, options) {
|
|
1960
1970
|
const seedHue = typeof options?.hue === "number" ? options.hue : main.h;
|
|
1961
1971
|
const seedSaturation = options?.saturation ?? main.s * 100;
|
|
1962
1972
|
const relativeHue = typeof options?.hue === "string" ? options.hue : void 0;
|
|
@@ -1972,7 +1982,7 @@ function buildStandaloneValueDefs(main, options, inputIsString) {
|
|
|
1972
1982
|
saturation: options?.saturationFactor,
|
|
1973
1983
|
lightness: lightnessOption ?? main.l * 100,
|
|
1974
1984
|
contrast: options?.contrast,
|
|
1975
|
-
mode: options?.mode ??
|
|
1985
|
+
mode: options?.mode ?? "auto",
|
|
1976
1986
|
opacity: options?.opacity,
|
|
1977
1987
|
base: hasExternalBase ? STANDALONE_BASE : needsSeedAnchor ? STANDALONE_SEED : void 0
|
|
1978
1988
|
};
|
|
@@ -2073,7 +2083,7 @@ function createColorToken(input, scaling) {
|
|
|
2073
2083
|
const defs = { [primary]: {
|
|
2074
2084
|
lightness: input.lightness,
|
|
2075
2085
|
saturation: input.saturationFactor,
|
|
2076
|
-
mode: input.mode ?? "
|
|
2086
|
+
mode: input.mode ?? "auto",
|
|
2077
2087
|
contrast: input.contrast,
|
|
2078
2088
|
opacity: input.opacity,
|
|
2079
2089
|
base: hasExternalBase ? STANDALONE_BASE : needsSeedAnchor ? STANDALONE_SEED : void 0
|
|
@@ -2095,7 +2105,7 @@ function createColorTokenFromValue(value, options, scaling) {
|
|
|
2095
2105
|
const inputIsString = typeof value === "string";
|
|
2096
2106
|
const main = extractOkhslFromValue(value);
|
|
2097
2107
|
const baseToken = resolveBaseToken(options?.base);
|
|
2098
|
-
const { seedHue, seedSaturation, defs, primary } = buildStandaloneValueDefs(main, options
|
|
2108
|
+
const { seedHue, seedSaturation, defs, primary } = buildStandaloneValueDefs(main, options);
|
|
2099
2109
|
const effectiveScaling = scaling ?? defaultStandaloneScaling(inputIsString);
|
|
2100
2110
|
const exportData = () => ({
|
|
2101
2111
|
form: "value",
|
|
@@ -2215,17 +2225,23 @@ function isStructuredColorInput(input) {
|
|
|
2215
2225
|
* emits (`rgb()`, `hsl()`, `okhsl()`, `oklch()`), an `OkhslColor`
|
|
2216
2226
|
* object `{ h, s, l }` (0–1 ranges), or an `[r, g, b]` (0–255) tuple.
|
|
2217
2227
|
*
|
|
2218
|
-
* Defaults
|
|
2219
|
-
*
|
|
2220
|
-
*
|
|
2221
|
-
*
|
|
2222
|
-
*
|
|
2223
|
-
*
|
|
2224
|
-
* -
|
|
2225
|
-
*
|
|
2226
|
-
*
|
|
2227
|
-
* -
|
|
2228
|
-
* `
|
|
2228
|
+
* Defaults: every input form defaults to `mode: 'auto'` so colors
|
|
2229
|
+
* automatically adapt between light and dark like an ordinary theme
|
|
2230
|
+
* color. The scaling snapshot taken at create time differs by input
|
|
2231
|
+
* form:
|
|
2232
|
+
* - String value-shorthand: `{ lightLightness: false, darkLightness:
|
|
2233
|
+
* [globalConfig.darkLightness[0], 100] }`. Light preserves the input
|
|
2234
|
+
* exactly; dark Möbius-inverts up to 100, so `glaze.color('#000')`
|
|
2235
|
+
* renders as `#fff` in dark mode (and `glaze.color('#fff')` falls to
|
|
2236
|
+
* the dark `lo` floor).
|
|
2237
|
+
* - `OkhslColor` object / RGB-tuple / structured value-shorthand:
|
|
2238
|
+
* `{ lightLightness: globalConfig.lightLightness, darkLightness:
|
|
2239
|
+
* globalConfig.darkLightness }` — both windows come straight from
|
|
2240
|
+
* `globalConfig`, so the resulting token behaves like a theme color.
|
|
2241
|
+
*
|
|
2242
|
+
* Pass `{ mode: 'fixed' }` to opt back into the legacy linear, non-
|
|
2243
|
+
* inverting mapping, or `{ mode: 'static' }` to pin the same lightness
|
|
2244
|
+
* across every variant.
|
|
2229
2245
|
*
|
|
2230
2246
|
* Relative `lightness: '+N'` and `contrast: <ratio>` are anchored to
|
|
2231
2247
|
* the literal seed (the value passed in) by default, pinned at
|