primevue 3.22.0 → 3.22.2

package/sidebar/sidebar.js

@@ -10,7 +10,8 @@ this.primevue.sidebar = (function (FocusTrap, Portal, Ripple, utils, vue) {
 
     var script = {
         name: 'Sidebar',
-        emits: ['update:visible', 'show', 'hide'],
+        inheritAttrs: false,
+        emits: ['update:visible', 'show', 'hide', 'after-hide'],
         props: {
             visible: {
                 type: Boolean,
@@ -46,67 +47,70 @@ this.primevue.sidebar = (function (FocusTrap, Portal, Ripple, utils, vue) {
             },
             blockScroll: {
                 type: Boolean,
-                default: true
+                default: false
             }
         },
+        data() {
+            return {
+                containerVisible: this.visible
+            };
+        },
         container: null,
+        mask: null,
         content: null,
         headerContainer: null,
         closeButton: null,
         outsideClickListener: null,
-        data() {
-            return {
-                maskVisible: false
-            };
-        },
-        watch: {
-            visible(newValue) {
-                this.maskVisible = newValue ? newValue : this.maskVisible;
+        updated() {
+            if (this.visible) {
+                this.containerVisible = this.visible;
             }
         },
         beforeUnmount() {
-            if (this.container && this.autoZIndex) {
-                utils.ZIndexUtils.clear(this.container);
+            this.disableDocumentSettings();
+
+            if (this.mask && this.autoZIndex) {
+                utils.ZIndexUtils.clear(this.mask);
             }
 
-            this.unbindOutsideClickListener();
             this.container = null;
+            this.mask = null;
         },
         methods: {
             hide() {
                 this.$emit('update:visible', false);
-
-                this.unbindOutsideClickListener();
-                this.blockScroll && utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
             },
             onEnter() {
                 this.$emit('show');
+                this.focus();
 
                 if (this.autoZIndex) {
-                    utils.ZIndexUtils.set('modal', this.$refs.mask, this.baseZIndex || this.$primevue.config.zIndex.modal);
+                    utils.ZIndexUtils.set('modal', this.mask, this.baseZIndex || this.$primevue.config.zIndex.modal);
+                }
+            },
+            onAfterEnter() {
+                this.enableDocumentSettings();
+            },
+            onBeforeLeave() {
+                if (this.modal) {
+                    utils.DomHandler.addClass(this.mask, 'p-component-overlay-leave');
                 }
-
-                this.maskVisible = true;
-                this.focus();
             },
             onLeave() {
-                utils.DomHandler.addClass(this.$refs.mask, 'p-component-overlay-leave');
-
                 this.$emit('hide');
-                this.unbindOutsideClickListener();
             },
             onAfterLeave() {
                 if (this.autoZIndex) {
                     utils.ZIndexUtils.clear(this.mask);
                 }
 
-                this.maskVisible = false;
+                this.containerVisible = false;
+                this.disableDocumentSettings();
+                this.$emit('after-hide');
             },
-            onAfterEnter() {
-                this.bindOutsideClickListener();
-
-                if (this.blockScroll) {
-                    utils.DomHandler.addClass(document.body, 'p-overflow-hidden');
+            onMaskClick(event) {
+                if (this.dismissable && this.modal && this.mask === event.target) {
+                    this.hide();
                 }
             },
             focus() {
@@ -126,19 +130,33 @@ this.primevue.sidebar = (function (FocusTrap, Portal, Ripple, utils, vue) {
 
                 focusTarget && focusTarget.focus();
             },
-            onKeydown(event) {
-                if (event.code === 'Escape') {
-                    this.hide();
+            enableDocumentSettings() {
+                if (this.dismissable && !this.modal) {
+                    this.bindOutsideClickListener();
+                }
+
+                if (this.blockScroll) {
+                    utils.DomHandler.addClass(document.body, 'p-overflow-hidden');
                 }
             },
-            onMaskClick(event) {
-                if (this.dismissable && this.modal && this.$refs.mask === event.target) {
+            disableDocumentSettings() {
+                this.unbindOutsideClickListener();
+
+                if (this.blockScroll) {
+                    utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
+                }
+            },
+            onKeydown(event) {
+                if (event.code === 'Escape') {
                     this.hide();
                 }
             },
             containerRef(el) {
                 this.container = el;
             },
+            maskRef(el) {
+                this.mask = el;
+            },
             contentRef(el) {
                 this.content = el;
             },
@@ -157,7 +175,7 @@ this.primevue.sidebar = (function (FocusTrap, Portal, Ripple, utils, vue) {
             bindOutsideClickListener() {
                 if (!this.outsideClickListener) {
                     this.outsideClickListener = (event) => {
-                        if (!this.modal && this.isOutsideClicked(event) && this.dismissable) {
+                        if (this.isOutsideClicked(event)) {
                             this.hide();
                         }
                     };
@@ -192,14 +210,14 @@ this.primevue.sidebar = (function (FocusTrap, Portal, Ripple, utils, vue) {
             closeAriaLabel() {
                 return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.close : undefined;
             },
-            maskClasses() {
+            maskClass() {
                 return [
                     'p-sidebar-mask',
                     this.getPositionClass(),
                     {
                         'p-component-overlay p-component-overlay-enter': this.modal,
                         'p-sidebar-mask-scrollblocker': this.blockScroll,
-                        'p-sidebar-visible': this.maskVisible,
+                        'p-sidebar-visible': this.containerVisible,
                         'p-sidebar-full': this.fullScreen
                     }
                 ];
@@ -228,71 +246,74 @@ this.primevue.sidebar = (function (FocusTrap, Portal, Ripple, utils, vue) {
 
       return (vue.openBlock(), vue.createBlock(_component_Portal, null, {
         default: vue.withCtx(() => [
-          vue.createElementVNode("div", {
-            ref: "mask",
-            style: {},
-            class: vue.normalizeClass($options.maskClasses),
-            onMousedown: _cache[2] || (_cache[2] = (...args) => ($options.onMaskClick && $options.onMaskClick(...args)))
-          }, [
-            vue.createVNode(vue.Transition, {
-              name: "p-sidebar",
-              onAfterEnter: $options.onAfterEnter,
-              onEnter: $options.onEnter,
-              onLeave: $options.onLeave,
-              onAfterLeave: $options.onAfterLeave,
-              appear: ""
-            }, {
-              default: vue.withCtx(() => [
-                ($props.visible)
-                  ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
-                      key: 0,
-                      ref: $options.containerRef,
-                      class: $options.containerClass,
-                      role: "complementary",
-                      "aria-modal": $props.modal,
-                      onKeydown: _cache[1] || (_cache[1] = (...args) => ($options.onKeydown && $options.onKeydown(...args)))
-                    }, _ctx.$attrs), [
-                      vue.createElementVNode("div", {
-                        ref: $options.headerContainerRef,
-                        class: "p-sidebar-header"
-                      }, [
-                        (_ctx.$slots.header)
-                          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
-                              vue.renderSlot(_ctx.$slots, "header")
-                            ]))
-                          : vue.createCommentVNode("", true),
-                        ($props.showCloseIcon)
-                          ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
-                              key: 1,
-                              ref: $options.closeButtonRef,
-                              autofocus: "",
-                              type: "button",
-                              class: "p-sidebar-close p-sidebar-icon p-link",
-                              "aria-label": $options.closeAriaLabel,
-                              onClick: _cache[0] || (_cache[0] = (...args) => ($options.hide && $options.hide(...args)))
-                            }, [
-                              vue.createElementVNode("span", {
-                                class: vue.normalizeClass(['p-sidebar-close-icon', $props.closeIcon])
-                              }, null, 2)
-                            ], 8, _hoisted_3)), [
-                              [_directive_ripple]
-                            ])
-                          : vue.createCommentVNode("", true)
-                      ], 512),
-                      vue.createElementVNode("div", {
-                        ref: $options.contentRef,
-                        class: "p-sidebar-content"
-                      }, [
-                        vue.renderSlot(_ctx.$slots, "default")
-                      ], 512)
-                    ], 16, _hoisted_1)), [
-                      [_directive_focustrap]
-                    ])
-                  : vue.createCommentVNode("", true)
-              ]),
-              _: 3
-            }, 8, ["onAfterEnter", "onEnter", "onLeave", "onAfterLeave"])
-          ], 34)
+          ($data.containerVisible)
+            ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 0,
+                ref: $options.maskRef,
+                class: vue.normalizeClass($options.maskClass),
+                onMousedown: _cache[2] || (_cache[2] = (...args) => ($options.onMaskClick && $options.onMaskClick(...args)))
+              }, [
+                vue.createVNode(vue.Transition, {
+                  name: "p-sidebar",
+                  onEnter: $options.onEnter,
+                  onAfterEnter: $options.onAfterEnter,
+                  onBeforeLeave: $options.onBeforeLeave,
+                  onLeave: $options.onLeave,
+                  onAfterLeave: $options.onAfterLeave,
+                  appear: ""
+                }, {
+                  default: vue.withCtx(() => [
+                    ($props.visible)
+                      ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+                          key: 0,
+                          ref: $options.containerRef,
+                          class: $options.containerClass,
+                          role: "complementary",
+                          "aria-modal": $props.modal,
+                          onKeydown: _cache[1] || (_cache[1] = (...args) => ($options.onKeydown && $options.onKeydown(...args)))
+                        }, _ctx.$attrs), [
+                          vue.createElementVNode("div", {
+                            ref: $options.headerContainerRef,
+                            class: "p-sidebar-header"
+                          }, [
+                            (_ctx.$slots.header)
+                              ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+                                  vue.renderSlot(_ctx.$slots, "header")
+                                ]))
+                              : vue.createCommentVNode("", true),
+                            ($props.showCloseIcon)
+                              ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", {
+                                  key: 1,
+                                  ref: $options.closeButtonRef,
+                                  autofocus: "",
+                                  type: "button",
+                                  class: "p-sidebar-close p-sidebar-icon p-link",
+                                  "aria-label": $options.closeAriaLabel,
+                                  onClick: _cache[0] || (_cache[0] = (...args) => ($options.hide && $options.hide(...args)))
+                                }, [
+                                  vue.createElementVNode("span", {
+                                    class: vue.normalizeClass(['p-sidebar-close-icon', $props.closeIcon])
+                                  }, null, 2)
+                                ], 8, _hoisted_3)), [
+                                  [_directive_ripple]
+                                ])
+                              : vue.createCommentVNode("", true)
+                          ], 512),
+                          vue.createElementVNode("div", {
+                            ref: $options.contentRef,
+                            class: "p-sidebar-content"
+                          }, [
+                            vue.renderSlot(_ctx.$slots, "default")
+                          ], 512)
+                        ], 16, _hoisted_1)), [
+                          [_directive_focustrap]
+                        ])
+                      : vue.createCommentVNode("", true)
+                  ]),
+                  _: 3
+                }, 8, ["onEnter", "onAfterEnter", "onBeforeLeave", "onLeave", "onAfterLeave"])
+              ], 34))
+            : vue.createCommentVNode("", true)
         ]),
         _: 3
       }))
@@ -325,7 +346,7 @@ this.primevue.sidebar = (function (FocusTrap, Portal, Ripple, utils, vue) {
       }
     }
 
-    var css_248z = "\n.p-sidebar-mask {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    display: none;\n    justify-content: center;\n    align-items: center;\n    pointer-events: none;\n    background-color: transparent;\n    transition-property: background-color;\n}\n.p-sidebar-visible {\n    display: flex;\n}\n.p-sidebar-mask.p-component-overlay {\n    pointer-events: auto;\n}\n.p-sidebar {\n    display: flex;\n    flex-direction: column;\n    pointer-events: auto;\n    transform: translate3d(0px, 0px, 0px);\n    position: relative;\n    transition: transform 0.3s;\n}\n.p-sidebar-content {\n    overflow-y: auto;\n    flex-grow: 1;\n}\n.p-sidebar-header {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    flex-shrink: 0;\n}\n.p-sidebar-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-sidebar-full .p-sidebar {\n    transition: none;\n    transform: none;\n    width: 100vw !important;\n    height: 100vh !important;\n    max-height: 100%;\n    top: 0px !important;\n    left: 0px !important;\n}\n\n/* Animation */\n/* Center */\n.p-sidebar-left .p-sidebar-enter-from,\n.p-sidebar-left .p-sidebar-leave-to {\n    transform: translateX(-100%);\n}\n.p-sidebar-right .p-sidebar-enter-from,\n.p-sidebar-right .p-sidebar-leave-to {\n    transform: translateX(100%);\n}\n.p-sidebar-top .p-sidebar-enter-from,\n.p-sidebar-top .p-sidebar-leave-to {\n    transform: translateY(-100%);\n}\n.p-sidebar-bottom .p-sidebar-enter-from,\n.p-sidebar-bottom .p-sidebar-leave-to {\n    transform: translateY(100%);\n}\n.p-sidebar-full .p-sidebar-enter-from,\n.p-sidebar-full .p-sidebar-leave-to {\n    opacity: 0;\n}\n.p-sidebar-full .p-sidebar-enter-active,\n.p-sidebar-full .p-sidebar-leave-active {\n    transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n\n/* Position */\n.p-sidebar-left {\n    justify-content: flex-start;\n}\n.p-sidebar-right {\n    justify-content: flex-end;\n}\n.p-sidebar-top {\n    align-items: flex-start;\n}\n.p-sidebar-bottom {\n    align-items: flex-end;\n}\n\n/* Size */\n.p-sidebar-left .p-sidebar {\n    width: 20rem;\n    height: 100%;\n}\n.p-sidebar-right .p-sidebar {\n    width: 20rem;\n    height: 100%;\n}\n.p-sidebar-top .p-sidebar {\n    height: 10rem;\n    width: 100%;\n}\n.p-sidebar-bottom .p-sidebar {\n    height: 10rem;\n    width: 100%;\n}\n.p-sidebar-left .p-sidebar-sm,\n.p-sidebar-right .p-sidebar-sm {\n    width: 20rem;\n}\n.p-sidebar-left .p-sidebar-md,\n.p-sidebar-right .p-sidebar-md {\n    width: 40rem;\n}\n.p-sidebar-left .p-sidebar-lg,\n.p-sidebar-right .p-sidebar-lg {\n    width: 60rem;\n}\n.p-sidebar-top .p-sidebar-sm,\n.p-sidebar-bottom .p-sidebar-sm {\n    height: 10rem;\n}\n.p-sidebar-top .p-sidebar-md,\n.p-sidebar-bottom .p-sidebar-md {\n    height: 20rem;\n}\n.p-sidebar-top .p-sidebar-lg,\n.p-sidebar-bottom .p-sidebar-lg {\n    height: 30rem;\n}\n.p-sidebar-left .p-sidebar-view,\n.p-sidebar-right .p-sidebar-view,\n.p-sidebar-top .p-sidebar-view,\n.p-sidebar-bottom .p-sidebar-view {\n    width: 100%;\n    height: 100%;\n}\n.p-sidebar-left .p-sidebar-content,\n.p-sidebar-right .p-sidebar-content,\n.p-sidebar-top .p-sidebar-content,\n.p-sidebar-bottom .p-sidebar-content {\n    width: 100%;\n    height: 100%;\n}\n@media screen and (max-width: 64em) {\n.p-sidebar-left .p-sidebar-lg,\n    .p-sidebar-left .p-sidebar-md,\n    .p-sidebar-right .p-sidebar-lg,\n    .p-sidebar-right .p-sidebar-md {\n        width: 20rem;\n}\n}\n";
+    var css_248z = "\n.p-sidebar-mask {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    display: none;\n    justify-content: center;\n    align-items: center;\n    pointer-events: none;\n    background-color: transparent;\n    transition-property: background-color;\n}\n.p-sidebar-mask.p-component-overlay {\n    pointer-events: auto;\n}\n.p-sidebar-visible {\n    display: flex;\n}\n.p-sidebar {\n    display: flex;\n    flex-direction: column;\n    pointer-events: auto;\n    transform: translate3d(0px, 0px, 0px);\n    position: relative;\n    transition: transform 0.3s;\n}\n.p-sidebar-content {\n    overflow-y: auto;\n    flex-grow: 1;\n}\n.p-sidebar-header {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    flex-shrink: 0;\n}\n.p-sidebar-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-sidebar-full .p-sidebar {\n    transition: none;\n    transform: none;\n    width: 100vw !important;\n    height: 100vh !important;\n    max-height: 100%;\n    top: 0px !important;\n    left: 0px !important;\n}\n\n/* Animation */\n/* Center */\n.p-sidebar-left .p-sidebar-enter-from,\n.p-sidebar-left .p-sidebar-leave-to {\n    transform: translateX(-100%);\n}\n.p-sidebar-right .p-sidebar-enter-from,\n.p-sidebar-right .p-sidebar-leave-to {\n    transform: translateX(100%);\n}\n.p-sidebar-top .p-sidebar-enter-from,\n.p-sidebar-top .p-sidebar-leave-to {\n    transform: translateY(-100%);\n}\n.p-sidebar-bottom .p-sidebar-enter-from,\n.p-sidebar-bottom .p-sidebar-leave-to {\n    transform: translateY(100%);\n}\n.p-sidebar-full .p-sidebar-enter-from,\n.p-sidebar-full .p-sidebar-leave-to {\n    opacity: 0;\n}\n.p-sidebar-full .p-sidebar-enter-active,\n.p-sidebar-full .p-sidebar-leave-active {\n    transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n\n/* Position */\n.p-sidebar-left {\n    justify-content: flex-start;\n}\n.p-sidebar-right {\n    justify-content: flex-end;\n}\n.p-sidebar-top {\n    align-items: flex-start;\n}\n.p-sidebar-bottom {\n    align-items: flex-end;\n}\n\n/* Size */\n.p-sidebar-left .p-sidebar {\n    width: 20rem;\n    height: 100%;\n}\n.p-sidebar-right .p-sidebar {\n    width: 20rem;\n    height: 100%;\n}\n.p-sidebar-top .p-sidebar {\n    height: 10rem;\n    width: 100%;\n}\n.p-sidebar-bottom .p-sidebar {\n    height: 10rem;\n    width: 100%;\n}\n.p-sidebar-left .p-sidebar-sm,\n.p-sidebar-right .p-sidebar-sm {\n    width: 20rem;\n}\n.p-sidebar-left .p-sidebar-md,\n.p-sidebar-right .p-sidebar-md {\n    width: 40rem;\n}\n.p-sidebar-left .p-sidebar-lg,\n.p-sidebar-right .p-sidebar-lg {\n    width: 60rem;\n}\n.p-sidebar-top .p-sidebar-sm,\n.p-sidebar-bottom .p-sidebar-sm {\n    height: 10rem;\n}\n.p-sidebar-top .p-sidebar-md,\n.p-sidebar-bottom .p-sidebar-md {\n    height: 20rem;\n}\n.p-sidebar-top .p-sidebar-lg,\n.p-sidebar-bottom .p-sidebar-lg {\n    height: 30rem;\n}\n.p-sidebar-left .p-sidebar-content,\n.p-sidebar-right .p-sidebar-content,\n.p-sidebar-top .p-sidebar-content,\n.p-sidebar-bottom .p-sidebar-content {\n    width: 100%;\n    height: 100%;\n}\n@media screen and (max-width: 64em) {\n.p-sidebar-left .p-sidebar-lg,\n    .p-sidebar-left .p-sidebar-md,\n    .p-sidebar-right .p-sidebar-lg,\n    .p-sidebar-right .p-sidebar-md {\n        width: 20rem;\n}\n}\n";
     styleInject(css_248z);
 
     script.render = render;

package/sidebar/sidebar.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.sidebar=function(e,t,n,i,s){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=r(e),o=r(t),l=r(n),d={name:"Sidebar",emits:["update:visible","show","hide"],props:{visible:{type:Boolean,default:!1},position:{type:String,default:"left"},baseZIndex:{type:Number,default:0},autoZIndex:{type:Boolean,default:!0},dismissable:{type:Boolean,default:!0},showCloseIcon:{type:Boolean,default:!0},closeIcon:{type:String,default:"pi pi-times"},modal:{type:Boolean,default:!0},blockScroll:{type:Boolean,default:!0}},container:null,content:null,headerContainer:null,closeButton:null,outsideClickListener:null,data:()=>({maskVisible:!1}),watch:{visible(e){this.maskVisible=e||this.maskVisible}},beforeUnmount(){this.container&&this.autoZIndex&&i.ZIndexUtils.clear(this.container),this.unbindOutsideClickListener(),this.container=null},methods:{hide(){this.$emit("update:visible",!1),this.unbindOutsideClickListener(),this.blockScroll&&i.DomHandler.removeClass(document.body,"p-overflow-hidden")},onEnter(){this.$emit("show"),this.autoZIndex&&i.ZIndexUtils.set("modal",this.$refs.mask,this.baseZIndex||this.$primevue.config.zIndex.modal),this.maskVisible=!0,this.focus()},onLeave(){i.DomHandler.addClass(this.$refs.mask,"p-component-overlay-leave"),this.$emit("hide"),this.unbindOutsideClickListener()},onAfterLeave(){this.autoZIndex&&i.ZIndexUtils.clear(this.mask),this.maskVisible=!1},onAfterEnter(){this.bindOutsideClickListener(),this.blockScroll&&i.DomHandler.addClass(document.body,"p-overflow-hidden")},focus(){const e=e=>e.querySelector("[autofocus]");let t=this.$slots.default&&e(this.content);t||(t=this.$slots.header&&e(this.headerContainer),t||(t=e(this.container))),t&&t.focus()},onKeydown(e){"Escape"===e.code&&this.hide()},onMaskClick(e){this.dismissable&&this.modal&&this.$refs.mask===e.target&&this.hide()},containerRef(e){this.container=e},contentRef(e){this.content=e},headerContainerRef(e){this.headerContainer=e},closeButtonRef(e){this.closeButton=e},getPositionClass(){const e=["left","right","top","bottom"].find((e=>e===this.position));return e?`p-sidebar-${e}`:""},bindOutsideClickListener(){this.outsideClickListener||(this.outsideClickListener=e=>{!this.modal&&this.isOutsideClicked(e)&&this.dismissable&&this.hide()},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},isOutsideClicked(e){return this.container&&!this.container.contains(e.target)}},computed:{containerClass(){return["p-sidebar p-component",{"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple,"p-sidebar-full":this.fullScreen}]},fullScreen(){return"full"===this.position},closeAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0},maskClasses(){return["p-sidebar-mask",this.getPositionClass(),{"p-component-overlay p-component-overlay-enter":this.modal,"p-sidebar-mask-scrollblocker":this.blockScroll,"p-sidebar-visible":this.maskVisible,"p-sidebar-full":this.fullScreen}]}},directives:{focustrap:a.default,ripple:l.default},components:{Portal:o.default}};const p=["aria-modal"],c={key:0,class:"p-sidebar-header-content"},b=["aria-label"];return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===n&&i.firstChild?i.insertBefore(s,i.firstChild):i.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-sidebar-mask {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    display: none;\n    justify-content: center;\n    align-items: center;\n    pointer-events: none;\n    background-color: transparent;\n    transition-property: background-color;\n}\n.p-sidebar-visible {\n    display: flex;\n}\n.p-sidebar-mask.p-component-overlay {\n    pointer-events: auto;\n}\n.p-sidebar {\n    display: flex;\n    flex-direction: column;\n    pointer-events: auto;\n    transform: translate3d(0px, 0px, 0px);\n    position: relative;\n    transition: transform 0.3s;\n}\n.p-sidebar-content {\n    overflow-y: auto;\n    flex-grow: 1;\n}\n.p-sidebar-header {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    flex-shrink: 0;\n}\n.p-sidebar-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-sidebar-full .p-sidebar {\n    transition: none;\n    transform: none;\n    width: 100vw !important;\n    height: 100vh !important;\n    max-height: 100%;\n    top: 0px !important;\n    left: 0px !important;\n}\n\n/* Animation */\n/* Center */\n.p-sidebar-left .p-sidebar-enter-from,\n.p-sidebar-left .p-sidebar-leave-to {\n    transform: translateX(-100%);\n}\n.p-sidebar-right .p-sidebar-enter-from,\n.p-sidebar-right .p-sidebar-leave-to {\n    transform: translateX(100%);\n}\n.p-sidebar-top .p-sidebar-enter-from,\n.p-sidebar-top .p-sidebar-leave-to {\n    transform: translateY(-100%);\n}\n.p-sidebar-bottom .p-sidebar-enter-from,\n.p-sidebar-bottom .p-sidebar-leave-to {\n    transform: translateY(100%);\n}\n.p-sidebar-full .p-sidebar-enter-from,\n.p-sidebar-full .p-sidebar-leave-to {\n    opacity: 0;\n}\n.p-sidebar-full .p-sidebar-enter-active,\n.p-sidebar-full .p-sidebar-leave-active {\n    transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n\n/* Position */\n.p-sidebar-left {\n    justify-content: flex-start;\n}\n.p-sidebar-right {\n    justify-content: flex-end;\n}\n.p-sidebar-top {\n    align-items: flex-start;\n}\n.p-sidebar-bottom {\n    align-items: flex-end;\n}\n\n/* Size */\n.p-sidebar-left .p-sidebar {\n    width: 20rem;\n    height: 100%;\n}\n.p-sidebar-right .p-sidebar {\n    width: 20rem;\n    height: 100%;\n}\n.p-sidebar-top .p-sidebar {\n    height: 10rem;\n    width: 100%;\n}\n.p-sidebar-bottom .p-sidebar {\n    height: 10rem;\n    width: 100%;\n}\n.p-sidebar-left .p-sidebar-sm,\n.p-sidebar-right .p-sidebar-sm {\n    width: 20rem;\n}\n.p-sidebar-left .p-sidebar-md,\n.p-sidebar-right .p-sidebar-md {\n    width: 40rem;\n}\n.p-sidebar-left .p-sidebar-lg,\n.p-sidebar-right .p-sidebar-lg {\n    width: 60rem;\n}\n.p-sidebar-top .p-sidebar-sm,\n.p-sidebar-bottom .p-sidebar-sm {\n    height: 10rem;\n}\n.p-sidebar-top .p-sidebar-md,\n.p-sidebar-bottom .p-sidebar-md {\n    height: 20rem;\n}\n.p-sidebar-top .p-sidebar-lg,\n.p-sidebar-bottom .p-sidebar-lg {\n    height: 30rem;\n}\n.p-sidebar-left .p-sidebar-view,\n.p-sidebar-right .p-sidebar-view,\n.p-sidebar-top .p-sidebar-view,\n.p-sidebar-bottom .p-sidebar-view {\n    width: 100%;\n    height: 100%;\n}\n.p-sidebar-left .p-sidebar-content,\n.p-sidebar-right .p-sidebar-content,\n.p-sidebar-top .p-sidebar-content,\n.p-sidebar-bottom .p-sidebar-content {\n    width: 100%;\n    height: 100%;\n}\n@media screen and (max-width: 64em) {\n.p-sidebar-left .p-sidebar-lg,\n    .p-sidebar-left .p-sidebar-md,\n    .p-sidebar-right .p-sidebar-lg,\n    .p-sidebar-right .p-sidebar-md {\n        width: 20rem;\n}\n}\n"),d.render=function(e,t,n,i,r,a){const o=s.resolveComponent("Portal"),l=s.resolveDirective("ripple"),d=s.resolveDirective("focustrap");return s.openBlock(),s.createBlock(o,null,{default:s.withCtx((()=>[s.createElementVNode("div",{ref:"mask",style:{},class:s.normalizeClass(a.maskClasses),onMousedown:t[2]||(t[2]=(...e)=>a.onMaskClick&&a.onMaskClick(...e))},[s.createVNode(s.Transition,{name:"p-sidebar",onAfterEnter:a.onAfterEnter,onEnter:a.onEnter,onLeave:a.onLeave,onAfterLeave:a.onAfterLeave,appear:""},{default:s.withCtx((()=>[n.visible?s.withDirectives((s.openBlock(),s.createElementBlock("div",s.mergeProps({key:0,ref:a.containerRef,class:a.containerClass,role:"complementary","aria-modal":n.modal,onKeydown:t[1]||(t[1]=(...e)=>a.onKeydown&&a.onKeydown(...e))},e.$attrs),[s.createElementVNode("div",{ref:a.headerContainerRef,class:"p-sidebar-header"},[e.$slots.header?(s.openBlock(),s.createElementBlock("div",c,[s.renderSlot(e.$slots,"header")])):s.createCommentVNode("",!0),n.showCloseIcon?s.withDirectives((s.openBlock(),s.createElementBlock("button",{key:1,ref:a.closeButtonRef,autofocus:"",type:"button",class:"p-sidebar-close p-sidebar-icon p-link","aria-label":a.closeAriaLabel,onClick:t[0]||(t[0]=(...e)=>a.hide&&a.hide(...e))},[s.createElementVNode("span",{class:s.normalizeClass(["p-sidebar-close-icon",n.closeIcon])},null,2)],8,b)),[[l]]):s.createCommentVNode("",!0)],512),s.createElementVNode("div",{ref:a.contentRef,class:"p-sidebar-content"},[s.renderSlot(e.$slots,"default")],512)],16,p)),[[d]]):s.createCommentVNode("",!0)])),_:3},8,["onAfterEnter","onEnter","onLeave","onAfterLeave"])],34)])),_:3})},d}(primevue.focustrap,primevue.portal,primevue.ripple,primevue.utils,Vue);
+this.primevue=this.primevue||{},this.primevue.sidebar=function(e,t,n,i,s){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=r(e),o=r(t),l=r(n),d={name:"Sidebar",inheritAttrs:!1,emits:["update:visible","show","hide","after-hide"],props:{visible:{type:Boolean,default:!1},position:{type:String,default:"left"},baseZIndex:{type:Number,default:0},autoZIndex:{type:Boolean,default:!0},dismissable:{type:Boolean,default:!0},showCloseIcon:{type:Boolean,default:!0},closeIcon:{type:String,default:"pi pi-times"},modal:{type:Boolean,default:!0},blockScroll:{type:Boolean,default:!1}},data(){return{containerVisible:this.visible}},container:null,mask:null,content:null,headerContainer:null,closeButton:null,outsideClickListener:null,updated(){this.visible&&(this.containerVisible=this.visible)},beforeUnmount(){this.disableDocumentSettings(),this.mask&&this.autoZIndex&&i.ZIndexUtils.clear(this.mask),this.container=null,this.mask=null},methods:{hide(){this.$emit("update:visible",!1)},onEnter(){this.$emit("show"),this.focus(),this.autoZIndex&&i.ZIndexUtils.set("modal",this.mask,this.baseZIndex||this.$primevue.config.zIndex.modal)},onAfterEnter(){this.enableDocumentSettings()},onBeforeLeave(){this.modal&&i.DomHandler.addClass(this.mask,"p-component-overlay-leave")},onLeave(){this.$emit("hide")},onAfterLeave(){this.autoZIndex&&i.ZIndexUtils.clear(this.mask),this.containerVisible=!1,this.disableDocumentSettings(),this.$emit("after-hide")},onMaskClick(e){this.dismissable&&this.modal&&this.mask===e.target&&this.hide()},focus(){const e=e=>e.querySelector("[autofocus]");let t=this.$slots.default&&e(this.content);t||(t=this.$slots.header&&e(this.headerContainer),t||(t=e(this.container))),t&&t.focus()},enableDocumentSettings(){this.dismissable&&!this.modal&&this.bindOutsideClickListener(),this.blockScroll&&i.DomHandler.addClass(document.body,"p-overflow-hidden")},disableDocumentSettings(){this.unbindOutsideClickListener(),this.blockScroll&&i.DomHandler.removeClass(document.body,"p-overflow-hidden")},onKeydown(e){"Escape"===e.code&&this.hide()},containerRef(e){this.container=e},maskRef(e){this.mask=e},contentRef(e){this.content=e},headerContainerRef(e){this.headerContainer=e},closeButtonRef(e){this.closeButton=e},getPositionClass(){const e=["left","right","top","bottom"].find((e=>e===this.position));return e?`p-sidebar-${e}`:""},bindOutsideClickListener(){this.outsideClickListener||(this.outsideClickListener=e=>{this.isOutsideClicked(e)&&this.hide()},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},isOutsideClicked(e){return this.container&&!this.container.contains(e.target)}},computed:{containerClass(){return["p-sidebar p-component",{"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple,"p-sidebar-full":this.fullScreen}]},fullScreen(){return"full"===this.position},closeAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0},maskClass(){return["p-sidebar-mask",this.getPositionClass(),{"p-component-overlay p-component-overlay-enter":this.modal,"p-sidebar-mask-scrollblocker":this.blockScroll,"p-sidebar-visible":this.containerVisible,"p-sidebar-full":this.fullScreen}]}},directives:{focustrap:a.default,ripple:l.default},components:{Portal:o.default}};const p=["aria-modal"],c={key:0,class:"p-sidebar-header-content"},h=["aria-label"];return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===n&&i.firstChild?i.insertBefore(s,i.firstChild):i.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e))}}("\n.p-sidebar-mask {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    display: none;\n    justify-content: center;\n    align-items: center;\n    pointer-events: none;\n    background-color: transparent;\n    transition-property: background-color;\n}\n.p-sidebar-mask.p-component-overlay {\n    pointer-events: auto;\n}\n.p-sidebar-visible {\n    display: flex;\n}\n.p-sidebar {\n    display: flex;\n    flex-direction: column;\n    pointer-events: auto;\n    transform: translate3d(0px, 0px, 0px);\n    position: relative;\n    transition: transform 0.3s;\n}\n.p-sidebar-content {\n    overflow-y: auto;\n    flex-grow: 1;\n}\n.p-sidebar-header {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    flex-shrink: 0;\n}\n.p-sidebar-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-sidebar-full .p-sidebar {\n    transition: none;\n    transform: none;\n    width: 100vw !important;\n    height: 100vh !important;\n    max-height: 100%;\n    top: 0px !important;\n    left: 0px !important;\n}\n\n/* Animation */\n/* Center */\n.p-sidebar-left .p-sidebar-enter-from,\n.p-sidebar-left .p-sidebar-leave-to {\n    transform: translateX(-100%);\n}\n.p-sidebar-right .p-sidebar-enter-from,\n.p-sidebar-right .p-sidebar-leave-to {\n    transform: translateX(100%);\n}\n.p-sidebar-top .p-sidebar-enter-from,\n.p-sidebar-top .p-sidebar-leave-to {\n    transform: translateY(-100%);\n}\n.p-sidebar-bottom .p-sidebar-enter-from,\n.p-sidebar-bottom .p-sidebar-leave-to {\n    transform: translateY(100%);\n}\n.p-sidebar-full .p-sidebar-enter-from,\n.p-sidebar-full .p-sidebar-leave-to {\n    opacity: 0;\n}\n.p-sidebar-full .p-sidebar-enter-active,\n.p-sidebar-full .p-sidebar-leave-active {\n    transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n}\n\n/* Position */\n.p-sidebar-left {\n    justify-content: flex-start;\n}\n.p-sidebar-right {\n    justify-content: flex-end;\n}\n.p-sidebar-top {\n    align-items: flex-start;\n}\n.p-sidebar-bottom {\n    align-items: flex-end;\n}\n\n/* Size */\n.p-sidebar-left .p-sidebar {\n    width: 20rem;\n    height: 100%;\n}\n.p-sidebar-right .p-sidebar {\n    width: 20rem;\n    height: 100%;\n}\n.p-sidebar-top .p-sidebar {\n    height: 10rem;\n    width: 100%;\n}\n.p-sidebar-bottom .p-sidebar {\n    height: 10rem;\n    width: 100%;\n}\n.p-sidebar-left .p-sidebar-sm,\n.p-sidebar-right .p-sidebar-sm {\n    width: 20rem;\n}\n.p-sidebar-left .p-sidebar-md,\n.p-sidebar-right .p-sidebar-md {\n    width: 40rem;\n}\n.p-sidebar-left .p-sidebar-lg,\n.p-sidebar-right .p-sidebar-lg {\n    width: 60rem;\n}\n.p-sidebar-top .p-sidebar-sm,\n.p-sidebar-bottom .p-sidebar-sm {\n    height: 10rem;\n}\n.p-sidebar-top .p-sidebar-md,\n.p-sidebar-bottom .p-sidebar-md {\n    height: 20rem;\n}\n.p-sidebar-top .p-sidebar-lg,\n.p-sidebar-bottom .p-sidebar-lg {\n    height: 30rem;\n}\n.p-sidebar-left .p-sidebar-content,\n.p-sidebar-right .p-sidebar-content,\n.p-sidebar-top .p-sidebar-content,\n.p-sidebar-bottom .p-sidebar-content {\n    width: 100%;\n    height: 100%;\n}\n@media screen and (max-width: 64em) {\n.p-sidebar-left .p-sidebar-lg,\n    .p-sidebar-left .p-sidebar-md,\n    .p-sidebar-right .p-sidebar-lg,\n    .p-sidebar-right .p-sidebar-md {\n        width: 20rem;\n}\n}\n"),d.render=function(e,t,n,i,r,a){const o=s.resolveComponent("Portal"),l=s.resolveDirective("ripple"),d=s.resolveDirective("focustrap");return s.openBlock(),s.createBlock(o,null,{default:s.withCtx((()=>[r.containerVisible?(s.openBlock(),s.createElementBlock("div",{key:0,ref:a.maskRef,class:s.normalizeClass(a.maskClass),onMousedown:t[2]||(t[2]=(...e)=>a.onMaskClick&&a.onMaskClick(...e))},[s.createVNode(s.Transition,{name:"p-sidebar",onEnter:a.onEnter,onAfterEnter:a.onAfterEnter,onBeforeLeave:a.onBeforeLeave,onLeave:a.onLeave,onAfterLeave:a.onAfterLeave,appear:""},{default:s.withCtx((()=>[n.visible?s.withDirectives((s.openBlock(),s.createElementBlock("div",s.mergeProps({key:0,ref:a.containerRef,class:a.containerClass,role:"complementary","aria-modal":n.modal,onKeydown:t[1]||(t[1]=(...e)=>a.onKeydown&&a.onKeydown(...e))},e.$attrs),[s.createElementVNode("div",{ref:a.headerContainerRef,class:"p-sidebar-header"},[e.$slots.header?(s.openBlock(),s.createElementBlock("div",c,[s.renderSlot(e.$slots,"header")])):s.createCommentVNode("",!0),n.showCloseIcon?s.withDirectives((s.openBlock(),s.createElementBlock("button",{key:1,ref:a.closeButtonRef,autofocus:"",type:"button",class:"p-sidebar-close p-sidebar-icon p-link","aria-label":a.closeAriaLabel,onClick:t[0]||(t[0]=(...e)=>a.hide&&a.hide(...e))},[s.createElementVNode("span",{class:s.normalizeClass(["p-sidebar-close-icon",n.closeIcon])},null,2)],8,h)),[[l]]):s.createCommentVNode("",!0)],512),s.createElementVNode("div",{ref:a.contentRef,class:"p-sidebar-content"},[s.renderSlot(e.$slots,"default")],512)],16,p)),[[d]]):s.createCommentVNode("",!0)])),_:3},8,["onEnter","onAfterEnter","onBeforeLeave","onLeave","onAfterLeave"])],34)):s.createCommentVNode("",!0)])),_:3})},d}(primevue.focustrap,primevue.portal,primevue.ripple,primevue.utils,Vue);

package/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "framework": "vue",
   "name": "PrimeVue",
-  "version": "3.22.0",
+  "version": "3.22.2",
   "contributions": {
     "html": {
       "types-syntax": "typescript",