@ankhorage/zora 0.12.0 → 0.12.2

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.
Files changed (40) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/internal/color/harmony.d.ts +12 -0
  3. package/dist/internal/color/harmony.d.ts.map +1 -0
  4. package/dist/internal/color/harmony.js +69 -0
  5. package/dist/internal/color/harmony.js.map +1 -0
  6. package/dist/internal/color/hue.d.ts +3 -0
  7. package/dist/internal/color/hue.d.ts.map +1 -0
  8. package/dist/internal/color/hue.js +7 -0
  9. package/dist/internal/color/hue.js.map +1 -0
  10. package/dist/internal/color/index.d.ts +4 -0
  11. package/dist/internal/color/index.d.ts.map +1 -1
  12. package/dist/internal/color/index.js +4 -0
  13. package/dist/internal/color/index.js.map +1 -1
  14. package/dist/internal/color/oklch.d.ts.map +1 -1
  15. package/dist/internal/color/oklch.js +1 -4
  16. package/dist/internal/color/oklch.js.map +1 -1
  17. package/dist/internal/color/roleHues.d.ts +15 -0
  18. package/dist/internal/color/roleHues.d.ts.map +1 -0
  19. package/dist/internal/color/roleHues.js +103 -0
  20. package/dist/internal/color/roleHues.js.map +1 -0
  21. package/dist/internal/color/scales.d.ts +10 -0
  22. package/dist/internal/color/scales.d.ts.map +1 -0
  23. package/dist/internal/color/scales.js +110 -0
  24. package/dist/internal/color/scales.js.map +1 -0
  25. package/dist/internal/color/types.d.ts +4 -0
  26. package/dist/internal/color/types.d.ts.map +1 -1
  27. package/dist/internal/color/types.js +3 -1
  28. package/dist/internal/color/types.js.map +1 -1
  29. package/package.json +1 -1
  30. package/src/internal/color/harmony.test.ts +145 -0
  31. package/src/internal/color/harmony.ts +96 -0
  32. package/src/internal/color/hue.test.ts +28 -0
  33. package/src/internal/color/hue.ts +7 -0
  34. package/src/internal/color/index.ts +20 -0
  35. package/src/internal/color/oklch.ts +1 -5
  36. package/src/internal/color/roleHues.test.ts +197 -0
  37. package/src/internal/color/roleHues.ts +142 -0
  38. package/src/internal/color/scales.test.ts +151 -0
  39. package/src/internal/color/scales.ts +145 -0
  40. package/src/internal/color/types.ts +10 -0
