primevue 3.40.0 → 3.41.0

package/focustrap/focustrap.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.focustrap=function(e,t,o){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}return n(t).default.extend({style:n(o).default}).extend("focustrap",{mounted:function(e,t){(t.value||{}).disabled||(this.createHiddenFocusableElements(e,t),this.bind(e,t),this.autoFocus(e,t)),e.setAttribute("data-pd-focustrap",!0),this.$el=e},updated:function(e,t){(t.value||{}).disabled&&this.unbind(e)},unmounted:function(e){this.unbind(e)},methods:{getComputedSelector:function(e){return':not(.p-hidden-focusable):not([data-p-hidden-focusable="true"])'.concat(null!=e?e:"")},bind:function(t,o){var n=this,s=o.value||{},u=s.onFocusIn,c=s.onFocusOut;t.$_pfocustrap_mutationobserver=new MutationObserver((function(o){o.forEach((function(o){if("childList"===o.type&&!t.contains(document.activeElement)){e.DomHandler.focus(function o(s){var u=e.DomHandler.isFocusableElement(s)?e.DomHandler.isFocusableElement(s,n.getComputedSelector(t.$_pfocustrap_focusableselector))?s:e.DomHandler.getFirstFocusableElement(t,n.getComputedSelector(t.$_pfocustrap_focusableselector)):e.DomHandler.getFirstFocusableElement(s);return e.ObjectUtils.isNotEmpty(u)?u:o(s.nextSibling)}(o.nextSibling))}}))})),t.$_pfocustrap_mutationobserver.disconnect(),t.$_pfocustrap_mutationobserver.observe(t,{childList:!0}),t.$_pfocustrap_focusinlistener=function(e){return u&&u(e)},t.$_pfocustrap_focusoutlistener=function(e){return c&&c(e)},t.addEventListener("focusin",t.$_pfocustrap_focusinlistener),t.addEventListener("focusout",t.$_pfocustrap_focusoutlistener)},unbind:function(e){e.$_pfocustrap_mutationobserver&&e.$_pfocustrap_mutationobserver.disconnect(),e.$_pfocustrap_focusinlistener&&e.removeEventListener("focusin",e.$_pfocustrap_focusinlistener)&&(e.$_pfocustrap_focusinlistener=null),e.$_pfocustrap_focusoutlistener&&e.removeEventListener("focusout",e.$_pfocustrap_focusoutlistener)&&(e.$_pfocustrap_focusoutlistener=null)},autoFocus:function(t,o){var n=o.value||{},s=n.autoFocusSelector,u=n.firstFocusableSelector,c=void 0===u?"":u,a=n.autoFocus,r=void 0!==a&&a,i=e.DomHandler.getFirstFocusableElement(t,"[autofocus]".concat(this.getComputedSelector(void 0===s?"":s)));r&&!i&&(i=e.DomHandler.getFirstFocusableElement(t,this.getComputedSelector(c))),e.DomHandler.focus(i)},onFirstHiddenElementFocus:function(t){var o,n=t.currentTarget,s=t.relatedTarget,u=s!==n.$_pfocustrap_lasthiddenfocusableelement&&null!==(o=this.$el)&&void 0!==o&&o.contains(s)?n.$_pfocustrap_lasthiddenfocusableelement:e.DomHandler.getFirstFocusableElement(n.parentElement,this.getComputedSelector(n.$_pfocustrap_focusableselector));e.DomHandler.focus(u)},onLastHiddenElementFocus:function(t){var o,n=t.currentTarget,s=t.relatedTarget,u=s!==n.$_pfocustrap_firsthiddenfocusableelement&&null!==(o=this.$el)&&void 0!==o&&o.contains(s)?n.$_pfocustrap_firsthiddenfocusableelement:e.DomHandler.getLastFocusableElement(n.parentElement,this.getComputedSelector(n.$_pfocustrap_focusableselector));e.DomHandler.focus(u)},createHiddenFocusableElements:function(t,o){var n=this,s=o.value||{},u=s.tabIndex,c=void 0===u?0:u,a=s.firstFocusableSelector,r=void 0===a?"":a,i=s.lastFocusableSelector,l=void 0===i?"":i,d=function(t){return e.DomHandler.createElement("span",{class:"p-hidden-accessible p-hidden-focusable",tabIndex:c,role:"presentation","aria-hidden":!0,"data-p-hidden-accessible":!0,"data-p-hidden-focusable":!0,onFocus:null==t?void 0:t.bind(n)})},f=d(this.onFirstHiddenElementFocus),p=d(this.onLastHiddenElementFocus);f.$_pfocustrap_lasthiddenfocusableelement=p,f.$_pfocustrap_focusableselector=r,f.setAttribute("data-pc-section","firstfocusableelement"),p.$_pfocustrap_firsthiddenfocusableelement=f,p.$_pfocustrap_focusableselector=l,p.setAttribute("data-pc-section","lastfocusableelement"),t.prepend(f),t.append(p)}}})}(primevue.utils,primevue.basedirective,primevue.focustrap.style);
+this.primevue=this.primevue||{},this.primevue.focustrap=function(e,t,o){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}return n(t).default.extend({style:n(o).default}).extend("focustrap",{mounted:function(e,t){(t.value||{}).disabled||(this.createHiddenFocusableElements(e,t),this.bind(e,t),this.autoFocus(e,t)),e.setAttribute("data-pd-focustrap",!0),this.$el=e},updated:function(e,t){(t.value||{}).disabled&&this.unbind(e)},unmounted:function(e){this.unbind(e)},methods:{getComputedSelector:function(e){return':not(.p-hidden-focusable):not([data-p-hidden-focusable="true"])'.concat(null!=e?e:"")},bind:function(t,o){var n=this,s=o.value||{},u=s.onFocusIn,c=s.onFocusOut;t.$_pfocustrap_mutationobserver=new MutationObserver((function(o){o.forEach((function(o){if("childList"===o.type&&!t.contains(document.activeElement)){e.DomHandler.focus(function o(s){var u=e.DomHandler.isFocusableElement(s)?e.DomHandler.isFocusableElement(s,n.getComputedSelector(t.$_pfocustrap_focusableselector))?s:e.DomHandler.getFirstFocusableElement(t,n.getComputedSelector(t.$_pfocustrap_focusableselector)):e.DomHandler.getFirstFocusableElement(s);return e.ObjectUtils.isNotEmpty(u)?u:s.nextSibling&&o(s.nextSibling)}(o.nextSibling))}}))})),t.$_pfocustrap_mutationobserver.disconnect(),t.$_pfocustrap_mutationobserver.observe(t,{childList:!0}),t.$_pfocustrap_focusinlistener=function(e){return u&&u(e)},t.$_pfocustrap_focusoutlistener=function(e){return c&&c(e)},t.addEventListener("focusin",t.$_pfocustrap_focusinlistener),t.addEventListener("focusout",t.$_pfocustrap_focusoutlistener)},unbind:function(e){e.$_pfocustrap_mutationobserver&&e.$_pfocustrap_mutationobserver.disconnect(),e.$_pfocustrap_focusinlistener&&e.removeEventListener("focusin",e.$_pfocustrap_focusinlistener)&&(e.$_pfocustrap_focusinlistener=null),e.$_pfocustrap_focusoutlistener&&e.removeEventListener("focusout",e.$_pfocustrap_focusoutlistener)&&(e.$_pfocustrap_focusoutlistener=null)},autoFocus:function(t,o){var n=o.value||{},s=n.autoFocusSelector,u=n.firstFocusableSelector,c=void 0===u?"":u,a=n.autoFocus,r=void 0!==a&&a,i=e.DomHandler.getFirstFocusableElement(t,"[autofocus]".concat(this.getComputedSelector(void 0===s?"":s)));r&&!i&&(i=e.DomHandler.getFirstFocusableElement(t,this.getComputedSelector(c))),e.DomHandler.focus(i)},onFirstHiddenElementFocus:function(t){var o,n=t.currentTarget,s=t.relatedTarget,u=s!==n.$_pfocustrap_lasthiddenfocusableelement&&null!==(o=this.$el)&&void 0!==o&&o.contains(s)?n.$_pfocustrap_lasthiddenfocusableelement:e.DomHandler.getFirstFocusableElement(n.parentElement,this.getComputedSelector(n.$_pfocustrap_focusableselector));e.DomHandler.focus(u)},onLastHiddenElementFocus:function(t){var o,n=t.currentTarget,s=t.relatedTarget,u=s!==n.$_pfocustrap_firsthiddenfocusableelement&&null!==(o=this.$el)&&void 0!==o&&o.contains(s)?n.$_pfocustrap_firsthiddenfocusableelement:e.DomHandler.getLastFocusableElement(n.parentElement,this.getComputedSelector(n.$_pfocustrap_focusableselector));e.DomHandler.focus(u)},createHiddenFocusableElements:function(t,o){var n=this,s=o.value||{},u=s.tabIndex,c=void 0===u?0:u,a=s.firstFocusableSelector,r=void 0===a?"":a,i=s.lastFocusableSelector,l=void 0===i?"":i,d=function(t){return e.DomHandler.createElement("span",{class:"p-hidden-accessible p-hidden-focusable",tabIndex:c,role:"presentation","aria-hidden":!0,"data-p-hidden-accessible":!0,"data-p-hidden-focusable":!0,onFocus:null==t?void 0:t.bind(n)})},f=d(this.onFirstHiddenElementFocus),p=d(this.onLastHiddenElementFocus);f.$_pfocustrap_lasthiddenfocusableelement=p,f.$_pfocustrap_focusableselector=r,f.setAttribute("data-pc-section","firstfocusableelement"),p.$_pfocustrap_firsthiddenfocusableelement=f,p.$_pfocustrap_focusableselector=l,p.setAttribute("data-pc-section","lastfocusableelement"),t.prepend(f),t.append(p)}}})}(primevue.utils,primevue.basedirective,primevue.focustrap.style);

