primevue 4.2.5 → 4.3.0

package/multiselect/index.mjs

@@ -1,8 +1,8 @@
-import { focus, getFirstFocusableElement, getLastFocusableElement, addStyle, relativePosition, getOuterWidth, absolutePosition, isTouchDevice, getFocusableElements, findSingle } from '@primeuix/utils/dom';
-import { resolveFieldData, isPrintableCharacter, equals, isNotEmpty, findLastIndex, isEmpty } from '@primeuix/utils/object';
+import { findSingle, getFocusableElements, isTouchDevice, relativePosition, getOuterWidth, absolutePosition, addStyle, focus, getLastFocusableElement, getFirstFocusableElement } from '@primeuix/utils/dom';
+import { isNotEmpty, isEmpty, findLastIndex, equals, isPrintableCharacter, resolveFieldData } from '@primeuix/utils/object';
 import { ZIndex } from '@primeuix/utils/zindex';
 import { FilterService } from '@primevue/core/api';
-import { UniqueComponentId, ConnectedOverlayScrollHandler } from '@primevue/core/utils';
+import { ConnectedOverlayScrollHandler } from '@primevue/core/utils';
 import CheckIcon from '@primevue/icons/check';
 import ChevronDownIcon from '@primevue/icons/chevrondown';
 import SearchIcon from '@primevue/icons/search';
@@ -19,7 +19,7 @@ import Ripple from 'primevue/ripple';
 import VirtualScroller from 'primevue/virtualscroller';
 import BaseInput from '@primevue/core/baseinput';
 import MultiSelectStyle from 'primevue/multiselect/style';
