Merge pull request #6 from sanity-labs/default-visual-center-y

feat: default alignBy to visual-center-y

Author: RostiMelk

README.md

@@ -97,7 +97,7 @@ Imagine you have two logos:
 
 ### `alignBy`
 
-How to align logos. Default is `"bounds"`.
+How to align logos. Default is `"visual-center-y"`.
 
 - `"bounds"` — Align by geometric center (bounding box)
 - `"visual-center"` — Align by visual weight center (accounts for asymmetric logos)

src/constants.ts

@@ -1,8 +1,10 @@
 import type { AlignmentMode } from "./types";
 
-export const DEFAULT_ALIGN_BY: AlignmentMode = "bounds";
+export const DEFAULT_ALIGN_BY: AlignmentMode = "visual-center-y";
 export const DEFAULT_GAP = 28;
 export const DEFAULT_BASE_SIZE = 48;
 export const DEFAULT_SCALE_FACTOR = 0.5;
 export const DEFAULT_CONTRAST_THRESHOLD = 10;
+export const DEFAULT_DENSITY_AWARE = true;
 export const DEFAULT_DENSITY_FACTOR = 0.5;
+export const DEFAULT_CROP_TO_CONTENT = false;

src/hooks/useLogoSoup.ts

@@ -2,6 +2,8 @@ import { useEffect, useReducer, useRef } from "react";
 import {
   DEFAULT_BASE_SIZE,
   DEFAULT_CONTRAST_THRESHOLD,
+  DEFAULT_CROP_TO_CONTENT,
+  DEFAULT_DENSITY_AWARE,
   DEFAULT_DENSITY_FACTOR,
   DEFAULT_SCALE_FACTOR,
 } from "../constants";
@@ -63,9 +65,9 @@ export function useLogoSoup(options: UseLogoSoupOptions): UseLogoSoupResult {
     baseSize = DEFAULT_BASE_SIZE,
     scaleFactor = DEFAULT_SCALE_FACTOR,
     contrastThreshold = DEFAULT_CONTRAST_THRESHOLD,
-    densityAware = true,
+    densityAware = DEFAULT_DENSITY_AWARE,
     densityFactor = DEFAULT_DENSITY_FACTOR,
-    cropToContent = false,
+    cropToContent = DEFAULT_CROP_TO_CONTENT,
   } = options;
 
   const [state, dispatch] = useReducer(reducer, INITIAL_STATE);

stories/LogoSoup.stories.tsx

@@ -4,6 +4,8 @@ import { useMemo } from "react";
 import {
   DEFAULT_ALIGN_BY,
   DEFAULT_BASE_SIZE,
+  DEFAULT_CROP_TO_CONTENT,
+  DEFAULT_DENSITY_AWARE,
   DEFAULT_DENSITY_FACTOR,
   DEFAULT_GAP,
   DEFAULT_SCALE_FACTOR,
@@ -275,9 +277,9 @@ export const Playground: Story = {
     shuffleSeed: 42,
     baseSize: DEFAULT_BASE_SIZE,
     scaleFactor: DEFAULT_SCALE_FACTOR,
-    densityAware: true,
+    densityAware: DEFAULT_DENSITY_AWARE,
     densityFactor: DEFAULT_DENSITY_FACTOR,
-    cropToContent: false,
+    cropToContent: DEFAULT_CROP_TO_CONTENT,
     alignBy: DEFAULT_ALIGN_BY,
     gap: DEFAULT_GAP,
     showImageBounds: false,