primevue 3.31.0 → 3.32.1

package/image/Image.d.ts

@@ -7,11 +7,14 @@
  * @module image
  *
  */
-import { VNode } from 'vue';
+import { TransitionProps, VNode } from 'vue';
 import { ComponentHooks } from '../basecomponent';
-import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
+import { ClassComponent, GlobalComponentConstructor, PTOptions } from '../ts-helpers';
+
 export declare type ImagePassThroughOptionType = ImagePassThroughAttributes | ((options: ImagePassThroughMethodOptions) => ImagePassThroughAttributes | string) | string | null | undefined;
 
+export declare type ImagePassThroughTransitionType = TransitionProps | ((options: ImagePassThroughMethodOptions) => TransitionProps) | undefined;
+
 /**
  * Custom passthrough(pt) option method.
  */
@@ -27,82 +30,86 @@ export interface ImagePassThroughMethodOptions {
  */
 export interface ImagePassThroughOptions {
     /**
-     * Uses to pass attributes to the root's DOM element.
+     * Used to pass attributes to the root's DOM element.
      */
     root?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the image's DOM element.
+     * Used to pass attributes to the image's DOM element.
      */
     image?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the button's DOM element.
+     * Used to pass attributes to the button's DOM element.
      */
     button?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the icon's DOM element.
+     * Used to pass attributes to the icon's DOM element.
      */
     icon?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the mask's DOM element.
+     * Used to pass attributes to the mask's DOM element.
      */
     mask?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the toolbar's DOM element.
+     * Used to pass attributes to the toolbar's DOM element.
      */
     toolbar?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the rotate right button's DOM element.
+     * Used to pass attributes to the rotate right button's DOM element.
      */
     rotateRightButton?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the rotate right icon's DOM element.
+     * Used to pass attributes to the rotate right icon's DOM element.
      */
     rotateRightIcon?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the rotate left button's DOM element.
+     * Used to pass attributes to the rotate left button's DOM element.
      */
     rotateLeftButton?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the rotate left icon's DOM element.
+     * Used to pass attributes to the rotate left icon's DOM element.
      */
     rotateLeftIcon?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the zoom out button's DOM element.
+     * Used to pass attributes to the zoom out button's DOM element.
      */
     zoomOutButton?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the zoom out icon's DOM element.
+     * Used to pass attributes to the zoom out icon's DOM element.
      */
     zoomOutIcon?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the zoom in button's DOM element.
+     * Used to pass attributes to the zoom in button's DOM element.
      */
     zoomInButton?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the zoom in icon's DOM element.
+     * Used to pass attributes to the zoom in icon's DOM element.
      */
     zoomInIcon?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the close button's DOM element.
+     * Used to pass attributes to the close button's DOM element.
      */
     closeButton?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the close icon's DOM element.
+     * Used to pass attributes to the close icon's DOM element.
      */
     closeIcon?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the preview container's DOM element.
+     * Used to pass attributes to the preview container's DOM element.
      */
     previewContainer?: ImagePassThroughOptionType;
     /**
-     * Uses to pass attributes to the preview's DOM element.
+     * Used to pass attributes to the preview's DOM element.
      */
     preview?: ImagePassThroughOptionType;
     /**
-     * Uses to manage all lifecycle hooks
+     * Used to manage all lifecycle hooks
      * @see {@link BaseComponent.ComponentHooks}
      */
     hooks?: ComponentHooks;
+    /**
+     * Used to control Vue Transition API.
+     */
+    transition?: ImagePassThroughTransitionType;
 }
 
 /**
@@ -171,10 +178,10 @@ export interface ImageProps {
      */
     zoomOutDisabled?: boolean | undefined;
     /**
-     * Uses to pass attributes to DOM elements inside the component.
+     * Used to pass attributes to DOM elements inside the component.
      * @type {ImagePassThroughOptions}
      */
-    pt?: ImagePassThroughOptions;
+    pt?: PTOptions<ImagePassThroughOptions>;
     /**
      * When enabled, it removes component related styles in the core.
      * @defaultValue false
@@ -212,6 +219,7 @@ export interface ImageSlots {
     close(): VNode[];
     /**
      * Custom image template.
+     * @param {Object} scope - image slot's params.
      */
     image(scope: {
         /**
@@ -225,10 +233,11 @@ export interface ImageSlots {
         /**
          * Image error function.
          */
-        onError: void;
+        onError: () => void;
     }): VNode[];
     /**
      * Custom preview template.
+     * @param {Object} scope - preview slot's params.
      */
     preview(scope: {
         /**
@@ -242,7 +251,7 @@ export interface ImageSlots {
         /**
          * Preview click function.
          */
-        onClick: void;
+        onClick: () => void;
     }): VNode[];
 }
 

package/image/Image.vue

@@ -3,7 +3,7 @@
         <slot name="image" :onError="onError">
             <img :style="imageStyle" :class="[cx('image'), imageClass]" @error="onError" v-bind="{ ...$attrs, ...ptm('image') }" />
         </slot>
-        <button v-if="preview" ref="previewButton" :class="cx('button')" @click="onImageClick" v-bind="{ ...previewButtonProps, ...ptm('button') }">
+        <button v-if="preview" ref="previewButton" type="button" :class="cx('button')" @click="onImageClick" v-bind="{ ...previewButtonProps, ...ptm('button') }">
             <slot name="indicatoricon">
                 <component :is="indicatorIcon ? 'i' : 'EyeIcon'" :class="cx('icon')" v-bind="ptm('icon')" />
             </slot>
@@ -11,39 +11,39 @@
         <Portal>
             <div v-if="maskVisible" :ref="maskRef" v-focustrap role="dialog" :class="cx('mask')" :aria-modal="maskVisible" @click="onMaskClick" @keydown="onMaskKeydown" v-bind="ptm('mask')">
                 <div class="p-image-toolbar" v-bind="ptm('toolbar')">
-                    <button :class="cx('rotateRightButton')" @click="rotateRight" type="button" :aria-label="rightAriaLabel" v-bind="ptm('rotateRightButton')">
+                    <button :class="cx('rotateRightButton')" @click="rotateRight" type="button" :aria-label="rightAriaLabel" v-bind="ptm('rotateRightButton')" data-pc-group-section="action">
                         <slot name="refresh">
                             <RefreshIcon v-bind="ptm('rotateRightIcon')" />
                         </slot>
                     </button>
 
-                    <button :class="cx('rotateLeftButton')" @click="rotateLeft" type="button" :aria-label="leftAriaLabel" v-bind="ptm('rotateLeftButton')">
+                    <button :class="cx('rotateLeftButton')" @click="rotateLeft" type="button" :aria-label="leftAriaLabel" v-bind="ptm('rotateLeftButton')" data-pc-group-section="action">
                         <slot name="undo">
                             <UndoIcon v-bind="ptm('rotateLeftIcon')" />
                         </slot>
                     </button>
 
-                    <button :class="cx('zoomOutButton')" @click="zoomOut" type="button" :disabled="isZoomOutDisabled" :aria-label="zoomOutAriaLabel" v-bind="ptm('zoomOutButton')">
+                    <button :class="cx('zoomOutButton')" @click="zoomOut" type="button" :disabled="isZoomOutDisabled" :aria-label="zoomOutAriaLabel" v-bind="ptm('zoomOutButton')" data-pc-group-section="action">
                         <slot name="zoomout">
                             <SearchMinusIcon v-bind="ptm('zoomOutIcon')" />
                         </slot>
                     </button>
 
-                    <button :class="cx('zoomInButton')" @click="zoomIn" type="button" :disabled="isZoomInDisabled" :aria-label="zoomInAriaLabel" v-bind="ptm('zoomInButton')">
+                    <button :class="cx('zoomInButton')" @click="zoomIn" type="button" :disabled="isZoomInDisabled" :aria-label="zoomInAriaLabel" v-bind="ptm('zoomInButton')" data-pc-group-section="action">
                         <slot name="zoomin">
                             <SearchPlusIcon v-bind="ptm('zoomInIcon')" />
                         </slot>
                     </button>
 
-                    <button :class="cx('closeButton')" type="button" @click="hidePreview" :aria-label="closeAriaLabel" autofocus v-bind="ptm('closeButton')">
+                    <button :class="cx('closeButton')" type="button" @click="hidePreview" :aria-label="closeAriaLabel" autofocus v-bind="ptm('closeButton')" data-pc-group-section="action">
                         <slot name="close">
                             <TimesIcon v-bind="ptm('closeIcon')" />
                         </slot>
                     </button>
                 </div>
-                <transition name="p-image-preview" @before-enter="onBeforeEnter" @enter="onEnter" @leave="onLeave" @before-leave="onBeforeLeave" @after-leave="onAfterLeave">
+                <transition name="p-image-preview" @before-enter="onBeforeEnter" @enter="onEnter" @leave="onLeave" @before-leave="onBeforeLeave" @after-leave="onAfterLeave" v-bind="ptm('transition')">
                     <div v-if="previewVisible" v-bind="ptm('previewContainer')">
