@ankhorage/zora 0.16.2 → 1.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.
- package/CHANGELOG.md +74 -0
- package/README.md +27 -22
- package/dist/components/heading/resolveHeadingRecipe.d.ts +2 -2
- package/dist/components/heading/resolveHeadingRecipe.d.ts.map +1 -1
- package/dist/components/heading/resolveHeadingRecipe.js.map +1 -1
- package/dist/components/text/resolveTextRecipe.d.ts +2 -2
- package/dist/components/text/resolveTextRecipe.d.ts.map +1 -1
- package/dist/components/text/resolveTextRecipe.js.map +1 -1
- package/dist/patterns/theme-composer/ThemeComposer.d.ts.map +1 -1
- package/dist/patterns/theme-composer/ThemeComposer.js +101 -86
- package/dist/patterns/theme-composer/ThemeComposer.js.map +1 -1
- package/dist/patterns/theme-composer/index.d.ts +1 -1
- package/dist/patterns/theme-composer/index.d.ts.map +1 -1
- package/dist/patterns/theme-composer/index.js.map +1 -1
- package/dist/patterns/theme-composer/types.d.ts +3 -13
- package/dist/patterns/theme-composer/types.d.ts.map +1 -1
- package/dist/patterns/theme-composer/types.js.map +1 -1
- package/dist/theme/createZoraThemeConfig.d.ts +1 -1
- package/dist/theme/createZoraThemeConfig.d.ts.map +1 -1
- package/dist/theme/createZoraThemeConfig.js +5 -6
- package/dist/theme/createZoraThemeConfig.js.map +1 -1
- package/dist/theme/index.d.ts +1 -1
- package/dist/theme/index.d.ts.map +1 -1
- package/dist/theme/index.js.map +1 -1
- package/dist/theme/types.d.ts +16 -11
- package/dist/theme/types.d.ts.map +1 -1
- package/dist/theme/types.js +1 -20
- package/dist/theme/types.js.map +1 -1
- package/dist/theme/useZoraTheme.d.ts +1 -1
- package/dist/theme/zoraDefaultTheme.js +1 -1
- package/dist/theme/zoraDefaultTheme.js.map +1 -1
- package/package.json +4 -4
- package/src/components/heading/resolveHeadingRecipe.test.ts +30 -5
- package/src/components/heading/resolveHeadingRecipe.ts +6 -6
- package/src/components/text/resolveTextRecipe.test.ts +30 -5
- package/src/components/text/resolveTextRecipe.ts +6 -6
- package/src/patterns/theme-composer/ThemeComposer.test.ts +128 -114
- package/src/patterns/theme-composer/ThemeComposer.tsx +130 -128
- package/src/patterns/theme-composer/index.ts +1 -6
- package/src/patterns/theme-composer/types.ts +4 -15
- package/src/showcaseCoverage.test.ts +14 -0
- package/src/theme/createZoraThemeConfig.test.ts +51 -26
- package/src/theme/createZoraThemeConfig.ts +7 -7
- package/src/theme/index.ts +1 -3
- package/src/theme/types.ts +22 -34
- package/src/theme/zoraDefaultTheme.ts +1 -1
- package/dist/internal/color/colorToneRecipes.d.ts +0 -23
- package/dist/internal/color/colorToneRecipes.d.ts.map +0 -1
- package/dist/internal/color/colorToneRecipes.js +0 -139
- package/dist/internal/color/colorToneRecipes.js.map +0 -1
- package/dist/internal/color/harmony.d.ts +0 -12
- package/dist/internal/color/harmony.d.ts.map +0 -1
- package/dist/internal/color/harmony.js +0 -69
- package/dist/internal/color/harmony.js.map +0 -1
- package/dist/internal/color/hue.d.ts +0 -3
- package/dist/internal/color/hue.d.ts.map +0 -1
- package/dist/internal/color/hue.js +0 -7
- package/dist/internal/color/hue.js.map +0 -1
- package/dist/internal/color/index.d.ts +0 -10
- package/dist/internal/color/index.d.ts.map +0 -1
- package/dist/internal/color/index.js +0 -10
- package/dist/internal/color/index.js.map +0 -1
- package/dist/internal/color/oklch.d.ts +0 -6
- package/dist/internal/color/oklch.d.ts.map +0 -1
- package/dist/internal/color/oklch.js +0 -50
- package/dist/internal/color/oklch.js.map +0 -1
- package/dist/internal/color/primary.d.ts +0 -3
- package/dist/internal/color/primary.d.ts.map +0 -1
- package/dist/internal/color/primary.js +0 -44
- package/dist/internal/color/primary.js.map +0 -1
- package/dist/internal/color/roleHues.d.ts +0 -15
- package/dist/internal/color/roleHues.d.ts.map +0 -1
- package/dist/internal/color/roleHues.js +0 -103
- package/dist/internal/color/roleHues.js.map +0 -1
- package/dist/internal/color/roleScales.d.ts +0 -20
- package/dist/internal/color/roleScales.d.ts.map +0 -1
- package/dist/internal/color/roleScales.js +0 -79
- package/dist/internal/color/roleScales.js.map +0 -1
- package/dist/internal/color/scales.d.ts +0 -19
- package/dist/internal/color/scales.d.ts.map +0 -1
- package/dist/internal/color/scales.js +0 -135
- package/dist/internal/color/scales.js.map +0 -1
- package/dist/internal/color/semanticTokens.d.ts +0 -28
- package/dist/internal/color/semanticTokens.d.ts.map +0 -1
- package/dist/internal/color/semanticTokens.js +0 -84
- package/dist/internal/color/semanticTokens.js.map +0 -1
- package/dist/internal/color/types.d.ts +0 -10
- package/dist/internal/color/types.d.ts.map +0 -1
- package/dist/internal/color/types.js +0 -4
- package/dist/internal/color/types.js.map +0 -1
- package/dist/patterns/theme-composer/recommendations.d.ts +0 -14
- package/dist/patterns/theme-composer/recommendations.d.ts.map +0 -1
- package/dist/patterns/theme-composer/recommendations.js +0 -58
- package/dist/patterns/theme-composer/recommendations.js.map +0 -1
- package/src/internal/color/colorToneRecipes.test.ts +0 -89
- package/src/internal/color/colorToneRecipes.ts +0 -167
- package/src/internal/color/harmony.test.ts +0 -145
- package/src/internal/color/harmony.ts +0 -96
- package/src/internal/color/hue.test.ts +0 -28
- package/src/internal/color/hue.ts +0 -7
- package/src/internal/color/index.ts +0 -44
- package/src/internal/color/oklch.ts +0 -65
- package/src/internal/color/primary.test.ts +0 -105
- package/src/internal/color/primary.ts +0 -64
- package/src/internal/color/roleHues.test.ts +0 -197
- package/src/internal/color/roleHues.ts +0 -142
- package/src/internal/color/roleScales.test.ts +0 -220
- package/src/internal/color/roleScales.ts +0 -127
- package/src/internal/color/scales.test.ts +0 -151
- package/src/internal/color/scales.ts +0 -194
- package/src/internal/color/semanticTokens.test.ts +0 -170
- package/src/internal/color/semanticTokens.ts +0 -114
- package/src/internal/color/types.ts +0 -15
- package/src/patterns/theme-composer/recommendations.ts +0 -85
|
@@ -1,16 +1,7 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
|
|
3
|
-
|
|
4
|
-
export type ThemeComposerAppCategory = string;
|
|
5
|
-
export type ThemeComposerAppMood = string;
|
|
1
|
+
import type { AppCategory } from '@ankhorage/contracts';
|
|
6
2
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
appMood: ThemeComposerAppMood;
|
|
10
|
-
suggestedColorTone: ZoraColorTone;
|
|
11
|
-
suggestedHarmony: ZoraColorHarmony;
|
|
12
|
-
suggestedPrimaryHueDegrees?: number;
|
|
13
|
-
}
|
|
3
|
+
import type { ZoraTheme, ZoraThemeMode } from '../../theme/types';
|
|
4
|
+
import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
|
|
14
5
|
|
|
15
6
|
export interface ThemeComposerProps extends ZoraBaseProps {
|
|
16
7
|
value: ZoraTheme;
|
|
@@ -18,7 +9,5 @@ export interface ThemeComposerProps extends ZoraBaseProps {
|
|
|
18
9
|
mode?: ZoraThemeMode;
|
|
19
10
|
onModeChange?: (mode: ZoraThemeMode) => void;
|
|
20
11
|
onSubmit?: (theme: ZoraTheme) => void;
|
|
21
|
-
|
|
22
|
-
appMood?: ThemeComposerAppMood;
|
|
23
|
-
recommendations?: readonly ThemeComposerRecommendation[];
|
|
12
|
+
appCategories?: readonly AppCategory[];
|
|
24
13
|
}
|
|
@@ -5,6 +5,16 @@ import { describe, expect, test } from 'bun:test';
|
|
|
5
5
|
|
|
6
6
|
const SHOWCASE_ROOT = join(process.cwd(), 'examples', 'expo-showcase');
|
|
7
7
|
|
|
8
|
+
const IGNORED_DIRECTORY_NAMES = new Set([
|
|
9
|
+
'.expo',
|
|
10
|
+
'.git',
|
|
11
|
+
'.turbo',
|
|
12
|
+
'.vercel',
|
|
13
|
+
'coverage',
|
|
14
|
+
'dist',
|
|
15
|
+
'node_modules',
|
|
16
|
+
]);
|
|
17
|
+
|
|
8
18
|
const REQUIRED_SHOWCASE_COVERAGE = {
|
|
9
19
|
components: [
|
|
10
20
|
'Badge',
|
|
@@ -79,6 +89,10 @@ const REQUIRED_SHOWCASE_COVERAGE = {
|
|
|
79
89
|
|
|
80
90
|
function listFiles(root: string): string[] {
|
|
81
91
|
return readdirSync(root, { withFileTypes: true }).flatMap((entry) => {
|
|
92
|
+
if (entry.isDirectory() && IGNORED_DIRECTORY_NAMES.has(entry.name)) {
|
|
93
|
+
return [];
|
|
94
|
+
}
|
|
95
|
+
|
|
82
96
|
const absolutePath = join(root, entry.name);
|
|
83
97
|
if (entry.isDirectory()) {
|
|
84
98
|
return listFiles(absolutePath);
|
|
@@ -1,12 +1,7 @@
|
|
|
1
1
|
import { describe, expect, test } from 'bun:test';
|
|
2
2
|
|
|
3
|
-
import { parseHexToOklch } from '../internal/color';
|
|
4
3
|
import { createZoraThemeConfig } from './createZoraThemeConfig';
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
function isSixDigitHexColor(value: string): value is ZoraHexColor {
|
|
8
|
-
return /^#[0-9a-f]{6}$/.test(value);
|
|
9
|
-
}
|
|
4
|
+
import { zoraDefaultTheme } from './zoraDefaultTheme';
|
|
10
5
|
|
|
11
6
|
describe('createZoraThemeConfig', () => {
|
|
12
7
|
test('converts the default theme seed into a surface config', () => {
|
|
@@ -14,37 +9,67 @@ describe('createZoraThemeConfig', () => {
|
|
|
14
9
|
|
|
15
10
|
expect(themeConfig.id).toBe('zora');
|
|
16
11
|
expect(themeConfig.name).toBe('ZORA');
|
|
17
|
-
expect(
|
|
12
|
+
expect(themeConfig.light.primaryColor).toBe(zoraDefaultTheme.primaryColor);
|
|
18
13
|
expect(themeConfig.light.harmony).toBe('analogous');
|
|
19
|
-
expect(themeConfig.
|
|
20
|
-
expect(isSixDigitHexColor(themeConfig.dark.primaryColor)).toBe(true);
|
|
14
|
+
expect(themeConfig.dark.primaryColor).toBe(zoraDefaultTheme.primaryColor);
|
|
21
15
|
expect(themeConfig.dark.harmony).toBe('analogous');
|
|
22
|
-
expect(themeConfig.dark.colorTone).toBe('jewel');
|
|
23
|
-
|
|
24
|
-
expect(themeConfig.light.primaryColor).not.toBe(themeConfig.dark.primaryColor);
|
|
25
|
-
|
|
26
|
-
const lightOklch = parseHexToOklch(themeConfig.light.primaryColor);
|
|
27
|
-
const darkOklch = parseHexToOklch(themeConfig.dark.primaryColor);
|
|
28
|
-
expect(darkOklch.l).toBeGreaterThan(lightOklch.l);
|
|
29
16
|
});
|
|
30
17
|
|
|
31
|
-
test('
|
|
18
|
+
test('uses theme.name directly without fallback to id', () => {
|
|
32
19
|
const themeConfig = createZoraThemeConfig({
|
|
33
20
|
id: 'studio',
|
|
21
|
+
name: 'Studio',
|
|
22
|
+
appCategory: 'developer_tools',
|
|
34
23
|
primaryColor: '#0f766e',
|
|
35
24
|
harmony: 'analogous',
|
|
36
|
-
colorTone: 'jewel',
|
|
37
25
|
});
|
|
38
26
|
|
|
39
27
|
expect(themeConfig.id).toBe('studio');
|
|
40
|
-
expect(themeConfig.name).toBe('
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
28
|
+
expect(themeConfig.name).toBe('Studio');
|
|
29
|
+
});
|
|
30
|
+
|
|
31
|
+
test('preserves the same primaryColor for both light and dark', () => {
|
|
32
|
+
const primary = '#2563eb';
|
|
33
|
+
const themeConfig = createZoraThemeConfig({
|
|
34
|
+
id: 'test',
|
|
35
|
+
name: 'Test',
|
|
36
|
+
appCategory: 'utilities_tools',
|
|
37
|
+
primaryColor: primary,
|
|
38
|
+
harmony: 'triadic',
|
|
39
|
+
});
|
|
40
|
+
|
|
41
|
+
expect(themeConfig.light.primaryColor).toBe(primary);
|
|
42
|
+
expect(themeConfig.dark.primaryColor).toBe(primary);
|
|
43
|
+
});
|
|
44
|
+
|
|
45
|
+
test('validates public primaryColor strings during config conversion', () => {
|
|
46
|
+
expect(() =>
|
|
47
|
+
createZoraThemeConfig({
|
|
48
|
+
id: 'bad-theme',
|
|
49
|
+
name: 'Bad Theme',
|
|
50
|
+
appCategory: 'utilities_tools',
|
|
51
|
+
primaryColor: 'blue',
|
|
52
|
+
harmony: 'triadic',
|
|
53
|
+
}),
|
|
54
|
+
).toThrow();
|
|
55
|
+
});
|
|
56
|
+
|
|
57
|
+
test('output has no colorTone field', () => {
|
|
58
|
+
const themeConfig = createZoraThemeConfig();
|
|
59
|
+
|
|
60
|
+
expect('colorTone' in themeConfig.light).toBe(false);
|
|
61
|
+
expect('colorTone' in themeConfig.dark).toBe(false);
|
|
62
|
+
});
|
|
63
|
+
|
|
64
|
+
test('surfaceConfig.name equals theme.name', () => {
|
|
65
|
+
const themeConfig = createZoraThemeConfig({
|
|
66
|
+
id: 'my-theme',
|
|
67
|
+
name: 'My Theme',
|
|
68
|
+
appCategory: 'games',
|
|
69
|
+
primaryColor: '#7c3aed',
|
|
70
|
+
harmony: 'complementary',
|
|
71
|
+
});
|
|
47
72
|
|
|
48
|
-
expect(themeConfig.
|
|
73
|
+
expect(themeConfig.name).toBe('My Theme');
|
|
49
74
|
});
|
|
50
75
|
});
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { parseHexColorOrThrow } from '@ankhorage/color-theory';
|
|
2
|
+
import type { ThemeConfig } from '@ankhorage/contracts';
|
|
2
3
|
|
|
3
|
-
import { resolveModePrimaryColor } from '../internal/color';
|
|
4
4
|
import type { ZoraTheme } from './types';
|
|
5
5
|
import { zoraDefaultTheme } from './zoraDefaultTheme';
|
|
6
6
|
|
|
7
7
|
export function createZoraThemeConfig(theme: ZoraTheme = zoraDefaultTheme): ThemeConfig {
|
|
8
|
+
const primaryColor = parseHexColorOrThrow(theme.primaryColor);
|
|
9
|
+
|
|
8
10
|
return {
|
|
9
11
|
id: theme.id,
|
|
10
|
-
name: theme.name
|
|
12
|
+
name: theme.name,
|
|
11
13
|
light: {
|
|
12
|
-
primaryColor
|
|
14
|
+
primaryColor,
|
|
13
15
|
harmony: theme.harmony,
|
|
14
|
-
colorTone: theme.colorTone,
|
|
15
16
|
},
|
|
16
17
|
dark: {
|
|
17
|
-
primaryColor
|
|
18
|
+
primaryColor,
|
|
18
19
|
harmony: theme.harmony,
|
|
19
|
-
colorTone: theme.colorTone,
|
|
20
20
|
},
|
|
21
21
|
};
|
|
22
22
|
}
|
package/src/theme/index.ts
CHANGED
package/src/theme/types.ts
CHANGED
|
@@ -1,49 +1,37 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type {
|
|
2
|
+
ColorHarmony,
|
|
3
|
+
GeneratedThemeModeColors,
|
|
4
|
+
GeneratedThemeSwatches,
|
|
5
|
+
SemanticColorToken,
|
|
6
|
+
} from '@ankhorage/color-theory';
|
|
7
|
+
import type { AppCategory, ThemeConfig } from '@ankhorage/contracts';
|
|
8
|
+
import type { SurfaceTheme } from '@ankhorage/surface';
|
|
2
9
|
|
|
3
10
|
export type ZoraThemeId = string;
|
|
4
11
|
|
|
5
12
|
export type ZoraThemeMode = 'light' | 'dark';
|
|
6
13
|
|
|
7
|
-
export type ZoraHexColor = `#${string}`;
|
|
8
|
-
|
|
9
|
-
export const ZORA_COLOR_HARMONIES = [
|
|
10
|
-
'monochromatic',
|
|
11
|
-
'analogous',
|
|
12
|
-
'complementary',
|
|
13
|
-
'splitComplementary',
|
|
14
|
-
'triadic',
|
|
15
|
-
'tetradic',
|
|
16
|
-
] as const satisfies readonly ColorHarmony[];
|
|
17
|
-
|
|
18
|
-
export type ZoraColorHarmony = ColorHarmony;
|
|
19
|
-
|
|
20
|
-
export const ZORA_COLOR_TONES = [
|
|
21
|
-
'neutral',
|
|
22
|
-
'pastel',
|
|
23
|
-
'earth',
|
|
24
|
-
'mineral',
|
|
25
|
-
'muted',
|
|
26
|
-
'jewel',
|
|
27
|
-
'fluorescent',
|
|
28
|
-
'obsidian',
|
|
29
|
-
'vaporwave',
|
|
30
|
-
'monochromeAccent',
|
|
31
|
-
] as const satisfies readonly ColorTone[];
|
|
32
|
-
|
|
33
|
-
export type ZoraColorTone = ColorTone;
|
|
34
|
-
|
|
35
14
|
export interface ZoraTheme {
|
|
36
15
|
id: ZoraThemeId;
|
|
37
|
-
name
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
16
|
+
name: string;
|
|
17
|
+
appCategory: AppCategory;
|
|
18
|
+
primaryColor: string;
|
|
19
|
+
harmony: ColorHarmony;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export interface ZoraComputedThemeMode {
|
|
23
|
+
mode: ZoraThemeMode;
|
|
24
|
+
surfaceTheme: SurfaceTheme;
|
|
25
|
+
generated: GeneratedThemeModeColors;
|
|
26
|
+
swatches: GeneratedThemeSwatches;
|
|
27
|
+
semanticColors?: Record<SemanticColorToken, string>;
|
|
41
28
|
}
|
|
42
29
|
|
|
43
30
|
export interface ZoraComputedTheme {
|
|
44
31
|
id: ZoraThemeId;
|
|
45
32
|
name: string;
|
|
46
|
-
mode: ZoraThemeMode;
|
|
47
33
|
source: ZoraTheme;
|
|
48
34
|
surfaceConfig: ThemeConfig;
|
|
35
|
+
light: ZoraComputedThemeMode;
|
|
36
|
+
dark: ZoraComputedThemeMode;
|
|
49
37
|
}
|
|
@@ -1,23 +0,0 @@
|
|
|
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
|
|
@@ -1 +0,0 @@
|
|
|
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"}
|
|
@@ -1,139 +0,0 @@
|
|
|
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
|
|
@@ -1 +0,0 @@
|
|
|
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,12 +0,0 @@
|
|
|
1
|
-
import type { ZoraColorHarmony, ZoraHexColor } from '../../theme/types';
|
|
2
|
-
export type ZoraHarmonySlotId = 'base' | 'a' | 'b' | 'c';
|
|
3
|
-
export interface ZoraHarmonySlot {
|
|
4
|
-
id: ZoraHarmonySlotId;
|
|
5
|
-
hue: number;
|
|
6
|
-
}
|
|
7
|
-
export interface ZoraComputedHarmony {
|
|
8
|
-
kind: ZoraColorHarmony;
|
|
9
|
-
orderedSlots: readonly ZoraHarmonySlot[];
|
|
10
|
-
}
|
|
11
|
-
export declare function computeZoraHarmony(seed: ZoraHexColor, harmony: ZoraColorHarmony): ZoraComputedHarmony;
|
|
12
|
-
//# sourceMappingURL=harmony.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"harmony.d.ts","sourceRoot":"","sources":["../../../src/internal/color/harmony.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAIxE,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEzD,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,iBAAiB,CAAC;IACtB,GAAG,EAAE,MAAM,CAAC;CACb;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,gBAAgB,CAAC;IACvB,YAAY,EAAE,SAAS,eAAe,EAAE,CAAC;CAC1C;AAmBD,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,YAAY,EAClB,OAAO,EAAE,gBAAgB,GACxB,mBAAmB,CA2DrB"}
|
|
@@ -1,69 +0,0 @@
|
|
|
1
|
-
import { normalizeHueDegrees, rotateHueDegrees } from './hue';
|
|
2
|
-
import { parseHexToOklch } from './oklch';
|
|
3
|
-
const DEFAULT_HARMONY_HUE_DEGREES = 260;
|
|
4
|
-
const MIN_SEED_CHROMA_FOR_HARMONY_HUE = 0.03;
|
|
5
|
-
function createSlot(id, hue) {
|
|
6
|
-
return { id, hue: normalizeHueDegrees(hue) };
|
|
7
|
-
}
|
|
8
|
-
function resolveSeedHueDegrees(seed) {
|
|
9
|
-
const parsed = parseHexToOklch(seed);
|
|
10
|
-
if (!Number.isFinite(parsed.h) || parsed.c < MIN_SEED_CHROMA_FOR_HARMONY_HUE) {
|
|
11
|
-
return DEFAULT_HARMONY_HUE_DEGREES;
|
|
12
|
-
}
|
|
13
|
-
return normalizeHueDegrees(parsed.h);
|
|
14
|
-
}
|
|
15
|
-
export function computeZoraHarmony(seed, harmony) {
|
|
16
|
-
const baseHue = resolveSeedHueDegrees(seed);
|
|
17
|
-
if (harmony === 'monochromatic') {
|
|
18
|
-
return {
|
|
19
|
-
kind: harmony,
|
|
20
|
-
orderedSlots: [createSlot('base', baseHue)],
|
|
21
|
-
};
|
|
22
|
-
}
|
|
23
|
-
if (harmony === 'complementary') {
|
|
24
|
-
return {
|
|
25
|
-
kind: harmony,
|
|
26
|
-
orderedSlots: [createSlot('base', baseHue), createSlot('a', rotateHueDegrees(baseHue, 180))],
|
|
27
|
-
};
|
|
28
|
-
}
|
|
29
|
-
if (harmony === 'analogous') {
|
|
30
|
-
return {
|
|
31
|
-
kind: harmony,
|
|
32
|
-
orderedSlots: [
|
|
33
|
-
createSlot('base', baseHue),
|
|
34
|
-
createSlot('a', rotateHueDegrees(baseHue, -30)),
|
|
35
|
-
createSlot('b', rotateHueDegrees(baseHue, 30)),
|
|
36
|
-
],
|
|
37
|
-
};
|
|
38
|
-
}
|
|
39
|
-
if (harmony === 'splitComplementary') {
|
|
40
|
-
return {
|
|
41
|
-
kind: harmony,
|
|
42
|
-
orderedSlots: [
|
|
43
|
-
createSlot('base', baseHue),
|
|
44
|
-
createSlot('a', rotateHueDegrees(baseHue, 150)),
|
|
45
|
-
createSlot('b', rotateHueDegrees(baseHue, 210)),
|
|
46
|
-
],
|
|
47
|
-
};
|
|
48
|
-
}
|
|
49
|
-
if (harmony === 'triadic') {
|
|
50
|
-
return {
|
|
51
|
-
kind: harmony,
|
|
52
|
-
orderedSlots: [
|
|
53
|
-
createSlot('base', baseHue),
|
|
54
|
-
createSlot('a', rotateHueDegrees(baseHue, 120)),
|
|
55
|
-
createSlot('b', rotateHueDegrees(baseHue, 240)),
|
|
56
|
-
],
|
|
57
|
-
};
|
|
58
|
-
}
|
|
59
|
-
return {
|
|
60
|
-
kind: harmony,
|
|
61
|
-
orderedSlots: [
|
|
62
|
-
createSlot('base', baseHue),
|
|
63
|
-
createSlot('a', rotateHueDegrees(baseHue, 90)),
|
|
64
|
-
createSlot('b', rotateHueDegrees(baseHue, 180)),
|
|
65
|
-
createSlot('c', rotateHueDegrees(baseHue, 270)),
|
|
66
|
-
],
|
|
67
|
-
};
|
|
68
|
-
}
|
|
69
|
-
//# sourceMappingURL=harmony.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"harmony.js","sourceRoot":"","sources":["../../../src/internal/color/harmony.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ZoraColorHarmony, ZoraHexColor } from '../../theme/types';\nimport { normalizeHueDegrees, rotateHueDegrees } from './hue';\nimport { parseHexToOklch } from './oklch';\n\nexport type ZoraHarmonySlotId = 'base' | 'a' | 'b' | 'c';\n\nexport interface ZoraHarmonySlot {\n id: ZoraHarmonySlotId;\n hue: number;\n}\n\nexport interface ZoraComputedHarmony {\n kind: ZoraColorHarmony;\n orderedSlots: readonly ZoraHarmonySlot[];\n}\n\nconst DEFAULT_HARMONY_HUE_DEGREES = 260;\nconst MIN_SEED_CHROMA_FOR_HARMONY_HUE = 0.03;\n\nfunction createSlot(id: ZoraHarmonySlotId, hue: number): ZoraHarmonySlot {\n return { id, hue: normalizeHueDegrees(hue) };\n}\n\nfunction resolveSeedHueDegrees(seed: ZoraHexColor): number {\n const parsed = parseHexToOklch(seed);\n\n if (!Number.isFinite(parsed.h) || parsed.c < MIN_SEED_CHROMA_FOR_HARMONY_HUE) {\n return DEFAULT_HARMONY_HUE_DEGREES;\n }\n\n return normalizeHueDegrees(parsed.h);\n}\n\nexport function computeZoraHarmony(\n seed: ZoraHexColor,\n harmony: ZoraColorHarmony,\n): ZoraComputedHarmony {\n const baseHue = resolveSeedHueDegrees(seed);\n\n if (harmony === 'monochromatic') {\n return {\n kind: harmony,\n orderedSlots: [createSlot('base', baseHue)],\n };\n }\n\n if (harmony === 'complementary') {\n return {\n kind: harmony,\n orderedSlots: [createSlot('base', baseHue), createSlot('a', rotateHueDegrees(baseHue, 180))],\n };\n }\n\n if (harmony === 'analogous') {\n return {\n kind: harmony,\n orderedSlots: [\n createSlot('base', baseHue),\n createSlot('a', rotateHueDegrees(baseHue, -30)),\n createSlot('b', rotateHueDegrees(baseHue, 30)),\n ],\n };\n }\n\n if (harmony === 'splitComplementary') {\n return {\n kind: harmony,\n orderedSlots: [\n createSlot('base', baseHue),\n createSlot('a', rotateHueDegrees(baseHue, 150)),\n createSlot('b', rotateHueDegrees(baseHue, 210)),\n ],\n };\n }\n\n if (harmony === 'triadic') {\n return {\n kind: harmony,\n orderedSlots: [\n createSlot('base', baseHue),\n createSlot('a', rotateHueDegrees(baseHue, 120)),\n createSlot('b', rotateHueDegrees(baseHue, 240)),\n ],\n };\n }\n\n return {\n kind: harmony,\n orderedSlots: [\n createSlot('base', baseHue),\n createSlot('a', rotateHueDegrees(baseHue, 90)),\n createSlot('b', rotateHueDegrees(baseHue, 180)),\n createSlot('c', rotateHueDegrees(baseHue, 270)),\n ],\n };\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hue.d.ts","sourceRoot":"","sources":["../../../src/internal/color/hue.ts"],"names":[],"mappings":"AAAA,wBAAgB,mBAAmB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAEvD;AAED,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAEnE"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"hue.js","sourceRoot":"","sources":["../../../src/internal/color/hue.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,mBAAmB,CAAC,GAAW;IAC7C,OAAO,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;AACnC,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,GAAW,EAAE,KAAa;IACzD,OAAO,mBAAmB,CAAC,GAAG,GAAG,KAAK,CAAC,CAAC;AAC1C,CAAC","sourcesContent":["export function normalizeHueDegrees(hue: number): number {\n return ((hue % 360) + 360) % 360;\n}\n\nexport function rotateHueDegrees(hue: number, delta: number): number {\n return normalizeHueDegrees(hue + delta);\n}\n"]}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
export { getZoraColorToneRecipe, getZoraColorToneRoleChromaFactor, type ZoraColorToneLaneRecipe, type ZoraColorToneRecipe, type ZoraColorToneRoleChromaFactors, } from './colorToneRecipes';
|
|
2
|
-
export { computeZoraHarmony, type ZoraComputedHarmony, type ZoraHarmonySlot, type ZoraHarmonySlotId, } from './harmony';
|
|
3
|
-
export { parseHexToOklch } from './oklch';
|
|
4
|
-
export { resolveModePrimaryColor } from './primary';
|
|
5
|
-
export { assignZoraHarmonyRoleHues, getZoraHueRoleAssignment, type ZoraComputedHueRoles, type ZoraHueRoleAssignment, type ZoraHueRoleId, } from './roleHues';
|
|
6
|
-
export { createZoraRoleColorScales, getZoraRoleColorScale, ZORA_COLOR_SCALE_ROLE_ORDER, type ZoraColorScaleRoleId, type ZoraComputedRoleColorScales, type ZoraRoleColorScale, } from './roleScales';
|
|
7
|
-
export { createZoraColorScale, type CreateZoraColorScaleOptions, type CreateZoraHueScaleOptions, createZoraNeutralScale, createZoraPrimaryScale, type ZoraHueScaleRoleId, } from './scales';
|
|
8
|
-
export { createZoraSemanticColorTokens, getReadableTextColor, type ZoraSemanticColorTokens, } from './semanticTokens';
|
|
9
|
-
export { ZORA_COLOR_SCALE_STEPS, type ZoraColorScale, type ZoraColorScaleStep } from './types';
|
|
10
|
-
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
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,EACL,6BAA6B,EAC7B,oBAAoB,EACpB,KAAK,uBAAuB,GAC7B,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,sBAAsB,EAAE,KAAK,cAAc,EAAE,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
export { getZoraColorToneRecipe, getZoraColorToneRoleChromaFactor, } from './colorToneRecipes';
|
|
2
|
-
export { computeZoraHarmony, } from './harmony';
|
|
3
|
-
export { parseHexToOklch } from './oklch';
|
|
4
|
-
export { resolveModePrimaryColor } from './primary';
|
|
5
|
-
export { assignZoraHarmonyRoleHues, getZoraHueRoleAssignment, } from './roleHues';
|
|
6
|
-
export { createZoraRoleColorScales, getZoraRoleColorScale, ZORA_COLOR_SCALE_ROLE_ORDER, } from './roleScales';
|
|
7
|
-
export { createZoraColorScale, createZoraNeutralScale, createZoraPrimaryScale, } from './scales';
|
|
8
|
-
export { createZoraSemanticColorTokens, getReadableTextColor, } from './semanticTokens';
|
|
9
|
-
export { ZORA_COLOR_SCALE_STEPS } from './types';
|
|
10
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
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,EACL,6BAA6B,EAC7B,oBAAoB,GAErB,MAAM,kBAAkB,CAAC;AAC1B,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 {\n createZoraSemanticColorTokens,\n getReadableTextColor,\n type ZoraSemanticColorTokens,\n} from './semanticTokens';\nexport { ZORA_COLOR_SCALE_STEPS, type ZoraColorScale, type ZoraColorScaleStep } from './types';\n"]}
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import type { ZoraHexColor } from '../../theme/types';
|
|
2
|
-
import type { ZoraOklchColor } from './types';
|
|
3
|
-
export declare function parseHexToOklch(hex: ZoraHexColor): ZoraOklchColor;
|
|
4
|
-
export declare function formatOklchAsHex(color: ZoraOklchColor): ZoraHexColor;
|
|
5
|
-
export declare function clampOklchToGamut(color: ZoraOklchColor): ZoraOklchColor;
|
|
6
|
-
//# sourceMappingURL=oklch.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"oklch.d.ts","sourceRoot":"","sources":["../../../src/internal/color/oklch.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEtD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAS9C,wBAAgB,eAAe,CAAC,GAAG,EAAE,YAAY,GAAG,cAAc,CAoBjE;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,GAAG,YAAY,CAcpE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,GAAG,cAAc,CAavE"}
|