@arbor-css/colors 0.0.1

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.
@@ -0,0 +1,31 @@
1
+ import { CalcEvaluationContext, CalcOperations, ComputationResult, Equation } from '@arbor-css/calc';
2
+ export interface OklchColorEquation {
3
+ l: Equation;
4
+ c: Equation;
5
+ h: Equation;
6
+ /**
7
+ * Prints the CSS value of the color equation, including all
8
+ * calculations and variable references - fully dynamic.
9
+ */
10
+ printDynamic(context: CalcEvaluationContext): string;
11
+ /**
12
+ * Uses the equation and provided context to compute a static
13
+ * OKLCH color string with calculations and references resolved.
14
+ */
15
+ printComputed(context: CalcEvaluationContext): string;
16
+ /**
17
+ * Returns the raw computed L, C, H values as numbers with units.
18
+ */
19
+ compute(ctx: CalcEvaluationContext): {
20
+ l: ComputationResult;
21
+ c: ComputationResult;
22
+ h: ComputationResult;
23
+ };
24
+ }
25
+ export declare function oklchBuilder(impl: ($: CalcOperations) => {
26
+ from?: Equation;
27
+ l: Equation;
28
+ c: Equation;
29
+ h: Equation;
30
+ }): OklchColorEquation;
31
+ //# sourceMappingURL=color.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../src/color.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,qBAAqB,EACrB,cAAc,EACd,iBAAiB,EACjB,QAAQ,EAIR,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,kBAAkB;IAClC,CAAC,EAAE,QAAQ,CAAC;IACZ,CAAC,EAAE,QAAQ,CAAC;IACZ,CAAC,EAAE,QAAQ,CAAC;IAEZ;;;OAGG;IACH,YAAY,CAAC,OAAO,EAAE,qBAAqB,GAAG,MAAM,CAAC;IACrD;;;OAGG;IACH,aAAa,CAAC,OAAO,EAAE,qBAAqB,GAAG,MAAM,CAAC;IACtD;;OAEG;IACH,OAAO,CAAC,GAAG,EAAE,qBAAqB,GAAG;QACpC,CAAC,EAAE,iBAAiB,CAAC;QACrB,CAAC,EAAE,iBAAiB,CAAC;QACrB,CAAC,EAAE,iBAAiB,CAAC;KACrB,CAAC;CACF;AAED,wBAAgB,YAAY,CAC3B,IAAI,EAAE,CAAC,CAAC,EAAE,cAAc,KAAK;IAC5B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,CAAC,EAAE,QAAQ,CAAC;IACZ,CAAC,EAAE,QAAQ,CAAC;IACZ,CAAC,EAAE,QAAQ,CAAC;CACZ,GACC,kBAAkB,CAiCpB"}
package/dist/color.js ADDED
@@ -0,0 +1,27 @@
1
+ import { $, computeEquation, printComputationResult, printEquation, } from '@arbor-css/calc';
2
+ export function oklchBuilder(impl) {
3
+ const equations = impl($);
4
+ function compute(context) {
5
+ const l = computeEquation(equations.l, context);
6
+ const c = computeEquation(equations.c, context);
7
+ const h = computeEquation(equations.h, context);
8
+ const from = equations.from ? computeEquation(equations.from, context) : undefined;
9
+ return { l, c, h, from };
10
+ }
11
+ return {
12
+ ...equations,
13
+ printDynamic() {
14
+ const l = printEquation(equations.l);
15
+ const c = printEquation(equations.c);
16
+ const h = printEquation(equations.h);
17
+ const from = equations.from ? printEquation(equations.from) : undefined;
18
+ return `oklch(${from ? `from ${from} ` : ''}calc(${l}) calc(${c}) calc(${h}))`;
19
+ },
20
+ printComputed(context) {
21
+ const { l, c, h, from } = compute(context);
22
+ return `oklch(${from ? `from ${printComputationResult(from)} ` : ''}${printComputationResult(l)} ${printComputationResult(c)} ${printComputationResult(h)})`;
23
+ },
24
+ compute,
25
+ };
26
+ }
27
+ //# sourceMappingURL=color.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"color.js","sourceRoot":"","sources":["../src/color.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,CAAC,EAKD,eAAe,EACf,sBAAsB,EACtB,aAAa,GACb,MAAM,iBAAiB,CAAC;AA2BzB,MAAM,UAAU,YAAY,CAC3B,IAKC;IAED,MAAM,SAAS,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;IAE1B,SAAS,OAAO,CAAC,OAA8B;QAC9C,MAAM,CAAC,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;QAChD,MAAM,CAAC,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;QAChD,MAAM,CAAC,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC;QAChD,MAAM,IAAI,GACT,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,eAAe,CAAC,SAAS,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QACvE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC;IAC1B,CAAC;IAED,OAAO;QACN,GAAG,SAAS;QACZ,YAAY;YACX,MAAM,CAAC,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;YACrC,MAAM,CAAC,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;YACrC,MAAM,CAAC,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;YACrC,MAAM,IAAI,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;YACxE,OAAO,SACN,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,GAAG,CAAC,CAAC,CAAC,EAC1B,QAAQ,CAAC,UAAU,CAAC,UAAU,CAAC,IAAI,CAAC;QACrC,CAAC;QACD,aAAa,CAAC,OAA8B;YAC3C,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;YAC3C,OAAO,SACN,IAAI,CAAC,CAAC,CAAC,QAAQ,sBAAsB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAClD,GAAG,sBAAsB,CAAC,CAAC,CAAC,IAAI,sBAAsB,CACrD,CAAC,CACD,IAAI,sBAAsB,CAAC,CAAC,CAAC,GAAG,CAAC;QACnC,CAAC;QACD,OAAO;KACP,CAAC;AACH,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=color.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"color.test.d.ts","sourceRoot":"","sources":["../src/color.test.ts"],"names":[],"mappings":""}
@@ -0,0 +1,60 @@
1
+ import { PROPS } from '@';
2
+ import { assert } from '@a-type/utils';
3
+ import { expect, it } from 'vitest';
4
+ import { oklchBuilder } from './color.js';
5
+ const demoColor = oklchBuilder(($) => ({
6
+ l: $.clamp($.add($.literal((ctx) => ctx.appliedProperties[PROPS.SCHEME.LIGHTNESS.NAME]), $.multiply($.literal((ctx) => ctx.appliedProperties[PROPS.SCHEME.MULT.NAME]), $.literal((ctx) => ctx.appliedProperties[PROPS.LOCAL.LIGHTNESS_SPREAD.NAME]))), $.literal(() => '0%'), $.literal(() => '100%')),
7
+ c: $.clamp($.multiply($.literal((ctx) => ctx.appliedProperties[PROPS.LOCAL.SATURATION.NAME]), $.literal((ctx) => ctx.appliedProperties[PROPS.USER.SATURATION.NAME]), $.add($.literal((ctx) => ctx.appliedProperties[PROPS.SCHEME.SATURATION.NAME]), $.multiply($.literal((ctx) => ctx.appliedProperties[PROPS.SCHEME.MULT.NAME])))), $.literal(() => '0%'), $.literal(() => '100%')),
8
+ h: $.literal(() => '210'),
9
+ }));
10
+ it('prints a dynamic oklch representation of a built equation', () => {
11
+ expect(demoColor.printDynamic()).toBe(`oklch(calc(clamp(0%, (var(${PROPS.SCHEME.LIGHTNESS}) + (var(${PROPS.SCHEME.MULT}) * var(${PROPS.LOCAL.LIGHTNESS_SPREAD}))), 100%)) calc(clamp(0%, (var(${PROPS.LOCAL.SATURATION}) * var(${PROPS.USER.SATURATION}) * (var(${PROPS.SCHEME.SATURATION}) + (var(${PROPS.SCHEME.MULT})))), 100%)) calc(210))`);
12
+ });
13
+ const fullProperties = {
14
+ [PROPS.SCHEME.LIGHTNESS.NAME]: '80%',
15
+ [PROPS.SCHEME.MULT.NAME]: '1',
16
+ [PROPS.LOCAL.LIGHTNESS_SPREAD.NAME]: '1',
17
+ [PROPS.LOCAL.SATURATION.NAME]: '1',
18
+ [PROPS.USER.SATURATION.NAME]: '0.5',
19
+ [PROPS.SCHEME.SATURATION.NAME]: '50%',
20
+ };
21
+ it('computes a full evaluation from supplied property values', () => {
22
+ const computed = demoColor.compute({
23
+ appliedProperties: fullProperties,
24
+ });
25
+ expect(computed.l.value).toBe(100);
26
+ assert(computed.l.type === 'numeric');
27
+ expect(computed.l.unit).toBe('%');
28
+ expect(computed.c.value).toBeCloseTo(50, 1);
29
+ assert(computed.c.type === 'numeric');
30
+ expect(computed.c.unit).toBe('%');
31
+ expect(computed.h.value).toBe(210);
32
+ assert(computed.h.type === 'numeric');
33
+ expect(computed.h.unit).toBe('');
34
+ });
35
+ it('prints a computed oklch color string from supplied property values', () => {
36
+ const colorString = demoColor.printComputed({
37
+ appliedProperties: fullProperties,
38
+ });
39
+ expect(colorString).toBe('oklch(100% 50% 210)');
40
+ });
41
+ it('prints a partially resolved oklch color string when some properties are missing', () => {
42
+ const colorString = demoColor.printComputed({
43
+ appliedProperties: {
44
+ [PROPS.SCHEME.LIGHTNESS.NAME]: '80%',
45
+ [PROPS.SCHEME.MULT.NAME]: '1',
46
+ [PROPS.LOCAL.LIGHTNESS_SPREAD.NAME]: '1',
47
+ // saturation properties are missing
48
+ },
49
+ });
50
+ expect(colorString).toMatchInlineSnapshot(`"oklch(100% calc(clamp(0%, calc(calc(var(--🎨-🏠-sat) * var(--🎨-🧑-sat)) * calc(calc(0% + var(--🎨-🌗-sat-neutral)) + var(--🎨-🌗-sat-range-up))), 100%)) 210)"`);
51
+ });
52
+ it('supports function calls in equations', () => {
53
+ const funcColor = oklchBuilder(($) => ({
54
+ l: $.fn('min', $.literal(0), $.literal('l')),
55
+ c: $.literal(0.5),
56
+ h: $.literal(210),
57
+ }));
58
+ expect(funcColor.printDynamic()).toBe(`oklch(calc(min(0, l)) calc(0.5) calc(210))`);
59
+ });
60
+ //# sourceMappingURL=color.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"color.test.js","sourceRoot":"","sources":["../src/color.test.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,26 @@
1
+ import { GlobalConfig } from '@arbor-css/globals';
2
+ import { ColorRangeConfig, CompiledColorRange } from './ranges.js';
3
+ import { SchemeDefinition } from './schemes.js';
4
+ export type CompiledColorRangeWithNeutral<TRangeConfig extends ColorRangeConfig<any>> = CompiledColorRange<TRangeConfig> & {
5
+ /**
6
+ * An automatically-generated neutral range derived from
7
+ * the color range.
8
+ */
9
+ $neutral: CompiledColorRange<TRangeConfig>;
10
+ };
11
+ export type CompiledColorRanges<TRanges extends Record<string, ColorRangeConfig<any>>> = {
12
+ isDark: boolean;
13
+ colors: {
14
+ [K in keyof TRanges]: CompiledColorRangeWithNeutral<TRanges[K]>;
15
+ };
16
+ };
17
+ export type CompiledColors<TRanges extends Record<string, ColorRangeConfig<any>> = Record<string, ColorRangeConfig>, TSchemes extends Record<string, SchemeDefinition> = Record<string, SchemeDefinition>> = {
18
+ [K in keyof TSchemes | 'light' | 'dark']: CompiledColorRanges<TRanges>;
19
+ };
20
+ export type ExtractCompiledColorRanges<TCompiledColors extends CompiledColors<any, any>> = TCompiledColors['light'];
21
+ export declare function compileColors<TRanges extends Record<string, ColorRangeConfig<any>>, TSchemes extends Record<string, SchemeDefinition>>({ ranges, schemes: userSchemes, globals, }: {
22
+ ranges: TRanges;
23
+ schemes?: TSchemes;
24
+ globals?: Partial<GlobalConfig>;
25
+ }): CompiledColors<TRanges, TSchemes>;
26
+ //# sourceMappingURL=compile.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"compile.d.ts","sourceRoot":"","sources":["../src/compile.ts"],"names":[],"mappings":"AACA,OAAO,EAAgB,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,EACN,gBAAgB,EAChB,kBAAkB,EAGlB,MAAM,aAAa,CAAC;AACrB,OAAO,EAGN,gBAAgB,EAChB,MAAM,cAAc,CAAC;AAEtB,MAAM,MAAM,6BAA6B,CACxC,YAAY,SAAS,gBAAgB,CAAC,GAAG,CAAC,IACvC,kBAAkB,CAAC,YAAY,CAAC,GAAG;IACtC;;;OAGG;IACH,QAAQ,EAAE,kBAAkB,CAAC,YAAY,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAC9B,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC,IAClD;IACH,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE;SACN,CAAC,IAAI,MAAM,OAAO,GAAG,6BAA6B,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;KAC/D,CAAC;CACF,CAAC;AAEF,MAAM,MAAM,cAAc,CACzB,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,CAC7D,MAAM,EACN,gBAAgB,CAChB,EACD,QAAQ,SAAS,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,GAAG,MAAM,CACzD,MAAM,EACN,gBAAgB,CAChB,IACE;KACF,CAAC,IAAI,MAAM,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,mBAAmB,CAAC,OAAO,CAAC;CACtE,CAAC;AAEF,MAAM,MAAM,0BAA0B,CACrC,eAAe,SAAS,cAAc,CAAC,GAAG,EAAE,GAAG,CAAC,IAC7C,eAAe,CAAC,OAAO,CAAC,CAAC;AAE7B,wBAAgB,aAAa,CAC5B,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC,EACrD,QAAQ,SAAS,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,EAChD,EACD,MAAM,EACN,OAAO,EAAE,WAAW,EACpB,OAAO,GACP,EAAE;IACF,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,CAAC,EAAE,QAAQ,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC;CAChC,qCA4CA"}
@@ -0,0 +1,34 @@
1
+ import { $globalProps } from '@arbor-css/globals';
2
+ import { compileRange, createNeutralDerivedRange, } from './ranges.js';
3
+ import { defaultDarkScheme, defaultLightScheme, } from './schemes.js';
4
+ export function compileColors({ ranges, schemes: userSchemes, globals, }) {
5
+ const evalContext = {
6
+ propertyValues: {
7
+ [$globalProps.saturation.name]: globals?.saturation?.toString(),
8
+ },
9
+ };
10
+ const schemes = {
11
+ light: defaultLightScheme,
12
+ dark: defaultDarkScheme,
13
+ ...userSchemes,
14
+ };
15
+ return Object.keys(schemes).reduce((acc, schemeName) => {
16
+ const scheme = schemes[schemeName];
17
+ acc[schemeName] = {
18
+ isDark: scheme.isDark,
19
+ colors: Object.keys(ranges).reduce((rangeAcc, rangeName) => {
20
+ const rangeConfig = ranges[rangeName];
21
+ const uncompiled = scheme.getColorRange(rangeConfig);
22
+ const compiled = compileRange(uncompiled, evalContext);
23
+ const uncompiledNeutralRange = createNeutralDerivedRange(uncompiled);
24
+ rangeAcc[rangeName] = {
25
+ ...compiled,
26
+ $neutral: compileRange(uncompiledNeutralRange, evalContext),
27
+ };
28
+ return rangeAcc;
29
+ }, {}),
30
+ };
31
+ return acc;
32
+ }, {});
33
+ }
34
+ //# sourceMappingURL=compile.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"compile.js","sourceRoot":"","sources":["../src/compile.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAgB,MAAM,oBAAoB,CAAC;AAChE,OAAO,EAGN,YAAY,EACZ,yBAAyB,GACzB,MAAM,aAAa,CAAC;AACrB,OAAO,EACN,iBAAiB,EACjB,kBAAkB,GAElB,MAAM,cAAc,CAAC;AAsCtB,MAAM,UAAU,aAAa,CAG3B,EACD,MAAM,EACN,OAAO,EAAE,WAAW,EACpB,OAAO,GAKP;IACA,MAAM,WAAW,GAA0B;QAC1C,cAAc,EAAE;YACf,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE;SAC/D;KACD,CAAC;IACF,MAAM,OAAO,GAAG;QACf,KAAK,EAAE,kBAAkB;QACzB,IAAI,EAAE,iBAAiB;QACvB,GAAG,WAAW;KAC8B,CAAC;IAE9C,OAAO,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,MAAM,CACjC,CAAC,GAAG,EAAE,UAAU,EAAE,EAAE;QACnB,MAAM,MAAM,GAAG,OAAO,CAAC,UAA4B,CAAC,CAAC;QACrD,GAAG,CAAC,UAA4B,CAAC,GAAG;YACnC,MAAM,EAAE,MAAM,CAAC,MAAM;YACrB,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,CACjC,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE;gBACvB,MAAM,WAAW,GAAG,MAAM,CAAC,SAA0B,CAAC,CAAC;gBAEvD,MAAM,UAAU,GAAG,MAAM,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;gBAErD,MAAM,QAAQ,GAAG,YAAY,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;gBAEvD,MAAM,sBAAsB,GAC3B,yBAAyB,CAAC,UAAU,CAAC,CAAC;gBAEvC,QAAQ,CAAC,SAA0B,CAAC,GAAG;oBACtC,GAAG,QAAQ;oBACX,QAAQ,EAAE,YAAY,CAAC,sBAAsB,EAAE,WAAW,CAAC;iBACpD,CAAC;gBACT,OAAO,QAAQ,CAAC;YACjB,CAAC,EACD,EAGC,CACD;SACD,CAAC;QACF,OAAO,GAAG,CAAC;IACZ,CAAC,EACD,EAAuC,CACvC,CAAC;AACH,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=compile.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"compile.test.d.ts","sourceRoot":"","sources":["../src/compile.test.ts"],"names":[],"mappings":""}
@@ -0,0 +1,248 @@
1
+ import { createGlobals } from '@arbor-css/globals';
2
+ import { expect, it } from 'vitest';
3
+ import { compileColors } from './compile.js';
4
+ import { createColorRange, defaultRangeNames } from './ranges.js';
5
+ it('compiles a set of color ranges with default schemes and no precalculated globals', () => {
6
+ const compiled = compileColors({
7
+ ranges: {
8
+ primary: {
9
+ hue: 90,
10
+ rangeNames: ['dark', 'mid', 'light'],
11
+ },
12
+ alt: {
13
+ hue: 210,
14
+ rangeNames: ['dark', 'mid', 'light'],
15
+ },
16
+ },
17
+ schemes: {},
18
+ });
19
+ expect(compiled).toMatchInlineSnapshot(`
20
+ {
21
+ "dark": {
22
+ "alt": {
23
+ "$neutral": {
24
+ "dark": "oklch(calc(clamp(0, calc(0.996 - pow(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
25
+ "light": "oklch(calc(clamp(0, calc(0.23261017031782796 - pow(calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
26
+ "mid": "oklch(calc(clamp(0, calc(0.705302621368203 - pow(calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
27
+ },
28
+ "dark": "oklch(100% calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) 210)",
29
+ "light": "oklch(23.27740405204301% calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)) 210)",
30
+ "mid": "oklch(70.7841830520807% calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)) 210)",
31
+ },
32
+ "primary": {
33
+ "$neutral": {
34
+ "dark": "oklch(calc(clamp(0, calc(0.996 - pow(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
35
+ "light": "oklch(calc(clamp(0, calc(0.23261017031782796 - pow(calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
36
+ "mid": "oklch(calc(clamp(0, calc(0.705302621368203 - pow(calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
37
+ },
38
+ "dark": "oklch(100% calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) 90)",
39
+ "light": "oklch(23.27740405204301% calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)) 90)",
40
+ "mid": "oklch(70.7841830520807% calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)) 90)",
41
+ },
42
+ },
43
+ "light": {
44
+ "alt": {
45
+ "$neutral": {
46
+ "dark": "oklch(calc(clamp(0, calc(0.001 - pow(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
47
+ "light": "oklch(calc(clamp(0, calc(0.996 - pow(calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
48
+ "mid": "oklch(calc(clamp(0, calc(0.7638333333333333 - pow(calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
49
+ },
50
+ "dark": "oklch(0% calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) 210)",
51
+ "light": "oklch(100% calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)) 210)",
52
+ "mid": "oklch(76.66666666666666% calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)) 210)",
53
+ },
54
+ "primary": {
55
+ "$neutral": {
56
+ "dark": "oklch(calc(clamp(0, calc(0.001 - pow(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
57
+ "light": "oklch(calc(clamp(0, calc(0.996 - pow(calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
58
+ "mid": "oklch(calc(clamp(0, calc(0.7638333333333333 - pow(calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
59
+ },
60
+ "dark": "oklch(0% calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) 90)",
61
+ "light": "oklch(100% calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)) 90)",
62
+ "mid": "oklch(76.66666666666666% calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)) 90)",
63
+ },
64
+ },
65
+ }
66
+ `);
67
+ });
68
+ it('compiles a set of color ranges with a custom scheme', () => {
69
+ const compiled = compileColors({
70
+ ranges: {
71
+ primary: {
72
+ hue: 90,
73
+ rangeNames: ['dark', 'mid', 'light'],
74
+ },
75
+ alt: {
76
+ hue: 210,
77
+ rangeNames: ['dark', 'mid', 'light'],
78
+ },
79
+ },
80
+ schemes: {
81
+ custom: {
82
+ tag: '👌',
83
+ getColorRange: (config) => createColorRange(config, {
84
+ lightness: ($) => $.literal('0'),
85
+ chroma: ($) => $.literal('0'),
86
+ }),
87
+ isDark: true,
88
+ },
89
+ },
90
+ });
91
+ expect(compiled).toMatchInlineSnapshot(`
92
+ {
93
+ "custom": {
94
+ "alt": {
95
+ "$neutral": {
96
+ "dark": "oklch(0.001 0 210)",
97
+ "light": "oklch(0.001 0 210)",
98
+ "mid": "oklch(0.001 0 210)",
99
+ },
100
+ "dark": "oklch(0% 0 210)",
101
+ "light": "oklch(0% 0 210)",
102
+ "mid": "oklch(0% 0 210)",
103
+ },
104
+ "primary": {
105
+ "$neutral": {
106
+ "dark": "oklch(0.001 0 90)",
107
+ "light": "oklch(0.001 0 90)",
108
+ "mid": "oklch(0.001 0 90)",
109
+ },
110
+ "dark": "oklch(0% 0 90)",
111
+ "light": "oklch(0% 0 90)",
112
+ "mid": "oklch(0% 0 90)",
113
+ },
114
+ },
115
+ "dark": {
116
+ "alt": {
117
+ "$neutral": {
118
+ "dark": "oklch(calc(clamp(0, calc(0.996 - pow(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
119
+ "light": "oklch(calc(clamp(0, calc(0.23261017031782796 - pow(calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
120
+ "mid": "oklch(calc(clamp(0, calc(0.705302621368203 - pow(calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
121
+ },
122
+ "dark": "oklch(100% calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) 210)",
123
+ "light": "oklch(23.27740405204301% calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)) 210)",
124
+ "mid": "oklch(70.7841830520807% calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)) 210)",
125
+ },
126
+ "primary": {
127
+ "$neutral": {
128
+ "dark": "oklch(calc(clamp(0, calc(0.996 - pow(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
129
+ "light": "oklch(calc(clamp(0, calc(0.23261017031782796 - pow(calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
130
+ "mid": "oklch(calc(clamp(0, calc(0.705302621368203 - pow(calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
131
+ },
132
+ "dark": "oklch(100% calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) 90)",
133
+ "light": "oklch(23.27740405204301% calc(clamp(0, calc(0.31700841514760014 * var(--🎨-🧑-sat)), 0.4)) 90)",
134
+ "mid": "oklch(70.7841830520807% calc(clamp(0, calc(0.3604746560566229 * var(--🎨-🧑-sat)), 0.4)) 90)",
135
+ },
136
+ },
137
+ "light": {
138
+ "alt": {
139
+ "$neutral": {
140
+ "dark": "oklch(calc(clamp(0, calc(0.001 - pow(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
141
+ "light": "oklch(calc(clamp(0, calc(0.996 - pow(calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
142
+ "mid": "oklch(calc(clamp(0, calc(0.7638333333333333 - pow(calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 210)",
143
+ },
144
+ "dark": "oklch(0% calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) 210)",
145
+ "light": "oklch(100% calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)) 210)",
146
+ "mid": "oklch(76.66666666666666% calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)) 210)",
147
+ },
148
+ "primary": {
149
+ "$neutral": {
150
+ "dark": "oklch(calc(clamp(0, calc(0.001 - pow(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
151
+ "light": "oklch(calc(clamp(0, calc(0.996 - pow(calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
152
+ "mid": "oklch(calc(clamp(0, calc(0.7638333333333333 - pow(calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)), 1.6)), 1)) calc(clamp(0, calc(calc(calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)) * var(--🎨-🧑-sat)) * 0.15), 0.4)) 90)",
153
+ },
154
+ "dark": "oklch(0% calc(clamp(0, calc(0.06435767717846044 * var(--🎨-🧑-sat)), 0.4)) 90)",
155
+ "light": "oklch(100% calc(clamp(0, calc(0.1570084151476001 * var(--🎨-🧑-sat)), 0.4)) 90)",
156
+ "mid": "oklch(76.66666666666666% calc(clamp(0, calc(0.28047465605662286 * var(--🎨-🧑-sat)), 0.4)) 90)",
157
+ },
158
+ },
159
+ }
160
+ `);
161
+ });
162
+ it('precomputes colors when globals are provided', () => {
163
+ const globals = createGlobals({
164
+ saturation: 0.5,
165
+ });
166
+ const compiled = compileColors({
167
+ ranges: {
168
+ primary: {
169
+ hue: 90,
170
+ rangeNames: ['dark', 'mid', 'light'],
171
+ },
172
+ },
173
+ schemes: {},
174
+ globals,
175
+ });
176
+ expect(compiled).toMatchInlineSnapshot(`
177
+ {
178
+ "dark": {
179
+ "primary": {
180
+ "$neutral": {
181
+ "dark": "oklch(0.9919063323164973 0.0024134128941922664 90)",
182
+ "light": "oklch(0.18012153608872544 0.011887815568035006 90)",
183
+ "mid": "oklch(0.640833524736341 0.013517799602123357 90)",
184
+ },
185
+ "dark": "oklch(100% 0.03217883858923022 90)",
186
+ "light": "oklch(23.27740405204301% 0.15850420757380007 90)",
187
+ "mid": "oklch(70.7841830520807% 0.18023732802831144 90)",
188
+ },
189
+ },
190
+ "light": {
191
+ "primary": {
192
+ "$neutral": {
193
+ "dark": "oklch(0 0.0024134128941922664 90)",
194
+ "light": "oklch(0.9789459043417997 0.005887815568035004 90)",
195
+ "mid": "oklch(0.7206832334318378 0.010517799602123358 90)",
196
+ },
197
+ "dark": "oklch(0% 0.03217883858923022 90)",
198
+ "light": "oklch(100% 0.07850420757380006 90)",
199
+ "mid": "oklch(76.66666666666666% 0.14023732802831143 90)",
200
+ },
201
+ },
202
+ }
203
+ `);
204
+ });
205
+ it('provides default range names', () => {
206
+ const compiled = compileColors({
207
+ ranges: {
208
+ primary: {
209
+ hue: 90,
210
+ },
211
+ },
212
+ schemes: {},
213
+ });
214
+ for (const name of defaultRangeNames) {
215
+ expect(compiled.dark.colors.primary).toHaveProperty(name);
216
+ }
217
+ });
218
+ it('supports color-level saturation', () => {
219
+ const compiled = compileColors({
220
+ ranges: {
221
+ primaryLight: {
222
+ hue: 90,
223
+ saturation: 0.5,
224
+ },
225
+ primary: {
226
+ hue: 90,
227
+ },
228
+ },
229
+ schemes: {},
230
+ globals: {
231
+ saturation: 1,
232
+ },
233
+ });
234
+ const matchChroma = /oklch\((.*)\)/;
235
+ expect(compiled.dark.colors.primaryLight.light).toMatch(matchChroma);
236
+ expect(compiled.dark.colors.primary.light).toMatch(matchChroma);
237
+ const lightChroma = compiled.dark.colors.primaryLight.light
238
+ .match(matchChroma)?.[1]
239
+ .split(' ')[1];
240
+ const primaryChroma = compiled.dark.colors.primary.light
241
+ .match(matchChroma)?.[1]
242
+ .split(' ')[1];
243
+ console.log({ lightChroma, primaryChroma });
244
+ expect(lightChroma).toBeDefined();
245
+ expect(primaryChroma).toBeDefined();
246
+ expect(Number(lightChroma)).toBeCloseTo(Number(primaryChroma) * 0.5);
247
+ });
248
+ //# sourceMappingURL=compile.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"compile.test.js","sourceRoot":"","sources":["../src/compile.test.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ export declare function getContrastColor(backgroundColor: string): string;
2
+ //# sourceMappingURL=contrast.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"contrast.d.ts","sourceRoot":"","sources":["../src/contrast.ts"],"names":[],"mappings":"AACA,wBAAgB,gBAAgB,CAAC,eAAe,EAAE,MAAM,GAAG,MAAM,CAEhE"}
@@ -0,0 +1,5 @@
1
+ const contrastClamp = 'clamp(0, (0.36 / y - 1) * infinity, 1)';
2
+ export function getContrastColor(backgroundColor) {
3
+ return `color(from ${backgroundColor} xyz-d65 ${contrastClamp} ${contrastClamp} ${contrastClamp} / 100)`;
4
+ }
5
+ //# sourceMappingURL=contrast.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"contrast.js","sourceRoot":"","sources":["../src/contrast.ts"],"names":[],"mappings":"AAAA,MAAM,aAAa,GAAG,wCAAwC,CAAC;AAC/D,MAAM,UAAU,gBAAgB,CAAC,eAAuB;IACvD,OAAO,cAAc,eAAe,YAAY,aAAa,IAAI,aAAa,IAAI,aAAa,SAAS,CAAC;AAC1G,CAAC"}
@@ -0,0 +1,6 @@
1
+ export * from './color.js';
2
+ export * from './compile.js';
3
+ export * from './contrast.js';
4
+ export * from './ranges.js';
5
+ export * from './schemes.js';
6
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,6 @@
1
+ export * from './color.js';
2
+ export * from './compile.js';
3
+ export * from './contrast.js';
4
+ export * from './ranges.js';
5
+ export * from './schemes.js';
6
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC"}
@@ -0,0 +1,46 @@
1
+ import { CalcEvaluationContext, CalcOperations, Equation } from '@arbor-css/calc';
2
+ import { OklchColorEquation } from './color.js';
3
+ export declare const defaultRangeNames: readonly ["ink", "heavier", "heavy", "mid", "light", "lighter", "wash", "paper"];
4
+ export type DefaultRangeName = (typeof defaultRangeNames)[number];
5
+ export interface ColorRangeConfig<RangeNames extends string = DefaultRangeName> {
6
+ /** 0-360ish, OKLCH "H" hue */
7
+ hue: number;
8
+ rangeNames?: readonly RangeNames[];
9
+ /** 0-1, a local multiplier for chroma, stacks on global and computed value */
10
+ saturation?: number;
11
+ }
12
+ export interface ColorRangeCalculations {
13
+ /** A computation for lightness at each step - resolve 0-1 */
14
+ lightness: (tools: CalcOperations, details: {
15
+ step: number;
16
+ rangeSize: number;
17
+ }) => Equation;
18
+ /** A computation for chroma at each step - resolve 0-1 */
19
+ chroma: (tools: CalcOperations, details: {
20
+ step: number;
21
+ rangeSize: number;
22
+ }) => Equation;
23
+ }
24
+ export type InferRangeNames<Config> = Config extends ColorRangeConfig<infer RangeNames> ? '!!!do_not_use_this_name' extends RangeNames ? DefaultRangeName : RangeNames : never;
25
+ export interface ColorRangeItem<TRangeNames extends string = string> {
26
+ equation: OklchColorEquation;
27
+ name: TRangeNames;
28
+ }
29
+ export type UncompiledColorRange<TRangeConfig extends ColorRangeConfig<string>> = {
30
+ [K in InferRangeNames<TRangeConfig>]: ColorRangeItem;
31
+ };
32
+ export type CompiledColorRange<TRangeConfig extends ColorRangeConfig<string>> = {
33
+ [K in InferRangeNames<TRangeConfig>]: string;
34
+ };
35
+ export declare function createColorRange<RangeNames extends string = DefaultRangeName>(config: ColorRangeConfig<RangeNames>, calcs: ColorRangeCalculations): UncompiledColorRange<ColorRangeConfig<RangeNames>>;
36
+ export declare function createColorLightModeRange(config: ColorRangeConfig & {
37
+ base?: number;
38
+ scale?: number;
39
+ }): UncompiledColorRange<ColorRangeConfig<"ink" | "heavier" | "heavy" | "mid" | "light" | "lighter" | "wash" | "paper">>;
40
+ export declare function createColorDarkModeRange(config: ColorRangeConfig & {
41
+ base?: number;
42
+ scale?: number;
43
+ }): UncompiledColorRange<ColorRangeConfig<"ink" | "heavier" | "heavy" | "mid" | "light" | "lighter" | "wash" | "paper">>;
44
+ export declare function createNeutralDerivedRange(sourceRange: UncompiledColorRange<ColorRangeConfig<string>>): UncompiledColorRange<ColorRangeConfig<string>>;
45
+ export declare function compileRange<R extends string, TRanges extends Record<string, ColorRangeConfig>>(range: UncompiledColorRange<TRanges[R]>, context: CalcEvaluationContext): CompiledColorRange<TRanges[R]>;
46
+ //# sourceMappingURL=ranges.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ranges.d.ts","sourceRoot":"","sources":["../src/ranges.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,qBAAqB,EACrB,cAAc,EACd,QAAQ,EACR,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAgB,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAE9D,eAAO,MAAM,iBAAiB,kFASpB,CAAC;AACX,MAAM,MAAM,gBAAgB,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC;AAElE,MAAM,WAAW,gBAAgB,CAChC,UAAU,SAAS,MAAM,GAAG,gBAAgB;IAE5C,8BAA8B;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,UAAU,CAAC,EAAE,SAAS,UAAU,EAAE,CAAC;IACnC,8EAA8E;IAC9E,UAAU,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,sBAAsB;IACtC,6DAA6D;IAC7D,SAAS,EAAE,CACV,KAAK,EAAE,cAAc,EACrB,OAAO,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KACxC,QAAQ,CAAC;IACd,0DAA0D;IAC1D,MAAM,EAAE,CACP,KAAK,EAAE,cAAc,EACrB,OAAO,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KACxC,QAAQ,CAAC;CACd;AAED,MAAM,MAAM,eAAe,CAAC,MAAM,IACjC,MAAM,SAAS,gBAAgB,CAAC,MAAM,UAAU,CAAC,GAGhD,yBAAyB,SAAS,UAAU,GAC3C,gBAAgB,GACf,UAAU,GACX,KAAK,CAAC;AAET,MAAM,WAAW,cAAc,CAAC,WAAW,SAAS,MAAM,GAAG,MAAM;IAClE,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,IAAI,EAAE,WAAW,CAAC;CAClB;AAED,MAAM,MAAM,oBAAoB,CAC/B,YAAY,SAAS,gBAAgB,CAAC,MAAM,CAAC,IAC1C;KACF,CAAC,IAAI,eAAe,CAAC,YAAY,CAAC,GAAG,cAAc;CACpD,CAAC;AACF,MAAM,MAAM,kBAAkB,CAAC,YAAY,SAAS,gBAAgB,CAAC,MAAM,CAAC,IAC3E;KACE,CAAC,IAAI,eAAe,CAAC,YAAY,CAAC,GAAG,MAAM;CAC5C,CAAC;AAEH,wBAAgB,gBAAgB,CAAC,UAAU,SAAS,MAAM,GAAG,gBAAgB,EAC5E,MAAM,EAAE,gBAAgB,CAAC,UAAU,CAAC,EACpC,KAAK,EAAE,sBAAsB,GAC3B,oBAAoB,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC,CA+BpD;AAkED,wBAAgB,yBAAyB,CACxC,MAAM,EAAE,gBAAgB,GAAG;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,wHAeD;AAED,wBAAgB,wBAAwB,CACvC,MAAM,EAAE,gBAAgB,GAAG;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CACf,wHAmBD;AAED,wBAAgB,yBAAyB,CACxC,WAAW,EAAE,oBAAoB,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,GACzD,oBAAoB,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,CAyChD;AAED,wBAAgB,YAAY,CAC3B,CAAC,SAAS,MAAM,EAChB,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,EAEhD,KAAK,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EACvC,OAAO,EAAE,qBAAqB,GAC5B,kBAAkB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAOhC"}
package/dist/ranges.js ADDED
@@ -0,0 +1,111 @@
1
+ import { $globalProps } from '@arbor-css/globals';
2
+ import { oklchBuilder } from './color.js';
3
+ export const defaultRangeNames = [
4
+ 'ink',
5
+ 'heavier',
6
+ 'heavy',
7
+ 'mid',
8
+ 'light',
9
+ 'lighter',
10
+ 'wash',
11
+ 'paper',
12
+ ];
13
+ export function createColorRange(config, calcs) {
14
+ const { hue: sourceHue, rangeNames = defaultRangeNames } = config;
15
+ const { lightness, chroma } = calcs;
16
+ const size = rangeNames.length;
17
+ return rangeNames.reduce((acc, name, i) => {
18
+ const equation = oklchBuilder(($) => ({
19
+ l: $.clamp($.castPercentage(lightness($, { step: i, rangeSize: size })), $.literal('0%'), $.literal('100%')),
20
+ c: $.clamp($.multiply($.literal(config.saturation ?? 1), $.literal('0.4'), chroma($, { step: i, rangeSize: size }), $.literal($globalProps.saturation.var)), $.literal('0'), $.literal('0.4')),
21
+ h: $.literal(`${sourceHue}`),
22
+ }));
23
+ acc[name] = { name, equation };
24
+ return acc;
25
+ }, {});
26
+ }
27
+ function presetLightnessRange({ dir = 1, base = 0.1, scale = 1.2, grade = 1, } = {}) {
28
+ return function ($, step, rangeSize) {
29
+ const inverseStep = rangeSize - step;
30
+ const stepToUse = dir > 0 ? step : inverseStep;
31
+ // inverse cosine curve
32
+ const curve = $.subtract($.literal(1), $.divide($.add($.fn('cos', $.literal((stepToUse / rangeSize) * (Math.PI * scale))), $.literal(1)), $.literal(2)));
33
+ const baseSlope = $.multiply($.literal(base), $.literal(grade), $.literal(stepToUse / rangeSize));
34
+ return $.add(baseSlope, curve);
35
+ };
36
+ }
37
+ // chroma: reduced at either end of the range
38
+ function presetChromaRange({ base = 0.1, scale = 1.2, grade = 1 }) {
39
+ return function ($, step, rangeSize) {
40
+ const baseSlope = $.multiply($.literal(base), $.literal(grade), $.literal(step / rangeSize));
41
+ return $.add(baseSlope, $.multiply($.fn('pow', $.fn('sin', $.add($.multiply(
42
+ // nudge the chroma upward a bit at the top end / down at the bottom end
43
+ $.literal(step / rangeSize), $.literal(Math.PI * scale), $.literal(0.8)), $.literal(0.5))), $.literal(2)), $.literal(0.7)));
44
+ };
45
+ }
46
+ export function createColorLightModeRange(config) {
47
+ const lightness = presetLightnessRange({
48
+ dir: 1,
49
+ base: config.base ?? 0.8,
50
+ scale: config.scale ?? 1.5,
51
+ });
52
+ const chroma = presetChromaRange({
53
+ base: 0.05,
54
+ scale: 1.1,
55
+ });
56
+ return createColorRange(config, {
57
+ lightness: ($, { step, rangeSize }) => lightness($, step, rangeSize),
58
+ chroma: ($, { step, rangeSize }) => chroma($, step, rangeSize),
59
+ });
60
+ }
61
+ export function createColorDarkModeRange(config) {
62
+ const lightness = presetLightnessRange({
63
+ dir: -1,
64
+ base: config.base ?? 0.2,
65
+ // larger = upper range is brighter
66
+ scale: config.scale ?? 0.7,
67
+ grade: 0.8,
68
+ });
69
+ const chroma = presetChromaRange({
70
+ base: 0.4,
71
+ // larger = lower range is desaturated
72
+ scale: 1,
73
+ grade: 2,
74
+ });
75
+ return createColorRange(config, {
76
+ lightness: ($, { step, rangeSize }) => lightness($, step, rangeSize),
77
+ chroma: ($, { step, rangeSize }) => chroma($, step, rangeSize),
78
+ });
79
+ }
80
+ export function createNeutralDerivedRange(sourceRange) {
81
+ function lightness($, source) {
82
+ const sourceLAsZeroToOne = $.divide(source.l, $.literal('100%'));
83
+ const fromL = $.add(sourceLAsZeroToOne, $.multiply($.divide($.subtract(sourceLAsZeroToOne, $.literal('0.2')), $.literal('0.2')), $.literal('-0.001')));
84
+ return $.subtract(fromL, $.fn('pow', source.c, $.literal(1.6)));
85
+ }
86
+ function chroma($, source) {
87
+ return $.multiply(source.c, $.literal($globalProps.saturation.var), $.literal('0.15'));
88
+ }
89
+ return Object.fromEntries(Object.keys(sourceRange).map((sourceName) => {
90
+ const sourceEquation = sourceRange[sourceName].equation;
91
+ const equation = oklchBuilder(($) => ({
92
+ l: $.clamp(lightness($, sourceEquation), $.literal(0), $.literal(1)),
93
+ c: $.clamp(chroma($, sourceEquation), $.literal(0), $.literal(0.4)),
94
+ h: sourceEquation.h,
95
+ }));
96
+ return [
97
+ sourceName,
98
+ {
99
+ name: sourceName,
100
+ equation,
101
+ },
102
+ ];
103
+ }));
104
+ }
105
+ export function compileRange(range, context) {
106
+ return Object.fromEntries(Object.keys(range).map((name) => [
107
+ name,
108
+ range[name].equation.printComputed(context),
109
+ ]));
110
+ }
111
+ //# sourceMappingURL=ranges.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ranges.js","sourceRoot":"","sources":["../src/ranges.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,10 @@
1
+ import { ColorRangeConfig, UncompiledColorRange } from './ranges.js';
2
+ export interface SchemeDefinition<RangeConfig extends ColorRangeConfig = ColorRangeConfig> {
3
+ getColorRange: (config: RangeConfig) => UncompiledColorRange<RangeConfig>;
4
+ tag: string;
5
+ isDark: boolean;
6
+ }
7
+ export declare function createScheme<RangeConfig extends ColorRangeConfig = ColorRangeConfig>(def: SchemeDefinition<RangeConfig>): SchemeDefinition<RangeConfig>;
8
+ export declare const defaultLightScheme: SchemeDefinition;
9
+ export declare const defaultDarkScheme: SchemeDefinition;
10
+ //# sourceMappingURL=schemes.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"schemes.d.ts","sourceRoot":"","sources":["../src/schemes.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,gBAAgB,EAGhB,oBAAoB,EACpB,MAAM,aAAa,CAAC;AAErB,MAAM,WAAW,gBAAgB,CAChC,WAAW,SAAS,gBAAgB,GAAG,gBAAgB;IAEvD,aAAa,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,oBAAoB,CAAC,WAAW,CAAC,CAAC;IAC1E,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,OAAO,CAAC;CAChB;AAED,wBAAgB,YAAY,CAC3B,WAAW,SAAS,gBAAgB,GAAG,gBAAgB,EACtD,GAAG,EAAE,gBAAgB,CAAC,WAAW,CAAC,iCAEnC;AAED,eAAO,MAAM,kBAAkB,EAAE,gBAIhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,gBAI/B,CAAC"}
@@ -0,0 +1,15 @@
1
+ import { createColorDarkModeRange, createColorLightModeRange, } from './ranges.js';
2
+ export function createScheme(def) {
3
+ return def;
4
+ }
5
+ export const defaultLightScheme = {
6
+ tag: '☀️',
7
+ getColorRange: createColorLightModeRange,
8
+ isDark: false,
9
+ };
10
+ export const defaultDarkScheme = {
11
+ tag: '🌑',
12
+ getColorRange: createColorDarkModeRange,
13
+ isDark: true,
14
+ };
15
+ //# sourceMappingURL=schemes.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"schemes.js","sourceRoot":"","sources":["../src/schemes.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,wBAAwB,EACxB,yBAAyB,GAEzB,MAAM,aAAa,CAAC;AAUrB,MAAM,UAAU,YAAY,CAE1B,GAAkC;IACnC,OAAO,GAAG,CAAC;AACZ,CAAC;AAED,MAAM,CAAC,MAAM,kBAAkB,GAAqB;IACnD,GAAG,EAAE,IAAI;IACT,aAAa,EAAE,yBAAyB;IACxC,MAAM,EAAE,KAAK;CACb,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAqB;IAClD,GAAG,EAAE,IAAI;IACT,aAAa,EAAE,wBAAwB;IACvC,MAAM,EAAE,IAAI;CACZ,CAAC"}
package/package.json ADDED
@@ -0,0 +1,38 @@
1
+ {
2
+ "name": "@arbor-css/colors",
3
+ "version": "0.0.1",
4
+ "type": "module",
5
+ "publishConfig": {
6
+ "access": "public"
7
+ },
8
+ "files": [
9
+ "dist"
10
+ ],
11
+ "exports": {
12
+ ".": {
13
+ "development": "./src/index.ts",
14
+ "import": "./dist/index.js",
15
+ "node": "./dist/index.js",
16
+ "types": "./dist/index.d.ts",
17
+ "default": "./dist/index.js"
18
+ }
19
+ },
20
+ "sideEffects": false,
21
+ "devDependencies": {
22
+ "@vitest/browser-playwright": "^4.1.5",
23
+ "typescript": "^6.0.3",
24
+ "vitest": "^4.1.5",
25
+ "vite": "^8.0.10"
26
+ },
27
+ "dependencies": {
28
+ "@arbor-css/calc": "0.0.1",
29
+ "@arbor-css/tokens": "0.0.1",
30
+ "@arbor-css/globals": "0.0.1"
31
+ },
32
+ "scripts": {
33
+ "build": "tsc",
34
+ "dev": "tsc -w --preserveWatchOutput",
35
+ "test": "vitest",
36
+ "test:ci": "vitest --run"
37
+ }
38
+ }