primereact 9.4.0 → 9.6.0

package/galleria/galleria.esm.js

@@ -1,30 +1,16 @@
 import * as React from 'react';
-import PrimeReact, { localeOption } from 'primereact/api';
+import PrimeReact, { PrimeReactContext, localeOption } from 'primereact/api';
 import { CSSTransition } from 'primereact/csstransition';
 import { useMountEffect, usePrevious, useResizeListener, useUpdateEffect, useInterval, useUnmountEffect } from 'primereact/hooks';
+import { TimesIcon } from 'primereact/icons/times';
 import { Portal } from 'primereact/portal';
 import { Ripple } from 'primereact/ripple';
-import { ObjectUtils, classNames, IconUtils, UniqueComponentId, DomHandler, ZIndexUtils } from 'primereact/utils';
+import { mergeProps, classNames, IconUtils, UniqueComponentId, DomHandler, ObjectUtils, ZIndexUtils } from 'primereact/utils';
+import { ComponentBase } from 'primereact/componentbase';
 import { ChevronLeftIcon } from 'primereact/icons/chevronleft';
 import { ChevronRightIcon } from 'primereact/icons/chevronright';
-import { ChevronUpIcon } from 'primereact/icons/chevronup';
 import { ChevronDownIcon } from 'primereact/icons/chevrondown';
-import { TimesIcon } from 'primereact/icons/times';
-
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
+import { ChevronUpIcon } from 'primereact/icons/chevronup';
 
 function _typeof(obj) {
   "@babel/helpers - typeof";
@@ -122,7 +108,7 @@ function _slicedToArray(arr, i) {
   return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
 
-var GalleriaBase = {
+var GalleriaBase = ComponentBase.extend({
   defaultProps: {
     __TYPE: 'Galleria',
     id: null,
@@ -161,15 +147,11 @@ var GalleriaBase = {
     transitionOptions: null,
     onItemChange: null,
     children: undefined
-  },
-  getProps: function getProps(props) {
-    return ObjectUtils.getMergedProps(props, GalleriaBase.defaultProps);
-  },
-  getOtherProps: function getOtherProps(props) {
-    return ObjectUtils.getDiffProps(props, GalleriaBase.defaultProps);
   }
-};
+});
 
+function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var GalleriaItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {
   var next = function next() {
     var nextItemIndex = props.activeItemIndex + 1;
@@ -236,20 +218,20 @@ var GalleriaItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functi
         'p-disabled': isDisabled
       });
       var iconClassName = 'p-galleria-item-prev-icon';
-      var icon = props.itemPrevIcon || /*#__PURE__*/React.createElement(ChevronLeftIcon, {
+      var previousItemIconProps = mergeProps({
         className: iconClassName
-      });
-      var itemPrevIcon = IconUtils.getJSXIcon(icon, {
-        className: iconClassName
-      }, {
+      }, props.ptm('previousItemIcon'));
+      var icon = props.itemPrevIcon || /*#__PURE__*/React.createElement(ChevronLeftIcon, previousItemIconProps);
+      var itemPrevIcon = IconUtils.getJSXIcon(icon, _objectSpread$2({}, previousItemIconProps), {
         props: props
       });
-      return /*#__PURE__*/React.createElement("button", {
-        type: "button",
+      var previousItemButtonProps = mergeProps({
+        type: 'button',
         className: buttonClassName,
         onClick: navBackward,
         disabled: isDisabled
-      }, itemPrevIcon, /*#__PURE__*/React.createElement(Ripple, null));
+      }, props.ptm('previousItemButton'));
+      return /*#__PURE__*/React.createElement("button", previousItemButtonProps, itemPrevIcon, /*#__PURE__*/React.createElement(Ripple, null));
     }
     return null;
   };
@@ -260,29 +242,30 @@ var GalleriaItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functi
         'p-disabled': isDisabled
       });
       var iconClassName = 'p-galleria-item-next-icon';
-      var icon = props.itemNextIcon || /*#__PURE__*/React.createElement(ChevronRightIcon, {
+      var nextItemIconProps = mergeProps({
         className: iconClassName
-      });
-      var itemNextIcon = IconUtils.getJSXIcon(icon, {
-        className: iconClassName
-      }, {
+      }, props.ptm('nextItemIcon'));
+      var icon = props.itemNextIcon || /*#__PURE__*/React.createElement(ChevronRightIcon, nextItemIconProps);
+      var itemNextIcon = IconUtils.getJSXIcon(icon, _objectSpread$2({}, nextItemIconProps), {
         props: props
       });
-      return /*#__PURE__*/React.createElement("button", {
-        type: "button",
+      var nextItemButtonProps = mergeProps({
+        type: 'button',
         className: buttonClassName,
         onClick: navForward,
         disabled: isDisabled
-      }, itemNextIcon, /*#__PURE__*/React.createElement(Ripple, null));
+      }, props.ptm('nextItemButton'));
+      return /*#__PURE__*/React.createElement("button", nextItemButtonProps, itemNextIcon, /*#__PURE__*/React.createElement(Ripple, null));
     }
     return null;
   };
   var createCaption = function createCaption() {
+    var captionProps = mergeProps({
+      className: 'p-galleria-caption'
+    }, props.ptm('caption'));
     if (props.caption) {
       var _content = props.caption(props.value[props.activeItemIndex]);
-      return /*#__PURE__*/React.createElement("div", {
-        className: "p-galleria-caption"
-      }, _content);
+      return /*#__PURE__*/React.createElement("div", captionProps, _content);
     }
     return null;
   };
@@ -293,14 +276,7 @@ var GalleriaItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functi
       'p-highlight': isActive
     });
     var indicator = props.indicator && props.indicator(index);
-    if (!indicator) {
-      indicator = /*#__PURE__*/React.createElement("button", {
-        type: "button",
-        tabIndex: -1,
-        className: "p-link"
-      }, /*#__PURE__*/React.createElement(Ripple, null));
-    }
-    return /*#__PURE__*/React.createElement("li", {
+    var indicatorProps = mergeProps({
       className: className,
       key: key,
       tabIndex: 0,
@@ -313,18 +289,27 @@ var GalleriaItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functi
       onKeyDown: function onKeyDown(e) {
         return onIndicatorKeyDown(e, index);
       }
-    }, indicator);
+    }, props.ptm('indicator'));
+    if (!indicator) {
+      indicator = /*#__PURE__*/React.createElement("button", {
+        type: "button",
+        tabIndex: -1,
+        className: "p-link"
+      }, /*#__PURE__*/React.createElement(Ripple, null));
+    }
+    return /*#__PURE__*/React.createElement("li", indicatorProps, indicator);
   };
   var createIndicators = function createIndicators() {
     if (props.showIndicators) {
       var className = classNames('p-galleria-indicators p-reset', props.indicatorsContentClassName);
       var _indicators = [];
+      var indicatorsProps = mergeProps({
+        className: className
+      }, props.ptm('indicators'));
       for (var i = 0; i < props.value.length; i++) {
         _indicators.push(createIndicator(i));
       }
-      return /*#__PURE__*/React.createElement("ul", {
-        className: className
-      }, _indicators);
+      return /*#__PURE__*/React.createElement("ul", indicatorsProps, _indicators);
     }
     return null;
   };
@@ -333,14 +318,17 @@ var GalleriaItem = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(functi
   var forwardNavigator = createForwardNavigator();
   var caption = createCaption();
   var indicators = createIndicators();
-  return /*#__PURE__*/React.createElement("div", {
+  var itemWrapperProps = mergeProps({
     ref: ref,
-    className: "p-galleria-item-wrapper"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "p-galleria-item-container"
-  }, backwardNavigator, /*#__PURE__*/React.createElement("div", {
-    className: "p-galleria-item"
-  }, content), forwardNavigator, caption), indicators);
+    className: 'p-galleria-item-wrapper'
+  }, props.ptm('itemWrapper'));
+  var itemContainerProps = mergeProps({
+    className: 'p-galleria-item-container'
+  }, props.ptm('itemContainer'));
+  var itemProps = mergeProps({
+    className: 'p-galleria-item'
+  }, props.ptm('item'));
+  return /*#__PURE__*/React.createElement("div", itemWrapperProps, /*#__PURE__*/React.createElement("div", itemContainerProps, backwardNavigator, /*#__PURE__*/React.createElement("div", itemProps, content), forwardNavigator, caption), indicators);
 }));
 GalleriaItem.displayName = 'GalleriaItem';
 