-                        <slot name="preview" :style="imagePreviewStyle" :onClick="onPreviewImageClick">
+                        <slot name="preview" :class="cx('preview')" :style="imagePreviewStyle" :onClick="onPreviewImageClick">
                             <img :src="$attrs.src" :class="cx('preview')" :style="imagePreviewStyle" @click="onPreviewImageClick" v-bind="ptm('preview')" />
                         </slot>
                     </div>
@@ -93,6 +93,7 @@ export default {
         },
         onImageClick() {
             if (this.preview) {
+                DomHandler.addClass(document.body, 'p-overflow-hidden');
                 this.maskVisible = true;
                 setTimeout(() => {
                     this.previewVisible = true;
@@ -179,6 +180,7 @@ export default {
             this.previewVisible = false;
             this.rotate = 0;
             this.scale = 1;
+            DomHandler.removeClass(document.body, 'p-overflow-hidden');
         }
     },
     computed: {

package/image/image.cjs.js

@@ -143,6 +143,7 @@ var script = {
     onImageClick: function onImageClick() {
       var _this = this;
       if (this.preview) {
+        utils.DomHandler.addClass(document.body, 'p-overflow-hidden');
         this.maskVisible = true;
         setTimeout(function () {
           _this.previewVisible = true;
@@ -222,6 +223,7 @@ var script = {
       this.previewVisible = false;
       this.rotate = 0;
       this.scale = 1;
+      utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
     }
   },
   computed: {
@@ -311,6 +313,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   }), _ctx.preview ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
     key: 0,
     ref: "previewButton",
+    type: "button",
     "class": _ctx.cx('button'),
     onClick: _cache[1] || (_cache[1] = function () {
       return $options.onImageClick && $options.onImageClick.apply($options, arguments);
@@ -342,7 +345,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }),
         type: "button",
         "aria-label": $options.rightAriaLabel
-      }, _ctx.ptm('rotateRightButton')), [vue.renderSlot(_ctx.$slots, "refresh", {}, function () {
+      }, _ctx.ptm('rotateRightButton'), {
+        "data-pc-group-section": "action"
+      }), [vue.renderSlot(_ctx.$slots, "refresh", {}, function () {
         return [vue.createVNode(_component_RefreshIcon, vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('rotateRightIcon'))), null, 16)];
       })], 16, _hoisted_2), vue.createElementVNode("button", vue.mergeProps({
         "class": _ctx.cx('rotateLeftButton'),
@@ -351,7 +356,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }),
         type: "button",
         "aria-label": $options.leftAriaLabel
-      }, _ctx.ptm('rotateLeftButton')), [vue.renderSlot(_ctx.$slots, "undo", {}, function () {
+      }, _ctx.ptm('rotateLeftButton'), {
+        "data-pc-group-section": "action"
+      }), [vue.renderSlot(_ctx.$slots, "undo", {}, function () {
         return [vue.createVNode(_component_UndoIcon, vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('rotateLeftIcon'))), null, 16)];
       })], 16, _hoisted_3), vue.createElementVNode("button", vue.mergeProps({
         "class": _ctx.cx('zoomOutButton'),
@@ -361,7 +368,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         type: "button",
         disabled: $options.isZoomOutDisabled,
         "aria-label": $options.zoomOutAriaLabel
-      }, _ctx.ptm('zoomOutButton')), [vue.renderSlot(_ctx.$slots, "zoomout", {}, function () {
+      }, _ctx.ptm('zoomOutButton'), {
+        "data-pc-group-section": "action"
+      }), [vue.renderSlot(_ctx.$slots, "zoomout", {}, function () {
         return [vue.createVNode(_component_SearchMinusIcon, vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('zoomOutIcon'))), null, 16)];
       })], 16, _hoisted_4), vue.createElementVNode("button", vue.mergeProps({
         "class": _ctx.cx('zoomInButton'),
@@ -371,7 +380,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         type: "button",
         disabled: $options.isZoomInDisabled,
         "aria-label": $options.zoomInAriaLabel
-      }, _ctx.ptm('zoomInButton')), [vue.renderSlot(_ctx.$slots, "zoomin", {}, function () {
+      }, _ctx.ptm('zoomInButton'), {
+        "data-pc-group-section": "action"
+      }), [vue.renderSlot(_ctx.$slots, "zoomin", {}, function () {
         return [vue.createVNode(_component_SearchPlusIcon, vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('zoomInIcon'))), null, 16)];
       })], 16, _hoisted_5), vue.createElementVNode("button", vue.mergeProps({
         "class": _ctx.cx('closeButton'),
@@ -381,20 +392,23 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }),
         "aria-label": $options.closeAriaLabel,
         autofocus: ""
-      }, _ctx.ptm('closeButton')), [vue.renderSlot(_ctx.$slots, "close", {}, function () {
+      }, _ctx.ptm('closeButton'), {
+        "data-pc-group-section": "action"
+      }), [vue.renderSlot(_ctx.$slots, "close", {}, function () {
         return [vue.createVNode(_component_TimesIcon, vue.normalizeProps(vue.guardReactiveProps(_ctx.ptm('closeIcon'))), null, 16)];
-      })], 16, _hoisted_6)], 16), vue.createVNode(vue.Transition, {
+      })], 16, _hoisted_6)], 16), vue.createVNode(vue.Transition, vue.mergeProps({
         name: "p-image-preview",
         onBeforeEnter: $options.onBeforeEnter,
         onEnter: $options.onEnter,
         onLeave: $options.onLeave,
         onBeforeLeave: $options.onBeforeLeave,
         onAfterLeave: $options.onAfterLeave
-      }, {
+      }, _ctx.ptm('transition')), {
         "default": vue.withCtx(function () {
           return [$data.previewVisible ? (vue.openBlock(), vue.createElementBlock("div", vue.normalizeProps(vue.mergeProps({
             key: 0
           }, _ctx.ptm('previewContainer'))), [vue.renderSlot(_ctx.$slots, "preview", {
+            "class": vue.normalizeClass(_ctx.cx('preview')),
             style: vue.normalizeStyle($options.imagePreviewStyle),
             onClick: $options.onPreviewImageClick
           }, function () {
@@ -409,7 +423,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           })], 16)) : vue.createCommentVNode("", true)];
         }),
         _: 3
-      }, 8, ["onBeforeEnter", "onEnter", "onLeave", "onBeforeLeave", "onAfterLeave"])], 16, _hoisted_1)), [[_directive_focustrap]]) : vue.createCommentVNode("", true)];
+      }, 16, ["onBeforeEnter", "onEnter", "onLeave", "onBeforeLeave", "onAfterLeave"])], 16, _hoisted_1)), [[_directive_focustrap]]) : vue.createCommentVNode("", true)];
     }),
     _: 3
   })], 16);

