yet-another-react-lightbox 3.5.3 → 3.6.0

package/dist/styles.css

@@ -1,281 +1 @@
-.yarl__fullsize {
-  width: 100%;
-  height: 100%;
-}
-.yarl__relative {
-  position: relative;
-}
-.yarl__portal {
-  position: fixed;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  opacity: 0;
-  overflow: hidden;
-  z-index: var(--yarl__portal_zindex, 9999);
-  transition: opacity var(--yarl__fade_animation_duration, 250ms) var(--yarl__fade_animation_timing_function, ease);
-}
-.yarl__portal_open {
-  opacity: 1;
-}
-.yarl__container {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  overflow: hidden;
-  background-color: var(--yarl__container_background_color, var(--yarl__color_backdrop, #000));
-  outline: 0;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-          user-select: none;
-  touch-action: var(--yarl__controller_touch_action, none);
-  overscroll-behavior: var(--yarl__controller_overscroll-behavior, contain);
-}
-.yarl__carousel {
-  display: flex;
-  flex: 0 0 auto;
-  height: 100%;
-  align-content: center;
-  justify-content: center;
-  align-items: stretch;
-  width: calc(100% + (var(--yarl__carousel_slides_count) - 1) * (100% + var(--yarl__carousel_spacing_px, 0) * 1px + var(--yarl__carousel_spacing_percent, 0) * 1%));
-  -webkit-transform: translateX(var(--yarl__swipe_offset, 0px));
-          transform: translateX(var(--yarl__swipe_offset, 0px));
-}
-.yarl__carousel_with_slides {
-  -webkit-column-gap: calc(var(--yarl__carousel_spacing_px, 0) * 1px + 100 / (100 * var(--yarl__carousel_slides_count) + (var(--yarl__carousel_slides_count) - 1) * var(--yarl__carousel_spacing_percent, 0)) * var(--yarl__carousel_spacing_percent, 0) * 1%);
-     -moz-column-gap: calc(var(--yarl__carousel_spacing_px, 0) * 1px + 100 / (100 * var(--yarl__carousel_slides_count) + (var(--yarl__carousel_slides_count) - 1) * var(--yarl__carousel_spacing_percent, 0)) * var(--yarl__carousel_spacing_percent, 0) * 1%);
-          column-gap: calc(var(--yarl__carousel_spacing_px, 0) * 1px + 100 / (100 * var(--yarl__carousel_slides_count) + (var(--yarl__carousel_slides_count) - 1) * var(--yarl__carousel_spacing_percent, 0)) * var(--yarl__carousel_spacing_percent, 0) * 1%);
-}
-.yarl__flex_center {
-  display: flex;
-  justify-content: center;
-  align-content: center;
-  align-items: center;
-}
-.yarl__slide {
-  flex: 1;
-  position: relative;
-  overflow: hidden;
-  padding: calc(var(--yarl__carousel_padding_px, 0) * 1px + 100 / (100 * var(--yarl__carousel_slides_count) + (var(--yarl__carousel_slides_count) - 1) * var(--yarl__carousel_spacing_percent, 0)) * var(--yarl__carousel_padding_percent, 0) * 1%);
-}
-[dir=rtl] .yarl__slide {
-  --yarl__direction: -1;
-}
-.yarl__slide_image {
-  max-width: 100%;
-  max-height: 100%;
-  -o-object-fit: contain;
-     object-fit: contain;
-  touch-action: var(--yarl__controller_touch_action, none);
-  -moz-user-select: none;
-       user-select: none;
-  -webkit-user-select: none;
-  -webkit-touch-callout: none;
-}
-@media screen and (min-width: 800px) {
-  .yarl__slide_image {
-    -webkit-transform: translateZ(0);
-    -webkit-backface-visibility: hidden;
-    -webkit-transform-style: preserve-3d;
-  }
-}
-.yarl__slide_image_cover {
-  width: 100%;
-  height: 100%;
-  -o-object-fit: cover;
-     object-fit: cover;
-}
-.yarl__slide_image_loading {
-  opacity: 0;
-}
-.yarl__slide_placeholder {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  -webkit-transform: translateX(-50%) translateY(-50%);
-          transform: translateX(-50%) translateY(-50%);
-  line-height: 0;
-}
-.yarl__slide_loading {
-  color: var(--yarl__slide_icon_loading_color, var(--yarl__color_button, rgba(255, 255, 255, 0.8)));
-  -webkit-animation: yarl__delayed_fadein 1s linear;
-          animation: yarl__delayed_fadein 1s linear;
-}
-.yarl__slide_loading line {
-  -webkit-animation: yarl__stroke_opacity 1s linear infinite;
-          animation: yarl__stroke_opacity 1s linear infinite;
-}
-.yarl__slide_loading line:nth-of-type(1) {
-  -webkit-animation-delay: -1.875s;
-          animation-delay: -1.875s;
-}
-.yarl__slide_loading line:nth-of-type(2) {
-  -webkit-animation-delay: -1.75s;
-          animation-delay: -1.75s;
-}
-.yarl__slide_loading line:nth-of-type(3) {
-  -webkit-animation-delay: -1.625s;
-          animation-delay: -1.625s;
-}
-.yarl__slide_loading line:nth-of-type(4) {
-  -webkit-animation-delay: -1.5s;
-          animation-delay: -1.5s;
-}
-.yarl__slide_loading line:nth-of-type(5) {
-  -webkit-animation-delay: -1.375s;
-          animation-delay: -1.375s;
-}
-.yarl__slide_loading line:nth-of-type(6) {
-  -webkit-animation-delay: -1.25s;
-          animation-delay: -1.25s;
-}
-.yarl__slide_loading line:nth-of-type(7) {
-  -webkit-animation-delay: -1.125s;
-          animation-delay: -1.125s;
-}
-.yarl__slide_loading line:nth-of-type(8) {
-  -webkit-animation-delay: -1s;
-          animation-delay: -1s;
-}
-.yarl__slide_error {
-  width: var(--yarl__slide_icon_error_size, 48px);
-  height: var(--yarl__slide_icon_error_size, 48px);
-  color: var(--yarl__slide_icon_error_color, red);
-}
-@media (prefers-reduced-motion) {
-  .yarl__portal, .yarl__slide {
-    transition: unset;
-  }
-  .yarl__slide_loading, .yarl__slide_loading line {
-    -webkit-animation: unset;
-            animation: unset;
-  }
-}
-.yarl__toolbar {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: auto;
-  left: auto;
-  display: flex;
-  justify-content: flex-end;
-  padding: var(--yarl__toolbar_padding, 8px);
-}
-[dir=rtl] .yarl__toolbar {
-  top: 0;
-  right: auto;
-  bottom: auto;
-  left: 0;
-}
-.yarl__icon {
-  width: var(--yarl__icon_size, 32px);
-  height: var(--yarl__icon_size, 32px);
-}
-.yarl__button {
-  cursor: pointer;
-  -webkit-appearance: none;
-     -moz-appearance: none;
-          appearance: none;
-  background-color: var(--yarl__button_background_color, transparent);
-  border: var(--yarl__button_border, 0);
-  margin: var(--yarl__button_margin, 0);
-  outline: none;
-  line-height: 0;
-  padding: var(--yarl__button_padding, 8px);
-  color: var(--yarl__color_button, rgba(255, 255, 255, 0.8));
-  -webkit-filter: var(--yarl__button_filter, drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.8)));
-          filter: var(--yarl__button_filter, drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.8)));
-  -webkit-tap-highlight-color: transparent;
-}
-.yarl__button:focus {
-  color: var(--yarl__color_button_active, #fff);
-}
-.yarl__button:focus:not(:focus-visible) {
-  color: var(--yarl__color_button, rgba(255, 255, 255, 0.8));
-}
-.yarl__button:focus-visible {
-  color: var(--yarl__color_button_active, #fff);
-}
-@media (hover: hover) {
-  .yarl__button:hover, .yarl__button:focus:hover, .yarl__button:focus-visible:hover {
-    color: var(--yarl__color_button_active, #fff);
-  }
-}
-.yarl__button:disabled {
-  color: var(--yarl__color_button_disabled, rgba(255, 255, 255, 0.4));
-  cursor: default;
-}
-.yarl__navigation_prev, .yarl__navigation_next {
-  position: absolute;
-  top: 50%;
-  -webkit-transform: translateY(-50%);
-          transform: translateY(-50%);
-  padding: var(--yarl__navigation_button_padding, 24px 16px);
-}
-.yarl__navigation_prev {
-  left: 0;
-}
-[dir=rtl] .yarl__navigation_prev {
-  left: unset;
-  right: 0;
-  -webkit-transform: translateY(-50%) rotate(180deg);
-          transform: translateY(-50%) rotate(180deg);
-}
-.yarl__navigation_next {
-  right: 0;
-}
-[dir=rtl] .yarl__navigation_next {
-  left: 0;
-  right: unset;
-  -webkit-transform: translateY(-50%) rotate(180deg);
-          transform: translateY(-50%) rotate(180deg);
-}
-.yarl__no_scroll {
-  height: 100%;
-  overflow: hidden;
-  overscroll-behavior: none;
-}
-
-@-webkit-keyframes yarl__delayed_fadein {
-  0% {
-    opacity: 0;
-  }
-  80% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-
-@keyframes yarl__delayed_fadein {
-  0% {
-    opacity: 0;
-  }
-  80% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-@-webkit-keyframes yarl__stroke_opacity {
-  from {
-    stroke-opacity: 1;
-  }
-  to {
-    stroke-opacity: 0.125;
-  }
-}
-@keyframes yarl__stroke_opacity {
-  from {
-    stroke-opacity: 1;
-  }
-  to {
-    stroke-opacity: 0.125;
-  }
-}
+.yarl__fullsize{height:100%;width:100%}.yarl__relative{position:relative}.yarl__portal{bottom:0;left:0;opacity:0;overflow:hidden;position:fixed;right:0;top:0;transition:opacity var(--yarl__fade_animation_duration,.25s) var(--yarl__fade_animation_timing_function,ease);z-index:var(--yarl__portal_zindex,9999)}.yarl__portal_open{opacity:1}.yarl__container{background-color:var(--yarl__container_background_color,var(--yarl__color_backdrop,#000));bottom:0;left:0;outline:0;overflow:hidden;overscroll-behavior:var(--yarl__controller_overscroll-behavior,contain);position:absolute;right:0;top:0;touch-action:var(--yarl__controller_touch_action,none);-webkit-user-select:none;-moz-user-select:none;user-select:none}.yarl__carousel{align-content:center;align-items:stretch;display:flex;flex:0 0 auto;height:100%;justify-content:center;-webkit-transform:translateX(var(--yarl__swipe_offset,0));transform:translateX(var(--yarl__swipe_offset,0));width:calc(100% + (var(--yarl__carousel_slides_count) - 1)*(100% + var(--yarl__carousel_spacing_px, 0)*1px + var(--yarl__carousel_spacing_percent, 0)*1%))}.yarl__carousel_with_slides{-webkit-column-gap:calc(var(--yarl__carousel_spacing_px, 0)*1px + 100/(var(--yarl__carousel_slides_count)*100 + (var(--yarl__carousel_slides_count) - 1)*var(--yarl__carousel_spacing_percent, 0))*var(--yarl__carousel_spacing_percent, 0)*1%);-moz-column-gap:calc(var(--yarl__carousel_spacing_px, 0)*1px + 100/(var(--yarl__carousel_slides_count)*100 + (var(--yarl__carousel_slides_count) - 1)*var(--yarl__carousel_spacing_percent, 0))*var(--yarl__carousel_spacing_percent, 0)*1%);column-gap:calc(var(--yarl__carousel_spacing_px, 0)*1px + 100/(var(--yarl__carousel_slides_count)*100 + (var(--yarl__carousel_slides_count) - 1)*var(--yarl__carousel_spacing_percent, 0))*var(--yarl__carousel_spacing_percent, 0)*1%)}.yarl__flex_center{align-content:center;align-items:center;display:flex;justify-content:center}.yarl__slide{flex:1;overflow:hidden;padding:calc(var(--yarl__carousel_padding_px, 0)*1px + 100/(var(--yarl__carousel_slides_count)*100 + (var(--yarl__carousel_slides_count) - 1)*var(--yarl__carousel_spacing_percent, 0))*var(--yarl__carousel_padding_percent, 0)*1%);position:relative}[dir=rtl] .yarl__slide{--yarl__direction:-1}.yarl__slide_image{-webkit-touch-callout:none;max-height:100%;max-width:100%;-o-object-fit:contain;object-fit:contain;touch-action:var(--yarl__controller_touch_action,none);-moz-user-select:none;user-select:none;-webkit-user-select:none}@media screen and (min-width:800px){.yarl__slide_image{-webkit-backface-visibility:hidden;-webkit-transform:translateZ(0);-webkit-transform-style:preserve-3d}}.yarl__slide_image_cover{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.yarl__slide_image_loading{opacity:0}.yarl__slide_placeholder{left:50%;line-height:0;position:absolute;top:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.yarl__slide_loading{-webkit-animation:yarl__delayed_fadein 1s linear;animation:yarl__delayed_fadein 1s linear;color:var(--yarl__slide_icon_loading_color,var(--yarl__color_button,hsla(0,0%,100%,.8)))}.yarl__slide_loading line{-webkit-animation:yarl__stroke_opacity 1s linear infinite;animation:yarl__stroke_opacity 1s linear infinite}.yarl__slide_loading line:first-of-type{-webkit-animation-delay:-1.875s;animation-delay:-1.875s}.yarl__slide_loading line:nth-of-type(2){-webkit-animation-delay:-1.75s;animation-delay:-1.75s}.yarl__slide_loading line:nth-of-type(3){-webkit-animation-delay:-1.625s;animation-delay:-1.625s}.yarl__slide_loading line:nth-of-type(4){-webkit-animation-delay:-1.5s;animation-delay:-1.5s}.yarl__slide_loading line:nth-of-type(5){-webkit-animation-delay:-1.375s;animation-delay:-1.375s}.yarl__slide_loading line:nth-of-type(6){-webkit-animation-delay:-1.25s;animation-delay:-1.25s}.yarl__slide_loading line:nth-of-type(7){-webkit-animation-delay:-1.125s;animation-delay:-1.125s}.yarl__slide_loading line:nth-of-type(8){-webkit-animation-delay:-1s;animation-delay:-1s}.yarl__slide_error{color:var(--yarl__slide_icon_error_color,red);height:var(--yarl__slide_icon_error_size,48px);width:var(--yarl__slide_icon_error_size,48px)}@media (prefers-reduced-motion){.yarl__portal,.yarl__slide{transition:unset}.yarl__slide_loading,.yarl__slide_loading line{-webkit-animation:unset;animation:unset}}.yarl__toolbar{bottom:auto;display:flex;justify-content:flex-end;left:auto;padding:var(--yarl__toolbar_padding,8px);position:absolute;right:0;top:0}[dir=rtl] .yarl__toolbar{bottom:auto;left:0;right:auto;top:0}.yarl__icon{height:var(--yarl__icon_size,32px);width:var(--yarl__icon_size,32px)}.yarl__button{-webkit-tap-highlight-color:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--yarl__button_background_color,transparent);border:var(--yarl__button_border,0);color:var(--yarl__color_button,hsla(0,0%,100%,.8));cursor:pointer;-webkit-filter:var(--yarl__button_filter,drop-shadow(2px 2px 2px rgba(0,0,0,.8)));filter:var(--yarl__button_filter,drop-shadow(2px 2px 2px rgba(0,0,0,.8)));line-height:0;margin:var(--yarl__button_margin,0);outline:none;padding:var(--yarl__button_padding,8px)}.yarl__button:focus{color:var(--yarl__color_button_active,#fff)}.yarl__button:focus:not(:focus-visible){color:var(--yarl__color_button,hsla(0,0%,100%,.8))}.yarl__button:focus-visible{color:var(--yarl__color_button_active,#fff)}@media (hover:hover){.yarl__button:focus-visible:hover,.yarl__button:focus:hover,.yarl__button:hover{color:var(--yarl__color_button_active,#fff)}}.yarl__button:disabled{color:var(--yarl__color_button_disabled,hsla(0,0%,100%,.4));cursor:default}.yarl__navigation_next,.yarl__navigation_prev{padding:var(--yarl__navigation_button_padding,24px 16px);position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.yarl__navigation_prev{left:0}[dir=rtl] .yarl__navigation_prev{left:unset;right:0;-webkit-transform:translateY(-50%) rotate(180deg);transform:translateY(-50%) rotate(180deg)}.yarl__navigation_next{right:0}[dir=rtl] .yarl__navigation_next{left:0;right:unset;-webkit-transform:translateY(-50%) rotate(180deg);transform:translateY(-50%) rotate(180deg)}.yarl__no_scroll{height:100%;overflow:hidden;overscroll-behavior:none}@-webkit-keyframes yarl__delayed_fadein{0%{opacity:0}80%{opacity:0}to{opacity:1}}@keyframes yarl__delayed_fadein{0%{opacity:0}80%{opacity:0}to{opacity:1}}@-webkit-keyframes yarl__stroke_opacity{0%{stroke-opacity:1}to{stroke-opacity:.125}}@keyframes yarl__stroke_opacity{0%{stroke-opacity:1}to{stroke-opacity:.125}}

package/dist/styles.css.d.ts

@@ -0,0 +1,2 @@
+declare const styles: unknown;
+export default styles;

package/dist/types.d.ts

@@ -1,8 +1,60 @@
-import * as React from "react";
+import * as React from 'react';
+
+declare const MODULE_CAROUSEL = "carousel";
+declare const MODULE_CONTROLLER = "controller";
+declare const MODULE_NAVIGATION = "navigation";
+declare const MODULE_NO_SCROLL = "no-scroll";
+declare const MODULE_PORTAL = "portal";
+declare const MODULE_ROOT = "root";
+declare const MODULE_TOOLBAR = "toolbar";
+declare const PLUGIN_CAPTIONS = "captions";
+declare const PLUGIN_COUNTER = "counter";
+declare const PLUGIN_DOWNLOAD = "download";
+declare const PLUGIN_FULLSCREEN = "fullscreen";
+declare const PLUGIN_INLINE = "inline";
+declare const PLUGIN_SLIDESHOW = "slideshow";
+declare const PLUGIN_THUMBNAILS = "thumbnails";
+declare const PLUGIN_ZOOM = "zoom";
+declare const SLIDE_STATUS_LOADING = "loading";
+declare const SLIDE_STATUS_PLAYING = "playing";
+declare const SLIDE_STATUS_ERROR = "error";
+declare const SLIDE_STATUS_COMPLETE = "complete";
+declare const SLIDE_STATUS_PLACEHOLDER = "placeholder";
+type SlideStatus = typeof SLIDE_STATUS_LOADING | typeof SLIDE_STATUS_PLAYING | typeof SLIDE_STATUS_ERROR | typeof SLIDE_STATUS_COMPLETE;
+declare const activeSlideStatus: (status: SlideStatus) => `active-slide-${SlideStatus}`;
+declare const ACTIVE_SLIDE_LOADING: "active-slide-loading";
+declare const ACTIVE_SLIDE_PLAYING: "active-slide-playing";
+declare const ACTIVE_SLIDE_ERROR: "active-slide-error";
+declare const ACTIVE_SLIDE_COMPLETE: "active-slide-complete";
+declare const CLASS_FULLSIZE = "fullsize";
+declare const CLASS_FLEX_CENTER = "flex_center";
+declare const CLASS_NO_SCROLL = "no_scroll";
+declare const CLASS_NO_SCROLL_PADDING = "no_scroll_padding";
+declare const ACTION_PREV = "prev";
+declare const ACTION_NEXT = "next";
+declare const ACTION_SWIPE = "swipe";
+declare const ACTION_CLOSE = "close";
+declare const EVENT_ON_POINTER_DOWN = "onPointerDown";
+declare const EVENT_ON_POINTER_MOVE = "onPointerMove";
+declare const EVENT_ON_POINTER_UP = "onPointerUp";
+declare const EVENT_ON_POINTER_LEAVE = "onPointerLeave";
+declare const EVENT_ON_POINTER_CANCEL = "onPointerCancel";
+declare const EVENT_ON_KEY_DOWN = "onKeyDown";
+declare const EVENT_ON_KEY_UP = "onKeyUp";
+declare const EVENT_ON_WHEEL = "onWheel";
+declare const VK_ESCAPE = "Escape";
+declare const VK_ARROW_LEFT = "ArrowLeft";
+declare const VK_ARROW_RIGHT = "ArrowRight";
+declare const ELEMENT_BUTTON = "button";
+declare const ELEMENT_ICON = "icon";
+declare const IMAGE_FIT_CONTAIN = "contain";
+declare const IMAGE_FIT_COVER = "cover";
+declare const UNKNOWN_ACTION_TYPE = "Unknown action type";
+
 /** Lightbox external props */
-export type LightboxExternalProps = DeepPartial<LightboxProps, "carousel" | "animation" | "controller" | "toolbar">;
+type LightboxExternalProps = DeepPartial<LightboxProps, "carousel" | "animation" | "controller" | "toolbar">;
 /** Lightbox properties */
-export interface LightboxProps {
+interface LightboxProps {
     /** if `true`, the lightbox is open */
     open: boolean;
     /** a callback to close the lightbox */
@@ -35,20 +87,20 @@ export interface LightboxProps {
     className: string;
 }
 /** Slide */
-export type Slide = SlideTypes[SlideTypeKey];
+type Slide = SlideTypes[SlideTypeKey];
 /** Supported slide types */
-export interface SlideTypes {
+interface SlideTypes {
     /** image slide type */
     image: SlideImage;
 }
 /** Slide type key */
-export type SlideTypeKey = keyof SlideTypes;
+type SlideTypeKey = keyof SlideTypes;
 /** Generic slide */
-export interface GenericSlide {
+interface GenericSlide {
     type?: SlideTypeKey;
 }
 /** Image slide properties */
-export interface SlideImage extends GenericSlide {
+interface SlideImage extends GenericSlide {
     /** image URL */
     src: string;
     /** image 'alt' attribute */
@@ -63,7 +115,7 @@ export interface SlideImage extends GenericSlide {
     srcSet?: ImageSource[];
 }
 /** Image source */
-export interface ImageSource {
+interface ImageSource {
     /** image URL */
     src: string;
     /** image width in pixels */
@@ -72,36 +124,36 @@ export interface ImageSource {
     height: number;
 }
 /** Image fit setting */
-export type ImageFit = "contain" | "cover";
+type ImageFit = "contain" | "cover";
 /** Lightbox component */
-export type Component = React.ComponentType<ComponentProps>;
+type Component = React.ComponentType<ComponentProps>;
 /** Lightbox component properties */
-export type ComponentProps = React.PropsWithChildren<Omit<LightboxProps, "slides" | "index" | "plugins">>;
+type ComponentProps = React.PropsWithChildren<Omit<LightboxProps, "slides" | "index" | "plugins">>;
 /** Lightbox component tree node */
-export type Node = {
+type Node = {
     /** module */
     module: Module;
     /** module child nodes */
     children?: Node[];
 };
 /** Lightbox module */
-export type Module = {
+type Module = {
     /** module name */
     name: string;
     /** module component */
     component: Component;
 };
 /** Lightbox props augmentation */
-export type Augmentation = (props: ComponentProps) => ComponentProps;
+type Augmentation = (props: ComponentProps) => ComponentProps;
 /** Container rect */
-export type ContainerRect = {
+type ContainerRect = {
     width: number;
     height: number;
 };
 /** Customization slots */
-export type Slot = SlotType[keyof SlotType];
+type Slot = SlotType[keyof SlotType];
 /** Supported customization slots */
-export interface SlotType {
+interface SlotType {
     /** lightbox root customization slot */
     root: "root";
     /** lightbox container customization slot */
@@ -116,11 +168,11 @@ interface SlotCSSProperties extends React.CSSProperties {
     [key: `--yarl__${string}`]: string | number;
 }
 /** Customization slots styles */
-export type SlotStyles = {
+type SlotStyles = {
     [key in Slot]?: SlotCSSProperties;
 };
 /** Carousel settings */
-export interface CarouselSettings {
+interface CarouselSettings {
     /** if `true`, the lightbox carousel doesn't wrap around */
     finite: boolean;
     /** the lightbox preloads (2 * preload + 1) slides */
@@ -132,9 +184,9 @@ export interface CarouselSettings {
     /** `object-fit` setting for image slides */
     imageFit: ImageFit;
 }
-export type LengthOrPercentage = `${number}px` | `${number}%` | number;
+type LengthOrPercentage = `${number}px` | `${number}%` | number;
 /** Animation settings */
-export interface AnimationSettings {
+interface AnimationSettings {
     /** fade-in / fade-out animation settings */
     fade: number;
     /** swipe animation settings */
@@ -152,7 +204,7 @@ export interface AnimationSettings {
     };
 }
 /** Controller settings */
-export interface ControllerSettings {
+interface ControllerSettings {
     /** controller ref */
     ref: React.ForwardedRef<ControllerRef>;
     /** if true, the lightbox captures focus when it opens */
@@ -165,7 +217,7 @@ export interface ControllerSettings {
     closeOnBackdropClick: boolean;
 }
 /** Lightbox controller ref */
-export interface ControllerRef {
+interface ControllerRef {
     /** navigate to the previous slide */
     prev: Callback<NavigationAction | void>;
     /** navigate to the next slide */
@@ -180,17 +232,30 @@ export interface ControllerRef {
     getLightboxState: () => LightboxState;
 }
 /** Portal settings */
-export interface PortalSettings {
+interface PortalSettings {
     /** portal mount point */
     root?: DocumentFragment | Element | null;
 }
 /** Lightbox navigation action */
-export interface NavigationAction {
+interface NavigationAction {
     /** navigate through the specified number of slides */
     count?: number;
 }
+/** Lightbox state swipe action */
+type LightboxStateSwipeAction = {
+    type: "swipe";
+    increment: number;
+    duration?: number;
+    easing?: string;
+};
+/** Lightbox state update action */
+type LightboxStateUpdateAction = {
+    type: "update";
+    slides: Slide[];
+    index: number;
+};
 /** Lightbox state */
-export interface LightboxState {
+interface LightboxState {
     /** lightbox slides */
     slides: Slide[];
     /** current slide index */
@@ -207,9 +272,9 @@ export interface LightboxState {
     };
 }
 /** Render function */
-export type RenderFunction<T = void> = [T] extends [void] ? () => React.ReactNode : (props: T) => React.ReactNode;
+type RenderFunction<T = void> = [T] extends [void] ? () => React.ReactNode : (props: T) => React.ReactNode;
 /** `render.slide` render function props */
-export interface RenderSlideProps {
+interface RenderSlideProps {
     /** slide */
     slide: Slide;
     /** slide offset (`0` - current slide, `1` - next slide, `-1` - previous slide, etc.) */
@@ -218,19 +283,19 @@ export interface RenderSlideProps {
     rect: ContainerRect;
 }
 /** `render.slideHeader` render function props */
-export interface RenderSlideHeaderProps {
+interface RenderSlideHeaderProps {
     slide: Slide;
 }
 /** `render.slideFooter` render function props */
-export interface RenderSlideFooterProps {
+interface RenderSlideFooterProps {
     slide: Slide;
 }
 /** `render.slideContainer` render function props */
-export interface RenderSlideContainerProps extends React.PropsWithChildren {
+interface RenderSlideContainerProps extends React.PropsWithChildren {
     slide: Slide;
 }
 /** Custom render functions. */
-export interface Render {
+interface Render {
     /** render custom slide type, or override the default image slide */
     slide?: RenderFunction<RenderSlideProps>;
     /** render custom slide header (use absolute positioning) */
@@ -258,15 +323,15 @@ export interface Render {
     /** render custom Close button */
     buttonClose?: RenderFunction;
 }
-export type Callback<T = void> = [T] extends [void] ? () => void : (props: T) => void;
-export interface ViewCallbackProps {
+type Callback<T = void> = [T] extends [void] ? () => void : (props: T) => void;
+interface ViewCallbackProps {
     index: number;
 }
-export interface ClickCallbackProps {
+interface ClickCallbackProps {
     index: number;
 }
 /** Lifecycle callbacks */
-export interface Callbacks {
+interface Callbacks {
     /** a callback called when a slide becomes active */
     view?: Callback<ViewCallbackProps>;
     /** a callback called when a slide is clicked */
@@ -281,20 +346,30 @@ export interface Callbacks {
     exited?: Callback;
 }
 /** Custom UI labels */
-export type Labels = {
+type Labels = {
     [key: string]: string;
 };
 /** Toolbar settings */
-export interface ToolbarSettings {
+interface ToolbarSettings {
     /** buttons to render in the toolbar */
     buttons: (ToolbarButtonKey | React.ReactNode)[];
 }
-export type ToolbarButtonKey = keyof ToolbarButtonKeys;
-export interface ToolbarButtonKeys {
+type ToolbarButtonKey = keyof ToolbarButtonKeys;
+interface ToolbarButtonKeys {
     close: null;
 }
+interface EventTypes {
+    [ACTION_PREV]: NavigationAction | void;
+    [ACTION_NEXT]: NavigationAction | void;
+    [ACTION_SWIPE]: LightboxStateSwipeAction;
+    [ACTION_CLOSE]: void;
+    [ACTIVE_SLIDE_LOADING]: void;
+    [ACTIVE_SLIDE_PLAYING]: void;
+    [ACTIVE_SLIDE_COMPLETE]: void;
+    [ACTIVE_SLIDE_ERROR]: void;
+}
 /** Plugin methods */
-export interface PluginProps {
+interface PluginProps {
     /** test if a target module is present */
     contains: (target: string) => boolean;
     /** add module as a parent */
@@ -315,16 +390,17 @@ export interface PluginProps {
     augment: (augmentation: Augmentation) => void;
 }
 /** Lightbox plugin */
-export type Plugin = (props: PluginProps) => void;
+type Plugin = (props: PluginProps) => void;
 /** Deep partial utility type */
-export type DeepPartial<T extends {}, K extends keyof T> = Omit<Partial<T>, K> & {
+type DeepPartial<T extends {}, K extends keyof T> = Omit<Partial<T>, K> & {
     [P in K]?: DeepPartialValue<T[P]>;
 };
-export type DeepPartialValue<T> = T extends any[] ? T : T extends (...props: any[]) => any ? T : T extends {} ? {
+type DeepPartialValue<T> = T extends any[] ? T : T extends (...props: any[]) => any ? T : T extends {} ? {
     [P in keyof T]?: P extends "ref" ? T[P] : DeepPartialValue<T[P]>;
 } : T;
 /** Deep non-nullable utility type */
-export type DeepNonNullable<T> = T extends {} ? {
+type DeepNonNullable<T> = T extends {} ? {
     [K in keyof T]-?: NonNullable<T[K]>;
 } : never;
-export {};
+
+export { ACTION_CLOSE, ACTION_NEXT, ACTION_PREV, ACTION_SWIPE, ACTIVE_SLIDE_COMPLETE, ACTIVE_SLIDE_ERROR, ACTIVE_SLIDE_LOADING, ACTIVE_SLIDE_PLAYING, AnimationSettings, Augmentation, CLASS_FLEX_CENTER, CLASS_FULLSIZE, CLASS_NO_SCROLL, CLASS_NO_SCROLL_PADDING, Callback, Callbacks, CarouselSettings, ClickCallbackProps, Component, ComponentProps, ContainerRect, ControllerRef, ControllerSettings, DeepNonNullable, DeepPartial, DeepPartialValue, ELEMENT_BUTTON, ELEMENT_ICON, EVENT_ON_KEY_DOWN, EVENT_ON_KEY_UP, EVENT_ON_POINTER_CANCEL, EVENT_ON_POINTER_DOWN, EVENT_ON_POINTER_LEAVE, EVENT_ON_POINTER_MOVE, EVENT_ON_POINTER_UP, EVENT_ON_WHEEL, EventTypes, GenericSlide, IMAGE_FIT_CONTAIN, IMAGE_FIT_COVER, ImageFit, ImageSource, Labels, LengthOrPercentage, LightboxExternalProps, LightboxProps, LightboxState, LightboxStateSwipeAction, LightboxStateUpdateAction, MODULE_CAROUSEL, MODULE_CONTROLLER, MODULE_NAVIGATION, MODULE_NO_SCROLL, MODULE_PORTAL, MODULE_ROOT, MODULE_TOOLBAR, Module, NavigationAction, Node, PLUGIN_CAPTIONS, PLUGIN_COUNTER, PLUGIN_DOWNLOAD, PLUGIN_FULLSCREEN, PLUGIN_INLINE, PLUGIN_SLIDESHOW, PLUGIN_THUMBNAILS, PLUGIN_ZOOM, Plugin, PluginProps, PortalSettings, Render, RenderFunction, RenderSlideContainerProps, RenderSlideFooterProps, RenderSlideHeaderProps, RenderSlideProps, SLIDE_STATUS_COMPLETE, SLIDE_STATUS_ERROR, SLIDE_STATUS_LOADING, SLIDE_STATUS_PLACEHOLDER, SLIDE_STATUS_PLAYING, Slide, SlideImage, SlideStatus, SlideTypeKey, SlideTypes, Slot, SlotStyles, SlotType, ToolbarButtonKey, ToolbarButtonKeys, ToolbarSettings, UNKNOWN_ACTION_TYPE, VK_ARROW_LEFT, VK_ARROW_RIGHT, VK_ESCAPE, ViewCallbackProps, activeSlideStatus };

package/dist/types.js

@@ -1 +1,51 @@
-export {};
+const MODULE_CAROUSEL = "carousel";
+const MODULE_CONTROLLER = "controller";
+const MODULE_NAVIGATION = "navigation";
+const MODULE_NO_SCROLL = "no-scroll";
+const MODULE_PORTAL = "portal";
+const MODULE_ROOT = "root";
+const MODULE_TOOLBAR = "toolbar";
+const PLUGIN_CAPTIONS = "captions";
+const PLUGIN_COUNTER = "counter";
+const PLUGIN_DOWNLOAD = "download";
+const PLUGIN_FULLSCREEN = "fullscreen";
+const PLUGIN_INLINE = "inline";
+const PLUGIN_SLIDESHOW = "slideshow";
+const PLUGIN_THUMBNAILS = "thumbnails";
+const PLUGIN_ZOOM = "zoom";
+const SLIDE_STATUS_LOADING = "loading";
+const SLIDE_STATUS_PLAYING = "playing";
+const SLIDE_STATUS_ERROR = "error";
+const SLIDE_STATUS_COMPLETE = "complete";
+const SLIDE_STATUS_PLACEHOLDER = "placeholder";
+const activeSlideStatus = (status) => `active-slide-${status}`;
+const ACTIVE_SLIDE_LOADING = activeSlideStatus(SLIDE_STATUS_LOADING);
+const ACTIVE_SLIDE_PLAYING = activeSlideStatus(SLIDE_STATUS_PLAYING);
+const ACTIVE_SLIDE_ERROR = activeSlideStatus(SLIDE_STATUS_ERROR);
+const ACTIVE_SLIDE_COMPLETE = activeSlideStatus(SLIDE_STATUS_COMPLETE);
+const CLASS_FULLSIZE = "fullsize";
+const CLASS_FLEX_CENTER = "flex_center";
+const CLASS_NO_SCROLL = "no_scroll";
+const CLASS_NO_SCROLL_PADDING = "no_scroll_padding";
+const ACTION_PREV = "prev";
+const ACTION_NEXT = "next";
+const ACTION_SWIPE = "swipe";
+const ACTION_CLOSE = "close";
+const EVENT_ON_POINTER_DOWN = "onPointerDown";
+const EVENT_ON_POINTER_MOVE = "onPointerMove";
+const EVENT_ON_POINTER_UP = "onPointerUp";
+const EVENT_ON_POINTER_LEAVE = "onPointerLeave";
+const EVENT_ON_POINTER_CANCEL = "onPointerCancel";
+const EVENT_ON_KEY_DOWN = "onKeyDown";
+const EVENT_ON_KEY_UP = "onKeyUp";
+const EVENT_ON_WHEEL = "onWheel";
+const VK_ESCAPE = "Escape";
+const VK_ARROW_LEFT = "ArrowLeft";
+const VK_ARROW_RIGHT = "ArrowRight";
+const ELEMENT_BUTTON = "button";
+const ELEMENT_ICON = "icon";
+const IMAGE_FIT_CONTAIN = "contain";
+const IMAGE_FIT_COVER = "cover";
+const UNKNOWN_ACTION_TYPE = "Unknown action type";
+
+export { ACTION_CLOSE, ACTION_NEXT, ACTION_PREV, ACTION_SWIPE, ACTIVE_SLIDE_COMPLETE, ACTIVE_SLIDE_ERROR, ACTIVE_SLIDE_LOADING, ACTIVE_SLIDE_PLAYING, CLASS_FLEX_CENTER, CLASS_FULLSIZE, CLASS_NO_SCROLL, CLASS_NO_SCROLL_PADDING, ELEMENT_BUTTON, ELEMENT_ICON, EVENT_ON_KEY_DOWN, EVENT_ON_KEY_UP, EVENT_ON_POINTER_CANCEL, EVENT_ON_POINTER_DOWN, EVENT_ON_POINTER_LEAVE, EVENT_ON_POINTER_MOVE, EVENT_ON_POINTER_UP, EVENT_ON_WHEEL, IMAGE_FIT_CONTAIN, IMAGE_FIT_COVER, MODULE_CAROUSEL, MODULE_CONTROLLER, MODULE_NAVIGATION, MODULE_NO_SCROLL, MODULE_PORTAL, MODULE_ROOT, MODULE_TOOLBAR, PLUGIN_CAPTIONS, PLUGIN_COUNTER, PLUGIN_DOWNLOAD, PLUGIN_FULLSCREEN, PLUGIN_INLINE, PLUGIN_SLIDESHOW, PLUGIN_THUMBNAILS, PLUGIN_ZOOM, SLIDE_STATUS_COMPLETE, SLIDE_STATUS_ERROR, SLIDE_STATUS_LOADING, SLIDE_STATUS_PLACEHOLDER, SLIDE_STATUS_PLAYING, UNKNOWN_ACTION_TYPE, VK_ARROW_LEFT, VK_ARROW_RIGHT, VK_ESCAPE, activeSlideStatus };