@@ -0,0 +1,145 @@
1
+ import { describe, expect, test } from 'bun:test';
2
+
3
+ import type { ZoraHexColor } from '../../theme/types';
4
+ import { normalizeHueDegrees } from './hue';
5
+ import {
6
+ computeZoraHarmony,
7
+ parseHexToOklch,
8
+ type ZoraComputedHarmony,
9
+ type ZoraHarmonySlot,
10
+ type ZoraHarmonySlotId,
11
+ } from './index';
12
+
13
+ function hueDeltaDegrees(a: number, b: number): number {
14
+ const raw = Math.abs(a - b) % 360;
15
+ return Math.min(raw, 360 - raw);
16
+ }
17
+
18
+ function expectNormalizedHue(hue: number) {
19
+ expect(hue).toBeGreaterThanOrEqual(0);
20
+ expect(hue).toBeLessThan(360);
21
+ }
22
+
23
+ function getSlotIds(slots: readonly ZoraHarmonySlot[]): ZoraHarmonySlotId[] {
24
+ return slots.map((slot) => slot.id);
25
+ }
26
+
27
+ describe('computeZoraHarmony', () => {
28
+ test('monochromatic returns 1 slot', () => {
29
+ const seed: ZoraHexColor = '#0f766e';
30
+ const harmony: ZoraComputedHarmony = computeZoraHarmony(seed, 'monochromatic');
31
+
32
+ expect(harmony.orderedSlots).toHaveLength(1);
33
+ expect(harmony.orderedSlots[0].id).toBe('base');
34
+ });
35
+
36
+ test('complementary returns 2 slots', () => {
37
+ const seed: ZoraHexColor = '#0f766e';
38
+ const harmony: ZoraComputedHarmony = computeZoraHarmony(seed, 'complementary');
39
+
40
+ expect(harmony.orderedSlots).toHaveLength(2);
41
+ expect(harmony.orderedSlots[0].id).toBe('base');
42
+ expect(harmony.orderedSlots[1].id).toBe('a');
43
+ });
44
+
45
+ test('analogous returns 3 slots', () => {
46
+ const seed: ZoraHexColor = '#0f766e';
47
+ const harmony: ZoraComputedHarmony = computeZoraHarmony(seed, 'analogous');
48
+
49
+ expect(harmony.orderedSlots).toHaveLength(3);
50
+ expect(getSlotIds(harmony.orderedSlots)).toEqual(['base', 'a', 'b']);
51
+ });
52
+
53
+ test('splitComplementary returns 3 slots', () => {
54
+ const seed: ZoraHexColor = '#0f766e';
55
+ const harmony: ZoraComputedHarmony = computeZoraHarmony(seed, 'splitComplementary');
56
+
57
+ expect(harmony.orderedSlots).toHaveLength(3);
58
+ expect(getSlotIds(harmony.orderedSlots)).toEqual(['base', 'a', 'b']);
59
+ });
60
+
61
+ test('triadic returns 3 slots', () => {
62
+ const seed: ZoraHexColor = '#0f766e';
63
+ const harmony: ZoraComputedHarmony = computeZoraHarmony(seed, 'triadic');
64
+
65
+ expect(harmony.orderedSlots).toHaveLength(3);
66
+ expect(getSlotIds(harmony.orderedSlots)).toEqual(['base', 'a', 'b']);
67
+ });
68
+
69
+ test('tetradic returns 4 slots', () => {
70
+ const seed: ZoraHexColor = '#0f766e';
71
+ const harmony: ZoraComputedHarmony = computeZoraHarmony(seed, 'tetradic');
72
+
73
+ expect(harmony.orderedSlots).toHaveLength(4);
74
+ expect(getSlotIds(harmony.orderedSlots)).toEqual(['base', 'a', 'b', 'c']);
75
+ });
76
+
77
+ test('every computed hue is normalized to [0, 360)', () => {
78
+ const seed: ZoraHexColor = '#0f766e';
79
+ const harmonies = [
80
+ 'monochromatic',
81
+ 'complementary',
82
+ 'analogous',
83
+ 'splitComplementary',
84
+ 'triadic',
85
+ 'tetradic',
86
+ ] as const;
87
+
88
+ for (const kind of harmonies) {
89
+ const computed = computeZoraHarmony(seed, kind);
90
+ for (const slot of computed.orderedSlots) {
91
+ expectNormalizedHue(slot.hue);
92
+ }
93
+ }
94
+ });
95
+
96
+ test('base slot approximately matches parsed seed hue for a non-neutral seed', () => {
97
+ const seed: ZoraHexColor = '#ff00ff';
98
+ const seedOklch = parseHexToOklch(seed);
99
+
100
+ const computed = computeZoraHarmony(seed, 'complementary');
101
+ const [base] = computed.orderedSlots;
102
+
103
+ expect(base).toBeDefined();
104
+ if (!base) {
105
+ throw new Error('Expected a base harmony slot.');
106
+ }
107
+
108
+ expect(base.id).toBe('base');
109
+ expect(hueDeltaDegrees(seedOklch.h, base.hue)).toBeLessThan(0.5);
110
+ });
111
+
112
+ test('neutral/low-chroma seed uses a stable fallback hue', () => {
113
+ const seed: ZoraHexColor = '#808080';
114
+ const computed = computeZoraHarmony(seed, 'monochromatic');
115
+
116
+ expect(computed.orderedSlots).toHaveLength(1);
117
+ expect(computed.orderedSlots[0].hue).toBe(260);
118
+ });
119
+
120
+ test('is deterministic for the same seed/harmony', () => {
121
+ const seed: ZoraHexColor = '#0f766e';
122
+
123
+ expect(computeZoraHarmony(seed, 'triadic')).toEqual(computeZoraHarmony(seed, 'triadic'));
124
+ });
125
+
126
+ test('complementary slots are based on base hue + 180', () => {
127
+ const seed: ZoraHexColor = '#0f766e';
128
+ const computed = computeZoraHarmony(seed, 'complementary');
129
+ const [base, a] = computed.orderedSlots;
130
+
131
+ expect(base).toBeDefined();
132
+ expect(a).toBeDefined();
133
+ if (!base || !a) {
134
+ throw new Error('Expected complementary harmony slots.');
135
+ }
136
+
137
+ expect(hueDeltaDegrees(a.hue, normalizeHueDegrees(base.hue + 180))).toBeLessThan(0.0001);
138
+ });
139
+
140
+ test('throws on invalid seed in test/development', () => {
141
+ const invalid: ZoraHexColor = '#nope';
142
+
143
+ expect(() => computeZoraHarmony(invalid, 'triadic')).toThrow();
144
+ });
145
+ });
@@ -0,0 +1,96 @@
1
+ import type { ZoraColorHarmony, ZoraHexColor } from '../../theme/types';
2
+ import { normalizeHueDegrees, rotateHueDegrees } from './hue';
3
+ import { parseHexToOklch } from './oklch';
4
+
5
+ export type ZoraHarmonySlotId = 'base' | 'a' | 'b' | 'c';
6
+
7
+ export interface ZoraHarmonySlot {
8
+ id: ZoraHarmonySlotId;
9
+ hue: number;
10
+ }
11
+
12
+ export interface ZoraComputedHarmony {
13
+ kind: ZoraColorHarmony;
14
+ orderedSlots: readonly ZoraHarmonySlot[];
15
+ }
16
+
17
+ const DEFAULT_HARMONY_HUE_DEGREES = 260;
18
+ const MIN_SEED_CHROMA_FOR_HARMONY_HUE = 0.03;
19
+
20
+ function createSlot(id: ZoraHarmonySlotId, hue: number): ZoraHarmonySlot {
21
+ return { id, hue: normalizeHueDegrees(hue) };
22
+ }
23
+
24
+ function resolveSeedHueDegrees(seed: ZoraHexColor): number {
25
+ const parsed = parseHexToOklch(seed);
26
+
27
+ if (!Number.isFinite(parsed.h) || parsed.c < MIN_SEED_CHROMA_FOR_HARMONY_HUE) {
28
+ return DEFAULT_HARMONY_HUE_DEGREES;
29
+ }
30
+
31
+ return normalizeHueDegrees(parsed.h);
32
+ }
33
+
34
+ export function computeZoraHarmony(
35
+ seed: ZoraHexColor,
36
+ harmony: ZoraColorHarmony,
37
+ ): ZoraComputedHarmony {
38
+ const baseHue = resolveSeedHueDegrees(seed);
39
+
40
+ if (harmony === 'monochromatic') {
41
+ return {
42
+ kind: harmony,
43
+ orderedSlots: [createSlot('base', baseHue)],
44
+ };
45
+ }
46
+
47
+ if (harmony === 'complementary') {
48
+ return {
49
+ kind: harmony,
50
+ orderedSlots: [createSlot('base', baseHue), createSlot('a', rotateHueDegrees(baseHue, 180))],
51
+ };
52
+ }
53
+
54
+ if (harmony === 'analogous') {
55
+ return {
56
+ kind: harmony,
57
+ orderedSlots: [
58
+ createSlot('base', baseHue),
59
+ createSlot('a', rotateHueDegrees(baseHue, -30)),
60
+ createSlot('b', rotateHueDegrees(baseHue, 30)),
61
+ ],
62
+ };
63
+ }
64
+
65
+ if (harmony === 'splitComplementary') {
66
+ return {
67
+ kind: harmony,
68
+ orderedSlots: [
69
+ createSlot('base', baseHue),
70
+ createSlot('a', rotateHueDegrees(baseHue, 150)),
71
+ createSlot('b', rotateHueDegrees(baseHue, 210)),
72
+ ],
73
+ };
74
+ }
75
+
76
+ if (harmony === 'triadic') {
77
+ return {
78
+ kind: harmony,
79
+ orderedSlots: [
80
+ createSlot('base', baseHue),
81
+ createSlot('a', rotateHueDegrees(baseHue, 120)),
82
+ createSlot('b', rotateHueDegrees(baseHue, 240)),
83
+ ],
84
+ };
85
+ }
86
+
87
+ return {
88
+ kind: harmony,
89
+ orderedSlots: [
90
+ createSlot('base', baseHue),
91
+ createSlot('a', rotateHueDegrees(baseHue, 90)),
92
+ createSlot('b', rotateHueDegrees(baseHue, 180)),
93
+ createSlot('c', rotateHueDegrees(baseHue, 270)),
94
+ ],
95
+ };
96
+ }
@@ -0,0 +1,28 @@
1
+ import { describe, expect, test } from 'bun:test';
2
+
3
+ import { normalizeHueDegrees, rotateHueDegrees } from './hue';
4
+
5
+ describe('normalizeHueDegrees', () => {
6
+ test('normalizes negative hues into [0, 360)', () => {
7
+ expect(normalizeHueDegrees(-30)).toBe(330);
8
+ expect(normalizeHueDegrees(-390)).toBe(330);
9
+ });
10
+
11
+ test('normalizes hues >= 360 into [0, 360)', () => {
12
+ expect(normalizeHueDegrees(390)).toBe(30);
13
+ expect(normalizeHueDegrees(720)).toBe(0);
14
+ });
15
+
16
+ test('preserves in-range hues', () => {
17
+ expect(normalizeHueDegrees(0)).toBe(0);
18
+ expect(normalizeHueDegrees(12.5)).toBe(12.5);
19
+ expect(normalizeHueDegrees(359.99)).toBe(359.99);
20
+ });
21
+ });
22
+
23
+ describe('rotateHueDegrees', () => {
24
+ test('rotates and normalizes', () => {
25
+ expect(rotateHueDegrees(350, 30)).toBe(20);
26
+ expect(rotateHueDegrees(10, -30)).toBe(340);
27
+ });
28
+ });
@@ -0,0 +1,7 @@
1
+ export function normalizeHueDegrees(hue: number): number {
2
+ return ((hue % 360) + 360) % 360;
3
+ }
4
+
5
+ export function rotateHueDegrees(hue: number, delta: number): number {
6
+ return normalizeHueDegrees(hue + delta);
7
+ }
@@ -1,2 +1,22 @@
1
+ export {
2
+ computeZoraHarmony,
3
+ type ZoraComputedHarmony,
4
+ type ZoraHarmonySlot,
5
+ type ZoraHarmonySlotId,
6
+ } from './harmony';
1
7
  export { parseHexToOklch } from './oklch';