package/image/image.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/focustrap"),t=require("primevue/icons/eye"),n=require("primevue/icons/refresh"),o=require("primevue/icons/searchminus"),i=require("primevue/icons/searchplus"),r=require("primevue/icons/times"),a=require("primevue/icons/undo"),l=require("primevue/portal"),s=require("primevue/utils"),c=require("primevue/basecomponent"),u=require("primevue/usestyle"),p=require("vue");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=m(e),v=m(t),d=m(n),g=m(o),b=m(i),h=m(r),y=m(a),w=m(l),k=m(c),P=u.useStyle("\n.p-image-mask {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-image-preview-container {\n    position: relative;\n    display: inline-block;\n}\n\n.p-image-preview-indicator {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: 0;\n    transition: opacity 0.3s;\n}\n\n.p-image-preview-container:hover > .p-image-preview-indicator {\n    opacity: 1;\n    cursor: pointer;\n}\n\n.p-image-preview-container > img {\n    cursor: pointer;\n}\n\n.p-image-toolbar {\n    position: absolute;\n    top: 0;\n    right: 0;\n    display: flex;\n}\n\n.p-image-action.p-link {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.p-image-preview {\n    transition: transform 0.15s;\n    max-width: 100vw;\n    max-height: 100vh;\n}\n\n.p-image-preview-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-image-preview-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-image-preview-enter-from,\n.p-image-preview-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n",{name:"image",manual:!0}),I={name:"Image",extends:{name:"BaseImage",extends:k.default,props:{preview:{type:Boolean,default:!1},class:{type:null,default:null},style:{type:null,default:null},imageStyle:{type:null,default:null},imageClass:{type:null,default:null},previewButtonProps:{type:null,default:null},indicatorIcon:{type:String,default:void 0},zoomInDisabled:{type:Boolean,default:!1},zoomOutDisabled:{type:Boolean,default:!1}},css:{classes:{root:function(e){return["p-image p-component",{"p-image-preview-container":e.props.preview}]},image:function(e){return e.props.image},button:"p-image-preview-indicator",icon:"p-image-preview-icon",mask:"p-image-mask p-component-overlay p-component-overlay-enter",rotateRightButton:"p-image-action p-link",rotateLeftButton:"p-image-action p-link",zoomOutButton:function(e){return["p-image-action p-link",{"p-disabled":e.instance.isZoomOutDisabled}]},zoomInButton:function(e){return["p-image-action p-link",{"p-disabled":e.instance.isZoomInDisabled}]},closeButton:"p-image-action p-link",preview:"p-image-preview"},loadStyle:P.load},provide:function(){return{$parentInstance:this}}},inheritAttrs:!1,emits:["show","hide","error"],mask:null,data:function(){return{maskVisible:!1,previewVisible:!1,rotate:0,scale:1}},beforeUnmount:function(){this.mask&&s.ZIndexUtils.clear(this.container)},methods:{maskRef:function(e){this.mask=e},toolbarRef:function(e){this.toolbarRef=e},onImageClick:function(){var e=this;this.preview&&(this.maskVisible=!0,setTimeout((function(){e.previewVisible=!0}),25))},onPreviewImageClick:function(){this.previewClick=!0},onMaskClick:function(e){[e.target.classList].includes("p-image-action")||e.target.closest(".p-image-action")||(this.previewClick||(this.previewVisible=!1,this.rotate=0,this.scale=1),this.previewClick=!1)},onMaskKeydown:function(e){var t=this;if("Escape"===e.code)this.hidePreview(),setTimeout((function(){s.DomHandler.focus(t.$refs.previewButton)}),200),e.preventDefault()},onError:function(){this.$emit("error")},rotateRight:function(){this.rotate+=90,this.previewClick=!0},rotateLeft:function(){this.rotate-=90,this.previewClick=!0},zoomIn:function(){this.scale=this.scale+.1,this.previewClick=!0},zoomOut:function(){this.scale=this.scale-.1,this.previewClick=!0},onBeforeEnter:function(){s.ZIndexUtils.set("modal",this.mask,this.$primevue.config.zIndex.modal)},onEnter:function(){this.focus(),this.$emit("show")},onBeforeLeave:function(){!this.isUnstyled&&s.DomHandler.addClass(this.mask,"p-component-overlay-leave")},onLeave:function(){this.$emit("hide")},onAfterLeave:function(e){s.ZIndexUtils.clear(e),this.maskVisible=!1},focus:function(){var e=this.mask.querySelector("[autofocus]");e&&e.focus()},hidePreview:function(){this.previewVisible=!1,this.rotate=0,this.scale=1}},computed:{containerClass:function(){return[this.cx("root"),this.class]},rotateClass:function(){return"p-image-preview-rotate-"+this.rotate},imagePreviewStyle:function(){return{transform:"rotate("+this.rotate+"deg) scale("+this.scale+")"}},isZoomInDisabled:function(){return this.zoomInDisabled||this.scale>=1.5},isZoomOutDisabled:function(){return this.zoomOutDisabled||this.scale<=.5},rightAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.rotateRight:void 0},leftAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.rotateLeft:void 0},zoomInAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.zoomIn:void 0},zoomOutAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.zoomOut:void 0},closeAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0}},components:{Portal:w.default,EyeIcon:v.default,RefreshIcon:d.default,UndoIcon:y.default,SearchMinusIcon:g.default,SearchPlusIcon:b.default,TimesIcon:h.default},directives:{focustrap:f.default}};function C(e){return C="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},C(e)}function B(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function z(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?B(Object(n),!0).forEach((function(t){O(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):B(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function O(e,t,n){return(t=E(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function E(e){var t=S(e,"string");return"symbol"===C(t)?t:String(t)}function S(e,t){if("object"!==C(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==C(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var L=["aria-modal"],V=["aria-label"],x=["aria-label"],$=["disabled","aria-label"],D=["disabled","aria-label"],N=["aria-label"],R=["src"];I.render=function(e,t,n,o,i,r){var a=p.resolveComponent("RefreshIcon"),l=p.resolveComponent("UndoIcon"),s=p.resolveComponent("SearchMinusIcon"),c=p.resolveComponent("SearchPlusIcon"),u=p.resolveComponent("TimesIcon"),m=p.resolveComponent("Portal"),f=p.resolveDirective("focustrap");return p.openBlock(),p.createElementBlock("span",p.mergeProps({class:r.containerClass,style:e.style},e.ptm("root"),{"data-pc-name":"image"}),[p.renderSlot(e.$slots,"image",{onError:r.onError},(function(){return[p.createElementVNode("img",p.mergeProps({style:e.imageStyle,class:[e.cx("image"),e.imageClass],onError:t[0]||(t[0]=function(){return r.onError&&r.onError.apply(r,arguments)})},z(z({},e.$attrs),e.ptm("image"))),null,16)]})),e.preview?(p.openBlock(),p.createElementBlock("button",p.mergeProps({key:0,ref:"previewButton",class:e.cx("button"),onClick:t[1]||(t[1]=function(){return r.onImageClick&&r.onImageClick.apply(r,arguments)})},z(z({},e.previewButtonProps),e.ptm("button"))),[p.renderSlot(e.$slots,"indicatoricon",{},(function(){return[(p.openBlock(),p.createBlock(p.resolveDynamicComponent(e.indicatorIcon?"i":"EyeIcon"),p.mergeProps({class:e.cx("icon")},e.ptm("icon")),null,16,["class"]))]}))],16)):p.createCommentVNode("",!0),p.createVNode(m,null,{default:p.withCtx((function(){return[i.maskVisible?p.withDirectives((p.openBlock(),p.createElementBlock("div",p.mergeProps({key:0,ref:r.maskRef,role:"dialog",class:e.cx("mask"),"aria-modal":i.maskVisible,onClick:t[8]||(t[8]=function(){return r.onMaskClick&&r.onMaskClick.apply(r,arguments)}),onKeydown:t[9]||(t[9]=function(){return r.onMaskKeydown&&r.onMaskKeydown.apply(r,arguments)})},e.ptm("mask")),[p.createElementVNode("div",p.mergeProps({class:"p-image-toolbar"},e.ptm("toolbar")),[p.createElementVNode("button",p.mergeProps({class:e.cx("rotateRightButton"),onClick:t[2]||(t[2]=function(){return r.rotateRight&&r.rotateRight.apply(r,arguments)}),type:"button","aria-label":r.rightAriaLabel},e.ptm("rotateRightButton")),[p.renderSlot(e.$slots,"refresh",{},(function(){return[p.createVNode(a,p.normalizeProps(p.guardReactiveProps(e.ptm("rotateRightIcon"))),null,16)]}))],16,V),p.createElementVNode("button",p.mergeProps({class:e.cx("rotateLeftButton"),onClick:t[3]||(t[3]=function(){return r.rotateLeft&&r.rotateLeft.apply(r,arguments)}),type:"button","aria-label":r.leftAriaLabel},e.ptm("rotateLeftButton")),[p.renderSlot(e.$slots,"undo",{},(function(){return[p.createVNode(l,p.normalizeProps(p.guardReactiveProps(e.ptm("rotateLeftIcon"))),null,16)]}))],16,x),p.createElementVNode("button",p.mergeProps({class:e.cx("zoomOutButton"),onClick:t[4]||(t[4]=function(){return r.zoomOut&&r.zoomOut.apply(r,arguments)}),type:"button",disabled:r.isZoomOutDisabled,"aria-label":r.zoomOutAriaLabel},e.ptm("zoomOutButton")),[p.renderSlot(e.$slots,"zoomout",{},(function(){return[p.createVNode(s,p.normalizeProps(p.guardReactiveProps(e.ptm("zoomOutIcon"))),null,16)]}))],16,$),p.createElementVNode("button",p.mergeProps({class:e.cx("zoomInButton"),onClick:t[5]||(t[5]=function(){return r.zoomIn&&r.zoomIn.apply(r,arguments)}),type:"button",disabled:r.isZoomInDisabled,"aria-label":r.zoomInAriaLabel},e.ptm("zoomInButton")),[p.renderSlot(e.$slots,"zoomin",{},(function(){return[p.createVNode(c,p.normalizeProps(p.guardReactiveProps(e.ptm("zoomInIcon"))),null,16)]}))],16,D),p.createElementVNode("button",p.mergeProps({class:e.cx("closeButton"),type:"button",onClick:t[6]||(t[6]=function(){return r.hidePreview&&r.hidePreview.apply(r,arguments)}),"aria-label":r.closeAriaLabel,autofocus:""},e.ptm("closeButton")),[p.renderSlot(e.$slots,"close",{},(function(){return[p.createVNode(u,p.normalizeProps(p.guardReactiveProps(e.ptm("closeIcon"))),null,16)]}))],16,N)],16),p.createVNode(p.Transition,{name:"p-image-preview",onBeforeEnter:r.onBeforeEnter,onEnter:r.onEnter,onLeave:r.onLeave,onBeforeLeave:r.onBeforeLeave,onAfterLeave:r.onAfterLeave},{default:p.withCtx((function(){return[i.previewVisible?(p.openBlock(),p.createElementBlock("div",p.normalizeProps(p.mergeProps({key:0},e.ptm("previewContainer"))),[p.renderSlot(e.$slots,"preview",{style:p.normalizeStyle(r.imagePreviewStyle),onClick:r.onPreviewImageClick},(function(){return[p.createElementVNode("img",p.mergeProps({src:e.$attrs.src,class:e.cx("preview"),style:r.imagePreviewStyle,onClick:t[7]||(t[7]=function(){return r.onPreviewImageClick&&r.onPreviewImageClick.apply(r,arguments)})},e.ptm("preview")),null,16,R)]}))],16)):p.createCommentVNode("",!0)]})),_:3},8,["onBeforeEnter","onEnter","onLeave","onBeforeLeave","onAfterLeave"])],16,L)),[[f]]):p.createCommentVNode("",!0)]})),_:3})],16)},module.exports=I;
+"use strict";var e=require("primevue/focustrap"),t=require("primevue/icons/eye"),o=require("primevue/icons/refresh"),n=require("primevue/icons/searchminus"),i=require("primevue/icons/searchplus"),r=require("primevue/icons/times"),a=require("primevue/icons/undo"),l=require("primevue/portal"),s=require("primevue/utils"),c=require("primevue/basecomponent"),u=require("primevue/usestyle"),p=require("vue");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=m(e),d=m(t),v=m(o),g=m(n),b=m(i),h=m(r),y=m(a),w=m(l),k=m(c),P=u.useStyle("\n.p-image-mask {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-image-preview-container {\n    position: relative;\n    display: inline-block;\n}\n\n.p-image-preview-indicator {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: 0;\n    transition: opacity 0.3s;\n}\n\n.p-image-preview-container:hover > .p-image-preview-indicator {\n    opacity: 1;\n    cursor: pointer;\n}\n\n.p-image-preview-container > img {\n    cursor: pointer;\n}\n\n.p-image-toolbar {\n    position: absolute;\n    top: 0;\n    right: 0;\n    display: flex;\n}\n\n.p-image-action.p-link {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.p-image-preview {\n    transition: transform 0.15s;\n    max-width: 100vw;\n    max-height: 100vh;\n}\n\n.p-image-preview-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-image-preview-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-image-preview-enter-from,\n.p-image-preview-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n",{name:"image",manual:!0}),C={name:"Image",extends:{name:"BaseImage",extends:k.default,props:{preview:{type:Boolean,default:!1},class:{type:null,default:null},style:{type:null,default:null},imageStyle:{type:null,default:null},imageClass:{type:null,default:null},previewButtonProps:{type:null,default:null},indicatorIcon:{type:String,default:void 0},zoomInDisabled:{type:Boolean,default:!1},zoomOutDisabled:{type:Boolean,default:!1}},css:{classes:{root:function(e){return["p-image p-component",{"p-image-preview-container":e.props.preview}]},image:function(e){return e.props.image},button:"p-image-preview-indicator",icon:"p-image-preview-icon",mask:"p-image-mask p-component-overlay p-component-overlay-enter",rotateRightButton:"p-image-action p-link",rotateLeftButton:"p-image-action p-link",zoomOutButton:function(e){return["p-image-action p-link",{"p-disabled":e.instance.isZoomOutDisabled}]},zoomInButton:function(e){return["p-image-action p-link",{"p-disabled":e.instance.isZoomInDisabled}]},closeButton:"p-image-action p-link",preview:"p-image-preview"},loadStyle:P.load},provide:function(){return{$parentInstance:this}}},inheritAttrs:!1,emits:["show","hide","error"],mask:null,data:function(){return{maskVisible:!1,previewVisible:!1,rotate:0,scale:1}},beforeUnmount:function(){this.mask&&s.ZIndexUtils.clear(this.container)},methods:{maskRef:function(e){this.mask=e},toolbarRef:function(e){this.toolbarRef=e},onImageClick:function(){var e=this;this.preview&&(s.DomHandler.addClass(document.body,"p-overflow-hidden"),this.maskVisible=!0,setTimeout((function(){e.previewVisible=!0}),25))},onPreviewImageClick:function(){this.previewClick=!0},onMaskClick:function(e){[e.target.classList].includes("p-image-action")||e.target.closest(".p-image-action")||(this.previewClick||(this.previewVisible=!1,this.rotate=0,this.scale=1),this.previewClick=!1)},onMaskKeydown:function(e){var t=this;if("Escape"===e.code)this.hidePreview(),setTimeout((function(){s.DomHandler.focus(t.$refs.previewButton)}),200),e.preventDefault()},onError:function(){this.$emit("error")},rotateRight:function(){this.rotate+=90,this.previewClick=!0},rotateLeft:function(){this.rotate-=90,this.previewClick=!0},zoomIn:function(){this.scale=this.scale+.1,this.previewClick=!0},zoomOut:function(){this.scale=this.scale-.1,this.previewClick=!0},onBeforeEnter:function(){s.ZIndexUtils.set("modal",this.mask,this.$primevue.config.zIndex.modal)},onEnter:function(){this.focus(),this.$emit("show")},onBeforeLeave:function(){!this.isUnstyled&&s.DomHandler.addClass(this.mask,"p-component-overlay-leave")},onLeave:function(){this.$emit("hide")},onAfterLeave:function(e){s.ZIndexUtils.clear(e),this.maskVisible=!1},focus:function(){var e=this.mask.querySelector("[autofocus]");e&&e.focus()},hidePreview:function(){this.previewVisible=!1,this.rotate=0,this.scale=1,s.DomHandler.removeClass(document.body,"p-overflow-hidden")}},computed:{containerClass:function(){return[this.cx("root"),this.class]},rotateClass:function(){return"p-image-preview-rotate-"+this.rotate},imagePreviewStyle:function(){return{transform:"rotate("+this.rotate+"deg) scale("+this.scale+")"}},isZoomInDisabled:function(){return this.zoomInDisabled||this.scale>=1.5},isZoomOutDisabled:function(){return this.zoomOutDisabled||this.scale<=.5},rightAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.rotateRight:void 0},leftAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.rotateLeft:void 0},zoomInAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.zoomIn:void 0},zoomOutAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.zoomOut:void 0},closeAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0}},components:{Portal:w.default,EyeIcon:d.default,RefreshIcon:v.default,UndoIcon:y.default,SearchMinusIcon:g.default,SearchPlusIcon:b.default,TimesIcon:h.default},directives:{focustrap:f.default}};function I(e){return I="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},I(e)}function B(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),o.push.apply(o,n)}return o}function z(e){for(var t=1;t<arguments.length;t++){var o=null!=arguments[t]?arguments[t]:{};t%2?B(Object(o),!0).forEach((function(t){O(e,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):B(Object(o)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(o,t))}))}return e}function O(e,t,o){return(t=E(t))in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function E(e){var t=S(e,"string");return"symbol"===I(t)?t:String(t)}function S(e,t){if("object"!==I(e)||null===e)return e;var o=e[Symbol.toPrimitive];if(void 0!==o){var n=o.call(e,t||"default");if("object"!==I(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var L=["aria-modal"],V=["aria-label"],x=["aria-label"],$=["disabled","aria-label"],D=["disabled","aria-label"],N=["aria-label"],R=["src"];C.render=function(e,t,o,n,i,r){var a=p.resolveComponent("RefreshIcon"),l=p.resolveComponent("UndoIcon"),s=p.resolveComponent("SearchMinusIcon"),c=p.resolveComponent("SearchPlusIcon"),u=p.resolveComponent("TimesIcon"),m=p.resolveComponent("Portal"),f=p.resolveDirective("focustrap");return p.openBlock(),p.createElementBlock("span",p.mergeProps({class:r.containerClass,style:e.style},e.ptm("root"),{"data-pc-name":"image"}),[p.renderSlot(e.$slots,"image",{onError:r.onError},(function(){return[p.createElementVNode("img",p.mergeProps({style:e.imageStyle,class:[e.cx("image"),e.imageClass],onError:t[0]||(t[0]=function(){return r.onError&&r.onError.apply(r,arguments)})},z(z({},e.$attrs),e.ptm("image"))),null,16)]})),e.preview?(p.openBlock(),p.createElementBlock("button",p.mergeProps({key:0,ref:"previewButton",type:"button",class:e.cx("button"),onClick:t[1]||(t[1]=function(){return r.onImageClick&&r.onImageClick.apply(r,arguments)})},z(z({},e.previewButtonProps),e.ptm("button"))),[p.renderSlot(e.$slots,"indicatoricon",{},(function(){return[(p.openBlock(),p.createBlock(p.resolveDynamicComponent(e.indicatorIcon?"i":"EyeIcon"),p.mergeProps({class:e.cx("icon")},e.ptm("icon")),null,16,["class"]))]}))],16)):p.createCommentVNode("",!0),p.createVNode(m,null,{default:p.withCtx((function(){return[i.maskVisible?p.withDirectives((p.openBlock(),p.createElementBlock("div",p.mergeProps({key:0,ref:r.maskRef,role:"dialog",class:e.cx("mask"),"aria-modal":i.maskVisible,onClick:t[8]||(t[8]=function(){return r.onMaskClick&&r.onMaskClick.apply(r,arguments)}),onKeydown:t[9]||(t[9]=function(){return r.onMaskKeydown&&r.onMaskKeydown.apply(r,arguments)})},e.ptm("mask")),[p.createElementVNode("div",p.mergeProps({class:"p-image-toolbar"},e.ptm("toolbar")),[p.createElementVNode("button",p.mergeProps({class:e.cx("rotateRightButton"),onClick:t[2]||(t[2]=function(){return r.rotateRight&&r.rotateRight.apply(r,arguments)}),type:"button","aria-label":r.rightAriaLabel},e.ptm("rotateRightButton"),{"data-pc-group-section":"action"}),[p.renderSlot(e.$slots,"refresh",{},(function(){return[p.createVNode(a,p.normalizeProps(p.guardReactiveProps(e.ptm("rotateRightIcon"))),null,16)]}))],16,V),p.createElementVNode("button",p.mergeProps({class:e.cx("rotateLeftButton"),onClick:t[3]||(t[3]=function(){return r.rotateLeft&&r.rotateLeft.apply(r,arguments)}),type:"button","aria-label":r.leftAriaLabel},e.ptm("rotateLeftButton"),{"data-pc-group-section":"action"}),[p.renderSlot(e.$slots,"undo",{},(function(){return[p.createVNode(l,p.normalizeProps(p.guardReactiveProps(e.ptm("rotateLeftIcon"))),null,16)]}))],16,x),p.createElementVNode("button",p.mergeProps({class:e.cx("zoomOutButton"),onClick:t[4]||(t[4]=function(){return r.zoomOut&&r.zoomOut.apply(r,arguments)}),type:"button",disabled:r.isZoomOutDisabled,"aria-label":r.zoomOutAriaLabel},e.ptm("zoomOutButton"),{"data-pc-group-section":"action"}),[p.renderSlot(e.$slots,"zoomout",{},(function(){return[p.createVNode(s,p.normalizeProps(p.guardReactiveProps(e.ptm("zoomOutIcon"))),null,16)]}))],16,$),p.createElementVNode("button",p.mergeProps({class:e.cx("zoomInButton"),onClick:t[5]||(t[5]=function(){return r.zoomIn&&r.zoomIn.apply(r,arguments)}),type:"button",disabled:r.isZoomInDisabled,"aria-label":r.zoomInAriaLabel},e.ptm("zoomInButton"),{"data-pc-group-section":"action"}),[p.renderSlot(e.$slots,"zoomin",{},(function(){return[p.createVNode(c,p.normalizeProps(p.guardReactiveProps(e.ptm("zoomInIcon"))),null,16)]}))],16,D),p.createElementVNode("button",p.mergeProps({class:e.cx("closeButton"),type:"button",onClick:t[6]||(t[6]=function(){return r.hidePreview&&r.hidePreview.apply(r,arguments)}),"aria-label":r.closeAriaLabel,autofocus:""},e.ptm("closeButton"),{"data-pc-group-section":"action"}),[p.renderSlot(e.$slots,"close",{},(function(){return[p.createVNode(u,p.normalizeProps(p.guardReactiveProps(e.ptm("closeIcon"))),null,16)]}))],16,N)],16),p.createVNode(p.Transition,p.mergeProps({name:"p-image-preview",onBeforeEnter:r.onBeforeEnter,onEnter:r.onEnter,onLeave:r.onLeave,onBeforeLeave:r.onBeforeLeave,onAfterLeave:r.onAfterLeave},e.ptm("transition")),{default:p.withCtx((function(){return[i.previewVisible?(p.openBlock(),p.createElementBlock("div",p.normalizeProps(p.mergeProps({key:0},e.ptm("previewContainer"))),[p.renderSlot(e.$slots,"preview",{class:p.normalizeClass(e.cx("preview")),style:p.normalizeStyle(r.imagePreviewStyle),onClick:r.onPreviewImageClick},(function(){return[p.createElementVNode("img",p.mergeProps({src:e.$attrs.src,class:e.cx("preview"),style:r.imagePreviewStyle,onClick:t[7]||(t[7]=function(){return r.onPreviewImageClick&&r.onPreviewImageClick.apply(r,arguments)})},e.ptm("preview")),null,16,R)]}))],16)):p.createCommentVNode("",!0)]})),_:3},16,["onBeforeEnter","onEnter","onLeave","onBeforeLeave","onAfterLeave"])],16,L)),[[f]]):p.createCommentVNode("",!0)]})),_:3})],16)},module.exports=C;

package/image/image.esm.js

@@ -9,7 +9,7 @@ import Portal from 'primevue/portal';
 import { ZIndexUtils, DomHandler } from 'primevue/utils';
 import BaseComponent from 'primevue/basecomponent';
 import { useStyle } from 'primevue/usestyle';
-import { resolveComponent, resolveDirective, openBlock, createElementBlock, mergeProps, renderSlot, createElementVNode, createBlock, resolveDynamicComponent, createCommentVNode, createVNode, withCtx, withDirectives, normalizeProps, guardReactiveProps, Transition, normalizeStyle } from 'vue';
+import { resolveComponent, resolveDirective, openBlock, createElementBlock, mergeProps, renderSlot, createElementVNode, createBlock, resolveDynamicComponent, createCommentVNode, createVNode, withCtx, withDirectives, normalizeProps, guardReactiveProps, Transition, normalizeClass, normalizeStyle } from 'vue';
 
 var styles = "\n.p-image-mask {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-image-preview-container {\n    position: relative;\n    display: inline-block;\n}\n\n.p-image-preview-indicator {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: 0;\n    transition: opacity 0.3s;\n}\n\n.p-image-preview-container:hover > .p-image-preview-indicator {\n    opacity: 1;\n    cursor: pointer;\n}\n\n.p-image-preview-container > img {\n    cursor: pointer;\n}\n\n.p-image-toolbar {\n    position: absolute;\n    top: 0;\n    right: 0;\n    display: flex;\n}\n\n.p-image-action.p-link {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.p-image-preview {\n    transition: transform 0.15s;\n    max-width: 100vw;\n    max-height: 100vh;\n}\n\n.p-image-preview-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-image-preview-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-image-preview-enter-from,\n.p-image-preview-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n";
 var classes = {
@@ -129,6 +129,7 @@ var script = {
     onImageClick: function onImageClick() {
       var _this = this;
       if (this.preview) {
+        DomHandler.addClass(document.body, 'p-overflow-hidden');
         this.maskVisible = true;
         setTimeout(function () {
           _this.previewVisible = true;
@@ -208,6 +209,7 @@ var script = {
       this.previewVisible = false;
       this.rotate = 0;
       this.scale = 1;
+      DomHandler.removeClass(document.body, 'p-overflow-hidden');
     }
   },
   computed: {
@@ -297,6 +299,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   }), _ctx.preview ? (openBlock(), createElementBlock("button", mergeProps({
     key: 0,
     ref: "previewButton",
+    type: "button",
     "class": _ctx.cx('button'),
     onClick: _cache[1] || (_cache[1] = function () {
       return $options.onImageClick && $options.onImageClick.apply($options, arguments);
@@ -328,7 +331,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }),
         type: "button",
         "aria-label": $options.rightAriaLabel
-      }, _ctx.ptm('rotateRightButton')), [renderSlot(_ctx.$slots, "refresh", {}, function () {
+      }, _ctx.ptm('rotateRightButton'), {
+        "data-pc-group-section": "action"
+      }), [renderSlot(_ctx.$slots, "refresh", {}, function () {
         return [createVNode(_component_RefreshIcon, normalizeProps(guardReactiveProps(_ctx.ptm('rotateRightIcon'))), null, 16)];
       })], 16, _hoisted_2), createElementVNode("button", mergeProps({
         "class": _ctx.cx('rotateLeftButton'),
@@ -337,7 +342,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }),
         type: "button",
         "aria-label": $options.leftAriaLabel
-      }, _ctx.ptm('rotateLeftButton')), [renderSlot(_ctx.$slots, "undo", {}, function () {
+      }, _ctx.ptm('rotateLeftButton'), {
+        "data-pc-group-section": "action"
+      }), [renderSlot(_ctx.$slots, "undo", {}, function () {
         return [createVNode(_component_UndoIcon, normalizeProps(guardReactiveProps(_ctx.ptm('rotateLeftIcon'))), null, 16)];
       })], 16, _hoisted_3), createElementVNode("button", mergeProps({
         "class": _ctx.cx('zoomOutButton'),
@@ -347,7 +354,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         type: "button",
         disabled: $options.isZoomOutDisabled,
         "aria-label": $options.zoomOutAriaLabel
-      }, _ctx.ptm('zoomOutButton')), [renderSlot(_ctx.$slots, "zoomout", {}, function () {
+      }, _ctx.ptm('zoomOutButton'), {
+        "data-pc-group-section": "action"
+      }), [renderSlot(_ctx.$slots, "zoomout", {}, function () {
         return [createVNode(_component_SearchMinusIcon, normalizeProps(guardReactiveProps(_ctx.ptm('zoomOutIcon'))), null, 16)];
       })], 16, _hoisted_4), createElementVNode("button", mergeProps({
         "class": _ctx.cx('zoomInButton'),
@@ -357,7 +366,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         type: "button",
         disabled: $options.isZoomInDisabled,
         "aria-label": $options.zoomInAriaLabel
-      }, _ctx.ptm('zoomInButton')), [renderSlot(_ctx.$slots, "zoomin", {}, function () {
+      }, _ctx.ptm('zoomInButton'), {
+        "data-pc-group-section": "action"
+      }), [renderSlot(_ctx.$slots, "zoomin", {}, function () {
         return [createVNode(_component_SearchPlusIcon, normalizeProps(guardReactiveProps(_ctx.ptm('zoomInIcon'))), null, 16)];
       })], 16, _hoisted_5), createElementVNode("button", mergeProps({
         "class": _ctx.cx('closeButton'),
@@ -367,20 +378,23 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }),
         "aria-label": $options.closeAriaLabel,
         autofocus: ""
-      }, _ctx.ptm('closeButton')), [renderSlot(_ctx.$slots, "close", {}, function () {
+      }, _ctx.ptm('closeButton'), {
+        "data-pc-group-section": "action"
+      }), [renderSlot(_ctx.$slots, "close", {}, function () {
         return [createVNode(_component_TimesIcon, normalizeProps(guardReactiveProps(_ctx.ptm('closeIcon'))), null, 16)];
-      })], 16, _hoisted_6)], 16), createVNode(Transition, {
+      })], 16, _hoisted_6)], 16), createVNode(Transition, mergeProps({
         name: "p-image-preview",
         onBeforeEnter: $options.onBeforeEnter,
         onEnter: $options.onEnter,
         onLeave: $options.onLeave,
         onBeforeLeave: $options.onBeforeLeave,
         onAfterLeave: $options.onAfterLeave
-      }, {
+      }, _ctx.ptm('transition')), {
         "default": withCtx(function () {
           return [$data.previewVisible ? (openBlock(), createElementBlock("div", normalizeProps(mergeProps({
             key: 0
           }, _ctx.ptm('previewContainer'))), [renderSlot(_ctx.$slots, "preview", {
+            "class": normalizeClass(_ctx.cx('preview')),
             style: normalizeStyle($options.imagePreviewStyle),
             onClick: $options.onPreviewImageClick
           }, function () {
@@ -395,7 +409,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           })], 16)) : createCommentVNode("", true)];
         }),
         _: 3
-      }, 8, ["onBeforeEnter", "onEnter", "onLeave", "onBeforeLeave", "onAfterLeave"])], 16, _hoisted_1)), [[_directive_focustrap]]) : createCommentVNode("", true)];
+      }, 16, ["onBeforeEnter", "onEnter", "onLeave", "onBeforeLeave", "onAfterLeave"])], 16, _hoisted_1)), [[_directive_focustrap]]) : createCommentVNode("", true)];
     }),
     _: 3
   })], 16);