package/inputgroupaddon/package.json

@@ -1,6 +1,6 @@
 {
     "main": "./inputgroupaddon.cjs.js",
-    "module": "./inputgrouaddonp.esm.js",
+    "module": "./inputgroupaddon.esm.js",
     "unpkg": "./inputgroupaddon.min.js",
     "types": "./InputGroupAddon.d.ts",
     "browser": {

package/inputnumber/style/inputnumberstyle.cjs.js

@@ -12,7 +12,7 @@ var classes = {
     var instance = _ref.instance,
       props = _ref.props;
     return ['p-inputnumber p-component p-inputwrapper', {
-      'p-inputwrapper-filled': instance.filled,
+      'p-inputwrapper-filled': instance.filled || props.allowEmpty === false,
       'p-inputwrapper-focus': instance.focused,
       'p-inputnumber-buttons-stacked': props.showButtons && props.buttonLayout === 'stacked',
       'p-inputnumber-buttons-horizontal': props.showButtons && props.buttonLayout === 'horizontal',

package/inputnumber/style/inputnumberstyle.cjs.min.js

@@ -1 +1 @@
-"use strict";function n(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var t=n(require("primevue/base/style")).default.extend({name:"inputnumber",css:"\n@layer primevue {\n    .p-inputnumber {\n        display: inline-flex;\n    }\n\n    .p-inputnumber-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {\n        display: none;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        border-bottom-left-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {\n        flex: 1 1 auto;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {\n        order: 3;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {\n        order: 1;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-vertical {\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {\n        order: 1;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n        text-align: center;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {\n        order: 3;\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-input {\n        flex: 1 1 auto;\n    }\n\n    .p-fluid .p-inputnumber {\n        width: 100%;\n    }\n\n    .p-fluid .p-inputnumber .p-inputnumber-input {\n        width: 1%;\n    }\n\n    .p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        width: 100%;\n    }\n}\n",classes:{root:function(n){var t=n.instance,u=n.props;return["p-inputnumber p-component p-inputwrapper",{"p-inputwrapper-filled":t.filled,"p-inputwrapper-focus":t.focused,"p-inputnumber-buttons-stacked":u.showButtons&&"stacked"===u.buttonLayout,"p-inputnumber-buttons-horizontal":u.showButtons&&"horizontal"===u.buttonLayout,"p-inputnumber-buttons-vertical":u.showButtons&&"vertical"===u.buttonLayout}]},input:"p-inputnumber-input",buttonGroup:"p-inputnumber-button-group",incrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-up",{"p-disabled":t.showButtons&&null!==t.max&&n.instance.maxBoundry()}]},decrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-down",{"p-disabled":t.showButtons&&null!==t.min&&n.instance.minBoundry()}]}}});module.exports=t;
+"use strict";function n(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var t=n(require("primevue/base/style")).default.extend({name:"inputnumber",css:"\n@layer primevue {\n    .p-inputnumber {\n        display: inline-flex;\n    }\n\n    .p-inputnumber-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {\n        display: none;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        border-bottom-left-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {\n        flex: 1 1 auto;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {\n        order: 3;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {\n        order: 1;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-vertical {\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {\n        order: 1;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n        text-align: center;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {\n        order: 3;\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-input {\n        flex: 1 1 auto;\n    }\n\n    .p-fluid .p-inputnumber {\n        width: 100%;\n    }\n\n    .p-fluid .p-inputnumber .p-inputnumber-input {\n        width: 1%;\n    }\n\n    .p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        width: 100%;\n    }\n}\n",classes:{root:function(n){var t=n.instance,u=n.props;return["p-inputnumber p-component p-inputwrapper",{"p-inputwrapper-filled":t.filled||!1===u.allowEmpty,"p-inputwrapper-focus":t.focused,"p-inputnumber-buttons-stacked":u.showButtons&&"stacked"===u.buttonLayout,"p-inputnumber-buttons-horizontal":u.showButtons&&"horizontal"===u.buttonLayout,"p-inputnumber-buttons-vertical":u.showButtons&&"vertical"===u.buttonLayout}]},input:"p-inputnumber-input",buttonGroup:"p-inputnumber-button-group",incrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-up",{"p-disabled":t.showButtons&&null!==t.max&&n.instance.maxBoundry()}]},decrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-down",{"p-disabled":t.showButtons&&null!==t.min&&n.instance.minBoundry()}]}}});module.exports=t;

package/inputnumber/style/inputnumberstyle.esm.js

@@ -6,7 +6,7 @@ var classes = {
     var instance = _ref.instance,
       props = _ref.props;
     return ['p-inputnumber p-component p-inputwrapper', {
-      'p-inputwrapper-filled': instance.filled,
+      'p-inputwrapper-filled': instance.filled || props.allowEmpty === false,
       'p-inputwrapper-focus': instance.focused,
       'p-inputnumber-buttons-stacked': props.showButtons && props.buttonLayout === 'stacked',
       'p-inputnumber-buttons-horizontal': props.showButtons && props.buttonLayout === 'horizontal',

package/inputnumber/style/inputnumberstyle.esm.min.js

@@ -1 +1 @@
-import n from"primevue/base/style";var t=n.extend({name:"inputnumber",css:"\n@layer primevue {\n    .p-inputnumber {\n        display: inline-flex;\n    }\n\n    .p-inputnumber-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {\n        display: none;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        border-bottom-left-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {\n        flex: 1 1 auto;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {\n        order: 3;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {\n        order: 1;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-vertical {\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {\n        order: 1;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n        text-align: center;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {\n        order: 3;\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-input {\n        flex: 1 1 auto;\n    }\n\n    .p-fluid .p-inputnumber {\n        width: 100%;\n    }\n\n    .p-fluid .p-inputnumber .p-inputnumber-input {\n        width: 1%;\n    }\n\n    .p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        width: 100%;\n    }\n}\n",classes:{root:function(n){var t=n.instance,u=n.props;return["p-inputnumber p-component p-inputwrapper",{"p-inputwrapper-filled":t.filled,"p-inputwrapper-focus":t.focused,"p-inputnumber-buttons-stacked":u.showButtons&&"stacked"===u.buttonLayout,"p-inputnumber-buttons-horizontal":u.showButtons&&"horizontal"===u.buttonLayout,"p-inputnumber-buttons-vertical":u.showButtons&&"vertical"===u.buttonLayout}]},input:"p-inputnumber-input",buttonGroup:"p-inputnumber-button-group",incrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-up",{"p-disabled":t.showButtons&&null!==t.max&&n.instance.maxBoundry()}]},decrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-down",{"p-disabled":t.showButtons&&null!==t.min&&n.instance.minBoundry()}]}}});export{t as default};
+import n from"primevue/base/style";var t=n.extend({name:"inputnumber",css:"\n@layer primevue {\n    .p-inputnumber {\n        display: inline-flex;\n    }\n\n    .p-inputnumber-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {\n        display: none;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        border-bottom-left-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {\n        flex: 1 1 auto;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {\n        order: 3;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {\n        order: 1;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-vertical {\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {\n        order: 1;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n        text-align: center;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {\n        order: 3;\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-input {\n        flex: 1 1 auto;\n    }\n\n    .p-fluid .p-inputnumber {\n        width: 100%;\n    }\n\n    .p-fluid .p-inputnumber .p-inputnumber-input {\n        width: 1%;\n    }\n\n    .p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        width: 100%;\n    }\n}\n",classes:{root:function(n){var t=n.instance,u=n.props;return["p-inputnumber p-component p-inputwrapper",{"p-inputwrapper-filled":t.filled||!1===u.allowEmpty,"p-inputwrapper-focus":t.focused,"p-inputnumber-buttons-stacked":u.showButtons&&"stacked"===u.buttonLayout,"p-inputnumber-buttons-horizontal":u.showButtons&&"horizontal"===u.buttonLayout,"p-inputnumber-buttons-vertical":u.showButtons&&"vertical"===u.buttonLayout}]},input:"p-inputnumber-input",buttonGroup:"p-inputnumber-button-group",incrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-up",{"p-disabled":t.showButtons&&null!==t.max&&n.instance.maxBoundry()}]},decrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-down",{"p-disabled":t.showButtons&&null!==t.min&&n.instance.minBoundry()}]}}});export{t as default};

package/inputnumber/style/inputnumberstyle.js

@@ -13,7 +13,7 @@ this.primevue.inputnumber.style = (function (BaseStyle) {
         var instance = _ref.instance,
           props = _ref.props;
         return ['p-inputnumber p-component p-inputwrapper', {
-          'p-inputwrapper-filled': instance.filled,
+          'p-inputwrapper-filled': instance.filled || props.allowEmpty === false,
           'p-inputwrapper-focus': instance.focused,
           'p-inputnumber-buttons-stacked': props.showButtons && props.buttonLayout === 'stacked',
           'p-inputnumber-buttons-horizontal': props.showButtons && props.buttonLayout === 'horizontal',

package/inputnumber/style/inputnumberstyle.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.inputnumber=this.primevue.inputnumber||{},this.primevue.inputnumber.style=function(n){"use strict";function t(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}return t(primevue.base.style).default.extend({name:"inputnumber",css:"\n@layer primevue {\n    .p-inputnumber {\n        display: inline-flex;\n    }\n\n    .p-inputnumber-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {\n        display: none;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        border-bottom-left-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {\n        flex: 1 1 auto;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {\n        order: 3;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {\n        order: 1;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-vertical {\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {\n        order: 1;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n        text-align: center;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {\n        order: 3;\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-input {\n        flex: 1 1 auto;\n    }\n\n    .p-fluid .p-inputnumber {\n        width: 100%;\n    }\n\n    .p-fluid .p-inputnumber .p-inputnumber-input {\n        width: 1%;\n    }\n\n    .p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        width: 100%;\n    }\n}\n",classes:{root:function(n){var t=n.instance,u=n.props;return["p-inputnumber p-component p-inputwrapper",{"p-inputwrapper-filled":t.filled,"p-inputwrapper-focus":t.focused,"p-inputnumber-buttons-stacked":u.showButtons&&"stacked"===u.buttonLayout,"p-inputnumber-buttons-horizontal":u.showButtons&&"horizontal"===u.buttonLayout,"p-inputnumber-buttons-vertical":u.showButtons&&"vertical"===u.buttonLayout}]},input:"p-inputnumber-input",buttonGroup:"p-inputnumber-button-group",incrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-up",{"p-disabled":t.showButtons&&null!==t.max&&n.instance.maxBoundry()}]},decrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-down",{"p-disabled":t.showButtons&&null!==t.min&&n.instance.minBoundry()}]}}})}();
+this.primevue=this.primevue||{},this.primevue.inputnumber=this.primevue.inputnumber||{},this.primevue.inputnumber.style=function(n){"use strict";function t(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}return t(primevue.base.style).default.extend({name:"inputnumber",css:"\n@layer primevue {\n    .p-inputnumber {\n        display: inline-flex;\n    }\n\n    .p-inputnumber-button {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex: 0 0 auto;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {\n        display: none;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-input {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        border-bottom-left-radius: 0;\n        padding: 0;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group {\n        display: flex;\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {\n        flex: 1 1 auto;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {\n        order: 3;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n    }\n\n    .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {\n        order: 1;\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n    }\n\n    .p-inputnumber-buttons-vertical {\n        flex-direction: column;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {\n        order: 1;\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        order: 2;\n        border-radius: 0;\n        text-align: center;\n    }\n\n    .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {\n        order: 3;\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n        width: 100%;\n    }\n\n    .p-inputnumber-input {\n        flex: 1 1 auto;\n    }\n\n    .p-fluid .p-inputnumber {\n        width: 100%;\n    }\n\n    .p-fluid .p-inputnumber .p-inputnumber-input {\n        width: 1%;\n    }\n\n    .p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {\n        width: 100%;\n    }\n}\n",classes:{root:function(n){var t=n.instance,u=n.props;return["p-inputnumber p-component p-inputwrapper",{"p-inputwrapper-filled":t.filled||!1===u.allowEmpty,"p-inputwrapper-focus":t.focused,"p-inputnumber-buttons-stacked":u.showButtons&&"stacked"===u.buttonLayout,"p-inputnumber-buttons-horizontal":u.showButtons&&"horizontal"===u.buttonLayout,"p-inputnumber-buttons-vertical":u.showButtons&&"vertical"===u.buttonLayout}]},input:"p-inputnumber-input",buttonGroup:"p-inputnumber-button-group",incrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-up",{"p-disabled":t.showButtons&&null!==t.max&&n.instance.maxBoundry()}]},decrementButton:function(n){var t=n.props;return["p-inputnumber-button p-inputnumber-button-down",{"p-disabled":t.showButtons&&null!==t.min&&n.instance.minBoundry()}]}}})}();

package/megamenu/BaseMegaMenu.vue

@@ -14,6 +14,10 @@ export default {
             type: String,
             default: 'horizontal'
         },
+        breakpoint: {
+            type: String,
+            default: '960px'
+        },
         disabled: {
             type: Boolean,
             default: false

package/megamenu/MegaMenu.d.ts

@@ -106,6 +106,10 @@ export interface MegaMenuPassThroughOptions {
      * Used to pass attributes to the separator's DOM element.
      */
     separator?: MegaMenuPassThroughOptionType;
+    /**
+     * Used to pass attributes to the mobile popup menu button's DOM element.
+     */
+    menubutton?: MegaMenuPassThroughOptionType;
     /**
      * Used to pass attributes to the start of the component.
      */
@@ -235,6 +239,11 @@ export interface MegaMenuProps {
      * @defaultValue horizontal
      */
     orientation?: 'horizontal' | 'vertical' | undefined;
+    /**
+     * The breakpoint to define the maximum width boundary.
+     * @defaultValue 960px
+     */
+    breakpoint?: string | undefined;
     /**
      * Whether to apply 'router-link-active-exact' class if route exactly matches the item path.
      * @deprecated since v3.40.0.

package/megamenu/MegaMenu.vue

@@ -3,6 +3,24 @@
         <div v-if="$slots.start" :class="cx('start')" v-bind="ptm('start')">
             <slot name="start"></slot>
         </div>
+        <a
+            v-if="model && model.length > 0"
+            ref="menubutton"
+            role="button"
+            tabindex="0"
+            :class="cx('menubutton')"
+            :aria-haspopup="model.length && model.length > 0 ? true : false"
+            :aria-expanded="mobileActive"
+            :aria-controls="id"
+            :aria-label="$primevue.config.locale.aria?.navigation"
+            @click="menuButtonClick($event)"
+            @keydown="menuButtonKeydown($event)"
+            v-bind="ptm('menubutton')"
+        >
+            <slot name="menubuttonicon">
+                <BarsIcon v-bind="ptm('menubuttonicon')" />
+            </slot>
+        </a>
         <MegaMenuSub
             :ref="menubarRef"
             :id="id + '_list'"
@@ -19,6 +37,7 @@
             :horizontal="horizontal"
             :templates="$slots"
             :activeItem="activeItem"
+            :mobileActive="mobileActive"
             :level="0"
             :pt="pt"
             :unstyled="unstyled"
@@ -35,7 +54,8 @@
 </template>
 
 <script>
-import { DomHandler, ObjectUtils, UniqueComponentId } from 'primevue/utils';
+import BarsIcon from 'primevue/icons/bars';
+import { DomHandler, ObjectUtils, UniqueComponentId, ZIndexUtils } from 'primevue/utils';
 import BaseMegaMenu from './BaseMegaMenu.vue';
 import MegaMenuSub from './MegaMenuSub.vue';
 
@@ -52,10 +72,12 @@ export default {
     data() {
         return {
             id: this.$attrs.id,
+            mobileActive: false,
             focused: false,
             focusedItemInfo: { index: -1, key: '', parentKey: '' },
             activeItem: null,
-            dirty: false
+            dirty: false,
+            queryMatches: false
         };
     },
     watch: {
@@ -74,8 +96,17 @@ export default {
     },
     mounted() {
         this.id = this.id || UniqueComponentId();
+        const query = matchMedia(`(max-width: ${this.breakpoint})`);
+
+        this.queryMatches = query.matches;
+
+        query.addEventListener('change', () => {
+            this.queryMatches = query.matches;
+            this.mobileActive = false;
+        });
     },
     beforeUnmount() {
+        this.mobileActive = false;
         this.unbindOutsideClickListener();
         this.unbindResizeListener();
     },
@@ -101,7 +132,35 @@ export default {
         isProccessedItemGroup(processedItem) {
             return processedItem && ObjectUtils.isNotEmpty(processedItem.items);
         },
+        toggle(event) {
+            if (this.mobileActive) {
+                this.mobileActive = false;
+                ZIndexUtils.clear(this.menubar);
+                this.hide();
+            } else {
+                this.mobileActive = true;
+                ZIndexUtils.set('menu', this.menubar, this.$primevue.config.zIndex.menu);
+                setTimeout(() => {
+                    this.show();
+                }, 1);
+            }
+
+            this.bindOutsideClickListener();
+            event.preventDefault();
+        },
+        show() {
+            this.focusedItemInfo = { index: this.findFirstFocusedItemIndex(), level: 0, parentKey: '' };
+
+            DomHandler.focus(this.menubar);
+        },
         hide(event, isFocus) {
+            if (this.mobileActive) {
+                this.mobileActive = false;
+                setTimeout(() => {
+                    DomHandler.focus(this.$refs.menubutton);
+                }, 0);
+            }
+
             this.activeItem = null;
             this.focusedItemInfo = { index: -1, key: '', parentKey: '' };
 
@@ -229,16 +288,22 @@ export default {
 
                     this.hide(originalEvent);
                     this.changeFocusedItemInfo(originalEvent, rootProcessedItem ? rootProcessedItem.index : -1);
-
+                    this.mobileActive = false;
                     DomHandler.focus(this.menubar);
                 }
             }
         },
         onItemMouseEnter(event) {
-            if (this.dirty) {
+            if (!this.mobileActive && this.dirty) {
                 this.onItemChange(event);
             }
         },
+        menuButtonClick(event) {
+            this.toggle(event);
+        },
+        menuButtonKeydown(event) {
+            (event.code === 'Enter' || event.code === 'Space') && this.menuButtonClick(event);
+        },
         onArrowDownKey(event) {
             if (this.horizontal) {
                 if (ObjectUtils.isNotEmpty(this.activeItem) && this.activeItem.key === this.focusedItemInfo.key) {
@@ -390,7 +455,7 @@ export default {
             if (!this.outsideClickListener) {
                 this.outsideClickListener = (event) => {
                     const isOutsideContainer = this.container && !this.container.contains(event.target);
-                    const isOutsideTarget = this.popup ? !(this.target && (this.target === event.target || this.target.contains(event.target))) : true;
+                    const isOutsideTarget = !(this.target && (this.target === event.target || this.target.contains(event.target)));
 
                     if (isOutsideContainer && isOutsideTarget) {
                         this.hide();
@@ -412,6 +477,8 @@ export default {
                     if (!DomHandler.isTouchDevice()) {
                         this.hide(event, true);
                     }
+
+                    this.mobileActive = false;
                 };
 
                 window.addEventListener('resize', this.resizeListener);
@@ -578,7 +645,8 @@ export default {
         }
     },
     components: {
-        MegaMenuSub: MegaMenuSub
+        MegaMenuSub: MegaMenuSub,
+        BarsIcon: BarsIcon
     }
 };
 </script>

package/megamenu/MegaMenuSub.vue

@@ -28,7 +28,7 @@
                             <span :class="level === 0 ? cx('label') : cx('submenuLabel')" v-bind="level === 0 ? getPTOptions(processedItem, index, 'label') : getPTOptions(processedItem, index, 'submenuLabel')">{{ getItemLabel(processedItem) }}</span>
                             <template v-if="isItemGroup(processedItem)">
                                 <component v-if="templates.submenuicon" :is="templates.submenuicon" :active="isItemActive(processedItem)" :class="cx('submenuIcon')" v-bind="getPTOptions(processedItem, index, 'submenuIcon')" />
-                                <component v-else :is="horizontal ? 'AngleDownIcon' : 'AngleRightIcon'" :class="cx('submenuIcon')" v-bind="getPTOptions(processedItem, index, 'submenuIcon')" />
+                                <component v-else :is="horizontal || mobileActive ? 'AngleDownIcon' : 'AngleRightIcon'" :class="cx('submenuIcon')" v-bind="getPTOptions(processedItem, index, 'submenuIcon')" />
                             </template>
                         </a>
                     </template>
@@ -49,6 +49,7 @@
                                 :items="submenu.items"
                                 :templates="templates"
                                 :level="level + 1"
+                                :mobileActive="mobileActive"
                                 :pt="pt"
                                 :unstyled="unstyled"
                                 @item-click="$emit('item-click', $event)"
@@ -100,6 +101,10 @@ export default {
             type: Object,
             default: null
         },
+        mobileActive: {
+            type: Boolean,
+            default: false
+        },
         items: {
             type: Array,
             default: null