2
8
  export { resolveModePrimaryColor } from './primary';
9
+ export {
10
+ assignZoraHarmonyRoleHues,
11
+ getZoraHueRoleAssignment,
12
+ type ZoraComputedHueRoles,
13
+ type ZoraHueRoleAssignment,
14
+ type ZoraHueRoleId,
15
+ } from './roleHues';
16
+ export {
17
+ createZoraColorScale,
18
+ type CreateZoraColorScaleOptions,
19
+ createZoraNeutralScale,
20
+ createZoraPrimaryScale,
21
+ } from './scales';
22
+ export { ZORA_COLOR_SCALE_STEPS, type ZoraColorScale, type ZoraColorScaleStep } from './types';
@@ -1,16 +1,12 @@
1
1
  import { converter, formatHex, parse, toGamut } from 'culori';
2
2
 
3
3
  import type { ZoraHexColor } from '../../theme/types';
4
+ import { normalizeHueDegrees } from './hue';
4
5
  import type { ZoraOklchColor } from './types';
5
6
 
6
7
  const toOklch = converter('oklch');
7
8
  const gamutMapToSrgb = toGamut('rgb', 'oklch');
8
9
 
9
- function normalizeHueDegrees(hue: number): number {
10
- const normalized = ((hue % 360) + 360) % 360;
11
- return normalized;
12
- }
13
-
14
10
  function isSixDigitHexColor(value: string): value is ZoraHexColor {
15
11
  return /^#[0-9a-fA-F]{6}$/.test(value);
16
12
  }