package/image/image.esm.min.js

@@ -1 +1 @@
-import e from"primevue/focustrap";import t from"primevue/icons/eye";import n from"primevue/icons/refresh";import i from"primevue/icons/searchminus";import o from"primevue/icons/searchplus";import r from"primevue/icons/times";import a from"primevue/icons/undo";import l from"primevue/portal";import{ZIndexUtils as s,DomHandler as c}from"primevue/utils";import u from"primevue/basecomponent";import{useStyle as p}from"primevue/usestyle";import{resolveComponent as m,resolveDirective as f,openBlock as v,createElementBlock as b,mergeProps as h,renderSlot as g,createElementVNode as d,createBlock as y,resolveDynamicComponent as w,createCommentVNode as k,createVNode as I,withCtx as C,withDirectives as O,normalizeProps as B,guardReactiveProps as L,Transition as z,normalizeStyle as P}from"vue";var $=p("\n.p-image-mask {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-image-preview-container {\n    position: relative;\n    display: inline-block;\n}\n\n.p-image-preview-indicator {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: 0;\n    transition: opacity 0.3s;\n}\n\n.p-image-preview-container:hover > .p-image-preview-indicator {\n    opacity: 1;\n    cursor: pointer;\n}\n\n.p-image-preview-container > img {\n    cursor: pointer;\n}\n\n.p-image-toolbar {\n    position: absolute;\n    top: 0;\n    right: 0;\n    display: flex;\n}\n\n.p-image-action.p-link {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.p-image-preview {\n    transition: transform 0.15s;\n    max-width: 100vw;\n    max-height: 100vh;\n}\n\n.p-image-preview-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-image-preview-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-image-preview-enter-from,\n.p-image-preview-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n",{name:"image",manual:!0}),S={name:"Image",extends:{name:"BaseImage",extends:u,props:{preview:{type:Boolean,default:!1},class:{type:null,default:null},style:{type:null,default:null},imageStyle:{type:null,default:null},imageClass:{type:null,default:null},previewButtonProps:{type:null,default:null},indicatorIcon:{type:String,default:void 0},zoomInDisabled:{type:Boolean,default:!1},zoomOutDisabled:{type:Boolean,default:!1}},css:{classes:{root:function(e){return["p-image p-component",{"p-image-preview-container":e.props.preview}]},image:function(e){return e.props.image},button:"p-image-preview-indicator",icon:"p-image-preview-icon",mask:"p-image-mask p-component-overlay p-component-overlay-enter",rotateRightButton:"p-image-action p-link",rotateLeftButton:"p-image-action p-link",zoomOutButton:function(e){return["p-image-action p-link",{"p-disabled":e.instance.isZoomOutDisabled}]},zoomInButton:function(e){return["p-image-action p-link",{"p-disabled":e.instance.isZoomInDisabled}]},closeButton:"p-image-action p-link",preview:"p-image-preview"},loadStyle:$.load},provide:function(){return{$parentInstance:this}}},inheritAttrs:!1,emits:["show","hide","error"],mask:null,data:function(){return{maskVisible:!1,previewVisible:!1,rotate:0,scale:1}},beforeUnmount:function(){this.mask&&s.clear(this.container)},methods:{maskRef:function(e){this.mask=e},toolbarRef:function(e){this.toolbarRef=e},onImageClick:function(){var e=this;this.preview&&(this.maskVisible=!0,setTimeout((function(){e.previewVisible=!0}),25))},onPreviewImageClick:function(){this.previewClick=!0},onMaskClick:function(e){[e.target.classList].includes("p-image-action")||e.target.closest(".p-image-action")||(this.previewClick||(this.previewVisible=!1,this.rotate=0,this.scale=1),this.previewClick=!1)},onMaskKeydown:function(e){var t=this;if("Escape"===e.code)this.hidePreview(),setTimeout((function(){c.focus(t.$refs.previewButton)}),200),e.preventDefault()},onError:function(){this.$emit("error")},rotateRight:function(){this.rotate+=90,this.previewClick=!0},rotateLeft:function(){this.rotate-=90,this.previewClick=!0},zoomIn:function(){this.scale=this.scale+.1,this.previewClick=!0},zoomOut:function(){this.scale=this.scale-.1,this.previewClick=!0},onBeforeEnter:function(){s.set("modal",this.mask,this.$primevue.config.zIndex.modal)},onEnter:function(){this.focus(),this.$emit("show")},onBeforeLeave:function(){!this.isUnstyled&&c.addClass(this.mask,"p-component-overlay-leave")},onLeave:function(){this.$emit("hide")},onAfterLeave:function(e){s.clear(e),this.maskVisible=!1},focus:function(){var e=this.mask.querySelector("[autofocus]");e&&e.focus()},hidePreview:function(){this.previewVisible=!1,this.rotate=0,this.scale=1}},computed:{containerClass:function(){return[this.cx("root"),this.class]},rotateClass:function(){return"p-image-preview-rotate-"+this.rotate},imagePreviewStyle:function(){return{transform:"rotate("+this.rotate+"deg) scale("+this.scale+")"}},isZoomInDisabled:function(){return this.zoomInDisabled||this.scale>=1.5},isZoomOutDisabled:function(){return this.zoomOutDisabled||this.scale<=.5},rightAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.rotateRight:void 0},leftAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.rotateLeft:void 0},zoomInAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.zoomIn:void 0},zoomOutAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.zoomOut:void 0},closeAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0}},components:{Portal:l,EyeIcon:t,RefreshIcon:n,UndoIcon:a,SearchMinusIcon:i,SearchPlusIcon:o,TimesIcon:r},directives:{focustrap:e}};function x(e){return x="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},x(e)}function E(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,i)}return n}function j(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?E(Object(n),!0).forEach((function(t){A(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):E(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function A(e,t,n){return(t=D(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function D(e){var t=R(e,"string");return"symbol"===x(t)?t:String(t)}function R(e,t){if("object"!==x(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var i=n.call(e,t||"default");if("object"!==x(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var V=["aria-modal"],M=["aria-label"],Z=["aria-label"],T=["disabled","aria-label"],K=["disabled","aria-label"],U=["aria-label"],_=["src"];S.render=function(e,t,n,i,o,r){var a=m("RefreshIcon"),l=m("UndoIcon"),s=m("SearchMinusIcon"),c=m("SearchPlusIcon"),u=m("TimesIcon"),p=m("Portal"),$=f("focustrap");return v(),b("span",h({class:r.containerClass,style:e.style},e.ptm("root"),{"data-pc-name":"image"}),[g(e.$slots,"image",{onError:r.onError},(function(){return[d("img",h({style:e.imageStyle,class:[e.cx("image"),e.imageClass],onError:t[0]||(t[0]=function(){return r.onError&&r.onError.apply(r,arguments)})},j(j({},e.$attrs),e.ptm("image"))),null,16)]})),e.preview?(v(),b("button",h({key:0,ref:"previewButton",class:e.cx("button"),onClick:t[1]||(t[1]=function(){return r.onImageClick&&r.onImageClick.apply(r,arguments)})},j(j({},e.previewButtonProps),e.ptm("button"))),[g(e.$slots,"indicatoricon",{},(function(){return[(v(),y(w(e.indicatorIcon?"i":"EyeIcon"),h({class:e.cx("icon")},e.ptm("icon")),null,16,["class"]))]}))],16)):k("",!0),I(p,null,{default:C((function(){return[o.maskVisible?O((v(),b("div",h({key:0,ref:r.maskRef,role:"dialog",class:e.cx("mask"),"aria-modal":o.maskVisible,onClick:t[8]||(t[8]=function(){return r.onMaskClick&&r.onMaskClick.apply(r,arguments)}),onKeydown:t[9]||(t[9]=function(){return r.onMaskKeydown&&r.onMaskKeydown.apply(r,arguments)})},e.ptm("mask")),[d("div",h({class:"p-image-toolbar"},e.ptm("toolbar")),[d("button",h({class:e.cx("rotateRightButton"),onClick:t[2]||(t[2]=function(){return r.rotateRight&&r.rotateRight.apply(r,arguments)}),type:"button","aria-label":r.rightAriaLabel},e.ptm("rotateRightButton")),[g(e.$slots,"refresh",{},(function(){return[I(a,B(L(e.ptm("rotateRightIcon"))),null,16)]}))],16,M),d("button",h({class:e.cx("rotateLeftButton"),onClick:t[3]||(t[3]=function(){return r.rotateLeft&&r.rotateLeft.apply(r,arguments)}),type:"button","aria-label":r.leftAriaLabel},e.ptm("rotateLeftButton")),[g(e.$slots,"undo",{},(function(){return[I(l,B(L(e.ptm("rotateLeftIcon"))),null,16)]}))],16,Z),d("button",h({class:e.cx("zoomOutButton"),onClick:t[4]||(t[4]=function(){return r.zoomOut&&r.zoomOut.apply(r,arguments)}),type:"button",disabled:r.isZoomOutDisabled,"aria-label":r.zoomOutAriaLabel},e.ptm("zoomOutButton")),[g(e.$slots,"zoomout",{},(function(){return[I(s,B(L(e.ptm("zoomOutIcon"))),null,16)]}))],16,T),d("button",h({class:e.cx("zoomInButton"),onClick:t[5]||(t[5]=function(){return r.zoomIn&&r.zoomIn.apply(r,arguments)}),type:"button",disabled:r.isZoomInDisabled,"aria-label":r.zoomInAriaLabel},e.ptm("zoomInButton")),[g(e.$slots,"zoomin",{},(function(){return[I(c,B(L(e.ptm("zoomInIcon"))),null,16)]}))],16,K),d("button",h({class:e.cx("closeButton"),type:"button",onClick:t[6]||(t[6]=function(){return r.hidePreview&&r.hidePreview.apply(r,arguments)}),"aria-label":r.closeAriaLabel,autofocus:""},e.ptm("closeButton")),[g(e.$slots,"close",{},(function(){return[I(u,B(L(e.ptm("closeIcon"))),null,16)]}))],16,U)],16),I(z,{name:"p-image-preview",onBeforeEnter:r.onBeforeEnter,onEnter:r.onEnter,onLeave:r.onLeave,onBeforeLeave:r.onBeforeLeave,onAfterLeave:r.onAfterLeave},{default:C((function(){return[o.previewVisible?(v(),b("div",B(h({key:0},e.ptm("previewContainer"))),[g(e.$slots,"preview",{style:P(r.imagePreviewStyle),onClick:r.onPreviewImageClick},(function(){return[d("img",h({src:e.$attrs.src,class:e.cx("preview"),style:r.imagePreviewStyle,onClick:t[7]||(t[7]=function(){return r.onPreviewImageClick&&r.onPreviewImageClick.apply(r,arguments)})},e.ptm("preview")),null,16,_)]}))],16)):k("",!0)]})),_:3},8,["onBeforeEnter","onEnter","onLeave","onBeforeLeave","onAfterLeave"])],16,V)),[[$]]):k("",!0)]})),_:3})],16)};export{S as default};
+import e from"primevue/focustrap";import t from"primevue/icons/eye";import n from"primevue/icons/refresh";import o from"primevue/icons/searchminus";import i from"primevue/icons/searchplus";import r from"primevue/icons/times";import a from"primevue/icons/undo";import s from"primevue/portal";import{ZIndexUtils as l,DomHandler as c}from"primevue/utils";import u from"primevue/basecomponent";import{useStyle as p}from"primevue/usestyle";import{resolveComponent as m,resolveDirective as f,openBlock as v,createElementBlock as d,mergeProps as b,renderSlot as g,createElementVNode as h,createBlock as y,resolveDynamicComponent as w,createCommentVNode as k,createVNode as I,withCtx as C,withDirectives as O,normalizeProps as B,guardReactiveProps as L,Transition as z,normalizeClass as P,normalizeStyle as $}from"vue";var x=p("\n.p-image-mask {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-image-preview-container {\n    position: relative;\n    display: inline-block;\n}\n\n.p-image-preview-indicator {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: 0;\n    transition: opacity 0.3s;\n}\n\n.p-image-preview-container:hover > .p-image-preview-indicator {\n    opacity: 1;\n    cursor: pointer;\n}\n\n.p-image-preview-container > img {\n    cursor: pointer;\n}\n\n.p-image-toolbar {\n    position: absolute;\n    top: 0;\n    right: 0;\n    display: flex;\n}\n\n.p-image-action.p-link {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n\n.p-image-preview {\n    transition: transform 0.15s;\n    max-width: 100vw;\n    max-height: 100vh;\n}\n\n.p-image-preview-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-image-preview-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-image-preview-enter-from,\n.p-image-preview-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n",{name:"image",manual:!0}),S={name:"Image",extends:{name:"BaseImage",extends:u,props:{preview:{type:Boolean,default:!1},class:{type:null,default:null},style:{type:null,default:null},imageStyle:{type:null,default:null},imageClass:{type:null,default:null},previewButtonProps:{type:null,default:null},indicatorIcon:{type:String,default:void 0},zoomInDisabled:{type:Boolean,default:!1},zoomOutDisabled:{type:Boolean,default:!1}},css:{classes:{root:function(e){return["p-image p-component",{"p-image-preview-container":e.props.preview}]},image:function(e){return e.props.image},button:"p-image-preview-indicator",icon:"p-image-preview-icon",mask:"p-image-mask p-component-overlay p-component-overlay-enter",rotateRightButton:"p-image-action p-link",rotateLeftButton:"p-image-action p-link",zoomOutButton:function(e){return["p-image-action p-link",{"p-disabled":e.instance.isZoomOutDisabled}]},zoomInButton:function(e){return["p-image-action p-link",{"p-disabled":e.instance.isZoomInDisabled}]},closeButton:"p-image-action p-link",preview:"p-image-preview"},loadStyle:x.load},provide:function(){return{$parentInstance:this}}},inheritAttrs:!1,emits:["show","hide","error"],mask:null,data:function(){return{maskVisible:!1,previewVisible:!1,rotate:0,scale:1}},beforeUnmount:function(){this.mask&&l.clear(this.container)},methods:{maskRef:function(e){this.mask=e},toolbarRef:function(e){this.toolbarRef=e},onImageClick:function(){var e=this;this.preview&&(c.addClass(document.body,"p-overflow-hidden"),this.maskVisible=!0,setTimeout((function(){e.previewVisible=!0}),25))},onPreviewImageClick:function(){this.previewClick=!0},onMaskClick:function(e){[e.target.classList].includes("p-image-action")||e.target.closest(".p-image-action")||(this.previewClick||(this.previewVisible=!1,this.rotate=0,this.scale=1),this.previewClick=!1)},onMaskKeydown:function(e){var t=this;if("Escape"===e.code)this.hidePreview(),setTimeout((function(){c.focus(t.$refs.previewButton)}),200),e.preventDefault()},onError:function(){this.$emit("error")},rotateRight:function(){this.rotate+=90,this.previewClick=!0},rotateLeft:function(){this.rotate-=90,this.previewClick=!0},zoomIn:function(){this.scale=this.scale+.1,this.previewClick=!0},zoomOut:function(){this.scale=this.scale-.1,this.previewClick=!0},onBeforeEnter:function(){l.set("modal",this.mask,this.$primevue.config.zIndex.modal)},onEnter:function(){this.focus(),this.$emit("show")},onBeforeLeave:function(){!this.isUnstyled&&c.addClass(this.mask,"p-component-overlay-leave")},onLeave:function(){this.$emit("hide")},onAfterLeave:function(e){l.clear(e),this.maskVisible=!1},focus:function(){var e=this.mask.querySelector("[autofocus]");e&&e.focus()},hidePreview:function(){this.previewVisible=!1,this.rotate=0,this.scale=1,c.removeClass(document.body,"p-overflow-hidden")}},computed:{containerClass:function(){return[this.cx("root"),this.class]},rotateClass:function(){return"p-image-preview-rotate-"+this.rotate},imagePreviewStyle:function(){return{transform:"rotate("+this.rotate+"deg) scale("+this.scale+")"}},isZoomInDisabled:function(){return this.zoomInDisabled||this.scale>=1.5},isZoomOutDisabled:function(){return this.zoomOutDisabled||this.scale<=.5},rightAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.rotateRight:void 0},leftAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.rotateLeft:void 0},zoomInAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.zoomIn:void 0},zoomOutAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.zoomOut:void 0},closeAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0}},components:{Portal:s,EyeIcon:t,RefreshIcon:n,UndoIcon:a,SearchMinusIcon:o,SearchPlusIcon:i,TimesIcon:r},directives:{focustrap:e}};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 j(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function A(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?j(Object(n),!0).forEach((function(t){D(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):j(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function D(e,t,n){return(t=R(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function R(e){var t=V(e,"string");return"symbol"===E(t)?t:String(t)}function V(e,t){if("object"!==E(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==E(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var M=["aria-modal"],Z=["aria-label"],T=["aria-label"],K=["disabled","aria-label"],U=["disabled","aria-label"],_=["aria-label"],q=["src"];S.render=function(e,t,n,o,i,r){var a=m("RefreshIcon"),s=m("UndoIcon"),l=m("SearchMinusIcon"),c=m("SearchPlusIcon"),u=m("TimesIcon"),p=m("Portal"),x=f("focustrap");return v(),d("span",b({class:r.containerClass,style:e.style},e.ptm("root"),{"data-pc-name":"image"}),[g(e.$slots,"image",{onError:r.onError},(function(){return[h("img",b({style:e.imageStyle,class:[e.cx("image"),e.imageClass],onError:t[0]||(t[0]=function(){return r.onError&&r.onError.apply(r,arguments)})},A(A({},e.$attrs),e.ptm("image"))),null,16)]})),e.preview?(v(),d("button",b({key:0,ref:"previewButton",type:"button",class:e.cx("button"),onClick:t[1]||(t[1]=function(){return r.onImageClick&&r.onImageClick.apply(r,arguments)})},A(A({},e.previewButtonProps),e.ptm("button"))),[g(e.$slots,"indicatoricon",{},(function(){return[(v(),y(w(e.indicatorIcon?"i":"EyeIcon"),b({class:e.cx("icon")},e.ptm("icon")),null,16,["class"]))]}))],16)):k("",!0),I(p,null,{default:C((function(){return[i.maskVisible?O((v(),d("div",b({key:0,ref:r.maskRef,role:"dialog",class:e.cx("mask"),"aria-modal":i.maskVisible,onClick:t[8]||(t[8]=function(){return r.onMaskClick&&r.onMaskClick.apply(r,arguments)}),onKeydown:t[9]||(t[9]=function(){return r.onMaskKeydown&&r.onMaskKeydown.apply(r,arguments)})},e.ptm("mask")),[h("div",b({class:"p-image-toolbar"},e.ptm("toolbar")),[h("button",b({class:e.cx("rotateRightButton"),onClick:t[2]||(t[2]=function(){return r.rotateRight&&r.rotateRight.apply(r,arguments)}),type:"button","aria-label":r.rightAriaLabel},e.ptm("rotateRightButton"),{"data-pc-group-section":"action"}),[g(e.$slots,"refresh",{},(function(){return[I(a,B(L(e.ptm("rotateRightIcon"))),null,16)]}))],16,Z),h("button",b({class:e.cx("rotateLeftButton"),onClick:t[3]||(t[3]=function(){return r.rotateLeft&&r.rotateLeft.apply(r,arguments)}),type:"button","aria-label":r.leftAriaLabel},e.ptm("rotateLeftButton"),{"data-pc-group-section":"action"}),[g(e.$slots,"undo",{},(function(){return[I(s,B(L(e.ptm("rotateLeftIcon"))),null,16)]}))],16,T),h("button",b({class:e.cx("zoomOutButton"),onClick:t[4]||(t[4]=function(){return r.zoomOut&&r.zoomOut.apply(r,arguments)}),type:"button",disabled:r.isZoomOutDisabled,"aria-label":r.zoomOutAriaLabel},e.ptm("zoomOutButton"),{"data-pc-group-section":"action"}),[g(e.$slots,"zoomout",{},(function(){return[I(l,B(L(e.ptm("zoomOutIcon"))),null,16)]}))],16,K),h("button",b({class:e.cx("zoomInButton"),onClick:t[5]||(t[5]=function(){return r.zoomIn&&r.zoomIn.apply(r,arguments)}),type:"button",disabled:r.isZoomInDisabled,"aria-label":r.zoomInAriaLabel},e.ptm("zoomInButton"),{"data-pc-group-section":"action"}),[g(e.$slots,"zoomin",{},(function(){return[I(c,B(L(e.ptm("zoomInIcon"))),null,16)]}))],16,U),h("button",b({class:e.cx("closeButton"),type:"button",onClick:t[6]||(t[6]=function(){return r.hidePreview&&r.hidePreview.apply(r,arguments)}),"aria-label":r.closeAriaLabel,autofocus:""},e.ptm("closeButton"),{"data-pc-group-section":"action"}),[g(e.$slots,"close",{},(function(){return[I(u,B(L(e.ptm("closeIcon"))),null,16)]}))],16,_)],16),I(z,b({name:"p-image-preview",onBeforeEnter:r.onBeforeEnter,onEnter:r.onEnter,onLeave:r.onLeave,onBeforeLeave:r.onBeforeLeave,onAfterLeave:r.onAfterLeave},e.ptm("transition")),{default:C((function(){return[i.previewVisible?(v(),d("div",B(b({key:0},e.ptm("previewContainer"))),[g(e.$slots,"preview",{class:P(e.cx("preview")),style:$(r.imagePreviewStyle),onClick:r.onPreviewImageClick},(function(){return[h("img",b({src:e.$attrs.src,class:e.cx("preview"),style:r.imagePreviewStyle,onClick:t[7]||(t[7]=function(){return r.onPreviewImageClick&&r.onPreviewImageClick.apply(r,arguments)})},e.ptm("preview")),null,16,q)]}))],16)):k("",!0)]})),_:3},16,["onBeforeEnter","onEnter","onLeave","onBeforeLeave","onAfterLeave"])],16,M)),[[x]]):k("",!0)]})),_:3})],16)};export{S as default};