fix tree shaking

KTibow · Jan 5, 2024 · d23079d · d23079d
1 parent c0bb753
commit d23079d
Show file tree

Hide file tree

Showing 4 changed files with 73 additions and 71 deletions.
diff --git a/src/lib/index.ts b/src/lib/index.ts
@@ -1,8 +1,9 @@
-export * from "./misc/utils.js";
 export { default as StyleFromScheme } from "./misc/StyleFromScheme.svelte";
 export { default as Icon } from "./misc/_icon.svelte";
 export * from "./misc/animation.js";
+export * from "./misc/utils.js";
 export * from "./misc/easing.js";
+export * from "./misc/serializeScheme.js";
 
 export { default as Button } from "./buttons/Button.svelte";
 export { default as ButtonLink } from "./buttons/ButtonLink.svelte";

diff --git a/src/lib/misc/serializeScheme.ts b/src/lib/misc/serializeScheme.ts
@@ -0,0 +1,70 @@
+import { DynamicScheme, MaterialDynamicColors } from "@material/material-color-utilities";
+import type { Color, SerializedScheme } from "./utils";
+
+export const pairs = [
+  ["primary", "onPrimary"],
+  ["primaryContainer", "onPrimaryContainer"],
+  ["secondary", "onSecondary"],
+  ["secondaryContainer", "onSecondaryContainer"],
+  ["tertiary", "onTertiary"],
+  ["tertiaryContainer", "onTertiaryContainer"],
+  ["background", "onBackground"],
+  ["surface", "onSurface"],
+  ["inverseSurface", "inverseOnSurface"],
+  ["surfaceVariant", "onSurfaceVariant"],
+  ["error", "onError"],
+  ["errorContainer", "onErrorContainer"],
+];
+
+export const colors: Color[] = [
+  "primary",
+  "onPrimary",
+  "primaryContainer",
+  "onPrimaryContainer",
+  "inversePrimary",
+  "secondary",
+  "onSecondary",
+  "secondaryContainer",
+  "onSecondaryContainer",
+  "tertiary",
+  "onTertiary",
+  "tertiaryContainer",
+  "onTertiaryContainer",
+  "error",
+  "onError",
+  "errorContainer",
+  "onErrorContainer",
+  "background",
+  "onBackground",
+  "surface",
+  "onSurface",
+  "surfaceVariant",
+  "onSurfaceVariant",
+  "inverseSurface",
+  "inverseOnSurface",
+  "outline",
+  "outlineVariant",
+  "shadow",
+  "scrim",
+  "surfaceDim",
+  "surfaceBright",
+  "surfaceContainerLowest",
+  "surfaceContainerLow",
+  "surfaceContainer",
+  "surfaceContainerHigh",
+  "surfaceContainerHighest",
+  "surfaceTint",
+];
+
+/**
+ * @description Serializes the {@link DynamicScheme} so that it can be used by {@link StyleFromScheme} and {@link genCSS}.
+ * @param scheme The theme generated by material-color-utils.
+ * */
+
+export const serializeScheme = (scheme: DynamicScheme) => {
+  const out: Record<string, number> = {};
+  for (const color of colors) {
+    out[color] = MaterialDynamicColors[color].getArgb(scheme);
+  }
+  return out as SerializedScheme;
+};
diff --git a/src/lib/misc/utils.ts b/src/lib/misc/utils.ts
@@ -1,5 +1,3 @@
-import { DynamicScheme, MaterialDynamicColors } from "@material/material-color-utilities";
-
 export type Color =
   | "primary"
   | "onPrimary"
@@ -40,61 +38,6 @@ export type Color =
   | "surfaceTint";
 export type SerializedScheme = Record<Color, number>;
 
-export const pairs = [
-  ["primary", "onPrimary"],
-  ["primaryContainer", "onPrimaryContainer"],
-  ["secondary", "onSecondary"],
-  ["secondaryContainer", "onSecondaryContainer"],
-  ["tertiary", "onTertiary"],
-  ["tertiaryContainer", "onTertiaryContainer"],
-  ["background", "onBackground"],
-  ["surface", "onSurface"],
-  ["inverseSurface", "inverseOnSurface"],
-  ["surfaceVariant", "onSurfaceVariant"],
-  ["error", "onError"],
-  ["errorContainer", "onErrorContainer"],
-];
-
-export const colors: Color[] = [
-  "primary",
-  "onPrimary",
-  "primaryContainer",
-  "onPrimaryContainer",
-  "inversePrimary",
-  "secondary",
-  "onSecondary",
-  "secondaryContainer",
-  "onSecondaryContainer",
-  "tertiary",
-  "onTertiary",
-  "tertiaryContainer",
-  "onTertiaryContainer",
-  "error",
-  "onError",
-  "errorContainer",
-  "onErrorContainer",
-  "background",
-  "onBackground",
-  "surface",
-  "onSurface",
-  "surfaceVariant",
-  "onSurfaceVariant",
-  "inverseSurface",
-  "inverseOnSurface",
-  "outline",
-  "outlineVariant",
-  "shadow",
-  "scrim",
-  "surfaceDim",
-  "surfaceBright",
-  "surfaceContainerLowest",
-  "surfaceContainerLow",
-  "surfaceContainer",
-  "surfaceContainerHigh",
-  "surfaceContainerHighest",
-  "surfaceTint",
-];
-
 /**
  * @returns A string of CSS code with custom properties representing the color scheme values.
  * */
@@ -134,15 +77,3 @@ ${darkColors}
 }`;
   return colors;
 };
-
-/**
- * @description Serializes the {@link DynamicScheme} so that it can be used by {@link StyleFromScheme} and {@link genCSS}.
- * @param scheme The theme generated by material-color-utils.
- * */
-export const serializeScheme = (scheme: DynamicScheme) => {
-  const out: Record<string, number> = {};
-  for (const color of colors) {
-    out[color] = MaterialDynamicColors[color as Color].getArgb(scheme);
-  }
-  return out as SerializedScheme;
-};
diff --git a/src/routes/theme/SchemeShowcase.svelte b/src/routes/theme/SchemeShowcase.svelte
@@ -9,7 +9,7 @@
   import StyleFromScheme from "$lib/misc/StyleFromScheme.svelte";
   import Button from "$lib/buttons/Button.svelte";
   import ColorCard from "./ColorCard.svelte";
-  import { pairs, serializeScheme } from "$lib/misc/utils";
+  import { pairs, serializeScheme } from "$lib/misc/serializeScheme";
 
   export let schemeLight: DynamicScheme;
   export let schemeDark: DynamicScheme;