feat(widgets): add border color option to advanced-options (#2512)

* feat: add border color option for all widgets

* fix: broken lockfile

* fix: typecheck issue

---------

Co-authored-by: Meier Lukas <meierschlumpf@gmail.com>

apps/nextjs/src/components/board/items/actions/create-item.ts

@@ -29,6 +29,7 @@ export const createItemCallback =
       integrationIds: [],
       advancedOptions: {
         customCssClasses: [],
+        borderColor: "",
       },
     } satisfies Modify<
       Item,

apps/nextjs/src/components/board/items/actions/test/duplicate-item.spec.ts

@@ -20,7 +20,7 @@ describe("item actions duplicate-item", () => {
       kind: itemKind,
       integrationIds: ["1"],
       options: { address: "localhost" },
-      advancedOptions: { customCssClasses: ["test"] },
+      advancedOptions: { customCssClasses: ["test"], borderColor: "#ff0000" },
     })
       .addLayout({ layoutId, sectionId: currentSectionId, ...currentItemSize })
       .build();

apps/nextjs/src/components/board/items/actions/test/mocks/item-mock.ts

@@ -14,6 +14,7 @@ export class ItemMockBuilder {
       integrationIds: [],
       advancedOptions: {
         customCssClasses: [],
+        borderColor: "",
       },
       ...item,
     } satisfies Item;

apps/nextjs/src/components/board/items/item-content.tsx

@@ -40,6 +40,7 @@ export const BoardItemContent = ({ item }: BoardItemContentProps) => {
           "--opacity": board.opacity / 100,
           containerType: "size",
           overflow: item.kind === "iframe" ? "hidden" : undefined,
+          "--border-color": item.advancedOptions.borderColor !== "" ? item.advancedOptions.borderColor : undefined,
         },
       }}
       p={0}