Items counter position and scrollbar for thumbnails

[iGer98]

Is it possible to move items counter right side over a thumbnail block? I did not found an answer for it and it looks there is no a good solution for it.

--------------------------------------------------------

Can we somehow add ability to scroll thumbnails?

[igordanchenko]

Is it possible to move items counter right side over a thumbnail block? I did not found an answer for it and it looks there is no a good solution for it.

I'm afraid there is no such option in the Counter plugin, but you can easily implement your own plugin for this use case.

// Counter.tsx

import {
  PluginProps,
  PLUGIN_THUMBNAILS,
  createModule,
  ComponentProps,
  useLightboxState,
} from "yet-another-react-lightbox";

function CounterComponent({ children }: ComponentProps) {
  const { slides, currentIndex } = useLightboxState();

  return (
    <>
      {children}

      <div
        style={{
          color: "white",
          position: "absolute",
          right: 16,
          top: 16,
        }}
      >
        {currentIndex + 1} / {slides.length}
      </div>
    </>
  );
}

export default function Counter({ addParent }: PluginProps) {
  addParent(PLUGIN_THUMBNAILS, createModule("counter", CounterComponent));
}

Can we somehow add ability to scroll thumbnails?

No, I'm afraid not.

#193 (comment)

[iGer98]

Thank you so much for a such quick response :)