@@ -360,6 +348,8 @@ function _toConsumableArray(arr) {
   return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
 }
 
+function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var GalleriaThumbnailItem = /*#__PURE__*/React.memo(function (props) {
   var onItemClick = function onItemClick(event) {
     props.onItemClick({
@@ -383,14 +373,16 @@ var GalleriaThumbnailItem = /*#__PURE__*/React.memo(function (props) {
     'p-galleria-thumbnail-item-start': props.start,
     'p-galleria-thumbnail-item-end': props.end
   }, props.className);
-  return /*#__PURE__*/React.createElement("div", {
+  var thumbnailItemProps = mergeProps({
     className: className
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "p-galleria-thumbnail-item-content",
+  }, props.ptm('thumbnailItem'));
+  var thumbnailItemContentProps = mergeProps({
+    className: 'p-galleria-thumbnail-item-content',
     tabIndex: tabIndex,
     onClick: onItemClick,
     onKeyDown: onItemKeyDown
-  }, content));
+  }, props.ptm('thumbnailItemContent'));
+  return /*#__PURE__*/React.createElement("div", thumbnailItemProps, /*#__PURE__*/React.createElement("div", thumbnailItemContentProps, content));
 });
 var GalleriaThumbnails = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (props, ref) {
   var _React$useState = React.useState(props.numVisible),
@@ -408,6 +400,7 @@ var GalleriaThumbnails = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(
   var responsiveOptions = React.useRef(null);
   var prevNumVisible = usePrevious(numVisibleState);
   var prevActiveItemIndex = usePrevious(props.activeItemIndex);
+  var context = React.useContext(PrimeReactContext);
   var _useResizeListener = useResizeListener({
       listener: function listener() {
         calculatePosition();
@@ -535,7 +528,7 @@ var GalleriaThumbnails = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(
   };
   var createStyle = function createStyle() {
     if (!thumbnailsStyle.current) {
-      thumbnailsStyle.current = DomHandler.createInlineStyle(PrimeReact.nonce);
+      thumbnailsStyle.current = DomHandler.createInlineStyle(context && context.nonce || PrimeReact.nonce);
     }
     var innerHTML = "\n            .p-galleria-thumbnail-items[".concat(attributeSelector.current, "] .p-galleria-thumbnail-item {\n                flex: 1 0 ").concat(100 / numVisibleState, "%\n            }\n        ");
     if (props.responsiveOptions) {
@@ -543,7 +536,7 @@ var GalleriaThumbnails = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(
       responsiveOptions.current.sort(function (data1, data2) {
         var value1 = data1.breakpoint;
         var value2 = data2.breakpoint;
-        return ObjectUtils.sort(value1, value2, -1, PrimeReact.locale, PrimeReact.nullSortOrder);
+        return ObjectUtils.sort(value1, value2, -1, context && context.locale || PrimeReact.locale, context && context.nullSortOrder || PrimeReact.nullSortOrder);
       });
       for (var i = 0; i < responsiveOptions.current.length; i++) {
         var res = responsiveOptions.current[i];
@@ -617,7 +610,8 @@ var GalleriaThumbnails = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(
         start: start,
         end: end,
         onItemClick: onItemClick,
-        current: current
+        current: current,
+        ptm: props.ptm
       });
     });
   };
@@ -628,21 +622,19 @@ var GalleriaThumbnails = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(
         'p-disabled': isDisabled
       });
       var iconClassName = 'p-galleria-thumbnail-prev-icon';
-      var icon = props.isVertical ? props.prevThumbnailIcon || /*#__PURE__*/React.createElement(ChevronUpIcon, {
+      var previousThumbnailIconProps = mergeProps({
         className: iconClassName
-      }) : props.prevThumbnailIcon || /*#__PURE__*/React.createElement(ChevronLeftIcon, {
-        className: iconClassName
-      });
-      var prevThumbnailIcon = IconUtils.getJSXIcon(icon, {
-        className: iconClassName
-      }, {
+      }, props.ptm('previousThumbnailIcon'));
+      var icon = props.isVertical ? props.prevThumbnailIcon || /*#__PURE__*/React.createElement(ChevronUpIcon, previousThumbnailIconProps) : props.prevThumbnailIcon || /*#__PURE__*/React.createElement(ChevronLeftIcon, previousThumbnailIconProps);
+      var prevThumbnailIcon = IconUtils.getJSXIcon(icon, _objectSpread$1({}, previousThumbnailIconProps), {
         props: props
       });
-      return /*#__PURE__*/React.createElement("button", {
+      var previousThumbnailButtonProps = mergeProps({
         className: buttonClassName,
         onClick: navBackward,
         disabled: isDisabled
-      }, prevThumbnailIcon, /*#__PURE__*/React.createElement(Ripple, null));
+      }, props.ptm('previousThumbnailButton'));
+      return /*#__PURE__*/React.createElement("button", previousThumbnailButtonProps, prevThumbnailIcon, /*#__PURE__*/React.createElement(Ripple, null));
     }
     return null;
   };
@@ -653,21 +645,19 @@ var GalleriaThumbnails = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(
         'p-disabled': isDisabled
       });
       var iconClassName = 'p-galleria-thumbnail-next-icon';
-      var icon = props.isVertical ? props.nextThumbnailIcon || /*#__PURE__*/React.createElement(ChevronDownIcon, {
-        className: iconClassName
-      }) : props.nextThumbnailIcon || /*#__PURE__*/React.createElement(ChevronRightIcon, {
-        className: iconClassName
-      });
-      var nextThumbnailIcon = IconUtils.getJSXIcon(icon, {
+      var nextThumbnailIconProps = mergeProps({
         className: iconClassName
-      }, {
+      }, props.ptm('nextThumbnailIcon'));
+      var icon = props.isVertical ? props.nextThumbnailIcon || /*#__PURE__*/React.createElement(ChevronDownIcon, nextThumbnailIconProps) : props.nextThumbnailIcon || /*#__PURE__*/React.createElement(ChevronRightIcon, nextThumbnailIconProps);
+      var nextThumbnailIcon = IconUtils.getJSXIcon(icon, _objectSpread$1({}, nextThumbnailIconProps), {
         props: props
       });
-      return /*#__PURE__*/React.createElement("button", {
+      var nextThumbnailButtonProps = mergeProps({
         className: buttonClassName,
         onClick: navForward,
         disabled: isDisabled
-      }, nextThumbnailIcon, /*#__PURE__*/React.createElement(Ripple, null));
+      }, props.ptm('nextThumbnailButton'));
+      return /*#__PURE__*/React.createElement("button", nextThumbnailButtonProps, nextThumbnailIcon, /*#__PURE__*/React.createElement(Ripple, null));
     }
     return null;
   };
@@ -676,26 +666,30 @@ var GalleriaThumbnails = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(
     var height = props.isVertical ? props.contentHeight : '';
     var backwardNavigator = createBackwardNavigator();
     var forwardNavigator = createForwardNavigator();
-    return /*#__PURE__*/React.createElement("div", {
-      className: "p-galleria-thumbnail-container"
-    }, backwardNavigator, /*#__PURE__*/React.createElement("div", {
-      className: "p-galleria-thumbnail-items-container",
+    var thumbnailContainerProps = mergeProps({
+      className: 'p-galleria-thumbnail-container'
+    }, props.ptm('thumbnailContainer'));
+    var thumbnailItemsContainerProps = mergeProps({
+      className: 'p-galleria-thumbnail-items-container',
       style: {
         height: height
       }
-    }, /*#__PURE__*/React.createElement("div", {
+    }, props.ptm('thumbnailItemsContainer'));
+    var thumbnailItemsProps = mergeProps({
       ref: itemsContainerRef,
-      className: "p-galleria-thumbnail-items",
+      className: 'p-galleria-thumbnail-items',
       onTransitionEnd: onTransitionEnd,
       onTouchStart: onTouchStart,
       onTouchMove: onTouchMove,
       onTouchEnd: onTouchEnd
-    }, items)), forwardNavigator);
+    }, props.ptm('thumbnailItems'));
+    return /*#__PURE__*/React.createElement("div", thumbnailContainerProps, backwardNavigator, /*#__PURE__*/React.createElement("div", thumbnailItemsContainerProps, /*#__PURE__*/React.createElement("div", thumbnailItemsProps, items)), forwardNavigator);
   };
   var content = createContent();
-  return /*#__PURE__*/React.createElement("div", {
-    className: "p-galleria-thumbnail-wrapper"
-  }, content);
+  var thumbnailWrapperProps = mergeProps({
+    className: 'p-galleria-thumbnail-wrapper'
+  }, props.ptm('thumbnailWrapper'));
+  return /*#__PURE__*/React.createElement("div", thumbnailWrapperProps, content);
 }));
 GalleriaThumbnailItem.displayName = 'GalleriaThumbnailItem';
 GalleriaThumbnails.displayName = 'GalleriaThumbnails';
@@ -703,7 +697,8 @@ GalleriaThumbnails.displayName = 'GalleriaThumbnails';
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var Galleria = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (inProps, ref) {
-  var props = GalleriaBase.getProps(inProps);
+  var context = React.useContext(PrimeReactContext);
+  var props = GalleriaBase.getProps(inProps, context);
   var _React$useState = React.useState(false),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     visibleState = _React$useState2[0],
@@ -725,6 +720,16 @@ var Galleria = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
   var maskRef = React.useRef(null);
   var activeItemIndex = props.onItemChange ? props.activeIndex : activeIndexState;
   var isVertical = props.thumbnailsPosition === 'left' || props.thumbnailsPosition === 'right';
+  var _GalleriaBase$setMeta = GalleriaBase.setMetaData({
+      props: props,
+      state: {
+        visible: visibleState,
+        numVisible: numVisibleState,
+        slideShowActive: slideShowActiveState,
+        activeIndex: activeIndexState
+      }
+    }),
+    ptm = _GalleriaBase$setMeta.ptm;
   useInterval(function () {
     onActiveItemChange({
       index: props.circular && props.value.length - 1 === activeItemIndex ? 0 : activeItemIndex + 1
@@ -752,7 +757,7 @@ var Galleria = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     DomHandler.addClass(document.body, 'p-overflow-hidden');
   };
   var onEntering = function onEntering() {
-    ZIndexUtils.set('modal', maskRef.current, PrimeReact.autoZIndex, props.baseZIndex || PrimeReact.zIndex['modal']);
+    ZIndexUtils.set('modal', maskRef.current, context && context.autoZIndex || PrimeReact.autoZIndex, props.baseZIndex || context && context.zIndex['modal'] || PrimeReact.zIndex['modal']);
     DomHandler.addMultipleClasses(maskRef.current, 'p-component-overlay p-component-overlay-enter');
   };
   var onEntered = function onEntered() {
@@ -813,56 +818,63 @@ var Galleria = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
     };
   });
   var createHeader = function createHeader() {
+    var headerProps = mergeProps({
+      className: 'p-galleria-header'
+    }, ptm('header'));
     if (props.header) {
-      return /*#__PURE__*/React.createElement("div", {
-        className: "p-galleria-header"
-      }, props.header);
+      return /*#__PURE__*/React.createElement("div", headerProps, props.header);
     }
     return null;
   };
   var createFooter = function createFooter() {
+    var footerProps = mergeProps({
+      className: 'p-galleria-footer'
+    }, ptm('footer'));
     if (props.footer) {
-      return /*#__PURE__*/React.createElement("div", {
-        className: "p-galleria-footer"
-      }, props.footer);
+      return /*#__PURE__*/React.createElement("div", footerProps, props.footer);
     }
     return null;
   };
   var createElement = function createElement() {
-    var otherProps = GalleriaBase.getOtherProps(props);
     var thumbnailsPosClassName = props.showThumbnails && getPositionClassName('p-galleria-thumbnails', props.thumbnailsPosition);
     var indicatorPosClassName = props.showIndicators && getPositionClassName('p-galleria-indicators', props.indicatorsPosition);
     var galleriaClassName = classNames('p-galleria p-component', props.className, {
       'p-galleria-fullscreen': props.fullScreen,
       'p-galleria-indicator-onitem': props.showIndicatorsOnItem,
       'p-galleria-item-nav-onhover': props.showItemNavigatorsOnHover && !props.fullScreen,
-      'p-input-filled': PrimeReact.inputStyle === 'filled',
-      'p-ripple-disabled': PrimeReact.ripple === false
+      'p-input-filled': context && context.inputStyle === 'filled' || PrimeReact.inputStyle === 'filled',
+      'p-ripple-disabled': context && context.ripple === false || PrimeReact.ripple === false
     }, thumbnailsPosClassName, indicatorPosClassName);
     var iconProps = {
       className: 'p-galleria-close-icon',
       'aria-hidden': true
     };
-    var icon = props.closeIcon || /*#__PURE__*/React.createElement(TimesIcon, iconProps);
-    var closeIcon = IconUtils.getJSXIcon(icon, _objectSpread({}, iconProps), {
+    var closeIconProps = mergeProps({
+      className: iconProps
+    }, ptm('closeIcon'));
+    var icon = props.closeIcon || /*#__PURE__*/React.createElement(TimesIcon, closeIconProps);
+    var closeIcon = IconUtils.getJSXIcon(icon, _objectSpread({}, closeIconProps), {
       props: props
     });
-    var closeButton = props.fullScreen && /*#__PURE__*/React.createElement("button", {
-      type: "button",
-      className: "p-galleria-close p-link",
-      "aria-label": localeOption('close'),
+    var closeButtonProps = mergeProps({
+      type: 'button',
+      className: 'p-galleria-close p-link',
+      'aria-label': localeOption('close'),
       onClick: hide
-    }, closeIcon, /*#__PURE__*/React.createElement(Ripple, null));
+    }, ptm('closeButton'));
+    var closeButton = props.fullScreen && /*#__PURE__*/React.createElement("button", closeButtonProps, closeIcon, /*#__PURE__*/React.createElement(Ripple, null));
     var header = createHeader();
     var footer = createFooter();
-    var element = /*#__PURE__*/React.createElement("div", _extends({
+    var rootProps = mergeProps({
       ref: elementRef,
       id: props.id,
       className: galleriaClassName,
       style: props.style
-    }, otherProps), closeButton, header, /*#__PURE__*/React.createElement("div", {
-      className: "p-galleria-content"
-    }, /*#__PURE__*/React.createElement(GalleriaItem, {
+    }, GalleriaBase.getOtherProps(props), ptm('root'));
+    var contentProps = mergeProps({
+      className: 'p-galleria-content'
+    }, ptm('content'));
+    var element = /*#__PURE__*/React.createElement("div", rootProps, closeButton, header, /*#__PURE__*/React.createElement("div", contentProps, /*#__PURE__*/React.createElement(GalleriaItem, {
       ref: previewContentRef,
       value: props.value,
       activeItemIndex: activeItemIndex,
@@ -879,7 +891,8 @@ var Galleria = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
       autoPlay: props.autoPlay,
       slideShowActive: slideShowActiveState,
       startSlideShow: startSlideShow,
-      stopSlideShow: stopSlideShow
+      stopSlideShow: stopSlideShow,
+      ptm: ptm
     }), props.showThumbnails && /*#__PURE__*/React.createElement(GalleriaThumbnails, {
       value: props.value,
       activeItemIndex: activeItemIndex,
@@ -895,7 +908,8 @@ var Galleria = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
       showThumbnailNavigators: props.showThumbnailNavigators,
       autoPlay: props.autoPlay,
       slideShowActive: slideShowActiveState,
-      stopSlideShow: stopSlideShow
+      stopSlideShow: stopSlideShow,
+      ptm: ptm
     })), footer);
     return element;
   };
@@ -905,10 +919,11 @@ var Galleria = /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(function (
       var maskClassName = classNames('p-galleria-mask', {
         'p-galleria-visible': visibleState
       });
-      var galleriaWrapper = /*#__PURE__*/React.createElement("div", {
+      var maskProps = mergeProps({
         ref: maskRef,
         className: maskClassName
-      }, /*#__PURE__*/React.createElement(CSSTransition, {
+      }, ptm('mask'));
+      var galleriaWrapper = /*#__PURE__*/React.createElement("div", maskProps, /*#__PURE__*/React.createElement(CSSTransition, {
         nodeRef: elementRef,
         classNames: "p-galleria",
         "in": visibleState,

package/galleria/galleria.esm.min.js

@@ -1 +1 @@
-import*as e from"react";import t,{localeOption as n}from"primereact/api";import{CSSTransition as r}from"primereact/csstransition";import{useMountEffect as a,usePrevious as i,useResizeListener as l,useUpdateEffect as o,useInterval as c,useUnmountEffect as u}from"primereact/hooks";import{Portal as s}from"primereact/portal";import{Ripple as m}from"primereact/ripple";import{ObjectUtils as p,classNames as v,IconUtils as d,UniqueComponentId as f,DomHandler as h,ZIndexUtils as g}from"primereact/utils";import{ChevronLeftIcon as I}from"primereact/icons/chevronleft";import{ChevronRightIcon as b}from"primereact/icons/chevronright";import{ChevronUpIcon as y}from"primereact/icons/chevronup";import{ChevronDownIcon as x}from"primereact/icons/chevrondown";import{TimesIcon as w}from"primereact/icons/times";function S(){return S=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},S.apply(this,arguments)}function E(e){return E="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},E(e)}function N(e,t){if("object"!==E(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==E(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function O(e){var t=N(e,"string");return"symbol"===E(t)?t:String(t)}function P(e,t,n){return(t=O(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function T(e){if(Array.isArray(e))return e}function C(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,a,i,l,o=[],c=!0,u=!1;try{if(i=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=i.call(n)).done)&&(o.push(r.value),o.length!==t);c=!0);}catch(e){u=!0,a=e}finally{try{if(!c&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(u)throw a}}return o}}function A(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function k(e,t){if(e){if("string"==typeof e)return A(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?A(e,t):void 0}}function j(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function V(e,t){return T(e)||C(e,t)||k(e,t)||j()}var H={defaultProps:{__TYPE:"Galleria",id:null,value:null,activeIndex:0,fullScreen:!1,item:null,thumbnail:null,indicator:null,caption:null,className:null,closeIcon:null,style:null,header:null,footer:null,numVisible:3,responsiveOptions:null,showItemNavigators:!1,showThumbnailNavigators:!0,showItemNavigatorsOnHover:!1,changeItemOnIndicatorHover:!1,circular:!1,autoPlay:!1,transitionInterval:4e3,showThumbnails:!0,itemNextIcon:null,itemPrevIcon:null,nextThumbnailIcon:null,prevThumbnailIcon:null,thumbnailsPosition:"bottom",verticalThumbnailViewPortHeight:"300px",showIndicators:!1,showIndicatorsOnItem:!1,indicatorsPosition:"bottom",baseZIndex:0,transitionOptions:null,onItemChange:null,children:void 0},getProps:function(e){return p.getMergedProps(e,H.defaultProps)},getOtherProps:function(e){return p.getDiffProps(e,H.defaultProps)}},D=e.memo(e.forwardRef((function(t,n){var r=function(){t.slideShowActive&&t.stopSlideShow&&t.stopSlideShow()},i=function(e){r(),t.onActiveItemChange({index:t.circular&&0===t.activeItemIndex?t.value.length-1:0!==t.activeItemIndex?t.activeItemIndex-1:0}),e&&e.cancelable&&e.preventDefault()},l=function(e){r(),t.onActiveItemChange({index:t.circular&&t.value.length-1===t.activeItemIndex?0:t.activeItemIndex+1}),e&&e.cancelable&&e.preventDefault()},o=function(e){r(),t.onActiveItemChange({index:e})},c=function(e){t.changeItemOnIndicatorHover&&(r(),t.onActiveItemChange({index:e}))},u=function(e,n){13===e.which&&(r(),t.onActiveItemChange({index:n}))};a((function(){t.autoPlay&&t.startSlideShow()}));var s=function(n){var r="p-galleria-indicator-"+n,a=v("p-galleria-indicator",{"p-highlight":t.activeItemIndex===n}),i=t.indicator&&t.indicator(n);return i||(i=e.createElement("button",{type:"button",tabIndex:-1,className:"p-link"},e.createElement(m,null))),e.createElement("li",{className:a,key:r,tabIndex:0,onClick:function(){return o(n)},onMouseEnter:function(){return c(n)},onKeyDown:function(e){return u(e,n)}},i)},p=t.itemTemplate&&t.itemTemplate(t.value[t.activeItemIndex]),f=function(){if(t.showItemNavigators){var n=!t.circular&&0===t.activeItemIndex,r=v("p-galleria-item-prev p-galleria-item-nav p-link",{"p-disabled":n}),a="p-galleria-item-prev-icon",l=d.getJSXIcon(t.itemPrevIcon||e.createElement(I,{className:a}),{className:a},{props:t});return e.createElement("button",{type:"button",className:r,onClick:i,disabled:n},l,e.createElement(m,null))}return null}(),h=function(){if(t.showItemNavigators){var n=!t.circular&&t.activeItemIndex===t.value.length-1,r=v("p-galleria-item-next p-galleria-item-nav p-link",{"p-disabled":n}),a="p-galleria-item-next-icon",i=d.getJSXIcon(t.itemNextIcon||e.createElement(b,{className:a}),{className:a},{props:t});return e.createElement("button",{type:"button",className:r,onClick:l,disabled:n},i,e.createElement(m,null))}return null}(),g=function(){if(t.caption){var n=t.caption(t.value[t.activeItemIndex]);return e.createElement("div",{className:"p-galleria-caption"},n)}return null}(),y=function(){if(t.showIndicators){for(var n=v("p-galleria-indicators p-reset",t.indicatorsContentClassName),r=[],a=0;a<t.value.length;a++)r.push(s(a));return e.createElement("ul",{className:n},r)}return null}();return e.createElement("div",{ref:n,className:"p-galleria-item-wrapper"},e.createElement("div",{className:"p-galleria-item-container"},f,e.createElement("div",{className:"p-galleria-item"},p),h,g),y)})));function R(e){if(Array.isArray(e))return A(e)}function M(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function X(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}D.displayName="GalleriaItem";var G=e.memo((function(t){var n=t.active?0:null,r=t.template&&t.template(t.item),a=v("p-galleria-thumbnail-item",{"p-galleria-thumbnail-item-current":t.current,"p-galleria-thumbnail-item-active":t.active,"p-galleria-thumbnail-item-start":t.start,"p-galleria-thumbnail-item-end":t.end},t.className);return e.createElement("div",{className:a},e.createElement("div",{className:"p-galleria-thumbnail-item-content",tabIndex:n,onClick:function(e){t.onItemClick({originalEvent:e,index:t.index})},onKeyDown:function(e){13===e.which&&t.onItemClick({originalEvent:e,index:t.index})}},r))})),J=e.memo(e.forwardRef((function(n,r){var c=V(e.useState(n.numVisible),2),u=c[0],s=c[1],g=V(e.useState(0),2),w=g[0],S=g[1],E=e.useRef(null),N=e.useRef(null),O=e.useRef(""),P=e.useRef(null),T=e.useRef(null),C=i(u),A=i(n.activeItemIndex),j=V(l({listener:function(){B()},when:n.responsiveOptions}),1)[0],H=function(e){var t=w+e;e<0&&-1*t+u>n.value.length-1?t=u-n.value.length:e>0&&t>0&&(t=0),n.circular&&(e<0&&n.value.length-1===n.activeItemIndex?t=0:e>0&&0===n.activeItemIndex&&(t=u-n.value.length)),E.current&&(h.removeClass(E.current,"p-items-hidden"),E.current.style.transform=n.isVertical?"translate3d(0, ".concat(t*(100/u),"%, 0)"):"translate3d(".concat(t*(100/u),"%, 0, 0)"),E.current.style.transition="transform 500ms ease 0s"),S(t)},D=function(){n.slideShowActive&&n.stopSlideShow&&n.stopSlideShow()},J=function(){var e=Math.floor(u/2);return u%2?e:e-1},Y=function(e){D();var t=0!==n.activeItemIndex?n.activeItemIndex-1:0;u-(t+w)-1>J()&&(-1*w!=0||n.circular)&&H(1),n.onActiveItemChange({index:n.circular&&0===n.activeItemIndex?n.value.length-1:t}),e.cancelable&&e.preventDefault()},Z=function(e){D();var t=n.activeItemIndex+1;t+w>J()&&(-1*w<$()-1||n.circular)&&H(-1),n.onActiveItemChange({index:n.circular&&n.value.length-1===n.activeItemIndex?0:t}),e.cancelable&&e.preventDefault()},K=function(e){D();var t=e.index;if(t!==n.activeItemIndex){var r=t+w,a=0;t<n.activeItemIndex?(a=u-r-1-J())>0&&-1*w!=0&&H(a):(a=J()-r)<0&&-1*w<$()-1&&H(a),n.onActiveItemChange({index:t})}},_=function(e){E.current&&"transform"===e.propertyName&&(h.addClass(E.current,"p-items-hidden"),E.current.style.transition="")},z=function(e){var t=e.changedTouches[0];N.current={x:t.pageX,y:t.pageY}},L=function(e){e.cancelable&&e.preventDefault()},U=function(e){var t=e.changedTouches[0];W(e,n.isVertical?t.pageY-N.current.y:t.pageX-N.current.x)},W=function(e,t){t<0?Z(e):Y(e)},$=function(){return n.value.length>u?n.value.length-u+1:0},q=function(){P.current||(P.current=h.createInlineStyle(t.nonce));var e,r="\n            .p-galleria-thumbnail-items[".concat(O.current,"] .p-galleria-thumbnail-item {\n                flex: 1 0 ").concat(100/u,"%\n            }\n        ");if(n.responsiveOptions){T.current=R(e=n.responsiveOptions)||M(e)||k(e)||X(),T.current.sort((function(e,n){return p.sort(e.breakpoint,n.breakpoint,-1,t.locale,t.nullSortOrder)}));for(var a=0;a<T.current.length;a++){var i=T.current[a];r+="\n                    @media screen and (max-width: ".concat(i.breakpoint,") {\n                        .p-galleria-thumbnail-items[").concat(O.current,"] .p-galleria-thumbnail-item {\n                            flex: 1 0 ").concat(100/i.numVisible,"%\n                        }\n                    }\n                ")}}P.current.innerHTML=r},B=function(){if(E.current&&T.current){for(var e=window.innerWidth,t={numVisible:n.numVisible},r=0;r<T.current.length;r++){var a=T.current[r];parseInt(a.breakpoint,10)>=e&&(t=a)}u!==t.numVisible&&s(t.numVisible)}};a((function(){E.current&&(O.current=f(),E.current.setAttribute(O.current,"")),q(),B(),j()})),o((function(){var e=w;C===u&&A===n.activeItemIndex||((e=n.activeItemIndex<=J()?0:n.value.length-u+J()<n.activeItemIndex?u-n.value.length:n.value.length-u<n.activeItemIndex&&u%2==0?-1*n.activeItemIndex+J()+1:-1*n.activeItemIndex+J())!==w&&S(e),E.current.style.transform=n.isVertical?"translate3d(0, ".concat(e*(100/u),"%, 0)"):"translate3d(".concat(e*(100/u),"%, 0, 0)"),A!==n.activeItemIndex&&(h.removeClass(E.current,"p-items-hidden"),E.current.style.transition="transform 500ms ease 0s"))}));var F,Q,ee,te,ne=function(){if(n.showThumbnailNavigators){var t=!n.circular&&0===n.activeItemIndex||n.value.length<=u,r=v("p-galleria-thumbnail-prev p-link",{"p-disabled":t}),a="p-galleria-thumbnail-prev-icon",i=d.getJSXIcon(n.isVertical?n.prevThumbnailIcon||e.createElement(y,{className:a}):n.prevThumbnailIcon||e.createElement(I,{className:a}),{className:a},{props:n});return e.createElement("button",{className:r,onClick:Y,disabled:t},i,e.createElement(m,null))}return null},re=function(){if(n.showThumbnailNavigators){var t=!n.circular&&n.activeItemIndex===n.value.length-1||n.value.length<=u,r=v("p-galleria-thumbnail-next p-link",{"p-disabled":t}),a="p-galleria-thumbnail-next-icon",i=d.getJSXIcon(n.isVertical?n.nextThumbnailIcon||e.createElement(x,{className:a}):n.nextThumbnailIcon||e.createElement(b,{className:a}),{className:a},{props:n});return e.createElement("button",{className:r,onClick:Z,disabled:t},i,e.createElement(m,null))}return null},ae=(F=n.value.map((function(t,r){var a=-1*w,i=a+u-1;return e.createElement(G,{key:r,index:r,template:n.itemTemplate,item:t,active:a<=r&&i>=r,start:a===r,end:i===r,onItemClick:K,current:n.activeItemIndex===r})})),Q=n.isVertical?n.contentHeight:"",ee=ne(),te=re(),e.createElement("div",{className:"p-galleria-thumbnail-container"},ee,e.createElement("div",{className:"p-galleria-thumbnail-items-container",style:{height:Q}},e.createElement("div",{ref:E,className:"p-galleria-thumbnail-items",onTransitionEnd:_,onTouchStart:z,onTouchMove:L,onTouchEnd:U},F)),te));return e.createElement("div",{className:"p-galleria-thumbnail-wrapper"},ae)})));function Y(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function Z(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?Y(Object(n),!0).forEach((function(t){P(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Y(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}G.displayName="GalleriaThumbnailItem",J.displayName="GalleriaThumbnails";var K=e.memo(e.forwardRef((function(a,i){var l=H.getProps(a),o=V(e.useState(!1),2),f=o[0],I=o[1],b=V(e.useState(l.numVisible),2),y=b[0],x=b[1],E=V(e.useState(!1),2),N=E[0],O=E[1],P=V(e.useState(l.activeIndex),2),T=P[0],C=P[1],A=e.useRef(null),k=e.useRef(null),j=e.useRef(null),R=l.onItemChange?l.activeIndex:T,M="left"===l.thumbnailsPosition||"right"===l.thumbnailsPosition;c((function(){X({index:l.circular&&l.value.length-1===R?0:R+1})}),l.transitionInterval,N);var X=function(e){e.index>=l.value.length?q():l.onItemChange?l.onItemChange(e):C(e.index)},G=function(){I(!0)},Y=function(){I(!1)},K=function(){h.addClass(document.body,"p-overflow-hidden")},_=function(){g.set("modal",j.current,t.autoZIndex,l.baseZIndex||t.zIndex.modal),h.addMultipleClasses(j.current,"p-component-overlay p-component-overlay-enter")},z=function(){l.onShow&&l.onShow()},L=function(){h.removeClass(document.body,"p-overflow-hidden"),h.addClass(j.current,"p-component-overlay-leave")},U=function(){g.clear(j.current),l.onHide&&l.onHide()},W=function(){return N},$=function(){O(!0)},q=function(){O(!1)},B=function(e,t){var n=["top","left","bottom","right"].find((function(e){return e===t}));return n?"".concat(e,"-").concat(n):""};e.useEffect((function(){l.value&&l.value.length<y&&x(l.value.length)}),[l.value,y]),e.useEffect((function(){x(l.numVisible)}),[l.numVisible]),u((function(){N&&q(),g.clear(j.current)})),e.useImperativeHandle(i,(function(){return{props:l,show:G,hide:Y,isAutoPlayActive:W,startSlideShow:$,stopSlideShow:q,getElement:function(){return A.current},getPreviewContent:function(){return k.current}}}));return p.isNotEmpty(l.value)&&function(){var a,i,o,c,u,p,h,g,I,b=(a=H.getOtherProps(l),i=l.showThumbnails&&B("p-galleria-thumbnails",l.thumbnailsPosition),o=l.showIndicators&&B("p-galleria-indicators",l.indicatorsPosition),c=v("p-galleria p-component",l.className,{"p-galleria-fullscreen":l.fullScreen,"p-galleria-indicator-onitem":l.showIndicatorsOnItem,"p-galleria-item-nav-onhover":l.showItemNavigatorsOnHover&&!l.fullScreen,"p-input-filled":"filled"===t.inputStyle,"p-ripple-disabled":!1===t.ripple},i,o),u={className:"p-galleria-close-icon","aria-hidden":!0},p=d.getJSXIcon(l.closeIcon||e.createElement(w,u),Z({},u),{props:l}),h=l.fullScreen&&e.createElement("button",{type:"button",className:"p-galleria-close p-link","aria-label":n("close"),onClick:Y},p,e.createElement(m,null)),g=l.header?e.createElement("div",{className:"p-galleria-header"},l.header):null,I=l.footer?e.createElement("div",{className:"p-galleria-footer"},l.footer):null,e.createElement("div",S({ref:A,id:l.id,className:c,style:l.style},a),h,g,e.createElement("div",{className:"p-galleria-content"},e.createElement(D,{ref:k,value:l.value,activeItemIndex:R,onActiveItemChange:X,itemTemplate:l.item,circular:l.circular,caption:l.caption,showIndicators:l.showIndicators,itemPrevIcon:l.itemPrevIcon,itemNextIcon:l.itemNextIcon,changeItemOnIndicatorHover:l.changeItemOnIndicatorHover,indicator:l.indicator,showItemNavigators:l.showItemNavigators,autoPlay:l.autoPlay,slideShowActive:N,startSlideShow:$,stopSlideShow:q}),l.showThumbnails&&e.createElement(J,{value:l.value,activeItemIndex:R,onActiveItemChange:X,itemTemplate:l.thumbnail,numVisible:y,nextThumbnailIcon:l.nextThumbnailIcon,prevThumbnailIcon:l.prevThumbnailIcon,responsiveOptions:l.responsiveOptions,circular:l.circular,isVertical:M,contentHeight:l.verticalThumbnailViewPortHeight,showThumbnailNavigators:l.showThumbnailNavigators,autoPlay:l.autoPlay,slideShowActive:N,stopSlideShow:q})),I));if(l.fullScreen){var x=v("p-galleria-mask",{"p-galleria-visible":f});return e.createElement(s,{element:e.createElement("div",{ref:j,className:x},e.createElement(r,{nodeRef:A,classNames:"p-galleria",in:f,timeout:{enter:150,exit:150},options:l.transitionOptions,unmountOnExit:!0,onEnter:K,onEntering:_,onEntered:z,onExit:L,onExited:U},b))})}return b}()})));K.displayName="Galleria";export{K as Galleria};
+import*as e from"react";import t,{PrimeReactContext as n,localeOption as r}from"primereact/api";import{CSSTransition as a}from"primereact/csstransition";import{useMountEffect as i,usePrevious as l,useResizeListener as o,useUpdateEffect as c,useInterval as u,useUnmountEffect as m}from"primereact/hooks";import{TimesIcon as s}from"primereact/icons/times";import{Portal as p}from"primereact/portal";import{Ripple as v}from"primereact/ripple";import{mergeProps as d,classNames as f,IconUtils as h,UniqueComponentId as b,DomHandler as I,ObjectUtils as g,ZIndexUtils as y}from"primereact/utils";import{ComponentBase as x}from"primereact/componentbase";import{ChevronLeftIcon as w}from"primereact/icons/chevronleft";import{ChevronRightIcon as O}from"primereact/icons/chevronright";import{ChevronDownIcon as S}from"primereact/icons/chevrondown";import{ChevronUpIcon as E}from"primereact/icons/chevronup";function N(e){return N="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},N(e)}function P(e,t){if("object"!==N(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!==N(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function j(e){var t=P(e,"string");return"symbol"===N(t)?t:String(t)}function T(e,t,n){return(t=j(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function C(e){if(Array.isArray(e))return e}function k(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,a,i,l,o=[],c=!0,u=!1;try{if(i=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(r=i.call(n)).done)&&(o.push(r.value),o.length!==t);c=!0);}catch(e){u=!0,a=e}finally{try{if(!c&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(u)throw a}}return o}}function A(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function V(e,t){if(e){if("string"==typeof e)return A(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?A(e,t):void 0}}function D(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function H(e,t){return C(e)||k(e,t)||V(e,t)||D()}var R=x.extend({defaultProps:{__TYPE:"Galleria",id:null,value:null,activeIndex:0,fullScreen:!1,item:null,thumbnail:null,indicator:null,caption:null,className:null,closeIcon:null,style:null,header:null,footer:null,numVisible:3,responsiveOptions:null,showItemNavigators:!1,showThumbnailNavigators:!0,showItemNavigatorsOnHover:!1,changeItemOnIndicatorHover:!1,circular:!1,autoPlay:!1,transitionInterval:4e3,showThumbnails:!0,itemNextIcon:null,itemPrevIcon:null,nextThumbnailIcon:null,prevThumbnailIcon:null,thumbnailsPosition:"bottom",verticalThumbnailViewPortHeight:"300px",showIndicators:!1,showIndicatorsOnItem:!1,indicatorsPosition:"bottom",baseZIndex:0,transitionOptions:null,onItemChange:null,children:void 0}});function M(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function X(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?M(Object(n),!0).forEach((function(t){T(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):M(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var B=e.memo(e.forwardRef((function(t,n){var r=function(){t.slideShowActive&&t.stopSlideShow&&t.stopSlideShow()},a=function(e){r(),t.onActiveItemChange({index:t.circular&&0===t.activeItemIndex?t.value.length-1:0!==t.activeItemIndex?t.activeItemIndex-1:0}),e&&e.cancelable&&e.preventDefault()},l=function(e){r(),t.onActiveItemChange({index:t.circular&&t.value.length-1===t.activeItemIndex?0:t.activeItemIndex+1}),e&&e.cancelable&&e.preventDefault()},o=function(e){r(),t.onActiveItemChange({index:e})},c=function(e){t.changeItemOnIndicatorHover&&(r(),t.onActiveItemChange({index:e}))},u=function(e,n){13===e.which&&(r(),t.onActiveItemChange({index:n}))};i((function(){t.autoPlay&&t.startSlideShow()}));var m=function(n){var r="p-galleria-indicator-"+n,a=f("p-galleria-indicator",{"p-highlight":t.activeItemIndex===n}),i=t.indicator&&t.indicator(n),l=d({className:a,key:r,tabIndex:0,onClick:function(){return o(n)},onMouseEnter:function(){return c(n)},onKeyDown:function(e){return u(e,n)}},t.ptm("indicator"));return i||(i=e.createElement("button",{type:"button",tabIndex:-1,className:"p-link"},e.createElement(v,null))),e.createElement("li",l,i)},s=t.itemTemplate&&t.itemTemplate(t.value[t.activeItemIndex]),p=function(){if(t.showItemNavigators){var n=!t.circular&&0===t.activeItemIndex,r=f("p-galleria-item-prev p-galleria-item-nav p-link",{"p-disabled":n}),i=d({className:"p-galleria-item-prev-icon"},t.ptm("previousItemIcon")),l=h.getJSXIcon(t.itemPrevIcon||e.createElement(w,i),X({},i),{props:t}),o=d({type:"button",className:r,onClick:a,disabled:n},t.ptm("previousItemButton"));return e.createElement("button",o,l,e.createElement(v,null))}return null}(),b=function(){if(t.showItemNavigators){var n=!t.circular&&t.activeItemIndex===t.value.length-1,r=f("p-galleria-item-next p-galleria-item-nav p-link",{"p-disabled":n}),a=d({className:"p-galleria-item-next-icon"},t.ptm("nextItemIcon")),i=h.getJSXIcon(t.itemNextIcon||e.createElement(O,a),X({},a),{props:t}),o=d({type:"button",className:r,onClick:l,disabled:n},t.ptm("nextItemButton"));return e.createElement("button",o,i,e.createElement(v,null))}return null}(),I=function(){var n=d({className:"p-galleria-caption"},t.ptm("caption"));if(t.caption){var r=t.caption(t.value[t.activeItemIndex]);return e.createElement("div",n,r)}return null}(),g=function(){if(t.showIndicators){for(var n=f("p-galleria-indicators p-reset",t.indicatorsContentClassName),r=[],a=d({className:n},t.ptm("indicators")),i=0;i<t.value.length;i++)r.push(m(i));return e.createElement("ul",a,r)}return null}(),y=d({ref:n,className:"p-galleria-item-wrapper"},t.ptm("itemWrapper")),x=d({className:"p-galleria-item-container"},t.ptm("itemContainer")),S=d({className:"p-galleria-item"},t.ptm("item"));return e.createElement("div",y,e.createElement("div",x,p,e.createElement("div",S,s),b,I),g)})));function G(e){if(Array.isArray(e))return A(e)}function J(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function Z(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function W(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function Y(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?W(Object(n),!0).forEach((function(t){T(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):W(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}B.displayName="GalleriaItem";var z=e.memo((function(t){var n=t.active?0:null,r=t.template&&t.template(t.item),a=f("p-galleria-thumbnail-item",{"p-galleria-thumbnail-item-current":t.current,"p-galleria-thumbnail-item-active":t.active,"p-galleria-thumbnail-item-start":t.start,"p-galleria-thumbnail-item-end":t.end},t.className),i=d({className:a},t.ptm("thumbnailItem")),l=d({className:"p-galleria-thumbnail-item-content",tabIndex:n,onClick:function(e){t.onItemClick({originalEvent:e,index:t.index})},onKeyDown:function(e){13===e.which&&t.onItemClick({originalEvent:e,index:t.index})}},t.ptm("thumbnailItemContent"));return e.createElement("div",i,e.createElement("div",l,r))})),K=e.memo(e.forwardRef((function(r,a){var u=H(e.useState(r.numVisible),2),m=u[0],s=u[1],p=H(e.useState(0),2),y=p[0],x=p[1],N=e.useRef(null),P=e.useRef(null),j=e.useRef(""),T=e.useRef(null),C=e.useRef(null),k=l(m),A=l(r.activeItemIndex),D=e.useContext(n),R=H(o({listener:function(){te()},when:r.responsiveOptions}),1)[0],M=function(e){var t=y+e;e<0&&-1*t+m>r.value.length-1?t=m-r.value.length:e>0&&t>0&&(t=0),r.circular&&(e<0&&r.value.length-1===r.activeItemIndex?t=0:e>0&&0===r.activeItemIndex&&(t=m-r.value.length)),N.current&&(I.removeClass(N.current,"p-items-hidden"),N.current.style.transform=r.isVertical?"translate3d(0, ".concat(t*(100/m),"%, 0)"):"translate3d(".concat(t*(100/m),"%, 0, 0)"),N.current.style.transition="transform 500ms ease 0s"),x(t)},X=function(){r.slideShowActive&&r.stopSlideShow&&r.stopSlideShow()},B=function(){var e=Math.floor(m/2);return m%2?e:e-1},W=function(e){X();var t=0!==r.activeItemIndex?r.activeItemIndex-1:0;m-(t+y)-1>B()&&(-1*y!=0||r.circular)&&M(1),r.onActiveItemChange({index:r.circular&&0===r.activeItemIndex?r.value.length-1:t}),e.cancelable&&e.preventDefault()},K=function(e){X();var t=r.activeItemIndex+1;t+y>B()&&(-1*y<Q()-1||r.circular)&&M(-1),r.onActiveItemChange({index:r.circular&&r.value.length-1===r.activeItemIndex?0:t}),e.cancelable&&e.preventDefault()},_=function(e){X();var t=e.index;if(t!==r.activeItemIndex){var n=t+y,a=0;t<r.activeItemIndex?(a=m-n-1-B())>0&&-1*y!=0&&M(a):(a=B()-n)<0&&-1*y<Q()-1&&M(a),r.onActiveItemChange({index:t})}},L=function(e){N.current&&"transform"===e.propertyName&&(I.addClass(N.current,"p-items-hidden"),N.current.style.transition="")},U=function(e){var t=e.changedTouches[0];P.current={x:t.pageX,y:t.pageY}},$=function(e){e.cancelable&&e.preventDefault()},q=function(e){var t=e.changedTouches[0];F(e,r.isVertical?t.pageY-P.current.y:t.pageX-P.current.x)},F=function(e,t){t<0?K(e):W(e)},Q=function(){return r.value.length>m?r.value.length-m+1:0},ee=function(){T.current||(T.current=I.createInlineStyle(D&&D.nonce||t.nonce));var e,n="\n            .p-galleria-thumbnail-items[".concat(j.current,"] .p-galleria-thumbnail-item {\n                flex: 1 0 ").concat(100/m,"%\n            }\n        ");if(r.responsiveOptions){C.current=G(e=r.responsiveOptions)||J(e)||V(e)||Z(),C.current.sort((function(e,n){return g.sort(e.breakpoint,n.breakpoint,-1,D&&D.locale||t.locale,D&&D.nullSortOrder||t.nullSortOrder)}));for(var a=0;a<C.current.length;a++){var i=C.current[a];n+="\n                    @media screen and (max-width: ".concat(i.breakpoint,") {\n                        .p-galleria-thumbnail-items[").concat(j.current,"] .p-galleria-thumbnail-item {\n                            flex: 1 0 ").concat(100/i.numVisible,"%\n                        }\n                    }\n                ")}}T.current.innerHTML=n},te=function(){if(N.current&&C.current){for(var e=window.innerWidth,t={numVisible:r.numVisible},n=0;n<C.current.length;n++){var a=C.current[n];parseInt(a.breakpoint,10)>=e&&(t=a)}m!==t.numVisible&&s(t.numVisible)}};i((function(){N.current&&(j.current=b(),N.current.setAttribute(j.current,"")),ee(),te(),R()})),c((function(){var e=y;k===m&&A===r.activeItemIndex||((e=r.activeItemIndex<=B()?0:r.value.length-m+B()<r.activeItemIndex?m-r.value.length:r.value.length-m<r.activeItemIndex&&m%2==0?-1*r.activeItemIndex+B()+1:-1*r.activeItemIndex+B())!==y&&x(e),N.current.style.transform=r.isVertical?"translate3d(0, ".concat(e*(100/m),"%, 0)"):"translate3d(".concat(e*(100/m),"%, 0, 0)"),A!==r.activeItemIndex&&(I.removeClass(N.current,"p-items-hidden"),N.current.style.transition="transform 500ms ease 0s"))}));var ne,re,ae,ie,le,oe,ce,ue=function(){if(r.showThumbnailNavigators){var t=!r.circular&&0===r.activeItemIndex||r.value.length<=m,n=f("p-galleria-thumbnail-prev p-link",{"p-disabled":t}),a=d({className:"p-galleria-thumbnail-prev-icon"},r.ptm("previousThumbnailIcon")),i=h.getJSXIcon(r.isVertical?r.prevThumbnailIcon||e.createElement(E,a):r.prevThumbnailIcon||e.createElement(w,a),Y({},a),{props:r}),l=d({className:n,onClick:W,disabled:t},r.ptm("previousThumbnailButton"));return e.createElement("button",l,i,e.createElement(v,null))}return null},me=function(){if(r.showThumbnailNavigators){var t=!r.circular&&r.activeItemIndex===r.value.length-1||r.value.length<=m,n=f("p-galleria-thumbnail-next p-link",{"p-disabled":t}),a=d({className:"p-galleria-thumbnail-next-icon"},r.ptm("nextThumbnailIcon")),i=h.getJSXIcon(r.isVertical?r.nextThumbnailIcon||e.createElement(S,a):r.nextThumbnailIcon||e.createElement(O,a),Y({},a),{props:r}),l=d({className:n,onClick:K,disabled:t},r.ptm("nextThumbnailButton"));return e.createElement("button",l,i,e.createElement(v,null))}return null},se=(ne=r.value.map((function(t,n){var a=-1*y,i=a+m-1;return e.createElement(z,{key:n,index:n,template:r.itemTemplate,item:t,active:a<=n&&i>=n,start:a===n,end:i===n,onItemClick:_,current:r.activeItemIndex===n,ptm:r.ptm})})),re=r.isVertical?r.contentHeight:"",ae=ue(),ie=me(),le=d({className:"p-galleria-thumbnail-container"},r.ptm("thumbnailContainer")),oe=d({className:"p-galleria-thumbnail-items-container",style:{height:re}},r.ptm("thumbnailItemsContainer")),ce=d({ref:N,className:"p-galleria-thumbnail-items",onTransitionEnd:L,onTouchStart:U,onTouchMove:$,onTouchEnd:q},r.ptm("thumbnailItems")),e.createElement("div",le,ae,e.createElement("div",oe,e.createElement("div",ce,ne)),ie)),pe=d({className:"p-galleria-thumbnail-wrapper"},r.ptm("thumbnailWrapper"));return e.createElement("div",pe,se)})));function _(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function L(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?_(Object(n),!0).forEach((function(t){T(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):_(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}z.displayName="GalleriaThumbnailItem",K.displayName="GalleriaThumbnails";var U=e.memo(e.forwardRef((function(i,l){var o=e.useContext(n),c=R.getProps(i,o),b=H(e.useState(!1),2),x=b[0],w=b[1],O=H(e.useState(c.numVisible),2),S=O[0],E=O[1],N=H(e.useState(!1),2),P=N[0],j=N[1],T=H(e.useState(c.activeIndex),2),C=T[0],k=T[1],A=e.useRef(null),V=e.useRef(null),D=e.useRef(null),M=c.onItemChange?c.activeIndex:C,X="left"===c.thumbnailsPosition||"right"===c.thumbnailsPosition,G=R.setMetaData({props:c,state:{visible:x,numVisible:S,slideShowActive:P,activeIndex:C}}).ptm;u((function(){J({index:c.circular&&c.value.length-1===M?0:M+1})}),c.transitionInterval,P);var J=function(e){e.index>=c.value.length?Q():c.onItemChange?c.onItemChange(e):k(e.index)},Z=function(){w(!0)},W=function(){w(!1)},Y=function(){I.addClass(document.body,"p-overflow-hidden")},z=function(){y.set("modal",D.current,o&&o.autoZIndex||t.autoZIndex,c.baseZIndex||o&&o.zIndex.modal||t.zIndex.modal),I.addMultipleClasses(D.current,"p-component-overlay p-component-overlay-enter")},_=function(){c.onShow&&c.onShow()},U=function(){I.removeClass(document.body,"p-overflow-hidden"),I.addClass(D.current,"p-component-overlay-leave")},$=function(){y.clear(D.current),c.onHide&&c.onHide()},q=function(){return P},F=function(){j(!0)},Q=function(){j(!1)},ee=function(e,t){var n=["top","left","bottom","right"].find((function(e){return e===t}));return n?"".concat(e,"-").concat(n):""};e.useEffect((function(){c.value&&c.value.length<S&&E(c.value.length)}),[c.value,S]),e.useEffect((function(){E(c.numVisible)}),[c.numVisible]),m((function(){P&&Q(),y.clear(D.current)})),e.useImperativeHandle(l,(function(){return{props:c,show:Z,hide:W,isAutoPlayActive:q,startSlideShow:F,stopSlideShow:Q,getElement:function(){return A.current},getPreviewContent:function(){return V.current}}}));return g.isNotEmpty(c.value)&&function(){var n,i,l,u,m,b,I,g,y,w,O,E,N,j=(l=c.showThumbnails&&ee("p-galleria-thumbnails",c.thumbnailsPosition),u=c.showIndicators&&ee("p-galleria-indicators",c.indicatorsPosition),m=f("p-galleria p-component",c.className,{"p-galleria-fullscreen":c.fullScreen,"p-galleria-indicator-onitem":c.showIndicatorsOnItem,"p-galleria-item-nav-onhover":c.showItemNavigatorsOnHover&&!c.fullScreen,"p-input-filled":o&&"filled"===o.inputStyle||"filled"===t.inputStyle,"p-ripple-disabled":o&&!1===o.ripple||!1===t.ripple},l,u),b=d({className:{className:"p-galleria-close-icon","aria-hidden":!0}},G("closeIcon")),I=h.getJSXIcon(c.closeIcon||e.createElement(s,b),L({},b),{props:c}),g=d({type:"button",className:"p-galleria-close p-link","aria-label":r("close"),onClick:W},G("closeButton")),y=c.fullScreen&&e.createElement("button",g,I,e.createElement(v,null)),n=d({className:"p-galleria-header"},G("header")),w=c.header?e.createElement("div",n,c.header):null,i=d({className:"p-galleria-footer"},G("footer")),O=c.footer?e.createElement("div",i,c.footer):null,E=d({ref:A,id:c.id,className:m,style:c.style},R.getOtherProps(c),G("root")),N=d({className:"p-galleria-content"},G("content")),e.createElement("div",E,y,w,e.createElement("div",N,e.createElement(B,{ref:V,value:c.value,activeItemIndex:M,onActiveItemChange:J,itemTemplate:c.item,circular:c.circular,caption:c.caption,showIndicators:c.showIndicators,itemPrevIcon:c.itemPrevIcon,itemNextIcon:c.itemNextIcon,changeItemOnIndicatorHover:c.changeItemOnIndicatorHover,indicator:c.indicator,showItemNavigators:c.showItemNavigators,autoPlay:c.autoPlay,slideShowActive:P,startSlideShow:F,stopSlideShow:Q,ptm:G}),c.showThumbnails&&e.createElement(K,{value:c.value,activeItemIndex:M,onActiveItemChange:J,itemTemplate:c.thumbnail,numVisible:S,nextThumbnailIcon:c.nextThumbnailIcon,prevThumbnailIcon:c.prevThumbnailIcon,responsiveOptions:c.responsiveOptions,circular:c.circular,isVertical:X,contentHeight:c.verticalThumbnailViewPortHeight,showThumbnailNavigators:c.showThumbnailNavigators,autoPlay:c.autoPlay,slideShowActive:P,stopSlideShow:Q,ptm:G})),O));if(c.fullScreen){var T=f("p-galleria-mask",{"p-galleria-visible":x}),C=d({ref:D,className:T},G("mask"));return e.createElement(p,{element:e.createElement("div",C,e.createElement(a,{nodeRef:A,classNames:"p-galleria",in:x,timeout:{enter:150,exit:150},options:c.transitionOptions,unmountOnExit:!0,onEnter:Y,onEntering:z,onEntered:_,onExit:U,onExited:$},j))})}return j}()})));U.displayName="Galleria";export{U as Galleria};