Add search spotlight with registration hook (#82)

* wip: add spotlight

* feat: add spotlight with registration hook and group chips

* chore: address pull request feedback

* docs: add documentation for usage of spotlight actions

* fix: deepsource issue JS-0415

* feat: add support for dependencies of spotlight actions

* fix: lockfile broken

* feat: add hover effect for spotlight action

* docs: Add documentation about dependency array

* refactor: remove test spotlight actions, disallow all as group for actions

* fix: type issues

* chore: address pull request feedback

apps/nextjs/src/components/board/sections/content.tsx

@@ -34,26 +34,28 @@ interface Props {
 export const SectionContent = ({ items, refs }: Props) => {
   return (
     <>
-      {items.map((item) => (
-        <div
-          key={item.id}
-          className="grid-stack-item"
-          data-id={item.id}
-          gs-x={item.xOffset}
-          gs-y={item.yOffset}
-          gs-w={item.width}
-          gs-h={item.height}
-          gs-min-w={1}
-          gs-min-h={1}
-          gs-max-w={4}
-          gs-max-h={4}
-          ref={refs.items.current[item.id] as RefObject<HTMLDivElement>}
-        >
-          <Card className="grid-stack-item-content" withBorder>
-            <BoardItem item={item} />
-          </Card>
-        </div>
-      ))}
+      {items.map((item) => {
+        return (
+          <div
+            key={item.id}
+            className="grid-stack-item"
+            data-id={item.id}
+            gs-x={item.xOffset}
+            gs-y={item.yOffset}
+            gs-w={item.width}
+            gs-h={item.height}
+            gs-min-w={1}
+            gs-min-h={1}
+            gs-max-w={4}
+            gs-max-h={4}
+            ref={refs.items.current[item.id] as RefObject<HTMLDivElement>}
+          >
+            <Card className="grid-stack-item-content" withBorder>
+              <BoardItem item={item} />
+            </Card>
+          </div>
+        );
+      })}
     </>
   );
 };