I’m using lightgallery and the goal is to substitute react-viewer which is not being maintained.
I need to incorporate a functionality where when the user clicks an icon, in my case an image icon the carousel will open with the box model. However, I wasn’t able to find a way to achieve that.
in the following example I’ve added button with a click event but the it will only display the image grid but will not automatically trigger the carousel box model.
in the case of react-viewer there is the prop visible which do exactly that.
saying that, I need help to find the equivalent for lightgallery if there is such a thing.
or just a suggestion for a different library

      <button onClick={handleIconClick}>Show Image Gallery</button>
      <div>
        {isGalleryVisible && (
          <LightGallery plugins={[lgZoom, lgVideo]} mode="lg-fade">
            <a
              data-lg-size="1406-1390"
              className="gallery-item"
              data-src="https://images.unsplash.com/photo-1581894158358-5ecd2c518883?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1406&q=80"
              data-sub-html="<h4>Photo by - <a href='https://unsplash.com/@entrycube' >Diego Guzmán </a></h4> <p> Location - <a href='https://unsplash.com/s/photos/fushimi-inari-taisha-shrine-senbontorii%2C-68%E7%95%AA%E5%9C%B0-fukakusa-yabunouchicho%2C-fushimi-ward%2C-kyoto%2C-japan'>Fushimi Ward, Kyoto, Japan</a></p>"
            >
              <img
                className="img-responsive"
                src="https://images.unsplash.com/photo-1581894158358-5ecd2c518883?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=240&q=80"
              />
            </a>
          </LightGallery>
        )}
      </div>