Fix (core): makeTheme should perform deep merges of objects (#1403)

* Fix: checkbox icon theming

* Fix (core): makeTheme should perform deep merges of objects

---------

Co-authored-by: Simon Boudrias <admin@simonboudrias.com>

packages/checkbox/checkbox.test.mts

@@ -672,6 +672,59 @@ describe('checkbox prompt', () => {
     await expect(answer).resolves.toEqual([1]);
   });
 
+  describe('theme: icon', () => {
+    it('checked/unchecked', async () => {
+      const { answer, events, getScreen } = await render(checkbox, {
+        message: 'Select a number',
+        choices: numberedChoices,
+        theme: {
+          icon: {
+            checked: '√',
+            unchecked: 'x',
+          },
+        },
+      });
+      events.keypress('space');
+      expect(getScreen()).toMatchInlineSnapshot(`
+        "? Select a number
+        ❯√ 1
+         x 2
+         x 3
+         x 4
+         x 5
+         x 6
+         x 7"
+      `);
+      events.keypress('enter');
+      await answer;
+    });
+
+    it('cursor', async () => {
+      const { answer, events, getScreen } = await render(checkbox, {
+        message: 'Select a number',
+        choices: numberedChoices,
+        theme: {
+          icon: {
+            cursor: '>',
+          },
+        },
+      });
+      events.keypress('space');
+      expect(getScreen()).toMatchInlineSnapshot(`
+        "? Select a number
+        >◉ 1
+         ◯ 2
+         ◯ 3
+         ◯ 4
+         ◯ 5
+         ◯ 6
+         ◯ 7"
+      `);
+      events.keypress('enter');
+      await answer;
+    });
+  });
+
   describe('theme: style.renderSelectedChoices', () => {
     it('renderSelectedChoices', async () => {
       const { answer, events, getScreen } = await render(checkbox, {

packages/core/src/lib/make-theme.mts

@@ -1,10 +1,40 @@
 import type { Prettify, PartialDeep } from '@inquirer/type';
 import { defaultTheme, type Theme } from './theme.mjs';
 
+function isPlainObject(value: unknown): value is object {
+  if (typeof value !== 'object' || value === null) return false;
+
+  let proto = value;
+  while (Object.getPrototypeOf(proto) !== null) {
+    proto = Object.getPrototypeOf(proto);
+  }
+
+  return Object.getPrototypeOf(value) === proto;
+}
+
+function deepMerge<T extends object>(...objects: Partial<T>[]): T {
+  const output: { [key: string]: unknown } = {};
+
+  for (const obj of objects) {
+    for (const [key, value] of Object.entries(obj)) {
+      const prevValue = output[key];
+
+      output[key] =
+        isPlainObject(prevValue) && isPlainObject(value)
+          ? deepMerge(prevValue, value)
+          : value;
+    }
+  }
+
+  return output as T;
+}
+
 export function makeTheme<SpecificTheme extends object>(
   ...themes: ReadonlyArray<undefined | PartialDeep<Theme<SpecificTheme>>>
 ): Prettify<Theme<SpecificTheme>> {
-  return Object.assign({}, defaultTheme, ...themes, {
-    style: Object.assign({}, defaultTheme.style, ...themes.map((theme) => theme?.style)),
-  });
+  const themesToMerge = [
+    defaultTheme,
+    ...themes.filter((theme) => theme != null),
+  ] as Theme<SpecificTheme>[];
+  return deepMerge(...themesToMerge);
 }