@ankhorage/zora 0.12.3 → 0.13.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.
- package/CHANGELOG.md +12 -0
- package/dist/internal/color/colorToneRecipes.d.ts +23 -0
- package/dist/internal/color/colorToneRecipes.d.ts.map +1 -0
- package/dist/internal/color/colorToneRecipes.js +139 -0
- package/dist/internal/color/colorToneRecipes.js.map +1 -0
- package/dist/internal/color/index.d.ts +2 -1
- package/dist/internal/color/index.d.ts.map +1 -1
- package/dist/internal/color/index.js +1 -0
- package/dist/internal/color/index.js.map +1 -1
- package/dist/internal/color/roleScales.d.ts +2 -1
- package/dist/internal/color/roleScales.d.ts.map +1 -1
- package/dist/internal/color/roleScales.js +33 -5
- package/dist/internal/color/roleScales.js.map +1 -1
- package/dist/internal/color/scales.d.ts +2 -0
- package/dist/internal/color/scales.d.ts.map +1 -1
- package/dist/internal/color/scales.js +16 -9
- package/dist/internal/color/scales.js.map +1 -1
- package/dist/theme/createZoraThemeConfig.js +2 -2
- package/dist/theme/createZoraThemeConfig.js.map +1 -1
- package/dist/theme/types.d.ts +6 -4
- package/dist/theme/types.d.ts.map +1 -1
- package/dist/theme/types.js +20 -1
- package/dist/theme/types.js.map +1 -1
- package/dist/theme/zoraDefaultTheme.js +1 -1
- package/dist/theme/zoraDefaultTheme.js.map +1 -1
- package/package.json +2 -2
- package/src/internal/color/colorToneRecipes.test.ts +89 -0
- package/src/internal/color/colorToneRecipes.ts +167 -0
- package/src/internal/color/index.ts +9 -0
- package/src/internal/color/roleScales.test.ts +72 -99
- package/src/internal/color/roleScales.ts +36 -6
- package/src/internal/color/scales.ts +27 -10
- package/src/theme/createZoraThemeConfig.test.ts +5 -5
- package/src/theme/createZoraThemeConfig.ts +2 -2
- package/src/theme/types.ts +26 -10
- package/src/theme/zoraDefaultTheme.ts +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 0.13.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 99c74b1: Update @ankhorage/zora in example app
|
|
8
|
+
|
|
9
|
+
## 0.13.0
|
|
10
|
+
|
|
11
|
+
### Minor Changes
|
|
12
|
+
|
|
13
|
+
- b72b3e1: Renames the public ZORA theme seed field from `tone` to `colorTone` and adds internal color tone recipes for future theme generation work.
|
|
14
|
+
|
|
3
15
|
## 0.12.3
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import type { ZoraColorTone } from '../../theme/types';
|
|
2
|
+
import type { ZoraHueScaleRoleId } from './scales';
|
|
3
|
+
export interface ZoraColorToneLaneRecipe {
|
|
4
|
+
backgroundTone: ZoraColorTone;
|
|
5
|
+
foregroundTone: ZoraColorTone;
|
|
6
|
+
}
|
|
7
|
+
export interface ZoraColorToneRoleChromaFactors {
|
|
8
|
+
primary: number;
|
|
9
|
+
secondary: number;
|
|
10
|
+
accent: number;
|
|
11
|
+
highlight: number;
|
|
12
|
+
surfaceTint: number;
|
|
13
|
+
}
|
|
14
|
+
export interface ZoraColorToneRecipe {
|
|
15
|
+
colorTone: ZoraColorTone;
|
|
16
|
+
laneRecipe: ZoraColorToneLaneRecipe;
|
|
17
|
+
roleChromaFactors: ZoraColorToneRoleChromaFactors;
|
|
18
|
+
maxChroma: number;
|
|
19
|
+
minMidChroma: number;
|
|
20
|
+
}
|
|
21
|
+
export declare function getZoraColorToneRecipe(colorTone: ZoraColorTone): ZoraColorToneRecipe;
|
|
22
|
+
export declare function getZoraColorToneRoleChromaFactor(recipe: ZoraColorToneRecipe, role: ZoraHueScaleRoleId): number;
|
|
23
|
+
//# sourceMappingURL=colorToneRecipes.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"colorToneRecipes.d.ts","sourceRoot":"","sources":["../../../src/internal/color/colorToneRecipes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAEnD,MAAM,WAAW,uBAAuB;IACtC,cAAc,EAAE,aAAa,CAAC;IAC9B,cAAc,EAAE,aAAa,CAAC;CAC/B;AAED,MAAM,WAAW,8BAA8B;IAC7C,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,mBAAmB;IAClC,SAAS,EAAE,aAAa,CAAC;IACzB,UAAU,EAAE,uBAAuB,CAAC;IACpC,iBAAiB,EAAE,8BAA8B,CAAC;IAClD,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;CACtB;AAuID,wBAAgB,sBAAsB,CAAC,SAAS,EAAE,aAAa,GAAG,mBAAmB,CAEpF;AAED,wBAAgB,gCAAgC,CAC9C,MAAM,EAAE,mBAAmB,EAC3B,IAAI,EAAE,kBAAkB,GACvB,MAAM,CAER"}
|
|
@@ -0,0 +1,139 @@
|
|
|
1
|
+
const ZORA_COLOR_TONE_RECIPES = {
|
|
2
|
+
neutral: {
|
|
3
|
+
colorTone: 'neutral',
|
|
4
|
+
laneRecipe: { backgroundTone: 'neutral', foregroundTone: 'jewel' },
|
|
5
|
+
roleChromaFactors: {
|
|
6
|
+
primary: 0.72,
|
|
7
|
+
secondary: 0.48,
|
|
8
|
+
accent: 0.56,
|
|
9
|
+
highlight: 0.6,
|
|
10
|
+
surfaceTint: 0.12,
|
|
11
|
+
},
|
|
12
|
+
maxChroma: 0.14,
|
|
13
|
+
minMidChroma: 0.025,
|
|
14
|
+
},
|
|
15
|
+
pastel: {
|
|
16
|
+
colorTone: 'pastel',
|
|
17
|
+
laneRecipe: { backgroundTone: 'pastel', foregroundTone: 'jewel' },
|
|
18
|
+
roleChromaFactors: {
|
|
19
|
+
primary: 0.58,
|
|
20
|
+
secondary: 0.48,
|
|
21
|
+
accent: 0.55,
|
|
22
|
+
highlight: 0.62,
|
|
23
|
+
surfaceTint: 0.2,
|
|
24
|
+
},
|
|
25
|
+
maxChroma: 0.12,
|
|
26
|
+
minMidChroma: 0.02,
|
|
27
|
+
},
|
|
28
|
+
earth: {
|
|
29
|
+
colorTone: 'earth',
|
|
30
|
+
laneRecipe: { backgroundTone: 'earth', foregroundTone: 'mineral' },
|
|
31
|
+
roleChromaFactors: {
|
|
32
|
+
primary: 0.64,
|
|
33
|
+
secondary: 0.52,
|
|
34
|
+
accent: 0.58,
|
|
35
|
+
highlight: 0.6,
|
|
36
|
+
surfaceTint: 0.16,
|
|
37
|
+
},
|
|
38
|
+
maxChroma: 0.13,
|
|
39
|
+
minMidChroma: 0.022,
|
|
40
|
+
},
|
|
41
|
+
mineral: {
|
|
42
|
+
colorTone: 'mineral',
|
|
43
|
+
laneRecipe: { backgroundTone: 'mineral', foregroundTone: 'jewel' },
|
|
44
|
+
roleChromaFactors: {
|
|
45
|
+
primary: 0.7,
|
|
46
|
+
secondary: 0.56,
|
|
47
|
+
accent: 0.64,
|
|
48
|
+
highlight: 0.68,
|
|
49
|
+
surfaceTint: 0.16,
|
|
50
|
+
},
|
|
51
|
+
maxChroma: 0.14,
|
|
52
|
+
minMidChroma: 0.025,
|
|
53
|
+
},
|
|
54
|
+
muted: {
|
|
55
|
+
colorTone: 'muted',
|
|
56
|
+
laneRecipe: { backgroundTone: 'muted', foregroundTone: 'jewel' },
|
|
57
|
+
roleChromaFactors: {
|
|
58
|
+
primary: 0.6,
|
|
59
|
+
secondary: 0.5,
|
|
60
|
+
accent: 0.56,
|
|
61
|
+
highlight: 0.6,
|
|
62
|
+
surfaceTint: 0.14,
|
|
63
|
+
},
|
|
64
|
+
maxChroma: 0.12,
|
|
65
|
+
minMidChroma: 0.02,
|
|
66
|
+
},
|
|
67
|
+
jewel: {
|
|
68
|
+
colorTone: 'jewel',
|
|
69
|
+
laneRecipe: { backgroundTone: 'neutral', foregroundTone: 'jewel' },
|
|
70
|
+
roleChromaFactors: {
|
|
71
|
+
primary: 1,
|
|
72
|
+
secondary: 0.72,
|
|
73
|
+
accent: 0.85,
|
|
74
|
+
highlight: 1,
|
|
75
|
+
surfaceTint: 0.18,
|
|
76
|
+
},
|
|
77
|
+
maxChroma: 0.2,
|
|
78
|
+
minMidChroma: 0.04,
|
|
79
|
+
},
|
|
80
|
+
fluorescent: {
|
|
81
|
+
colorTone: 'fluorescent',
|
|
82
|
+
laneRecipe: { backgroundTone: 'obsidian', foregroundTone: 'fluorescent' },
|
|
83
|
+
roleChromaFactors: {
|
|
84
|
+
primary: 1.12,
|
|
85
|
+
secondary: 0.82,
|
|
86
|
+
accent: 1.05,
|
|
87
|
+
highlight: 1.18,
|
|
88
|
+
surfaceTint: 0.22,
|
|
89
|
+
},
|
|
90
|
+
maxChroma: 0.24,
|
|
91
|
+
minMidChroma: 0.045,
|
|
92
|
+
},
|
|
93
|
+
obsidian: {
|
|
94
|
+
colorTone: 'obsidian',
|
|
95
|
+
laneRecipe: { backgroundTone: 'obsidian', foregroundTone: 'fluorescent' },
|
|
96
|
+
roleChromaFactors: {
|
|
97
|
+
primary: 1.08,
|
|
98
|
+
secondary: 0.78,
|
|
99
|
+
accent: 1,
|
|
100
|
+
highlight: 1.12,
|
|
101
|
+
surfaceTint: 0.2,
|
|
102
|
+
},
|
|
103
|
+
maxChroma: 0.22,
|
|
104
|
+
minMidChroma: 0.04,
|
|
105
|
+
},
|
|
106
|
+
vaporwave: {
|
|
107
|
+
colorTone: 'vaporwave',
|
|
108
|
+
laneRecipe: { backgroundTone: 'pastel', foregroundTone: 'fluorescent' },
|
|
109
|
+
roleChromaFactors: {
|
|
110
|
+
primary: 0.95,
|
|
111
|
+
secondary: 0.72,
|
|
112
|
+
accent: 1,
|
|
113
|
+
highlight: 1.08,
|
|
114
|
+
surfaceTint: 0.24,
|
|
115
|
+
},
|
|
116
|
+
maxChroma: 0.2,
|
|
117
|
+
minMidChroma: 0.035,
|
|
118
|
+
},
|
|
119
|
+
monochromeAccent: {
|
|
120
|
+
colorTone: 'monochromeAccent',
|
|
121
|
+
laneRecipe: { backgroundTone: 'neutral', foregroundTone: 'jewel' },
|
|
122
|
+
roleChromaFactors: {
|
|
123
|
+
primary: 0.88,
|
|
124
|
+
secondary: 0.36,
|
|
125
|
+
accent: 0.95,
|
|
126
|
+
highlight: 0.88,
|
|
127
|
+
surfaceTint: 0.08,
|
|
128
|
+
},
|
|
129
|
+
maxChroma: 0.18,
|
|
130
|
+
minMidChroma: 0.035,
|
|
131
|
+
},
|
|
132
|
+
};
|
|
133
|
+
export function getZoraColorToneRecipe(colorTone) {
|
|
134
|
+
return ZORA_COLOR_TONE_RECIPES[colorTone];
|
|
135
|
+
}
|
|
136
|
+
export function getZoraColorToneRoleChromaFactor(recipe, role) {
|
|
137
|
+
return recipe.roleChromaFactors[role];
|
|
138
|
+
}
|
|
139
|
+
//# sourceMappingURL=colorToneRecipes.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"colorToneRecipes.js","sourceRoot":"","sources":["../../../src/internal/color/colorToneRecipes.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ZoraColorTone } from '../../theme/types';\nimport type { ZoraHueScaleRoleId } from './scales';\n\nexport interface ZoraColorToneLaneRecipe {\n backgroundTone: ZoraColorTone;\n foregroundTone: ZoraColorTone;\n}\n\nexport interface ZoraColorToneRoleChromaFactors {\n primary: number;\n secondary: number;\n accent: number;\n highlight: number;\n surfaceTint: number;\n}\n\nexport interface ZoraColorToneRecipe {\n colorTone: ZoraColorTone;\n laneRecipe: ZoraColorToneLaneRecipe;\n roleChromaFactors: ZoraColorToneRoleChromaFactors;\n maxChroma: number;\n minMidChroma: number;\n}\n\nconst ZORA_COLOR_TONE_RECIPES = {\n neutral: {\n colorTone: 'neutral',\n laneRecipe: { backgroundTone: 'neutral', foregroundTone: 'jewel' },\n roleChromaFactors: {\n primary: 0.72,\n secondary: 0.48,\n accent: 0.56,\n highlight: 0.6,\n surfaceTint: 0.12,\n },\n maxChroma: 0.14,\n minMidChroma: 0.025,\n },\n pastel: {\n colorTone: 'pastel',\n laneRecipe: { backgroundTone: 'pastel', foregroundTone: 'jewel' },\n roleChromaFactors: {\n primary: 0.58,\n secondary: 0.48,\n accent: 0.55,\n highlight: 0.62,\n surfaceTint: 0.2,\n },\n maxChroma: 0.12,\n minMidChroma: 0.02,\n },\n earth: {\n colorTone: 'earth',\n laneRecipe: { backgroundTone: 'earth', foregroundTone: 'mineral' },\n roleChromaFactors: {\n primary: 0.64,\n secondary: 0.52,\n accent: 0.58,\n highlight: 0.6,\n surfaceTint: 0.16,\n },\n maxChroma: 0.13,\n minMidChroma: 0.022,\n },\n mineral: {\n colorTone: 'mineral',\n laneRecipe: { backgroundTone: 'mineral', foregroundTone: 'jewel' },\n roleChromaFactors: {\n primary: 0.7,\n secondary: 0.56,\n accent: 0.64,\n highlight: 0.68,\n surfaceTint: 0.16,\n },\n maxChroma: 0.14,\n minMidChroma: 0.025,\n },\n muted: {\n colorTone: 'muted',\n laneRecipe: { backgroundTone: 'muted', foregroundTone: 'jewel' },\n roleChromaFactors: {\n primary: 0.6,\n secondary: 0.5,\n accent: 0.56,\n highlight: 0.6,\n surfaceTint: 0.14,\n },\n maxChroma: 0.12,\n minMidChroma: 0.02,\n },\n jewel: {\n colorTone: 'jewel',\n laneRecipe: { backgroundTone: 'neutral', foregroundTone: 'jewel' },\n roleChromaFactors: {\n primary: 1,\n secondary: 0.72,\n accent: 0.85,\n highlight: 1,\n surfaceTint: 0.18,\n },\n maxChroma: 0.2,\n minMidChroma: 0.04,\n },\n fluorescent: {\n colorTone: 'fluorescent',\n laneRecipe: { backgroundTone: 'obsidian', foregroundTone: 'fluorescent' },\n roleChromaFactors: {\n primary: 1.12,\n secondary: 0.82,\n accent: 1.05,\n highlight: 1.18,\n surfaceTint: 0.22,\n },\n maxChroma: 0.24,\n minMidChroma: 0.045,\n },\n obsidian: {\n colorTone: 'obsidian',\n laneRecipe: { backgroundTone: 'obsidian', foregroundTone: 'fluorescent' },\n roleChromaFactors: {\n primary: 1.08,\n secondary: 0.78,\n accent: 1,\n highlight: 1.12,\n surfaceTint: 0.2,\n },\n maxChroma: 0.22,\n minMidChroma: 0.04,\n },\n vaporwave: {\n colorTone: 'vaporwave',\n laneRecipe: { backgroundTone: 'pastel', foregroundTone: 'fluorescent' },\n roleChromaFactors: {\n primary: 0.95,\n secondary: 0.72,\n accent: 1,\n highlight: 1.08,\n surfaceTint: 0.24,\n },\n maxChroma: 0.2,\n minMidChroma: 0.035,\n },\n monochromeAccent: {\n colorTone: 'monochromeAccent',\n laneRecipe: { backgroundTone: 'neutral', foregroundTone: 'jewel' },\n roleChromaFactors: {\n primary: 0.88,\n secondary: 0.36,\n accent: 0.95,\n highlight: 0.88,\n surfaceTint: 0.08,\n },\n maxChroma: 0.18,\n minMidChroma: 0.035,\n },\n} satisfies Record<ZoraColorTone, ZoraColorToneRecipe>;\n\nexport function getZoraColorToneRecipe(colorTone: ZoraColorTone): ZoraColorToneRecipe {\n return ZORA_COLOR_TONE_RECIPES[colorTone];\n}\n\nexport function getZoraColorToneRoleChromaFactor(\n recipe: ZoraColorToneRecipe,\n role: ZoraHueScaleRoleId,\n): number {\n return recipe.roleChromaFactors[role];\n}\n"]}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
export { getZoraColorToneRecipe, getZoraColorToneRoleChromaFactor, type ZoraColorToneLaneRecipe, type ZoraColorToneRecipe, type ZoraColorToneRoleChromaFactors, } from './colorToneRecipes';
|
|
1
2
|
export { computeZoraHarmony, type ZoraComputedHarmony, type ZoraHarmonySlot, type ZoraHarmonySlotId, } from './harmony';
|
|
2
3
|
export { parseHexToOklch } from './oklch';
|
|
3
4
|
export { resolveModePrimaryColor } from './primary';
|
|
4
5
|
export { assignZoraHarmonyRoleHues, getZoraHueRoleAssignment, type ZoraComputedHueRoles, type ZoraHueRoleAssignment, type ZoraHueRoleId, } from './roleHues';
|
|
5
6
|
export { createZoraRoleColorScales, getZoraRoleColorScale, ZORA_COLOR_SCALE_ROLE_ORDER, type ZoraColorScaleRoleId, type ZoraComputedRoleColorScales, type ZoraRoleColorScale, } from './roleScales';
|
|
6
|
-
export { createZoraColorScale, type CreateZoraColorScaleOptions, createZoraNeutralScale, createZoraPrimaryScale, } from './scales';
|
|
7
|
+
export { createZoraColorScale, type CreateZoraColorScaleOptions, type CreateZoraHueScaleOptions, createZoraNeutralScale, createZoraPrimaryScale, type ZoraHueScaleRoleId, } from './scales';
|
|
7
8
|
export { ZORA_COLOR_SCALE_STEPS, type ZoraColorScale, type ZoraColorScaleStep } from './types';
|
|
8
9
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/internal/color/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,iBAAiB,GACvB,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,WAAW,CAAC;AACpD,OAAO,EACL,yBAAyB,EACzB,wBAAwB,EACxB,KAAK,oBAAoB,EACzB,KAAK,qBAAqB,EAC1B,KAAK,aAAa,GACnB,MAAM,YAAY,CAAC;AACpB,OAAO,EACL,yBAAyB,EACzB,qBAAqB,EACrB,2BAA2B,EAC3B,KAAK,oBAAoB,EACzB,KAAK,2BAA2B,EAChC,KAAK,kBAAkB,GACxB,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,oBAAoB,EACpB,KAAK,2BAA2B,EAChC,sBAAsB,EACtB,sBAAsB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/internal/color/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,sBAAsB,EACtB,gCAAgC,EAChC,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACxB,KAAK,8BAA8B,GACpC,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,kBAAkB,EAClB,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,iBAAiB,GACvB,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,WAAW,CAAC;AACpD,OAAO,EACL,yBAAyB,EACzB,wBAAwB,EACxB,KAAK,oBAAoB,EACzB,KAAK,qBAAqB,EAC1B,KAAK,aAAa,GACnB,MAAM,YAAY,CAAC;AACpB,OAAO,EACL,yBAAyB,EACzB,qBAAqB,EACrB,2BAA2B,EAC3B,KAAK,oBAAoB,EACzB,KAAK,2BAA2B,EAChC,KAAK,kBAAkB,GACxB,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,oBAAoB,EACpB,KAAK,2BAA2B,EAChC,KAAK,yBAAyB,EAC9B,sBAAsB,EACtB,sBAAsB,EACtB,KAAK,kBAAkB,GACxB,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,sBAAsB,EAAE,KAAK,cAAc,EAAE,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/internal/color/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,GAInB,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,WAAW,CAAC;AACpD,OAAO,EACL,yBAAyB,EACzB,wBAAwB,GAIzB,MAAM,YAAY,CAAC;AACpB,OAAO,EACL,yBAAyB,EACzB,qBAAqB,EACrB,2BAA2B,GAI5B,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,oBAAoB,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/internal/color/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,sBAAsB,EACtB,gCAAgC,GAIjC,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,kBAAkB,GAInB,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,MAAM,WAAW,CAAC;AACpD,OAAO,EACL,yBAAyB,EACzB,wBAAwB,GAIzB,MAAM,YAAY,CAAC;AACpB,OAAO,EACL,yBAAyB,EACzB,qBAAqB,EACrB,2BAA2B,GAI5B,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,oBAAoB,EAGpB,sBAAsB,EACtB,sBAAsB,GAEvB,MAAM,UAAU,CAAC;AAClB,OAAO,EAAE,sBAAsB,EAAgD,MAAM,SAAS,CAAC","sourcesContent":["export {\n getZoraColorToneRecipe,\n getZoraColorToneRoleChromaFactor,\n type ZoraColorToneLaneRecipe,\n type ZoraColorToneRecipe,\n type ZoraColorToneRoleChromaFactors,\n} from './colorToneRecipes';\nexport {\n computeZoraHarmony,\n type ZoraComputedHarmony,\n type ZoraHarmonySlot,\n type ZoraHarmonySlotId,\n} from './harmony';\nexport { parseHexToOklch } from './oklch';\nexport { resolveModePrimaryColor } from './primary';\nexport {\n assignZoraHarmonyRoleHues,\n getZoraHueRoleAssignment,\n type ZoraComputedHueRoles,\n type ZoraHueRoleAssignment,\n type ZoraHueRoleId,\n} from './roleHues';\nexport {\n createZoraRoleColorScales,\n getZoraRoleColorScale,\n ZORA_COLOR_SCALE_ROLE_ORDER,\n type ZoraColorScaleRoleId,\n type ZoraComputedRoleColorScales,\n type ZoraRoleColorScale,\n} from './roleScales';\nexport {\n createZoraColorScale,\n type CreateZoraColorScaleOptions,\n type CreateZoraHueScaleOptions,\n createZoraNeutralScale,\n createZoraPrimaryScale,\n type ZoraHueScaleRoleId,\n} from './scales';\nexport { ZORA_COLOR_SCALE_STEPS, type ZoraColorScale, type ZoraColorScaleStep } from './types';\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ZoraHexColor } from '../../theme/types';
|
|
1
|
+
import type { ZoraColorTone, ZoraHexColor } from '../../theme/types';
|
|
2
2
|
import { type ZoraComputedHueRoles } from './roleHues';
|
|
3
3
|
import type { ZoraColorScale } from './types';
|
|
4
4
|
export type ZoraColorScaleRoleId = 'primary' | 'secondary' | 'accent' | 'highlight' | 'surfaceTint' | 'neutral';
|
|
@@ -15,5 +15,6 @@ export declare function getZoraRoleColorScale(scales: ZoraComputedRoleColorScale
|
|
|
15
15
|
export declare function createZoraRoleColorScales(options: {
|
|
16
16
|
hueRoles: ZoraComputedHueRoles;
|
|
17
17
|
seed: ZoraHexColor;
|
|
18
|
+
colorTone: ZoraColorTone;
|
|
18
19
|
}): ZoraComputedRoleColorScales;
|
|
19
20
|
//# sourceMappingURL=roleScales.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"roleScales.d.ts","sourceRoot":"","sources":["../../../src/internal/color/roleScales.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"roleScales.d.ts","sourceRoot":"","sources":["../../../src/internal/color/roleScales.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGrE,OAAO,EAEL,KAAK,oBAAoB,EAE1B,MAAM,YAAY,CAAC;AAOpB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,MAAM,MAAM,oBAAoB,GAC5B,SAAS,GACT,WAAW,GACX,QAAQ,GACR,WAAW,GACX,aAAa,GACb,SAAS,CAAC;AAEd,eAAO,MAAM,2BAA2B,EAAE,SAAS,oBAAoB,EAOtE,CAAC;AAEF,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,oBAAoB,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,cAAc,CAAC;CACvB;AAED,MAAM,WAAW,2BAA2B;IAC1C,KAAK,EAAE,SAAS,kBAAkB,EAAE,CAAC;CACtC;AAED,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,2BAA2B,EACnC,IAAI,EAAE,oBAAoB,GACzB,kBAAkB,CAMpB;AA6BD,wBAAgB,yBAAyB,CAAC,OAAO,EAAE;IACjD,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,IAAI,EAAE,YAAY,CAAC;IACnB,SAAS,EAAE,aAAa,CAAC;CAC1B,GAAG,2BAA2B,CAyC9B"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { getZoraColorToneRecipe } from './colorToneRecipes';
|
|
1
2
|
import { parseHexToOklch } from './oklch';
|
|
2
3
|
import { getZoraHueRoleAssignment, } from './roleHues';
|
|
3
4
|
import { createZoraHueScale, createZoraNeutralScale, } from './scales';
|
|
@@ -21,11 +22,13 @@ function resolveSeedChroma(seed) {
|
|
|
21
22
|
}
|
|
22
23
|
function createHueBackedRoleScale(options) {
|
|
23
24
|
const assignment = getZoraHueRoleAssignment(options.hueRoles, options.role);
|
|
25
|
+
const colorToneRecipe = getZoraColorToneRecipe(options.colorTone);
|
|
24
26
|
const hueScaleRole = options.role;
|
|
25
27
|
const hueScaleOptions = {
|
|
26
28
|
hue: assignment.hue,
|
|
27
29
|
seedChroma: options.seedChroma,
|
|
28
30
|
role: hueScaleRole,
|
|
31
|
+
colorToneRecipe,
|
|
29
32
|
};
|
|
30
33
|
return {
|
|
31
34
|
role: options.role,
|
|
@@ -36,11 +39,36 @@ function createHueBackedRoleScale(options) {
|
|
|
36
39
|
export function createZoraRoleColorScales(options) {
|
|
37
40
|
const seedChroma = resolveSeedChroma(options.seed);
|
|
38
41
|
const roles = [
|
|
39
|
-
createHueBackedRoleScale({
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
42
|
+
createHueBackedRoleScale({
|
|
43
|
+
colorTone: options.colorTone,
|
|
44
|
+
hueRoles: options.hueRoles,
|
|
45
|
+
seedChroma,
|
|
46
|
+
role: 'primary',
|
|
47
|
+
}),
|
|
48
|
+
createHueBackedRoleScale({
|
|
49
|
+
colorTone: options.colorTone,
|
|
50
|
+
hueRoles: options.hueRoles,
|
|
51
|
+
seedChroma,
|
|
52
|
+
role: 'secondary',
|
|
53
|
+
}),
|
|
54
|
+
createHueBackedRoleScale({
|
|
55
|
+
colorTone: options.colorTone,
|
|
56
|
+
hueRoles: options.hueRoles,
|
|
57
|
+
seedChroma,
|
|
58
|
+
role: 'accent',
|
|
59
|
+
}),
|
|
60
|
+
createHueBackedRoleScale({
|
|
61
|
+
colorTone: options.colorTone,
|
|
62
|
+
hueRoles: options.hueRoles,
|
|
63
|
+
seedChroma,
|
|
64
|
+
role: 'highlight',
|
|
65
|
+
}),
|
|
66
|
+
createHueBackedRoleScale({
|
|
67
|
+
colorTone: options.colorTone,
|
|
68
|
+
hueRoles: options.hueRoles,
|
|
69
|
+
seedChroma,
|
|
70
|
+
role: 'surfaceTint',
|
|
71
|
+
}),
|
|
44
72
|
{
|
|
45
73
|
role: 'neutral',
|
|
46
74
|
scale: createZoraNeutralScale(options.seed),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"roleScales.js","sourceRoot":"","sources":["../../../src/internal/color/roleScales.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EACL,wBAAwB,GAGzB,MAAM,YAAY,CAAC;AACpB,OAAO,EACL,kBAAkB,EAElB,sBAAsB,GAEvB,MAAM,UAAU,CAAC;AAWlB,MAAM,CAAC,MAAM,2BAA2B,GAAoC;IAC1E,SAAS;IACT,WAAW;IACX,QAAQ;IACR,WAAW;IACX,aAAa;IACb,SAAS;CACV,CAAC;AAYF,MAAM,UAAU,qBAAqB,CACnC,MAAmC,EACnC,IAA0B;IAE1B,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC;IAChE,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,iDAAiD,IAAI,IAAI,CAAC,CAAC;IAC7E,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED,SAAS,iBAAiB,CAAC,IAAkB;IAC3C,OAAO,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AACjC,CAAC;AAED,SAAS,wBAAwB,CAAC,
|
|
1
|
+
{"version":3,"file":"roleScales.js","sourceRoot":"","sources":["../../../src/internal/color/roleScales.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EACL,wBAAwB,GAGzB,MAAM,YAAY,CAAC;AACpB,OAAO,EACL,kBAAkB,EAElB,sBAAsB,GAEvB,MAAM,UAAU,CAAC;AAWlB,MAAM,CAAC,MAAM,2BAA2B,GAAoC;IAC1E,SAAS;IACT,WAAW;IACX,QAAQ;IACR,WAAW;IACX,aAAa;IACb,SAAS;CACV,CAAC;AAYF,MAAM,UAAU,qBAAqB,CACnC,MAAmC,EACnC,IAA0B;IAE1B,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC;IAChE,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,iDAAiD,IAAI,IAAI,CAAC,CAAC;IAC7E,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED,SAAS,iBAAiB,CAAC,IAAkB;IAC3C,OAAO,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AACjC,CAAC;AAED,SAAS,wBAAwB,CAAC,OAKjC;IACC,MAAM,UAAU,GAAG,wBAAwB,CAAC,OAAO,CAAC,QAAQ,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5E,MAAM,eAAe,GAAG,sBAAsB,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;IAClE,MAAM,YAAY,GAAuB,OAAO,CAAC,IAAI,CAAC;IACtD,MAAM,eAAe,GAA8B;QACjD,GAAG,EAAE,UAAU,CAAC,GAAG;QACnB,UAAU,EAAE,OAAO,CAAC,UAAU;QAC9B,IAAI,EAAE,YAAY;QAClB,eAAe;KAChB,CAAC;IAEF,OAAO;QACL,IAAI,EAAE,OAAO,CAAC,IAAI;QAClB,SAAS,EAAE,UAAU,CAAC,GAAG;QACzB,KAAK,EAAE,kBAAkB,CAAC,eAAe,CAAC;KAC3C,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,yBAAyB,CAAC,OAIzC;IACC,MAAM,UAAU,GAAG,iBAAiB,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;IAEnD,MAAM,KAAK,GAAyB;QAClC,wBAAwB,CAAC;YACvB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAC1B,UAAU;YACV,IAAI,EAAE,SAAS;SAChB,CAAC;QACF,wBAAwB,CAAC;YACvB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAC1B,UAAU;YACV,IAAI,EAAE,WAAW;SAClB,CAAC;QACF,wBAAwB,CAAC;YACvB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAC1B,UAAU;YACV,IAAI,EAAE,QAAQ;SACf,CAAC;QACF,wBAAwB,CAAC;YACvB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAC1B,UAAU;YACV,IAAI,EAAE,WAAW;SAClB,CAAC;QACF,wBAAwB,CAAC;YACvB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,QAAQ,EAAE,OAAO,CAAC,QAAQ;YAC1B,UAAU;YACV,IAAI,EAAE,aAAa;SACpB,CAAC;QACF;YACE,IAAI,EAAE,SAAS;YACf,KAAK,EAAE,sBAAsB,CAAC,OAAO,CAAC,IAAI,CAAC;SAC5C;KACF,CAAC;IAEF,OAAO,EAAE,KAAK,EAAE,CAAC;AACnB,CAAC","sourcesContent":["import type { ZoraColorTone, ZoraHexColor } from '../../theme/types';\nimport { getZoraColorToneRecipe } from './colorToneRecipes';\nimport { parseHexToOklch } from './oklch';\nimport {\n getZoraHueRoleAssignment,\n type ZoraComputedHueRoles,\n type ZoraHueRoleId,\n} from './roleHues';\nimport {\n createZoraHueScale,\n type CreateZoraHueScaleOptions,\n createZoraNeutralScale,\n type ZoraHueScaleRoleId,\n} from './scales';\nimport type { ZoraColorScale } from './types';\n\nexport type ZoraColorScaleRoleId =\n | 'primary'\n | 'secondary'\n | 'accent'\n | 'highlight'\n | 'surfaceTint'\n | 'neutral';\n\nexport const ZORA_COLOR_SCALE_ROLE_ORDER: readonly ZoraColorScaleRoleId[] = [\n 'primary',\n 'secondary',\n 'accent',\n 'highlight',\n 'surfaceTint',\n 'neutral',\n];\n\nexport interface ZoraRoleColorScale {\n role: ZoraColorScaleRoleId;\n sourceHue?: number;\n scale: ZoraColorScale;\n}\n\nexport interface ZoraComputedRoleColorScales {\n roles: readonly ZoraRoleColorScale[];\n}\n\nexport function getZoraRoleColorScale(\n scales: ZoraComputedRoleColorScales,\n role: ZoraColorScaleRoleId,\n): ZoraRoleColorScale {\n const found = scales.roles.find((entry) => entry.role === role);\n if (!found) {\n throw new Error(`[zora] Expected role color scales to include \"${role}\".`);\n }\n return found;\n}\n\nfunction resolveSeedChroma(seed: ZoraHexColor): number {\n return parseHexToOklch(seed).c;\n}\n\nfunction createHueBackedRoleScale(options: {\n colorTone: ZoraColorTone;\n hueRoles: ZoraComputedHueRoles;\n seedChroma: number;\n role: ZoraHueRoleId;\n}): ZoraRoleColorScale {\n const assignment = getZoraHueRoleAssignment(options.hueRoles, options.role);\n const colorToneRecipe = getZoraColorToneRecipe(options.colorTone);\n const hueScaleRole: ZoraHueScaleRoleId = options.role;\n const hueScaleOptions: CreateZoraHueScaleOptions = {\n hue: assignment.hue,\n seedChroma: options.seedChroma,\n role: hueScaleRole,\n colorToneRecipe,\n };\n\n return {\n role: options.role,\n sourceHue: assignment.hue,\n scale: createZoraHueScale(hueScaleOptions),\n };\n}\n\nexport function createZoraRoleColorScales(options: {\n hueRoles: ZoraComputedHueRoles;\n seed: ZoraHexColor;\n colorTone: ZoraColorTone;\n}): ZoraComputedRoleColorScales {\n const seedChroma = resolveSeedChroma(options.seed);\n\n const roles: ZoraRoleColorScale[] = [\n createHueBackedRoleScale({\n colorTone: options.colorTone,\n hueRoles: options.hueRoles,\n seedChroma,\n role: 'primary',\n }),\n createHueBackedRoleScale({\n colorTone: options.colorTone,\n hueRoles: options.hueRoles,\n seedChroma,\n role: 'secondary',\n }),\n createHueBackedRoleScale({\n colorTone: options.colorTone,\n hueRoles: options.hueRoles,\n seedChroma,\n role: 'accent',\n }),\n createHueBackedRoleScale({\n colorTone: options.colorTone,\n hueRoles: options.hueRoles,\n seedChroma,\n role: 'highlight',\n }),\n createHueBackedRoleScale({\n colorTone: options.colorTone,\n hueRoles: options.hueRoles,\n seedChroma,\n role: 'surfaceTint',\n }),\n {\n role: 'neutral',\n scale: createZoraNeutralScale(options.seed),\n },\n ];\n\n return { roles };\n}\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { ZoraHexColor } from '../../theme/types';
|
|
2
|
+
import type { ZoraColorToneRecipe } from './colorToneRecipes';
|
|
2
3
|
import { type ZoraColorScale } from './types';
|
|
3
4
|
export interface CreateZoraColorScaleOptions {
|
|
4
5
|
seed: ZoraHexColor;
|
|
@@ -9,6 +10,7 @@ export interface CreateZoraHueScaleOptions {
|
|
|
9
10
|
hue: number;
|
|
10
11
|
seedChroma: number;
|
|
11
12
|
role: ZoraHueScaleRoleId;
|
|
13
|
+
colorToneRecipe: ZoraColorToneRecipe;
|
|
12
14
|
}
|
|
13
15
|
export declare function createZoraColorScale(options: CreateZoraColorScaleOptions): ZoraColorScale;
|
|
14
16
|
export declare function createZoraPrimaryScale(seed: ZoraHexColor): ZoraColorScale;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scales.d.ts","sourceRoot":"","sources":["../../../src/internal/color/scales.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"scales.d.ts","sourceRoot":"","sources":["../../../src/internal/color/scales.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAG9D,OAAO,EAAE,KAAK,cAAc,EAA2B,MAAM,SAAS,CAAC;AAEvE,MAAM,WAAW,2BAA2B;IAC1C,IAAI,EAAE,YAAY,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CAC9B;AAED,MAAM,MAAM,kBAAkB,GAAG,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,WAAW,GAAG,aAAa,CAAC;AAElG,MAAM,WAAW,yBAAyB;IACxC,GAAG,EAAE,MAAM,CAAC;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,kBAAkB,CAAC;IACzB,eAAe,EAAE,mBAAmB,CAAC;CACtC;AA0JD,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,2BAA2B,GAAG,cAAc,CAKzF;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,YAAY,GAAG,cAAc,CAEzE;AAED,wBAAgB,sBAAsB,CAAC,IAAI,GAAE,YAAwB,GAAG,cAAc,CAErF;AAED,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,yBAAyB,GAAG,cAAc,CAMrF"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { getZoraColorToneRoleChromaFactor } from './colorToneRecipes';
|
|
1
2
|
import { clampOklchToGamut, formatOklchAsHex, parseHexToOklch } from './oklch';
|
|
2
3
|
import {} from './types';
|
|
3
4
|
const PRIMARY_LIGHTNESS_BY_STEP = {
|
|
@@ -43,13 +44,6 @@ const MAX_PRIMARY_SCALE_CHROMA = 0.2;
|
|
|
43
44
|
const MIN_PRIMARY_SCALE_CHROMA = 0.04;
|
|
44
45
|
const NEUTRAL_CHROMA = 0.012;
|
|
45
46
|
const DEFAULT_NEUTRAL_HUE_DEGREES = 260;
|
|
46
|
-
const ROLE_CHROMA_FACTOR = {
|
|
47
|
-
primary: 1,
|
|
48
|
-
secondary: 0.72,
|
|
49
|
-
accent: 0.85,
|
|
50
|
-
highlight: 1,
|
|
51
|
-
surfaceTint: 0.18,
|
|
52
|
-
};
|
|
53
47
|
function clampNumber(value, min, max) {
|
|
54
48
|
return Math.max(min, Math.min(value, max));
|
|
55
49
|
}
|
|
@@ -61,9 +55,22 @@ function resolvePrimaryScaleChroma(seedChroma, step) {
|
|
|
61
55
|
const shouldEnforceMin = step >= 300 && step <= 700 && seedChroma >= MIN_PRIMARY_SCALE_CHROMA;
|
|
62
56
|
return shouldEnforceMin ? Math.max(bounded, MIN_PRIMARY_SCALE_CHROMA) : bounded;
|
|
63
57
|
}
|
|
58
|
+
function resolveRoleScaleChroma(options) {
|
|
59
|
+
const cappedSeedChroma = clampNumber(options.seedChroma, 0, options.maxChroma);
|
|
60
|
+
const multiplier = PRIMARY_CHROMA_MULTIPLIER_BY_STEP[options.step];
|
|
61
|
+
const scaled = cappedSeedChroma * multiplier;
|
|
62
|
+
const bounded = clampNumber(scaled, 0, options.maxChroma);
|
|
63
|
+
const shouldEnforceMin = options.step >= 300 && options.step <= 700 && options.seedChroma >= options.minMidChroma;
|
|
64
|
+
return shouldEnforceMin ? Math.max(bounded, options.minMidChroma) : bounded;
|
|
65
|
+
}
|
|
64
66
|
function resolveHueScaleChroma(options, step) {
|
|
65
|
-
const factor =
|
|
66
|
-
return
|
|
67
|
+
const factor = getZoraColorToneRoleChromaFactor(options.colorToneRecipe, options.role);
|
|
68
|
+
return resolveRoleScaleChroma({
|
|
69
|
+
seedChroma: options.seedChroma * factor,
|
|
70
|
+
step,
|
|
71
|
+
maxChroma: options.colorToneRecipe.maxChroma,
|
|
72
|
+
minMidChroma: options.colorToneRecipe.minMidChroma,
|
|
73
|
+
});
|
|
67
74
|
}
|
|
68
75
|
function createScaleEntries(options) {
|
|
69
76
|
const seed = parseHexToOklch(options.seed);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scales.js","sourceRoot":"","sources":["../../../src/internal/color/scales.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ZoraHexColor } from '../../theme/types';\nimport { clampOklchToGamut, formatOklchAsHex, parseHexToOklch } from './oklch';\nimport { type ZoraColorScale, type ZoraColorScaleStep } from './types';\n\nexport interface CreateZoraColorScaleOptions {\n seed: ZoraHexColor;\n role?: 'primary' | 'neutral';\n}\n\nexport type ZoraHueScaleRoleId = 'primary' | 'secondary' | 'accent' | 'highlight' | 'surfaceTint';\n\nexport interface CreateZoraHueScaleOptions {\n hue: number;\n seedChroma: number;\n role: ZoraHueScaleRoleId;\n}\n\nconst PRIMARY_LIGHTNESS_BY_STEP: Record<ZoraColorScaleStep, number> = {\n 50: 0.97,\n 100: 0.93,\n 200: 0.86,\n 300: 0.78,\n 400: 0.68,\n 500: 0.58,\n 600: 0.5,\n 700: 0.42,\n 800: 0.34,\n 900: 0.27,\n 950: 0.2,\n};\n\nconst NEUTRAL_LIGHTNESS_BY_STEP: Record<ZoraColorScaleStep, number> = {\n 50: 0.98,\n 100: 0.95,\n 200: 0.89,\n 300: 0.8,\n 400: 0.68,\n 500: 0.55,\n 600: 0.44,\n 700: 0.34,\n 800: 0.25,\n 900: 0.18,\n 950: 0.12,\n};\n\nconst PRIMARY_CHROMA_MULTIPLIER_BY_STEP: Record<ZoraColorScaleStep, number> = {\n 50: 0.2,\n 100: 0.3,\n 200: 0.45,\n 300: 0.7,\n 400: 0.95,\n 500: 1,\n 600: 0.95,\n 700: 0.85,\n 800: 0.65,\n 900: 0.45,\n 950: 0.3,\n};\n\nconst MAX_PRIMARY_SCALE_CHROMA = 0.2;\nconst MIN_PRIMARY_SCALE_CHROMA = 0.04;\nconst NEUTRAL_CHROMA = 0.012;\nconst DEFAULT_NEUTRAL_HUE_DEGREES = 260;\n\nconst ROLE_CHROMA_FACTOR = {\n primary: 1,\n secondary: 0.72,\n accent: 0.85,\n highlight: 1,\n surfaceTint: 0.18,\n} satisfies Record<ZoraHueScaleRoleId, number>;\n\nfunction clampNumber(value: number, min: number, max: number): number {\n return Math.max(min, Math.min(value, max));\n}\n\nfunction resolvePrimaryScaleChroma(seedChroma: number, step: ZoraColorScaleStep): number {\n const cappedSeedChroma = clampNumber(seedChroma, 0, MAX_PRIMARY_SCALE_CHROMA);\n const multiplier = PRIMARY_CHROMA_MULTIPLIER_BY_STEP[step];\n const scaled = cappedSeedChroma * multiplier;\n\n const bounded = clampNumber(scaled, 0, MAX_PRIMARY_SCALE_CHROMA);\n const shouldEnforceMin = step >= 300 && step <= 700 && seedChroma >= MIN_PRIMARY_SCALE_CHROMA;\n\n return shouldEnforceMin ? Math.max(bounded, MIN_PRIMARY_SCALE_CHROMA) : bounded;\n}\n\nfunction resolveHueScaleChroma(\n options: CreateZoraHueScaleOptions,\n step: ZoraColorScaleStep,\n): number {\n const factor = ROLE_CHROMA_FACTOR[options.role];\n return resolvePrimaryScaleChroma(options.seedChroma * factor, step);\n}\n\nfunction createScaleEntries(options: CreateZoraColorScaleOptions): ZoraColorScale {\n const seed = parseHexToOklch(options.seed);\n\n if (options.role === 'neutral') {\n const hue = typeof seed.h === 'number' ? seed.h : DEFAULT_NEUTRAL_HUE_DEGREES;\n\n return createScaleFromRamp({\n hue,\n chroma: NEUTRAL_CHROMA,\n lightnessByStep: NEUTRAL_LIGHTNESS_BY_STEP,\n });\n }\n\n return createScaleFromRamp({\n hue: seed.h,\n chromaByStep: (step) => resolvePrimaryScaleChroma(seed.c, step),\n lightnessByStep: PRIMARY_LIGHTNESS_BY_STEP,\n });\n}\n\ninterface CreateScaleFromRampOptions {\n hue: number;\n chroma?: number;\n chromaByStep?: (step: ZoraColorScaleStep) => number;\n lightnessByStep: Record<ZoraColorScaleStep, number>;\n}\n\nfunction createScaleColor(\n options: CreateScaleFromRampOptions,\n step: ZoraColorScaleStep,\n): ZoraHexColor {\n const lightness = options.lightnessByStep[step];\n const chroma =\n typeof options.chromaByStep === 'function' ? options.chromaByStep(step) : (options.chroma ?? 0);\n\n const clamped = clampOklchToGamut({\n l: clampNumber(lightness, 0, 1),\n c: clampNumber(chroma, 0, 1),\n h: options.hue,\n });\n\n return formatOklchAsHex(clamped);\n}\n\nfunction createScaleFromRamp(options: CreateScaleFromRampOptions): ZoraColorScale {\n return {\n 50: createScaleColor(options, 50),\n 100: createScaleColor(options, 100),\n 200: createScaleColor(options, 200),\n 300: createScaleColor(options, 300),\n 400: createScaleColor(options, 400),\n 500: createScaleColor(options, 500),\n 600: createScaleColor(options, 600),\n 700: createScaleColor(options, 700),\n 800: createScaleColor(options, 800),\n 900: createScaleColor(options, 900),\n 950: createScaleColor(options, 950),\n };\n}\n\nexport function createZoraColorScale(options: CreateZoraColorScaleOptions): ZoraColorScale {\n return createScaleEntries({\n seed: options.seed,\n role: options.role,\n });\n}\n\nexport function createZoraPrimaryScale(seed: ZoraHexColor): ZoraColorScale {\n return createZoraColorScale({ seed, role: 'primary' });\n}\n\nexport function createZoraNeutralScale(seed: ZoraHexColor = '#94a3b8'): ZoraColorScale {\n return createZoraColorScale({ seed, role: 'neutral' });\n}\n\nexport function createZoraHueScale(options: CreateZoraHueScaleOptions): ZoraColorScale {\n return createScaleFromRamp({\n hue: options.hue,\n chromaByStep: (step) => resolveHueScaleChroma(options, step),\n lightnessByStep: PRIMARY_LIGHTNESS_BY_STEP,\n });\n}\n"]}
|
|
1
|
+
{"version":3,"file":"scales.js","sourceRoot":"","sources":["../../../src/internal/color/scales.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ZoraHexColor } from '../../theme/types';\nimport type { ZoraColorToneRecipe } from './colorToneRecipes';\nimport { getZoraColorToneRoleChromaFactor } from './colorToneRecipes';\nimport { clampOklchToGamut, formatOklchAsHex, parseHexToOklch } from './oklch';\nimport { type ZoraColorScale, type ZoraColorScaleStep } from './types';\n\nexport interface CreateZoraColorScaleOptions {\n seed: ZoraHexColor;\n role?: 'primary' | 'neutral';\n}\n\nexport type ZoraHueScaleRoleId = 'primary' | 'secondary' | 'accent' | 'highlight' | 'surfaceTint';\n\nexport interface CreateZoraHueScaleOptions {\n hue: number;\n seedChroma: number;\n role: ZoraHueScaleRoleId;\n colorToneRecipe: ZoraColorToneRecipe;\n}\n\nconst PRIMARY_LIGHTNESS_BY_STEP: Record<ZoraColorScaleStep, number> = {\n 50: 0.97,\n 100: 0.93,\n 200: 0.86,\n 300: 0.78,\n 400: 0.68,\n 500: 0.58,\n 600: 0.5,\n 700: 0.42,\n 800: 0.34,\n 900: 0.27,\n 950: 0.2,\n};\n\nconst NEUTRAL_LIGHTNESS_BY_STEP: Record<ZoraColorScaleStep, number> = {\n 50: 0.98,\n 100: 0.95,\n 200: 0.89,\n 300: 0.8,\n 400: 0.68,\n 500: 0.55,\n 600: 0.44,\n 700: 0.34,\n 800: 0.25,\n 900: 0.18,\n 950: 0.12,\n};\n\nconst PRIMARY_CHROMA_MULTIPLIER_BY_STEP: Record<ZoraColorScaleStep, number> = {\n 50: 0.2,\n 100: 0.3,\n 200: 0.45,\n 300: 0.7,\n 400: 0.95,\n 500: 1,\n 600: 0.95,\n 700: 0.85,\n 800: 0.65,\n 900: 0.45,\n 950: 0.3,\n};\n\nconst MAX_PRIMARY_SCALE_CHROMA = 0.2;\nconst MIN_PRIMARY_SCALE_CHROMA = 0.04;\nconst NEUTRAL_CHROMA = 0.012;\nconst DEFAULT_NEUTRAL_HUE_DEGREES = 260;\n\nfunction clampNumber(value: number, min: number, max: number): number {\n return Math.max(min, Math.min(value, max));\n}\n\nfunction resolvePrimaryScaleChroma(seedChroma: number, step: ZoraColorScaleStep): number {\n const cappedSeedChroma = clampNumber(seedChroma, 0, MAX_PRIMARY_SCALE_CHROMA);\n const multiplier = PRIMARY_CHROMA_MULTIPLIER_BY_STEP[step];\n const scaled = cappedSeedChroma * multiplier;\n\n const bounded = clampNumber(scaled, 0, MAX_PRIMARY_SCALE_CHROMA);\n const shouldEnforceMin = step >= 300 && step <= 700 && seedChroma >= MIN_PRIMARY_SCALE_CHROMA;\n\n return shouldEnforceMin ? Math.max(bounded, MIN_PRIMARY_SCALE_CHROMA) : bounded;\n}\n\nfunction resolveRoleScaleChroma(options: {\n seedChroma: number;\n step: ZoraColorScaleStep;\n maxChroma: number;\n minMidChroma: number;\n}): number {\n const cappedSeedChroma = clampNumber(options.seedChroma, 0, options.maxChroma);\n const multiplier = PRIMARY_CHROMA_MULTIPLIER_BY_STEP[options.step];\n const scaled = cappedSeedChroma * multiplier;\n const bounded = clampNumber(scaled, 0, options.maxChroma);\n const shouldEnforceMin =\n options.step >= 300 && options.step <= 700 && options.seedChroma >= options.minMidChroma;\n\n return shouldEnforceMin ? Math.max(bounded, options.minMidChroma) : bounded;\n}\n\nfunction resolveHueScaleChroma(\n options: CreateZoraHueScaleOptions,\n step: ZoraColorScaleStep,\n): number {\n const factor = getZoraColorToneRoleChromaFactor(options.colorToneRecipe, options.role);\n\n return resolveRoleScaleChroma({\n seedChroma: options.seedChroma * factor,\n step,\n maxChroma: options.colorToneRecipe.maxChroma,\n minMidChroma: options.colorToneRecipe.minMidChroma,\n });\n}\n\nfunction createScaleEntries(options: CreateZoraColorScaleOptions): ZoraColorScale {\n const seed = parseHexToOklch(options.seed);\n\n if (options.role === 'neutral') {\n const hue = typeof seed.h === 'number' ? seed.h : DEFAULT_NEUTRAL_HUE_DEGREES;\n\n return createScaleFromRamp({\n hue,\n chroma: NEUTRAL_CHROMA,\n lightnessByStep: NEUTRAL_LIGHTNESS_BY_STEP,\n });\n }\n\n return createScaleFromRamp({\n hue: seed.h,\n chromaByStep: (step) => resolvePrimaryScaleChroma(seed.c, step),\n lightnessByStep: PRIMARY_LIGHTNESS_BY_STEP,\n });\n}\n\ninterface CreateScaleFromRampOptions {\n hue: number;\n chroma?: number;\n chromaByStep?: (step: ZoraColorScaleStep) => number;\n lightnessByStep: Record<ZoraColorScaleStep, number>;\n}\n\nfunction createScaleColor(\n options: CreateScaleFromRampOptions,\n step: ZoraColorScaleStep,\n): ZoraHexColor {\n const lightness = options.lightnessByStep[step];\n const chroma =\n typeof options.chromaByStep === 'function' ? options.chromaByStep(step) : (options.chroma ?? 0);\n\n const clamped = clampOklchToGamut({\n l: clampNumber(lightness, 0, 1),\n c: clampNumber(chroma, 0, 1),\n h: options.hue,\n });\n\n return formatOklchAsHex(clamped);\n}\n\nfunction createScaleFromRamp(options: CreateScaleFromRampOptions): ZoraColorScale {\n return {\n 50: createScaleColor(options, 50),\n 100: createScaleColor(options, 100),\n 200: createScaleColor(options, 200),\n 300: createScaleColor(options, 300),\n 400: createScaleColor(options, 400),\n 500: createScaleColor(options, 500),\n 600: createScaleColor(options, 600),\n 700: createScaleColor(options, 700),\n 800: createScaleColor(options, 800),\n 900: createScaleColor(options, 900),\n 950: createScaleColor(options, 950),\n };\n}\n\nexport function createZoraColorScale(options: CreateZoraColorScaleOptions): ZoraColorScale {\n return createScaleEntries({\n seed: options.seed,\n role: options.role,\n });\n}\n\nexport function createZoraPrimaryScale(seed: ZoraHexColor): ZoraColorScale {\n return createZoraColorScale({ seed, role: 'primary' });\n}\n\nexport function createZoraNeutralScale(seed: ZoraHexColor = '#94a3b8'): ZoraColorScale {\n return createZoraColorScale({ seed, role: 'neutral' });\n}\n\nexport function createZoraHueScale(options: CreateZoraHueScaleOptions): ZoraColorScale {\n return createScaleFromRamp({\n hue: options.hue,\n chromaByStep: (step) => resolveHueScaleChroma(options, step),\n lightnessByStep: PRIMARY_LIGHTNESS_BY_STEP,\n });\n}\n"]}
|
|
@@ -7,12 +7,12 @@ export function createZoraThemeConfig(theme = zoraDefaultTheme) {
|
|
|
7
7
|
light: {
|
|
8
8
|
primaryColor: resolveModePrimaryColor(theme.primaryColor, 'light'),
|
|
9
9
|
harmony: theme.harmony,
|
|
10
|
-
|
|
10
|
+
colorTone: theme.colorTone,
|
|
11
11
|
},
|
|
12
12
|
dark: {
|
|
13
13
|
primaryColor: resolveModePrimaryColor(theme.primaryColor, 'dark'),
|
|
14
14
|
harmony: theme.harmony,
|
|
15
|
-
|
|
15
|
+
colorTone: theme.colorTone,
|
|
16
16
|
},
|
|
17
17
|
};
|
|
18
18
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createZoraThemeConfig.js","sourceRoot":"","sources":["../../src/theme/createZoraThemeConfig.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,MAAM,UAAU,qBAAqB,CAAC,QAAmB,gBAAgB;IACvE,OAAO;QACL,EAAE,EAAE,KAAK,CAAC,EAAE;QACZ,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,EAAE;QAC5B,KAAK,EAAE;YACL,YAAY,EAAE,uBAAuB,CAAC,KAAK,CAAC,YAAY,EAAE,OAAO,CAAC;YAClE,OAAO,EAAE,KAAK,CAAC,OAAO;YACtB,
|
|
1
|
+
{"version":3,"file":"createZoraThemeConfig.js","sourceRoot":"","sources":["../../src/theme/createZoraThemeConfig.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,uBAAuB,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,MAAM,UAAU,qBAAqB,CAAC,QAAmB,gBAAgB;IACvE,OAAO;QACL,EAAE,EAAE,KAAK,CAAC,EAAE;QACZ,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,EAAE;QAC5B,KAAK,EAAE;YACL,YAAY,EAAE,uBAAuB,CAAC,KAAK,CAAC,YAAY,EAAE,OAAO,CAAC;YAClE,OAAO,EAAE,KAAK,CAAC,OAAO;YACtB,SAAS,EAAE,KAAK,CAAC,SAAS;SAC3B;QACD,IAAI,EAAE;YACJ,YAAY,EAAE,uBAAuB,CAAC,KAAK,CAAC,YAAY,EAAE,MAAM,CAAC;YACjE,OAAO,EAAE,KAAK,CAAC,OAAO;YACtB,SAAS,EAAE,KAAK,CAAC,SAAS;SAC3B;KACF,CAAC;AACJ,CAAC","sourcesContent":["import type { ThemeConfig } from '@ankhorage/surface';\n\nimport { resolveModePrimaryColor } from '../internal/color';\nimport type { ZoraTheme } from './types';\nimport { zoraDefaultTheme } from './zoraDefaultTheme';\n\nexport function createZoraThemeConfig(theme: ZoraTheme = zoraDefaultTheme): ThemeConfig {\n return {\n id: theme.id,\n name: theme.name ?? theme.id,\n light: {\n primaryColor: resolveModePrimaryColor(theme.primaryColor, 'light'),\n harmony: theme.harmony,\n colorTone: theme.colorTone,\n },\n dark: {\n primaryColor: resolveModePrimaryColor(theme.primaryColor, 'dark'),\n harmony: theme.harmony,\n colorTone: theme.colorTone,\n },\n };\n}\n"]}
|
package/dist/theme/types.d.ts
CHANGED
|
@@ -1,15 +1,17 @@
|
|
|
1
|
-
import type { ThemeConfig } from '@ankhorage/surface';
|
|
1
|
+
import type { ColorHarmony, ColorTone, ThemeConfig } from '@ankhorage/surface';
|
|
2
2
|
export type ZoraThemeId = string;
|
|
3
3
|
export type ZoraThemeMode = 'light' | 'dark';
|
|
4
4
|
export type ZoraHexColor = `#${string}`;
|
|
5
|
-
export
|
|
6
|
-
export type
|
|
5
|
+
export declare const ZORA_COLOR_HARMONIES: readonly ["monochromatic", "analogous", "complementary", "splitComplementary", "triadic", "tetradic"];
|
|
6
|
+
export type ZoraColorHarmony = ColorHarmony;
|
|
7
|
+
export declare const ZORA_COLOR_TONES: readonly ["neutral", "pastel", "earth", "mineral", "muted", "jewel", "fluorescent", "obsidian", "vaporwave", "monochromeAccent"];
|
|
8
|
+
export type ZoraColorTone = ColorTone;
|
|
7
9
|
export interface ZoraTheme {
|
|
8
10
|
id: ZoraThemeId;
|
|
9
11
|
name?: string;
|
|
10
12
|
primaryColor: ZoraHexColor;
|
|
11
13
|
harmony: ZoraColorHarmony;
|
|
12
|
-
|
|
14
|
+
colorTone: ZoraColorTone;
|
|
13
15
|
}
|
|
14
16
|
export interface ZoraComputedTheme {
|
|
15
17
|
id: ZoraThemeId;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAE/E,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC;AAEjC,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,MAAM,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,IAAI,MAAM,EAAE,CAAC;AAExC,eAAO,MAAM,oBAAoB,uGAOW,CAAC;AAE7C,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC;AAE5C,eAAO,MAAM,gBAAgB,kIAWY,CAAC;AAE1C,MAAM,MAAM,aAAa,GAAG,SAAS,CAAC;AAEtC,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,WAAW,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,YAAY,CAAC;IAC3B,OAAO,EAAE,gBAAgB,CAAC;IAC1B,SAAS,EAAE,aAAa,CAAC;CAC1B;AAED,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,WAAW,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,aAAa,CAAC;IACpB,MAAM,EAAE,SAAS,CAAC;IAClB,aAAa,EAAE,WAAW,CAAC;CAC5B"}
|
package/dist/theme/types.js
CHANGED
|
@@ -1,2 +1,21 @@
|
|
|
1
|
-
export
|
|
1
|
+
export const ZORA_COLOR_HARMONIES = [
|
|
2
|
+
'monochromatic',
|
|
3
|
+
'analogous',
|
|
4
|
+
'complementary',
|
|
5
|
+
'splitComplementary',
|
|
6
|
+
'triadic',
|
|
7
|
+
'tetradic',
|
|
8
|
+
];
|
|
9
|
+
export const ZORA_COLOR_TONES = [
|
|
10
|
+
'neutral',
|
|
11
|
+
'pastel',
|
|
12
|
+
'earth',
|
|
13
|
+
'mineral',
|
|
14
|
+
'muted',
|
|
15
|
+
'jewel',
|
|
16
|
+
'fluorescent',
|
|
17
|
+
'obsidian',
|
|
18
|
+
'vaporwave',
|
|
19
|
+
'monochromeAccent',
|
|
20
|
+
];
|
|
2
21
|
//# sourceMappingURL=types.js.map
|
package/dist/theme/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ThemeConfig } from '@ankhorage/surface';\n\nexport type ZoraThemeId = string;\n\nexport type ZoraThemeMode = 'light' | 'dark';\n\nexport type ZoraHexColor = `#${string}`;\n\nexport
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/theme/types.ts"],"names":[],"mappings":"AAQA,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAClC,eAAe;IACf,WAAW;IACX,eAAe;IACf,oBAAoB;IACpB,SAAS;IACT,UAAU;CACgC,CAAC;AAI7C,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,SAAS;IACT,QAAQ;IACR,OAAO;IACP,SAAS;IACT,OAAO;IACP,OAAO;IACP,aAAa;IACb,UAAU;IACV,WAAW;IACX,kBAAkB;CACqB,CAAC","sourcesContent":["import type { ColorHarmony, ColorTone, ThemeConfig } from '@ankhorage/surface';\n\nexport type ZoraThemeId = string;\n\nexport type ZoraThemeMode = 'light' | 'dark';\n\nexport type ZoraHexColor = `#${string}`;\n\nexport const ZORA_COLOR_HARMONIES = [\n 'monochromatic',\n 'analogous',\n 'complementary',\n 'splitComplementary',\n 'triadic',\n 'tetradic',\n] as const satisfies readonly ColorHarmony[];\n\nexport type ZoraColorHarmony = ColorHarmony;\n\nexport const ZORA_COLOR_TONES = [\n 'neutral',\n 'pastel',\n 'earth',\n 'mineral',\n 'muted',\n 'jewel',\n 'fluorescent',\n 'obsidian',\n 'vaporwave',\n 'monochromeAccent',\n] as const satisfies readonly ColorTone[];\n\nexport type ZoraColorTone = ColorTone;\n\nexport interface ZoraTheme {\n id: ZoraThemeId;\n name?: string;\n primaryColor: ZoraHexColor;\n harmony: ZoraColorHarmony;\n colorTone: ZoraColorTone;\n}\n\nexport interface ZoraComputedTheme {\n id: ZoraThemeId;\n name: string;\n mode: ZoraThemeMode;\n source: ZoraTheme;\n surfaceConfig: ThemeConfig;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"zoraDefaultTheme.js","sourceRoot":"","sources":["../../src/theme/zoraDefaultTheme.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,gBAAgB,GAAc;IACzC,EAAE,EAAE,MAAM;IACV,IAAI,EAAE,MAAM;IACZ,YAAY,EAAE,SAAS;IACvB,OAAO,EAAE,WAAW;IACpB,
|
|
1
|
+
{"version":3,"file":"zoraDefaultTheme.js","sourceRoot":"","sources":["../../src/theme/zoraDefaultTheme.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,gBAAgB,GAAc;IACzC,EAAE,EAAE,MAAM;IACV,IAAI,EAAE,MAAM;IACZ,YAAY,EAAE,SAAS;IACvB,OAAO,EAAE,WAAW;IACpB,SAAS,EAAE,OAAO;CACnB,CAAC","sourcesContent":["import type { ZoraTheme } from './types';\n\nexport const zoraDefaultTheme: ZoraTheme = {\n id: 'zora',\n name: 'ZORA',\n primaryColor: '#0f766e',\n harmony: 'analogous',\n colorTone: 'jewel',\n};\n"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ankhorage/zora",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.13.1",
|
|
5
5
|
"description": "Opinionated React Native and React Native Web UI kit built on @ankhorage/surface.",
|
|
6
6
|
"homepage": "https://github.com/ankhorage/zora#readme",
|
|
7
7
|
"bugs": {
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
}
|
|
44
44
|
},
|
|
45
45
|
"dependencies": {
|
|
46
|
-
"@ankhorage/surface": "^0.
|
|
46
|
+
"@ankhorage/surface": "^0.2.0",
|
|
47
47
|
"culori": "^4.0.2"
|
|
48
48
|
},
|
|
49
49
|
"files": [
|