pull the palette types into a central location

README.md

@@ -26,6 +26,7 @@ First time you start it up you should also run `yarn prep data`
 - [ ] per cols 4 all: color blindness metric should maybe be sensitive to task?
 - [ ] Sequential check fix is incorrect for things with equi-ligthness
 - [ ] Macros story: "not similar", "sequences", "where": { "!=": {"left": "index(a)", "right": "index(b)"} },
+- [ ] More crashy type validation
 - [x] "No out of gamut"
 
 # General Todos
@@ -48,12 +49,12 @@ First time you start it up you should also run `yarn prep data`
 - [x] Performance stuff for linter (separate message generation into something very throttled, maybe move to web workers? Cache as hard as possible)
 - [x] Merge the info and fixes tooltips in the lints
 - [x] Hover broken on compare, also make sure it takes the right stringify (same as the color channel)
+- [x] Select compare from palettes drop down menu
 
 Parameterization epic:
 
 - [ ] Allow no palettes, allows renaming of non-current palettes, which would be enable by:
 - [ ] Parameterize the scatter column completely, allow edits to the compare stuff
-- [ ] Select compare from palettes drop down menu
 
 # Nice to have
 

src/components/MiniPalPreview.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   export let pal: Palette;
   export let onClick: () => void;
   export let className = "";

src/components/PalDiff.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   export let beforePal: Palette;
   export let afterPal: Palette;
   const xStep = 30;

src/components/PalPreview.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import focusStore from "../stores/focus-store";
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   import Tooltip from "./Tooltip.svelte";
   import SwatchTooltipContent from "./SwatchTooltipContent.svelte";
   import { toggleElement } from "../lib/utils";

src/controls/Config.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import configStore from "../stores/config-store";
   import { Color } from "../lib/Color";
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   import Tooltip from "../components/Tooltip.svelte";
   import colorStore from "../stores/color-store";
   import { buttonStyle } from "../lib/styles";

src/controls/InterpolatePoints.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { Color } from "../lib/Color";
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   import colorStore from "../stores/color-store";
   import focusStore from "../stores/focus-store";
   import { buttonStyle } from "../lib/styles";

src/controls/NewPal.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { Color } from "../lib/Color";
   import colorStore, { newGenericPal } from "../stores/color-store";
-  import type { StringPalette, Palette } from "../stores/color-store";
+  import type { StringPalette, Palette } from "../types";
   import focusStore from "../stores/focus-store";
   import { onMount } from "svelte";
   import Tooltip from "../components/Tooltip.svelte";

src/controls/SuggestColorPal.svelte

@@ -3,7 +3,7 @@
   import configStore from "../stores/config-store";
   import { Color } from "../lib/Color";
   import { suggestPal } from "../lib/api-calls";
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   import PalPreview from "../components/PalPreview.svelte";
   import { buttonStyle, AIButtonStyle } from "../lib/styles";
 

