Merged in SW-2064-lightbox-updates (pull request #3347)

feat(SW-2064): Lightbox updates

* chore(SW-2064): add opacity to not selected images

* chore(SW-2064): set main image as the first image in thumbnail

* chore(SW-2064): disable navigation buttons on first and last image

* fix(SW-2064): use cx

* Revert "chore(SW-2064): disable navigation buttons on first and last image"

This reverts commit 9c5acd8a02b83740f35d1cfa88bfba6b006ba947.

* refactor(SW-2064): create ImageCounter component

* refactor(SW-2064)

* chore(SW-2064): add enter keu down on main image


Approved-by: Erik Tiekstra

packages/design-system/lib/components/ImageCounter/ImageCounter.stories.tsx

@@ -0,0 +1,44 @@
+import type { Meta, StoryObj } from "@storybook/nextjs-vite"
+
+import { ImageCounter } from "./index"
+
+const meta: Meta<typeof ImageCounter> = {
+  title: "Core Components/ImageCounter",
+  component: ImageCounter,
+  argTypes: {},
+}
+
+export default meta
+
+type Story = StoryObj<typeof ImageCounter>
+
+export const Large: Story = {
+  args: {
+    size: "Large",
+    leadingIcon: false,
+    number: "12/36",
+  },
+}
+
+export const Small: Story = {
+  args: {
+    size: "Small",
+    leadingIcon: false,
+    number: "12/36",
+  },
+}
+
+export const LargeWithLeadingIcon: Story = {
+  args: {
+    size: "Large",
+    leadingIcon: true,
+    number: "10",
+  },
+}
+export const SmallWithLeadingIcon: Story = {
+  args: {
+    size: "Small",
+    leadingIcon: true,
+    number: 10,
+  },
+}