-import { resolveComponent, resolveDirective, openBlock, createElementBlock, mergeProps, createElementVNode, renderSlot, Fragment, createTextVNode, toDisplayString, renderList, createVNode, normalizeClass, withCtx, createCommentVNode, createBlock, resolveDynamicComponent, Transition, normalizeProps, createSlots, withDirectives } from 'vue';
+import { resolveComponent, resolveDirective, createElementBlock, openBlock, mergeProps, createElementVNode, renderSlot, createCommentVNode, createVNode, Fragment, createTextVNode, toDisplayString, renderList, normalizeClass, withCtx, createBlock, resolveDynamicComponent, Transition, normalizeProps, createSlots, withDirectives } from 'vue';
 
 var script$1 = {
   name: 'BaseMultiSelect',
@@ -204,10 +204,10 @@ var script$1 = {
 
 function _typeof$1(o) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$1(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty$1(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty$1(e, r, t) { return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty$1(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty$1(e, r, t) { return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
 function _toPropertyKey$1(t) { var i = _toPrimitive$1(t, "string"); return "symbol" == _typeof$1(i) ? i : i + ""; }
-function _toPrimitive$1(t, r) { if ("object" != _typeof$1(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof$1(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _toPrimitive$1(t, r) { if ("object" != _typeof$1(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$1(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -236,7 +236,6 @@ var script = {
   selectOnFocus: false,
   data: function data() {
     return {
-      id: this.$attrs.id,
       clicked: false,
       focused: false,
       focusedOptionIndex: -1,
@@ -245,15 +244,11 @@ var script = {
     };
   },
   watch: {
-    '$attrs.id': function $attrsId(newValue) {
-      this.id = newValue || UniqueComponentId();
-    },
     options: function options() {
       this.autoUpdateModel();
     }
   },
   mounted: function mounted() {
-    this.id = this.id || UniqueComponentId();
     this.autoUpdateModel();
   },
   beforeUnmount: function beforeUnmount() {
@@ -347,7 +342,7 @@ var script = {
       this.focused = true;
       if (this.overlayVisible) {
         this.focusedOptionIndex = this.focusedOptionIndex !== -1 ? this.focusedOptionIndex : this.autoOptionFocus ? this.findFirstFocusedOptionIndex() : this.findSelectedOptionIndex();
-        this.scrollInView(this.focusedOptionIndex);
+        !this.autoFilterFocus && this.scrollInView(this.focusedOptionIndex);
       }
       this.$emit('focus', event);
     },
@@ -703,12 +698,12 @@ var script = {
             _this6.hide();
           }
         };
-        document.addEventListener('click', this.outsideClickListener);
+        document.addEventListener('click', this.outsideClickListener, true);
       }
     },
     unbindOutsideClickListener: function unbindOutsideClickListener() {
       if (this.outsideClickListener) {
-        document.removeEventListener('click', this.outsideClickListener);
+        document.removeEventListener('click', this.outsideClickListener, true);
         this.outsideClickListener = null;
       }
     },
@@ -953,7 +948,7 @@ var script = {
       var _this23 = this;
       var index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : -1;
       this.$nextTick(function () {
-        var id = index !== -1 ? "".concat(_this23.id, "_").concat(index) : _this23.focusedOptionId;
+        var id = index !== -1 ? "".concat(_this23.$id, "_").concat(index) : _this23.focusedOptionId;
         var element = findSingle(_this23.list, "li[id=\"".concat(id, "\"]"));
         if (element) {
           element.scrollIntoView && element.scrollIntoView({
@@ -1091,7 +1086,7 @@ var script = {
       return this.$filled ? this.selectionMessageText.replaceAll('{0}', this.d_value.length) : this.emptySelectionMessageText;
     },
     focusedOptionId: function focusedOptionId() {
-      return this.focusedOptionIndex !== -1 ? "".concat(this.id, "_").concat(this.focusedOptionIndex) : null;
+      return this.focusedOptionIndex !== -1 ? "".concat(this.$id, "_").concat(this.focusedOptionIndex) : null;
     },
     ariaSetSize: function ariaSetSize() {
       var _this27 = this;
@@ -1112,7 +1107,7 @@ var script = {
       return isEmpty(this.fluid) ? !!this.$pcFluid : this.fluid;
     },
     isClearIconVisible: function isClearIconVisible() {
-      return this.showClear && this.d_value != null && isNotEmpty(this.options);
+      return this.showClear && this.d_value && this.d_value.length && this.d_value != null && isNotEmpty(this.options);
     }
   },
   directives: {
@@ -1135,9 +1130,9 @@ var script = {
 };
 
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var _hoisted_1 = ["id", "disabled", "placeholder", "tabindex", "aria-label", "aria-labelledby", "aria-expanded", "aria-controls", "aria-activedescendant", "aria-invalid"];
 var _hoisted_2 = {
   key: 0
@@ -1180,7 +1175,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     "aria-labelledby": _ctx.ariaLabelledby,
     "aria-haspopup": "listbox",
     "aria-expanded": $data.overlayVisible,
-    "aria-controls": $data.id + '_list',
+    "aria-controls": _ctx.$id + '_list',
     "aria-activedescendant": $data.focused ? $options.focusedOptionId : undefined,
     "aria-invalid": _ctx.invalid || undefined,
     onFocus: _cache[0] || (_cache[0] = function () {
@@ -1329,7 +1324,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             "aria-label": $options.toggleAllAriaLabel,
             onChange: $options.onToggleAll,
             unstyled: _ctx.unstyled,
-            pt: $options.getHeaderCheckboxPTOptions('pcHeaderCheckbox')
+            pt: $options.getHeaderCheckboxPTOptions('pcHeaderCheckbox'),
+            formControl: {
+              novalidate: true
+            }
           }, {
             icon: withCtx(function (slotProps) {
               return [_ctx.$slots.headercheckboxicon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.$slots.headercheckboxicon), {
@@ -1361,12 +1359,15 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 unstyled: _ctx.unstyled,
                 role: "searchbox",
                 autocomplete: "off",
-                "aria-owns": $data.id + '_list',
+                "aria-owns": _ctx.$id + '_list',
                 "aria-activedescendant": $options.focusedOptionId,
                 onKeydown: $options.onFilterKeyDown,
                 onBlur: $options.onFilterBlur,
                 onInput: $options.onFilterChange,
-                pt: _ctx.ptm('pcFilter')
+                pt: _ctx.ptm('pcFilter'),
+                formControl: {
+                  novalidate: true
+                }
               }, null, 8, ["value", "onVnodeMounted", "onVnodeUpdated", "class", "placeholder", "disabled", "variant", "unstyled", "aria-owns", "aria-activedescendant", "onKeydown", "onBlur", "onInput", "pt"]), createVNode(_component_InputIcon, {
                 unstyled: _ctx.unstyled,
                 pt: _ctx.ptm('pcFilterIconContainer')
@@ -1419,7 +1420,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 ref: function ref(el) {
                   return $options.listRef(el, contentRef);
                 },
-                id: $data.id + '_list',
+                id: _ctx.$id + '_list',
                 "class": [_ctx.cx('list'), styleClass],
                 style: contentStyle,
                 role: "listbox",
@@ -1430,7 +1431,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   key: $options.getOptionRenderKey(option, $options.getOptionIndex(i, getItemOptions))
                 }, [$options.isOptionGroup(option) ? (openBlock(), createElementBlock("li", mergeProps({
                   key: 0,
-                  id: $data.id + '_' + $options.getOptionIndex(i, getItemOptions),
+                  id: _ctx.$id + '_' + $options.getOptionIndex(i, getItemOptions),
                   style: {
                     height: itemSize ? itemSize + 'px' : undefined
                   },
@@ -1444,7 +1445,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   return [createTextVNode(toDisplayString($options.getOptionGroupLabel(option.optionGroup)), 1)];
                 })], 16, _hoisted_4)) : withDirectives((openBlock(), createElementBlock("li", mergeProps({
                   key: 1,
-                  id: $data.id + '_' + $options.getOptionIndex(i, getItemOptions),
+                  id: _ctx.$id + '_' + $options.getOptionIndex(i, getItemOptions),
                   style: {
                     height: itemSize ? itemSize + 'px' : undefined
                   },
@@ -1476,7 +1477,10 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   tabindex: -1,
                   variant: _ctx.variant,
                   unstyled: _ctx.unstyled,
-                  pt: $options.getCheckboxPTOptions(option, getItemOptions, i, 'pcOptionCheckbox')
+                  pt: $options.getCheckboxPTOptions(option, getItemOptions, i, 'pcOptionCheckbox'),
+                  formControl: {
+                    novalidate: true
+                  }
                 }, {
                   icon: withCtx(function (slotProps) {
                     return [_ctx.$slots.optioncheckboxicon || _ctx.$slots.itemcheckboxicon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.$slots.optioncheckboxicon || _ctx.$slots.itemcheckboxicon), {