@@ -0,0 +1,197 @@
1
+ import { describe, expect, test } from 'bun:test';
2
+
3
+ import {
4
+ assignZoraHarmonyRoleHues,
5
+ getZoraHueRoleAssignment,
6
+ type ZoraComputedHarmony,
7
+ type ZoraComputedHueRoles,
8
+ type ZoraHueRoleAssignment,
9
+ type ZoraHueRoleId,
10
+ } from './index';
11
+
12
+ function expectNormalizedHue(hue: number) {
13
+ expect(Number.isFinite(hue)).toBe(true);
14
+ expect(hue).toBeGreaterThanOrEqual(0);
15
+ expect(hue).toBeLessThan(360);
16
+ }
17
+
18
+ const ROLE_ORDER: readonly ZoraHueRoleId[] = [
19
+ 'primary',
20
+ 'secondary',
21
+ 'accent',
22
+ 'highlight',
23
+ 'surfaceTint',
24
+ ];
25
+
26
+ function expectEveryRoleOnce(roles: ReturnType<typeof assignZoraHarmonyRoleHues>) {
27
+ expect(roles.assignments).toHaveLength(ROLE_ORDER.length);
28
+ expect(roles.assignments.map((assignment) => assignment.role)).toEqual(ROLE_ORDER);
29
+ }
30
+
31
+ describe('assignZoraHarmonyRoleHues', () => {
32
+ test('monochromatic assigns every role to base', () => {
33
+ const harmony: ZoraComputedHarmony = {
34
+ kind: 'monochromatic',
35
+ orderedSlots: [{ id: 'base', hue: 100 }],
36
+ };
37
+
38
+ const roles: ZoraComputedHueRoles = assignZoraHarmonyRoleHues(harmony);
39
+
40
+ expectEveryRoleOnce(roles);
41
+ for (const assignment of roles.assignments) {
42
+ expect(assignment.sourceSlotId).toBe('base');
43
+ expect(assignment.hue).toBe(100);
44
+ expectNormalizedHue(assignment.hue);
45
+ }
46
+ });
47
+
48
+ test('complementary assigns accent/highlight to a', () => {
49
+ const harmony: ZoraComputedHarmony = {
50
+ kind: 'complementary',
51
+ orderedSlots: [
52
+ { id: 'base', hue: 100 },
53
+ { id: 'a', hue: 280 },
54
+ ],
55
+ };
56
+
57
+ const roles: ZoraComputedHueRoles = assignZoraHarmonyRoleHues(harmony);
58
+
59
+ expectEveryRoleOnce(roles);
60
+ const accent: ZoraHueRoleAssignment = getZoraHueRoleAssignment(roles, 'accent');
61
+ const highlight: ZoraHueRoleAssignment = getZoraHueRoleAssignment(roles, 'highlight');
62
+
63
+ expect(accent.sourceSlotId).toBe('a');
64
+ expect(highlight.sourceSlotId).toBe('a');
65
+ expect(getZoraHueRoleAssignment(roles, 'primary').sourceSlotId).toBe('base');
66
+ expect(getZoraHueRoleAssignment(roles, 'surfaceTint').sourceSlotId).toBe('base');
67
+ });
68
+
69
+ test('analogous assigns secondary/surfaceTint to a and accent/highlight to b', () => {
70
+ const harmony: ZoraComputedHarmony = {
71
+ kind: 'analogous',
72
+ orderedSlots: [
73
+ { id: 'base', hue: 100 },
74
+ { id: 'a', hue: 70 },
75
+ { id: 'b', hue: 130 },
76
+ ],
77
+ };
78
+
79
+ const roles = assignZoraHarmonyRoleHues(harmony);
80
+
81
+ expectEveryRoleOnce(roles);
82
+ expect(getZoraHueRoleAssignment(roles, 'secondary').sourceSlotId).toBe('a');
83
+ expect(getZoraHueRoleAssignment(roles, 'surfaceTint').sourceSlotId).toBe('a');
84
+ expect(getZoraHueRoleAssignment(roles, 'accent').sourceSlotId).toBe('b');
85
+ expect(getZoraHueRoleAssignment(roles, 'highlight').sourceSlotId).toBe('b');
86
+ });
87
+
88
+ test('splitComplementary assigns primary/surfaceTint to base and accent/highlight to b', () => {
89
+ const harmony: ZoraComputedHarmony = {
90
+ kind: 'splitComplementary',
91
+ orderedSlots: [
92
+ { id: 'base', hue: 100 },
93
+ { id: 'a', hue: 250 },
94
+ { id: 'b', hue: 310 },
95
+ ],
96
+ };
97
+
98
+ const roles = assignZoraHarmonyRoleHues(harmony);
99
+
100
+ expectEveryRoleOnce(roles);
101
+ expect(getZoraHueRoleAssignment(roles, 'primary').sourceSlotId).toBe('base');
102
+ expect(getZoraHueRoleAssignment(roles, 'surfaceTint').sourceSlotId).toBe('base');
103
+ expect(getZoraHueRoleAssignment(roles, 'accent').sourceSlotId).toBe('b');
104
+ expect(getZoraHueRoleAssignment(roles, 'highlight').sourceSlotId).toBe('b');
105
+ });
106
+
107
+ test('triadic assigns primary/surfaceTint to base and secondary/accent across a/b', () => {
108
+ const harmony: ZoraComputedHarmony = {
109
+ kind: 'triadic',
110
+ orderedSlots: [
111
+ { id: 'base', hue: 100 },
112
+ { id: 'a', hue: 220 },
113
+ { id: 'b', hue: 340 },
114
+ ],
115
+ };
116
+
117
+ const roles = assignZoraHarmonyRoleHues(harmony);
118
+
119
+ expectEveryRoleOnce(roles);
120
+ expect(getZoraHueRoleAssignment(roles, 'primary').sourceSlotId).toBe('base');
121
+ expect(getZoraHueRoleAssignment(roles, 'surfaceTint').sourceSlotId).toBe('base');
122
+ expect(getZoraHueRoleAssignment(roles, 'secondary').sourceSlotId).toBe('a');
123
+ expect(getZoraHueRoleAssignment(roles, 'accent').sourceSlotId).toBe('b');
124
+ });
125
+
126
+ test('tetradic assigns highlight to c', () => {
127
+ const harmony: ZoraComputedHarmony = {
128
+ kind: 'tetradic',
129
+ orderedSlots: [
130
+ { id: 'base', hue: 100 },
131
+ { id: 'a', hue: 190 },
132
+ { id: 'b', hue: 280 },
133
+ { id: 'c', hue: 10 },
134
+ ],
135
+ };
136
+
137
+ const roles = assignZoraHarmonyRoleHues(harmony);
138
+
139
+ expectEveryRoleOnce(roles);
140
+ expect(getZoraHueRoleAssignment(roles, 'highlight').sourceSlotId).toBe('c');
141
+ });
142
+
143
+ test('every assignment hue is normalized to [0, 360)', () => {
144
+ const harmony: ZoraComputedHarmony = {
145
+ kind: 'complementary',
146
+ orderedSlots: [
147
+ { id: 'base', hue: -10 },
148
+ { id: 'a', hue: 370 },
149
+ ],
150
+ };
151
+
152
+ const roles = assignZoraHarmonyRoleHues(harmony);
153
+
154
+ expectEveryRoleOnce(roles);
155
+ for (const assignment of roles.assignments) {
156
+ expectNormalizedHue(assignment.hue);
157
+ }
158
+ });
159
+
160
+ test('is deterministic for the same computed harmony', () => {
161
+ const harmony: ZoraComputedHarmony = {
162
+ kind: 'analogous',
163
+ orderedSlots: [
164
+ { id: 'base', hue: 100 },
165
+ { id: 'a', hue: 70 },
166
+ { id: 'b', hue: 130 },
167
+ ],
168
+ };
169
+
170
+ expect(assignZoraHarmonyRoleHues(harmony)).toEqual(assignZoraHarmonyRoleHues(harmony));
171
+ });
172
+
173
+ test('falls back when a preferred non-base slot is missing', () => {
174
+ const harmony: ZoraComputedHarmony = {
175
+ kind: 'analogous',
176
+ orderedSlots: [
177
+ { id: 'base', hue: 100 },
178
+ { id: 'a', hue: 70 },
179
+ ],
180
+ };
181
+
182
+ const roles = assignZoraHarmonyRoleHues(harmony);
183
+
184
+ expectEveryRoleOnce(roles);
185
+ expect(getZoraHueRoleAssignment(roles, 'accent').sourceSlotId).toBe('a');
186
+ expect(getZoraHueRoleAssignment(roles, 'highlight').sourceSlotId).toBe('a');
187
+ });
188
+
189
+ test('throws a clear error when the base slot is missing', () => {
190
+ const harmony: ZoraComputedHarmony = {
191
+ kind: 'complementary',
192
+ orderedSlots: [{ id: 'a', hue: 200 }],
193
+ };
194
+
195
+ expect(() => assignZoraHarmonyRoleHues(harmony)).toThrow('base');
196
+ });
197
+ });
@@ -0,0 +1,142 @@
1
+ import type { ZoraColorHarmony } from '../../theme/types';
2
+ import type { ZoraComputedHarmony, ZoraHarmonySlot, ZoraHarmonySlotId } from './harmony';
3
+ import { normalizeHueDegrees } from './hue';
4
+
5
+ export type ZoraHueRoleId = 'primary' | 'secondary' | 'accent' | 'highlight' | 'surfaceTint';
6
+
7
+ export interface ZoraHueRoleAssignment {
8
+ role: ZoraHueRoleId;
9
+ hue: number;
10
+ sourceSlotId: ZoraHarmonySlotId;
11
+ }
12
+
13
+ export interface ZoraComputedHueRoles {
14
+ harmony: ZoraColorHarmony;
15
+ assignments: readonly ZoraHueRoleAssignment[];
16
+ }
17
+
18
+ function findSlot(
19
+ harmony: ZoraComputedHarmony,
20
+ id: ZoraHarmonySlotId,
21
+ ): ZoraHarmonySlot | undefined {
22
+ return harmony.orderedSlots.find((slot) => slot.id === id);
23
+ }
24
+
25
+ function requireBaseSlot(harmony: ZoraComputedHarmony): ZoraHarmonySlot {
26
+ const base = findSlot(harmony, 'base');
27
+ if (!base) {
28
+ throw new Error(`[zora] Expected harmony to include a base slot (kind: ${harmony.kind}).`);
29
+ }
30
+ return base;
31
+ }
32
+
33
+ function assignRole(
34
+ role: ZoraHueRoleId,
35
+ harmony: ZoraComputedHarmony,
36
+ preferred: ZoraHarmonySlotId,
37
+ fallback: ZoraHarmonySlotId = 'base',
38
+ ): ZoraHueRoleAssignment {
39
+ const base = requireBaseSlot(harmony);
40
+ const preferredSlot = findSlot(harmony, preferred);
41
+ const fallbackSlot = findSlot(harmony, fallback);
42
+ const chosenSlot = preferredSlot ?? fallbackSlot ?? base;
43
+
44
+ return {
45
+ role,
46
+ hue: normalizeHueDegrees(chosenSlot.hue),
47
+ sourceSlotId: chosenSlot.id,
48
+ };
49
+ }
50
+
51
+ export function assignZoraHarmonyRoleHues(harmony: ZoraComputedHarmony): ZoraComputedHueRoles {
52
+ const { kind } = harmony;
53
+
54
+ if (kind === 'monochromatic') {
55
+ return {
56
+ harmony: kind,
57
+ assignments: [
58
+ assignRole('primary', harmony, 'base'),
59
+ assignRole('secondary', harmony, 'base'),
60
+ assignRole('accent', harmony, 'base'),
61
+ assignRole('highlight', harmony, 'base'),
62
+ assignRole('surfaceTint', harmony, 'base'),
63
+ ],
64
+ };
65
+ }
66
+
67
+ if (kind === 'complementary') {
68
+ return {
69
+ harmony: kind,
70
+ assignments: [
71
+ assignRole('primary', harmony, 'base'),
72
+ assignRole('secondary', harmony, 'base'),
73
+ assignRole('accent', harmony, 'a'),
74
+ assignRole('highlight', harmony, 'a'),
75
+ assignRole('surfaceTint', harmony, 'base'),
76
+ ],
77
+ };
78
+ }
79
+
80
+ if (kind === 'analogous') {
81
+ return {
82
+ harmony: kind,
83
+ assignments: [
84
+ assignRole('primary', harmony, 'base'),
85
+ assignRole('secondary', harmony, 'a'),
86
+ assignRole('accent', harmony, 'b', 'a'),
87
+ assignRole('highlight', harmony, 'b', 'a'),
88
+ assignRole('surfaceTint', harmony, 'a'),
89
+ ],
90
+ };
91
+ }
92
+
93
+ if (kind === 'splitComplementary') {
94
+ return {
95
+ harmony: kind,
96
+ assignments: [
97
+ assignRole('primary', harmony, 'base'),
98
+ assignRole('secondary', harmony, 'a'),
99
+ assignRole('accent', harmony, 'b', 'a'),
100
+ assignRole('highlight', harmony, 'b', 'a'),
101
+ assignRole('surfaceTint', harmony, 'base'),
102
+ ],
103
+ };
104
+ }
105
+
106
+ if (kind === 'triadic') {
107
+ return {
108
+ harmony: kind,
109
+ assignments: [
110
+ assignRole('primary', harmony, 'base'),
111
+ assignRole('secondary', harmony, 'a'),
112
+ assignRole('accent', harmony, 'b', 'a'),
113
+ assignRole('highlight', harmony, 'b', 'a'),
114
+ assignRole('surfaceTint', harmony, 'base'),
115
+ ],
116
+ };
117
+ }
118
+
119
+ return {
120
+ harmony: kind,
121
+ assignments: [
122
+ assignRole('primary', harmony, 'base'),
123
+ assignRole('secondary', harmony, 'a'),
124
+ assignRole('accent', harmony, 'b', 'a'),
125
+ assignRole('highlight', harmony, 'c', 'b'),
126
+ assignRole('surfaceTint', harmony, 'base'),
127
+ ],
128
+ };
129
+ }
130
+
131
+ export function getZoraHueRoleAssignment(
132
+ roles: ZoraComputedHueRoles,
133
+ role: ZoraHueRoleId,
134
+ ): ZoraHueRoleAssignment {
135
+ const found = roles.assignments.find((assignment) => assignment.role === role);
136
+ if (!found) {
137
+ throw new Error(
138
+ `[zora] Expected a hue-role assignment for "${role}" (harmony: ${roles.harmony}).`,
139
+ );
140
+ }
141
+ return found;
142
+ }