From 07d648af2e158e9a9095142206b96b30cc3fd7a3 Mon Sep 17 00:00:00 2001
From: Lou Huang <lou@streetmix.net>
Date: Sat, 14 Dec 2024 11:58:28 -0500
Subject: [PATCH] refactor(setSpace): fix typing

---
 lib/ui/mixins/setSpace.ts | 47 +++++++++++++++++++++------------------
 1 file changed, 25 insertions(+), 22 deletions(-)

diff --git a/lib/ui/mixins/setSpace.ts b/lib/ui/mixins/setSpace.ts
index e03e2298..c7272342 100644
--- a/lib/ui/mixins/setSpace.ts
+++ b/lib/ui/mixins/setSpace.ts
@@ -1,24 +1,30 @@
 import { space, type SpaceValue } from "ui/settings";
 import fluidify from "./ofMixins/fluidify";
 
-export const setSpace = (args: string, force?: "force") => {
-  const prop: keyof typeof properties = args.substring(0, 1);
-  const pos: SpaceValue = args.substring(1, 2);
-  const size: SpaceValue = args.substring(2, 3);
-  const properties = {
-    b: "border-width",
-    m: "margin",
-    p: "padding",
-  };
-  const positions: Record<SpaceValue, string> = {
-    t: "top",
-    b: "bottom",
-    l: "left",
-    r: "right",
-  };
+type PropertyValue = keyof typeof properties;
+type PositionValue = "a" | "h" | "v" | keyof typeof positions;
+type SpaceShorthand = `${PropertyValue}${PositionValue}${SpaceValue}`;
+
+const properties = {
+  b: "border-width",
+  m: "margin",
+  p: "padding",
+};
+const positions = {
+  t: "top",
+  b: "bottom",
+  l: "left",
+  r: "right",
+};
+
+export const setSpace = (args: SpaceShorthand, force?: "force") => {
+  const prop: PropertyValue = args.substring(0, 1) as PropertyValue;
+  const pos: PositionValue = args.substring(1, 2) as PositionValue;
+  const size: SpaceValue = args.substring(2, 3) as SpaceValue;
   const isImportant = force === "force";
 
   switch (pos) {
+    // a = all sides
     case "a":
       return fluidify(
         `${properties[prop]}`,
@@ -26,13 +32,7 @@ export const setSpace = (args: string, force?: "force") => {
         space[size][1],
         isImportant
       );
-    case "k":
-      return fluidify(
-        [`${properties[prop]}-left`, `${properties[prop]}-right`],
-        space[size][0],
-        space[size][1],
-        isImportant
-      );
+    // h = horizontal (left & right)
     case "h":
       return fluidify(
         [`${properties[prop]}-left`, `${properties[prop]}-right`],
@@ -40,6 +40,7 @@ export const setSpace = (args: string, force?: "force") => {
         space[size][1],
         isImportant
       );
+    // v = vertical (top & bottom)
     case "v":
       return fluidify(
         [`${properties[prop]}-top`, `${properties[prop]}-bottom`],
@@ -47,6 +48,7 @@ export const setSpace = (args: string, force?: "force") => {
         space[size][1],
         isImportant
       );
+    // default: single side (top / bottom / left / right)
     default:
       return fluidify(
         `${properties[prop]}-${positions[pos]}`,
@@ -57,4 +59,5 @@ export const setSpace = (args: string, force?: "force") => {
   }
 };
 
+// Re-export for use with typing setSpace()
 export { SpaceValue };