src/example/Examples.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { Color } from "../lib/Color";
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   import exampleStore, {
     DEMOS,
     detectColorsInSvgString,

src/lib/ColorLint.test.ts

@@ -1,7 +1,7 @@
 import { expect, test } from "vitest";
 
 import { Color } from "./Color";
-import type { Palette } from "../stores/color-store";
+import type { Palette } from "../types";
 
 import { CreateCustomLint } from "./CustomLint";
 import { suggestLintFix } from "./linter-tools/lint-fixer";

src/lib/ColorLint.ts

@@ -1,6 +1,5 @@
-import type { Palette } from "../stores/color-store";
+import type { Palette, PalType } from "../types";
 
-export type TaskType = "sequential" | "diverging" | "categorical";
 export type LintLevel = "error" | "warning";
 export interface LintResult {
   name: string;
@@ -10,13 +9,13 @@ export interface LintResult {
   group: string;
   description: string;
   isCustom: false | string;
-  taskTypes: TaskType[];
+  taskTypes: PalType[];
   subscribedFix: string;
 }
 
 export class ColorLint<CheckData, ParamType> {
   name: string = "";
-  taskTypes: TaskType[] = [];
+  taskTypes: PalType[] = [];
   passes: boolean;
   checkData: CheckData;
   palette: Palette;

src/lib/api-calls.ts

@@ -1,4 +1,4 @@
-import type { Palette } from "../stores/color-store";
+import type { Palette } from "../types";
 import * as Json from "jsonc-parser";
 import LintWorker from "./linter-tools/lint-worker.worker?worker";
 

src/lib/charts.ts

@@ -1,6 +1,6 @@
 import * as vega from "vega";
 import * as vegaLite from "vega-lite";
-import type { Palette } from "../stores/color-store";
+import type { Palette } from "../types";
 
 export const idxToKey = (idx: number) => `#${idx}A${idx}0${idx}${idx}`;
 

src/lib/lint-language/LintLanguage.test.ts

@@ -1,7 +1,7 @@
 import { expect, test } from "vitest";
 import { LLEval, prettyPrintLL, permutativeBlame } from "./lint-language";
 import { Color } from "../Color";
-import type { Palette } from "../../stores/color-store";
+import type { Palette } from "../../types";
 import type { LintProgram } from "./lint-type";
 
 const toPal = (colors: string[]): Palette => ({

src/lib/lint-language/lint-language.ts

@@ -1,5 +1,5 @@
 import cvdSim from "../blindness";
-import type { Palette } from "../../stores/color-store";
+import type { Palette } from "../../types";
 import { Color, colorPickerConfig } from "../Color";
 import { getName } from "../lints/name-discrim";
 import type { LintProgram } from "./lint-type";

src/lib/linter-tools/lint-fixer.ts

@@ -1,4 +1,4 @@
-import type { Palette } from "../../stores/color-store";
+import type { Palette } from "../../types";
 import { suggestFix } from "../api-calls";
 import type { LintResult } from "../ColorLint";
 import { Color } from "../Color";

src/lib/linter-tools/lint-worker.worker.ts

@@ -1,7 +1,7 @@
 import * as idb from "idb-keyval";
 import { runLintChecks } from "../linter";
 import type { CustomLint } from "../CustomLint";
-import type { Palette } from "../../stores/color-store";
+import type { Palette } from "../../types";
 import { Color } from "../Color";
 import type { LintResult } from "../ColorLint";
 

src/lib/linter.ts

@@ -1,5 +1,5 @@
 import { ColorLint } from "./ColorLint";
-import type { Palette } from "../stores/color-store";
+import type { Palette } from "../types";
 import type { CustomLint } from "./CustomLint";
 import { CreateCustomLint } from "./CustomLint";
 

src/lib/lints/diverging-order.ts

@@ -1,7 +1,7 @@
 import { ColorLint } from "../ColorLint";
 import type { TaskType } from "../ColorLint";
 import { Color } from "../Color";
-import type { Palette } from "../../stores/color-store";
+import type { Palette } from "../../types";
 import type { LintFixer } from "../linter-tools/lint-fixer";
 
 const meanPoint2d = (points: Color[]) => {

src/lib/lints/name-discrim.ts

@@ -2,7 +2,7 @@ import { JSONToPrettyString } from "../utils";
 import type { CustomLint } from "../CustomLint";
 import namer from "color-namer";
 import { Color } from "../Color";
-import type { Palette } from "../../stores/color-store";
+import type { Palette } from "../../types";
 import { titleCase } from "../utils";
 import type { LintFixer } from "../linter-tools/lint-fixer";
 

src/lib/lints/sequential-order.ts

@@ -1,7 +1,7 @@
 import { JSONToPrettyString } from "../utils";
 import type { CustomLint } from "../CustomLint";
 import { Color } from "../Color";
-import type { Palette } from "../../stores/color-store";
+import type { Palette } from "../../types";
 import type { LintFixer } from "../linter-tools/lint-fixer";
 
 const lint: CustomLint = {

src/lib/utils.ts

@@ -1,5 +1,5 @@
 import { Color, colorPickerConfig } from "./Color";
-import type { PalType, Palette } from "../stores/color-store";
+import type { Palette } from "../types";
 import type { LintProgram } from "./lint-language/lint-type";
 import { Formatter, FracturedJsonOptions, EolStyle } from "fracturedjsonjs";
 

src/linting/EvalResponse.svelte

@@ -4,7 +4,7 @@
   import focusStore from "../stores/focus-store";
   import configStore from "../stores/config-store";
   import type { LintResult } from "../lib/ColorLint";
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   import PalDiff from "../components/PalDiff.svelte";
   import ExplanationViewer from "./ExplanationViewer.svelte";
   import {

src/scatterplot/ColorScatterPlot.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import type { Palette } from "../stores/color-store";
+  import type { Palette } from "../types";
   import { Color, colorPickerConfig } from "../lib/Color";
   import {
     makePosAndSizes,

src/stores/color-store.ts

@@ -4,39 +4,19 @@ import fits from "../assets/outfits.json";
 import { pick, deDup } from "../lib/utils";
 const outfitToPal = (x: any) => [x.fill1, x.fill2, x.fill3];
 const outfits = fits.map((x) => outfitToPal(x));
-export type PalType = "sequential" | "diverging" | "categorical";
-type ColorSpace =
-  | "lab"
-  | "hsl"
-  | "hsv"
-  | "jzazbz"
-  | "lch"
-  | "oklab"
-  | "oklch"
-  | "rgb"
-  | "srgb";
-type Pal<A> = {
-  background: A;
-  colorSpace: ColorSpace;
-  colors: A[];
-  evalConfig: Record<string, any>;
-  name: string;
-  type: PalType;
-};
-export type Palette = Pal<Color>;
-export type StringPalette = Pal<string>;
+import type { Palette, StringPalette, PalType, ColorSpace } from "../types";
 
 interface StoreData {
-  palettes: Pal<Color>[];
+  palettes: Palette[];
   currentPal: number;
 }
 
 interface StorageData {
-  palettes: Pal<string>[];
+  palettes: StringPalette[];
   currentPal: number;
 }
 
-export function newGenericPal(name: string): Pal<string> {
+export function newGenericPal(name: string): StringPalette {
   return {
     name,
     colors: pick(outfits),
@@ -47,7 +27,7 @@ export function newGenericPal(name: string): Pal<string> {
   };
 }
 
-function stringPalToColorPal(pal: Pal<string>): Pal<Color> {
+function stringPalToColorPal(pal: StringPalette): Palette {
   return {
     ...pal,
     background: Color.colorFromString(pal.background, pal.colorSpace),

src/types.ts

@@ -0,0 +1,23 @@
+import { Color } from "./lib/Color";
+
+export type ColorSpace =
+  | "lab"
+  | "hsl"
+  | "hsv"
+  | "jzazbz"
+  | "lch"
+  | "oklab"
+  | "oklch"
+  | "rgb"
+  | "srgb";
+type Pal<A> = {
+  background: A;
+  colorSpace: ColorSpace;
+  colors: A[];
+  evalConfig: Record<string, any>;
+  name: string;
+  type: PalType;
+};
+export type PalType = "sequential" | "diverging" | "categorical";
+export type Palette = Pal<Color>;
+export type StringPalette = Pal<string>;