primevue 3.15.0 → 3.16.2

package/treeselect/TreeSelect.d.ts

@@ -4,7 +4,7 @@ import { TreeNode } from '../tree';
 
 type TreeSelectSelectionModeType = 'single' | 'multiple' | 'checkbox' | undefined;
 
-type TreeSelectAppendToType = 'body' | 'self' | string | undefined;
+type TreeSelectAppendToType = 'body' | 'self' | string | undefined | HTMLElement;
 
 type TreeSelectDisplayType = 'comma' | 'chip' | undefined;
 
@@ -34,14 +34,6 @@ export interface TreeSelectProps {
      * Index of the element in tabbing order.
      */
     tabindex?: string | undefined;
-    /**
-     * Identifier of the underlying input element.
-     */
-    inputId?: string | undefined;
-    /**
-     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
-     */
-    ariaLabelledBy?: string | undefined;
     /**
      * Defines the selection mode.
      * @see TreeSelectSelectionModeType
@@ -74,6 +66,30 @@ export interface TreeSelectProps {
      * Default value is true.
      */
     metaKeySelection?: boolean | undefined;
+    /**
+     * 	Identifier of the underlying input element.
+     */
+    inputId?: string | undefined;
+    /**
+     * Style class of the input field.
+     */
+    inputClass?: any | undefined;
+    /**
+     * Inline style of the input field.
+     */
+    inputStyle?: any | undefined;
+    /**
+     * 
+     */
+    inputProps?: object | undefined;
+    /**
+     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
+     */
+    'aria-labelledby'?: string | undefined;
+    /**
+      * Establishes a string value that labels the component.
+      */
+    'aria-label'?: string | undefined;
 }
 
 export interface TreeSelectSlots {
@@ -113,7 +129,7 @@ export interface TreeSelectSlots {
         /**
          * Selected value
          */
-         value: TreeNode | any;
+        value: TreeNode | any;
         /**
          * An array of treenodes.
          */

package/treeselect/TreeSelect.vue

@@ -1,8 +1,9 @@
 <template>
     <div ref="container" :class="containerClass" @click="onClick">
         <div class="p-hidden-accessible">
-            <input ref="focusInput" type="text" role="listbox" :id="inputId" readonly :disabled="disabled" @focus="onFocus" @blur="onBlur" @keydown="onKeyDown" :tabindex="tabindex"
-                aria-haspopup="true" :aria-expanded="overlayVisible" :aria-labelledby="ariaLabelledBy"/>
+            <input ref="focusInput" type="text" role="combobox" :id="inputId" :class="inputClass" :style="inputStyle" readonly :disabled="disabled" :tabindex="!disabled ? tabindex : -1"
+                :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" aria-haspopup="tree" :aria-expanded="overlayVisible" :aria-controls="listId"
+                @focus="onFocus($event)" @blur="onBlur($event)" @keydown="onKeyDown($event)" v-bind="inputProps" />
         </div>
         <div class="p-treeselect-label-container">
             <div :class="labelClass">
@@ -19,20 +20,20 @@
                 </slot>
             </div>
         </div>
-        <div class="p-treeselect-trigger">
+        <div class="p-treeselect-trigger" role="button" aria-haspopup="tree" :aria-expanded="overlayVisible">
             <slot name="indicator">
                 <span class="p-treeselect-trigger-icon pi pi-chevron-down"></span>
             </slot>
         </div>
         <Portal :appendTo="appendTo">
             <transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
-                <div :ref="overlayRef" v-if="overlayVisible" @click="onOverlayClick" :class="panelStyleClass">
+                <div :ref="overlayRef" v-if="overlayVisible" @click="onOverlayClick" :class="panelStyleClass" v-bind="panelProps">
                     <slot name="header" :value="modelValue" :options="options"></slot>
                     <div class="p-treeselect-items-wrapper" :style="{'max-height': scrollHeight}">
-                        <TSTree :value="options" :selectionMode="selectionMode" @update:selectionKeys="onSelectionChange" :selectionKeys="modelValue"
+                        <TSTree :id="listId" :value="options" :selectionMode="selectionMode" @update:selectionKeys="onSelectionChange" :selectionKeys="modelValue"
                             :expandedKeys="expandedKeys" @update:expandedKeys="onNodeToggle" :metaKeySelection="metaKeySelection"
                             @node-expand="$emit('node-expand', $event)" @node-collapse="$emit('node-collapse', $event)"
-                            @node-select="onNodeSelect" @node-unselect="onNodeUnselect" />
+                            @node-select="onNodeSelect" @node-unselect="onNodeUnselect" :level="0" />
                         <div v-if="emptyOptions" class="p-treeselect-empty-message">
                             <slot name="empty">{{emptyMessageText}}</slot>
                         </div>
@@ -45,7 +46,7 @@
 </template>
 
 <script>
-import {ConnectedOverlayScrollHandler,DomHandler,ZIndexUtils} from 'primevue/utils';
+import {ConnectedOverlayScrollHandler,DomHandler,ZIndexUtils,UniqueComponentId} from 'primevue/utils';
 import OverlayEventBus from 'primevue/overlayeventbus';
 import Tree from 'primevue/tree';
 import Ripple from 'primevue/ripple';
@@ -53,7 +54,7 @@ import Portal from 'primevue/portal';
 
 export default {
     name: 'TreeSelect',
-    emits: ['update:modelValue', 'before-show', 'before-hide', 'change', 'show', 'hide', 'node-select', 'node-unselect', 'node-expand', 'node-collapse'],
+    emits: ['update:modelValue', 'before-show', 'before-hide', 'change', 'show', 'hide', 'node-select', 'node-unselect', 'node-expand', 'node-collapse', 'focus', 'blur'],
     props: {
         modelValue: null,
         options: Array,
@@ -64,8 +65,6 @@ export default {
 		placeholder: String,
 		disabled: Boolean,
         tabindex: String,
-        inputId: String,
-        ariaLabelledBy: null,
         selectionMode: {
             type: String,
             default: 'single'
@@ -74,6 +73,7 @@ export default {
             type: String,
             default: null
         },
+        panelProps: null,
         appendTo: {
             type: String,
             default: 'body'
@@ -89,6 +89,18 @@ export default {
         metaKeySelection: {
             type: Boolean,
             default: true
+        },
+        inputId: String,
+        inputClass: String,
+        inputStyle: null,
+        inputProps: null,
+        'aria-labelledby': {
+            type: String,
+			default: null
+        },
+        'aria-label': {
+            type: String,
+            default: null
         }
     },
     watch: {
@@ -142,12 +154,15 @@ export default {
         hide() {
             this.$emit('before-hide');
             this.overlayVisible = false;
+            this.$refs.focusInput.focus();
         },
-        onFocus() {
+        onFocus(event) {
             this.focused = true;
+            this.$emit('focus', event);
         },
-        onBlur() {
+        onBlur(event) {
             this.focused = false;
+            this.$emit('blur', event);
         },
         onClick(event) {
             if (!this.disabled && (!this.overlay || !this.overlay.contains(event.target)) && !DomHandler.hasClass(event.target, 'p-treeselect-close')) {
@@ -178,37 +193,42 @@ export default {
             this.expandedKeys = keys;
         },
         onKeyDown(event) {
-            switch(event.which) {
-                //down
-                case 40:
-                    if (!this.overlayVisible && event.altKey) {
+            switch(event.code) {
+                case 'Down':
+                case 'ArrowDown':
+                    if (this.overlayVisible) {
+                        if (DomHandler.findSingle(this.overlay, '.p-highlight')) {
+                            DomHandler.findSingle(this.overlay, '.p-highlight').focus();
+                        }
+                        else DomHandler.findSingle(this.overlay, '.p-treenode').children[0].focus();
+                    }
+                    else {
                         this.show();
-                        event.preventDefault();
                     }
+
+                    event.preventDefault();
                 break;
 
-                //space
-                case 32:
-                    if (!this.overlayVisible) {
+                case 'Space':
+                case 'Enter':
+                    if (this.overlayVisible) {
+                        this.hide();
+                    }
+                    else {
                         this.show();
-                        event.preventDefault();
                     }
+
+                    event.preventDefault();
                 break;
 
-                //enter and escape
-                case 13:
-                case 27:
+                case 'Escape':
+                case 'Tab':
                     if (this.overlayVisible) {
                         this.hide();
                         event.preventDefault();
                     }
                 break;
 
-                //tab
-                case 9:
-                    this.hide();
-                break;
-
                 default:
                 break;
             }
@@ -415,6 +435,9 @@ export default {
         },
         emptyOptions() {
             return !this.options || this.options.length === 0;
+        },
+        listId() {
+            return UniqueComponentId() + '_list';
         }
     },
     components: {

package/treeselect/treeselect.cjs.js

@@ -16,7 +16,7 @@ var Portal__default = /*#__PURE__*/_interopDefaultLegacy(Portal);
 
 var script = {
     name: 'TreeSelect',
-    emits: ['update:modelValue', 'before-show', 'before-hide', 'change', 'show', 'hide', 'node-select', 'node-unselect', 'node-expand', 'node-collapse'],
+    emits: ['update:modelValue', 'before-show', 'before-hide', 'change', 'show', 'hide', 'node-select', 'node-unselect', 'node-expand', 'node-collapse', 'focus', 'blur'],
     props: {
         modelValue: null,
         options: Array,
@@ -27,8 +27,6 @@ var script = {
 		placeholder: String,
 		disabled: Boolean,
         tabindex: String,
-        inputId: String,
-        ariaLabelledBy: null,
         selectionMode: {
             type: String,
             default: 'single'
@@ -37,6 +35,7 @@ var script = {
             type: String,
             default: null
         },
+        panelProps: null,
         appendTo: {
             type: String,
             default: 'body'
@@ -52,6 +51,18 @@ var script = {
         metaKeySelection: {
             type: Boolean,
             default: true
+        },
+        inputId: String,
+        inputClass: String,
+        inputStyle: null,
+        inputProps: null,
+        'aria-labelledby': {
+            type: String,
+			default: null
+        },
+        'aria-label': {
+            type: String,
+            default: null
         }
     },
     watch: {
@@ -105,12 +116,15 @@ var script = {
         hide() {
             this.$emit('before-hide');
             this.overlayVisible = false;
+            this.$refs.focusInput.focus();
         },
-        onFocus() {
+        onFocus(event) {
             this.focused = true;
+            this.$emit('focus', event);
         },
-        onBlur() {
+        onBlur(event) {
             this.focused = false;
+            this.$emit('blur', event);
         },
         onClick(event) {
             if (!this.disabled && (!this.overlay || !this.overlay.contains(event.target)) && !utils.DomHandler.hasClass(event.target, 'p-treeselect-close')) {
@@ -141,36 +155,41 @@ var script = {
             this.expandedKeys = keys;
         },
         onKeyDown(event) {
-            switch(event.which) {
-                //down
-                case 40:
-                    if (!this.overlayVisible && event.altKey) {
+            switch(event.code) {
+                case 'Down':
+                case 'ArrowDown':
+                    if (this.overlayVisible) {
+                        if (utils.DomHandler.findSingle(this.overlay, '.p-highlight')) {
+                            utils.DomHandler.findSingle(this.overlay, '.p-highlight').focus();
+                        }
+                        else utils.DomHandler.findSingle(this.overlay, '.p-treenode').children[0].focus();
+                    }
+                    else {
                         this.show();
-                        event.preventDefault();
                     }
+
+                    event.preventDefault();
                 break;
 
-                //space
-                case 32:
-                    if (!this.overlayVisible) {
+                case 'Space':
+                case 'Enter':
+                    if (this.overlayVisible) {
+                        this.hide();
+                    }
+                    else {
                         this.show();
-                        event.preventDefault();
                     }
+
+                    event.preventDefault();
                 break;
 
-                //enter and escape
-                case 13:
-                case 27:
+                case 'Escape':
+                case 'Tab':
                     if (this.overlayVisible) {
                         this.hide();
                         event.preventDefault();
                     }
                 break;
-
-                //tab
-                case 9:
-                    this.hide();
-                break;
             }
         },
         onOverlayEnter(el) {
@@ -375,6 +394,9 @@ var script = {
         },
         emptyOptions() {
             return !this.options || this.options.length === 0;
+        },
+        listId() {
+            return utils.UniqueComponentId() + '_list';
         }
     },
     components: {
@@ -387,10 +409,10 @@ var script = {
 };
 
 const _hoisted_1 = { class: "p-hidden-accessible" };
-const _hoisted_2 = ["id", "disabled", "tabindex", "aria-expanded", "aria-labelledby"];
+const _hoisted_2 = ["id", "disabled", "tabindex", "aria-labelledby", "aria-label", "aria-expanded", "aria-controls"];
 const _hoisted_3 = { class: "p-treeselect-label-container" };
 const _hoisted_4 = { class: "p-treeselect-token-label" };
-const _hoisted_5 = { class: "p-treeselect-trigger" };
+const _hoisted_5 = ["aria-expanded"];
 const _hoisted_6 = /*#__PURE__*/vue.createElementVNode("span", { class: "p-treeselect-trigger-icon pi pi-chevron-down" }, null, -1);
 const _hoisted_7 = {
   key: 0,
@@ -407,21 +429,25 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _cache[6] || (_cache[6] = (...args) => ($options.onClick && $options.onClick(...args)))
   }, [
     vue.createElementVNode("div", _hoisted_1, [
-      vue.createElementVNode("input", {
+      vue.createElementVNode("input", vue.mergeProps({
         ref: "focusInput",
         type: "text",
-        role: "listbox",
+        role: "combobox",
         id: $props.inputId,
+        class: $props.inputClass,
+        style: $props.inputStyle,
         readonly: "",
         disabled: $props.disabled,
-        onFocus: _cache[0] || (_cache[0] = (...args) => ($options.onFocus && $options.onFocus(...args))),
-        onBlur: _cache[1] || (_cache[1] = (...args) => ($options.onBlur && $options.onBlur(...args))),
-        onKeydown: _cache[2] || (_cache[2] = (...args) => ($options.onKeyDown && $options.onKeyDown(...args))),
-        tabindex: $props.tabindex,
-        "aria-haspopup": "true",
+        tabindex: !$props.disabled ? $props.tabindex : -1,
+        "aria-labelledby": _ctx.ariaLabelledby,
+        "aria-label": _ctx.ariaLabel,
+        "aria-haspopup": "tree",
         "aria-expanded": $data.overlayVisible,
-        "aria-labelledby": $props.ariaLabelledBy
-      }, null, 40, _hoisted_2)
+        "aria-controls": $options.listId,
+        onFocus: _cache[0] || (_cache[0] = $event => ($options.onFocus($event))),
+        onBlur: _cache[1] || (_cache[1] = $event => ($options.onBlur($event))),
+        onKeydown: _cache[2] || (_cache[2] = $event => ($options.onKeyDown($event)))
+      }, $props.inputProps), null, 16, _hoisted_2)
     ]),
     vue.createElementVNode("div", _hoisted_3, [
       vue.createElementVNode("div", {
@@ -455,11 +481,16 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         ])
       ], 2)
     ]),
-    vue.createElementVNode("div", _hoisted_5, [
+    vue.createElementVNode("div", {
+      class: "p-treeselect-trigger",
+      role: "button",
+      "aria-haspopup": "tree",
+      "aria-expanded": $data.overlayVisible
+    }, [
       vue.renderSlot(_ctx.$slots, "indicator", {}, () => [
         _hoisted_6
       ])
-    ]),
+    ], 8, _hoisted_5),
     vue.createVNode(_component_Portal, { appendTo: $props.appendTo }, {
       default: vue.withCtx(() => [
         vue.createVNode(vue.Transition, {
@@ -470,12 +501,12 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }, {
           default: vue.withCtx(() => [
             ($data.overlayVisible)
-              ? (vue.openBlock(), vue.createElementBlock("div", {
+              ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
                   key: 0,
                   ref: $options.overlayRef,
                   onClick: _cache[5] || (_cache[5] = (...args) => ($options.onOverlayClick && $options.onOverlayClick(...args))),
-                  class: vue.normalizeClass($options.panelStyleClass)
-                }, [
+                  class: $options.panelStyleClass
+                }, $props.panelProps), [
                   vue.renderSlot(_ctx.$slots, "header", {
                     value: $props.modelValue,
                     options: $props.options
@@ -485,6 +516,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                     style: vue.normalizeStyle({'max-height': $props.scrollHeight})
                   }, [
                     vue.createVNode(_component_TSTree, {
+                      id: $options.listId,
                       value: $props.options,
                       selectionMode: $props.selectionMode,
                       "onUpdate:selectionKeys": $options.onSelectionChange,
@@ -495,8 +527,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                       onNodeExpand: _cache[3] || (_cache[3] = $event => (_ctx.$emit('node-expand', $event))),
                       onNodeCollapse: _cache[4] || (_cache[4] = $event => (_ctx.$emit('node-collapse', $event))),
                       onNodeSelect: $options.onNodeSelect,
-                      onNodeUnselect: $options.onNodeUnselect
-                    }, null, 8, ["value", "selectionMode", "onUpdate:selectionKeys", "selectionKeys", "expandedKeys", "onUpdate:expandedKeys", "metaKeySelection", "onNodeSelect", "onNodeUnselect"]),
+                      onNodeUnselect: $options.onNodeUnselect,
+                      level: 0
+                    }, null, 8, ["id", "value", "selectionMode", "onUpdate:selectionKeys", "selectionKeys", "expandedKeys", "onUpdate:expandedKeys", "metaKeySelection", "onNodeSelect", "onNodeUnselect"]),
                     ($options.emptyOptions)
                       ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
                           vue.renderSlot(_ctx.$slots, "empty", {}, () => [
@@ -509,7 +542,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                     value: $props.modelValue,
                     options: $props.options
                   })
-                ], 2))
+                ], 16))
               : vue.createCommentVNode("", true)
           ]),
           _: 3

package/treeselect/treeselect.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),t=require("primevue/overlayeventbus"),l=require("primevue/tree"),i=require("primevue/ripple"),n=require("primevue/portal"),s=require("vue");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=o(t),a=o(l),d=o(i),c=o(n),p={name:"TreeSelect",emits:["update:modelValue","before-show","before-hide","change","show","hide","node-select","node-unselect","node-expand","node-collapse"],props:{modelValue:null,options:Array,scrollHeight:{type:String,default:"400px"},placeholder:String,disabled:Boolean,tabindex:String,inputId:String,ariaLabelledBy:null,selectionMode:{type:String,default:"single"},panelClass:{type:String,default:null},appendTo:{type:String,default:"body"},emptyMessage:{type:String,default:null},display:{type:String,default:"comma"},metaKeySelection:{type:Boolean,default:!0}},watch:{modelValue:{handler:function(){this.selfChange||this.updateTreeState(),this.selfChange=!1},immediate:!0},options(){this.updateTreeState()}},data:()=>({focused:!1,overlayVisible:!1,expandedKeys:{}}),outsideClickListener:null,resizeListener:null,scrollHandler:null,overlay:null,selfChange:!1,beforeUnmount(){this.unbindOutsideClickListener(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.overlay&&(e.ZIndexUtils.clear(this.overlay),this.overlay=null)},mounted(){this.updateTreeState()},methods:{show(){this.$emit("before-show"),this.overlayVisible=!0},hide(){this.$emit("before-hide"),this.overlayVisible=!1},onFocus(){this.focused=!0},onBlur(){this.focused=!1},onClick(t){this.disabled||this.overlay&&this.overlay.contains(t.target)||e.DomHandler.hasClass(t.target,"p-treeselect-close")||(this.overlayVisible?this.hide():this.show(),this.$refs.focusInput.focus())},onSelectionChange(e){this.selfChange=!0,this.$emit("update:modelValue",e),this.$emit("change",e)},onNodeSelect(e){this.$emit("node-select",e),"single"===this.selectionMode&&this.hide()},onNodeUnselect(e){this.$emit("node-unselect",e)},onNodeToggle(e){this.expandedKeys=e},onKeyDown(e){switch(e.which){case 40:!this.overlayVisible&&e.altKey&&(this.show(),e.preventDefault());break;case 32:this.overlayVisible||(this.show(),e.preventDefault());break;case 13:case 27:this.overlayVisible&&(this.hide(),e.preventDefault());break;case 9:this.hide()}},onOverlayEnter(t){e.ZIndexUtils.set("overlay",t,this.$primevue.config.zIndex.overlay),this.alignOverlay(),this.bindOutsideClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.scrollValueInView(),this.$emit("show")},onOverlayLeave(){this.unbindOutsideClickListener(),this.unbindScrollListener(),this.unbindResizeListener(),this.$emit("hide"),this.overlay=null},onOverlayAfterLeave(t){e.ZIndexUtils.clear(t)},alignOverlay(){"self"===this.appendTo?e.DomHandler.relativePosition(this.overlay,this.$el):(this.overlay.style.minWidth=e.DomHandler.getOuterWidth(this.$el)+"px",e.DomHandler.absolutePosition(this.overlay,this.$el))},bindOutsideClickListener(){this.outsideClickListener||(this.outsideClickListener=e=>{this.overlayVisible&&this.isOutsideClicked(e)&&this.hide()},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener(){this.scrollHandler||(this.scrollHandler=new e.ConnectedOverlayScrollHandler(this.$refs.container,(()=>{this.overlayVisible&&this.hide()}))),this.scrollHandler.bindScrollListener()},unbindScrollListener(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener(){this.resizeListener||(this.resizeListener=()=>{this.overlayVisible&&!e.DomHandler.isTouchDevice()&&this.hide()},window.addEventListener("resize",this.resizeListener))},unbindResizeListener(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},isOutsideClicked(e){return!(this.$el.isSameNode(e.target)||this.$el.contains(e.target)||this.overlay&&this.overlay.contains(e.target))},overlayRef(e){this.overlay=e},onOverlayClick(e){r.default.emit("overlay-click",{originalEvent:e,target:this.$el})},findSelectedNodes(e,t,l){if(e){if(this.isSelected(e,t)&&(l.push(e),delete t[e.key]),Object.keys(t).length&&e.children)for(let i of e.children)this.findSelectedNodes(i,t,l)}else for(let e of this.options)this.findSelectedNodes(e,t,l)},isSelected(e,t){return"checkbox"===this.selectionMode?t[e.key]&&t[e.key].checked:t[e.key]},updateTreeState(){let e={...this.modelValue};this.expandedKeys={},e&&this.options&&this.updateTreeBranchState(null,null,e)},updateTreeBranchState(e,t,l){if(e){if(this.isSelected(e,l)&&(this.expandPath(t),delete l[e.key]),Object.keys(l).length&&e.children)for(let i of e.children)t.push(e.key),this.updateTreeBranchState(i,t,l)}else for(let e of this.options)this.updateTreeBranchState(e,[],l)},expandPath(e){if(e.length>0)for(let t of e)this.expandedKeys[t]=!0},scrollValueInView(){if(this.overlay){let t=e.DomHandler.findSingle(this.overlay,"li.p-highlight");t&&t.scrollIntoView({block:"nearest",inline:"start"})}}},computed:{containerClass(){return["p-treeselect p-component p-inputwrapper",{"p-treeselect-chip":"chip"===this.display,"p-disabled":this.disabled,"p-focus":this.focused,"p-inputwrapper-filled":!this.emptyValue,"p-inputwrapper-focus":this.focused||this.overlayVisible}]},labelClass(){return["p-treeselect-label",{"p-placeholder":this.label===this.placeholder,"p-treeselect-label-empty":!this.placeholder&&this.emptyValue}]},panelStyleClass(){return["p-treeselect-panel p-component",this.panelClass,{"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple}]},selectedNodes(){let e=[];if(this.modelValue&&this.options){let t={...this.modelValue};this.findSelectedNodes(null,t,e)}return e},label(){let e=this.selectedNodes;return e.length?e.map((e=>e.label)).join(", "):this.placeholder},emptyMessageText(){return this.emptyMessage||this.$primevue.config.locale.emptyMessage},emptyValue(){return!this.modelValue||0===Object.keys(this.modelValue).length},emptyOptions(){return!this.options||0===this.options.length}},components:{TSTree:a.default,Portal:c.default},directives:{ripple:d.default}};const h={class:"p-hidden-accessible"},u=["id","disabled","tabindex","aria-expanded","aria-labelledby"],y={class:"p-treeselect-label-container"},m={class:"p-treeselect-token-label"},f={class:"p-treeselect-trigger"},v=s.createElementVNode("span",{class:"p-treeselect-trigger-icon pi pi-chevron-down"},null,-1),b={key:0,class:"p-treeselect-empty-message"};!function(e,t){void 0===t&&(t={});var l=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===l&&i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-treeselect {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    cursor: pointer;\n    position: relative;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-treeselect-trigger {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n}\n.p-treeselect-label-container {\n    overflow: hidden;\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n            flex: 1 1 auto;\n    cursor: pointer;\n}\n.p-treeselect-label  {\n    display: block;\n    white-space: nowrap;\n    cursor: pointer;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.p-treeselect-label-empty {\n    overflow: hidden;\n    visibility: hidden;\n}\n.p-treeselect-token {\n    cursor: default;\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-flex: 0;\n        -ms-flex: 0 0 auto;\n            flex: 0 0 auto;\n}\n.p-treeselect .p-treeselect-panel {\n    min-width: 100%;\n}\n.p-treeselect-panel {\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-treeselect-items-wrapper {\n    overflow: auto;\n}\n.p-fluid .p-treeselect {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n}\n"),p.render=function(e,t,l,i,n,o){const r=s.resolveComponent("TSTree"),a=s.resolveComponent("Portal");return s.openBlock(),s.createElementBlock("div",{ref:"container",class:s.normalizeClass(o.containerClass),onClick:t[6]||(t[6]=(...e)=>o.onClick&&o.onClick(...e))},[s.createElementVNode("div",h,[s.createElementVNode("input",{ref:"focusInput",type:"text",role:"listbox",id:l.inputId,readonly:"",disabled:l.disabled,onFocus:t[0]||(t[0]=(...e)=>o.onFocus&&o.onFocus(...e)),onBlur:t[1]||(t[1]=(...e)=>o.onBlur&&o.onBlur(...e)),onKeydown:t[2]||(t[2]=(...e)=>o.onKeyDown&&o.onKeyDown(...e)),tabindex:l.tabindex,"aria-haspopup":"true","aria-expanded":n.overlayVisible,"aria-labelledby":l.ariaLabelledBy},null,40,u)]),s.createElementVNode("div",y,[s.createElementVNode("div",{class:s.normalizeClass(o.labelClass)},[s.renderSlot(e.$slots,"value",{value:o.selectedNodes,placeholder:l.placeholder},(()=>["comma"===l.display?(s.openBlock(),s.createElementBlock(s.Fragment,{key:0},[s.createTextVNode(s.toDisplayString(o.label||"empty"),1)],64)):"chip"===l.display?(s.openBlock(),s.createElementBlock(s.Fragment,{key:1},[(s.openBlock(!0),s.createElementBlock(s.Fragment,null,s.renderList(o.selectedNodes,(e=>(s.openBlock(),s.createElementBlock("div",{class:"p-treeselect-token",key:e.key},[s.createElementVNode("span",m,s.toDisplayString(e.label),1)])))),128)),o.emptyValue?(s.openBlock(),s.createElementBlock(s.Fragment,{key:0},[s.createTextVNode(s.toDisplayString(l.placeholder||"empty"),1)],64)):s.createCommentVNode("",!0)],64)):s.createCommentVNode("",!0)]))],2)]),s.createElementVNode("div",f,[s.renderSlot(e.$slots,"indicator",{},(()=>[v]))]),s.createVNode(a,{appendTo:l.appendTo},{default:s.withCtx((()=>[s.createVNode(s.Transition,{name:"p-connected-overlay",onEnter:o.onOverlayEnter,onLeave:o.onOverlayLeave,onAfterLeave:o.onOverlayAfterLeave},{default:s.withCtx((()=>[n.overlayVisible?(s.openBlock(),s.createElementBlock("div",{key:0,ref:o.overlayRef,onClick:t[5]||(t[5]=(...e)=>o.onOverlayClick&&o.onOverlayClick(...e)),class:s.normalizeClass(o.panelStyleClass)},[s.renderSlot(e.$slots,"header",{value:l.modelValue,options:l.options}),s.createElementVNode("div",{class:"p-treeselect-items-wrapper",style:s.normalizeStyle({"max-height":l.scrollHeight})},[s.createVNode(r,{value:l.options,selectionMode:l.selectionMode,"onUpdate:selectionKeys":o.onSelectionChange,selectionKeys:l.modelValue,expandedKeys:n.expandedKeys,"onUpdate:expandedKeys":o.onNodeToggle,metaKeySelection:l.metaKeySelection,onNodeExpand:t[3]||(t[3]=t=>e.$emit("node-expand",t)),onNodeCollapse:t[4]||(t[4]=t=>e.$emit("node-collapse",t)),onNodeSelect:o.onNodeSelect,onNodeUnselect:o.onNodeUnselect},null,8,["value","selectionMode","onUpdate:selectionKeys","selectionKeys","expandedKeys","onUpdate:expandedKeys","metaKeySelection","onNodeSelect","onNodeUnselect"]),o.emptyOptions?(s.openBlock(),s.createElementBlock("div",b,[s.renderSlot(e.$slots,"empty",{},(()=>[s.createTextVNode(s.toDisplayString(o.emptyMessageText),1)]))])):s.createCommentVNode("",!0)],4),s.renderSlot(e.$slots,"footer",{value:l.modelValue,options:l.options})],2)):s.createCommentVNode("",!0)])),_:3},8,["onEnter","onLeave","onAfterLeave"])])),_:3},8,["appendTo"])],2)},module.exports=p;
+"use strict";var e=require("primevue/utils"),t=require("primevue/overlayeventbus"),l=require("primevue/tree"),i=require("primevue/ripple"),n=require("primevue/portal"),s=require("vue");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=o(t),a=o(l),d=o(i),c=o(n),p={name:"TreeSelect",emits:["update:modelValue","before-show","before-hide","change","show","hide","node-select","node-unselect","node-expand","node-collapse","focus","blur"],props:{modelValue:null,options:Array,scrollHeight:{type:String,default:"400px"},placeholder:String,disabled:Boolean,tabindex:String,selectionMode:{type:String,default:"single"},panelClass:{type:String,default:null},panelProps:null,appendTo:{type:String,default:"body"},emptyMessage:{type:String,default:null},display:{type:String,default:"comma"},metaKeySelection:{type:Boolean,default:!0},inputId:String,inputClass:String,inputStyle:null,inputProps:null,"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},watch:{modelValue:{handler:function(){this.selfChange||this.updateTreeState(),this.selfChange=!1},immediate:!0},options(){this.updateTreeState()}},data:()=>({focused:!1,overlayVisible:!1,expandedKeys:{}}),outsideClickListener:null,resizeListener:null,scrollHandler:null,overlay:null,selfChange:!1,beforeUnmount(){this.unbindOutsideClickListener(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.overlay&&(e.ZIndexUtils.clear(this.overlay),this.overlay=null)},mounted(){this.updateTreeState()},methods:{show(){this.$emit("before-show"),this.overlayVisible=!0},hide(){this.$emit("before-hide"),this.overlayVisible=!1,this.$refs.focusInput.focus()},onFocus(e){this.focused=!0,this.$emit("focus",e)},onBlur(e){this.focused=!1,this.$emit("blur",e)},onClick(t){this.disabled||this.overlay&&this.overlay.contains(t.target)||e.DomHandler.hasClass(t.target,"p-treeselect-close")||(this.overlayVisible?this.hide():this.show(),this.$refs.focusInput.focus())},onSelectionChange(e){this.selfChange=!0,this.$emit("update:modelValue",e),this.$emit("change",e)},onNodeSelect(e){this.$emit("node-select",e),"single"===this.selectionMode&&this.hide()},onNodeUnselect(e){this.$emit("node-unselect",e)},onNodeToggle(e){this.expandedKeys=e},onKeyDown(t){switch(t.code){case"Down":case"ArrowDown":this.overlayVisible?e.DomHandler.findSingle(this.overlay,".p-highlight")?e.DomHandler.findSingle(this.overlay,".p-highlight").focus():e.DomHandler.findSingle(this.overlay,".p-treenode").children[0].focus():this.show(),t.preventDefault();break;case"Space":case"Enter":this.overlayVisible?this.hide():this.show(),t.preventDefault();break;case"Escape":case"Tab":this.overlayVisible&&(this.hide(),t.preventDefault())}},onOverlayEnter(t){e.ZIndexUtils.set("overlay",t,this.$primevue.config.zIndex.overlay),this.alignOverlay(),this.bindOutsideClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.scrollValueInView(),this.$emit("show")},onOverlayLeave(){this.unbindOutsideClickListener(),this.unbindScrollListener(),this.unbindResizeListener(),this.$emit("hide"),this.overlay=null},onOverlayAfterLeave(t){e.ZIndexUtils.clear(t)},alignOverlay(){"self"===this.appendTo?e.DomHandler.relativePosition(this.overlay,this.$el):(this.overlay.style.minWidth=e.DomHandler.getOuterWidth(this.$el)+"px",e.DomHandler.absolutePosition(this.overlay,this.$el))},bindOutsideClickListener(){this.outsideClickListener||(this.outsideClickListener=e=>{this.overlayVisible&&this.isOutsideClicked(e)&&this.hide()},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},bindScrollListener(){this.scrollHandler||(this.scrollHandler=new e.ConnectedOverlayScrollHandler(this.$refs.container,(()=>{this.overlayVisible&&this.hide()}))),this.scrollHandler.bindScrollListener()},unbindScrollListener(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()},bindResizeListener(){this.resizeListener||(this.resizeListener=()=>{this.overlayVisible&&!e.DomHandler.isTouchDevice()&&this.hide()},window.addEventListener("resize",this.resizeListener))},unbindResizeListener(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)},isOutsideClicked(e){return!(this.$el.isSameNode(e.target)||this.$el.contains(e.target)||this.overlay&&this.overlay.contains(e.target))},overlayRef(e){this.overlay=e},onOverlayClick(e){r.default.emit("overlay-click",{originalEvent:e,target:this.$el})},findSelectedNodes(e,t,l){if(e){if(this.isSelected(e,t)&&(l.push(e),delete t[e.key]),Object.keys(t).length&&e.children)for(let i of e.children)this.findSelectedNodes(i,t,l)}else for(let e of this.options)this.findSelectedNodes(e,t,l)},isSelected(e,t){return"checkbox"===this.selectionMode?t[e.key]&&t[e.key].checked:t[e.key]},updateTreeState(){let e={...this.modelValue};this.expandedKeys={},e&&this.options&&this.updateTreeBranchState(null,null,e)},updateTreeBranchState(e,t,l){if(e){if(this.isSelected(e,l)&&(this.expandPath(t),delete l[e.key]),Object.keys(l).length&&e.children)for(let i of e.children)t.push(e.key),this.updateTreeBranchState(i,t,l)}else for(let e of this.options)this.updateTreeBranchState(e,[],l)},expandPath(e){if(e.length>0)for(let t of e)this.expandedKeys[t]=!0},scrollValueInView(){if(this.overlay){let t=e.DomHandler.findSingle(this.overlay,"li.p-highlight");t&&t.scrollIntoView({block:"nearest",inline:"start"})}}},computed:{containerClass(){return["p-treeselect p-component p-inputwrapper",{"p-treeselect-chip":"chip"===this.display,"p-disabled":this.disabled,"p-focus":this.focused,"p-inputwrapper-filled":!this.emptyValue,"p-inputwrapper-focus":this.focused||this.overlayVisible}]},labelClass(){return["p-treeselect-label",{"p-placeholder":this.label===this.placeholder,"p-treeselect-label-empty":!this.placeholder&&this.emptyValue}]},panelStyleClass(){return["p-treeselect-panel p-component",this.panelClass,{"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple}]},selectedNodes(){let e=[];if(this.modelValue&&this.options){let t={...this.modelValue};this.findSelectedNodes(null,t,e)}return e},label(){let e=this.selectedNodes;return e.length?e.map((e=>e.label)).join(", "):this.placeholder},emptyMessageText(){return this.emptyMessage||this.$primevue.config.locale.emptyMessage},emptyValue(){return!this.modelValue||0===Object.keys(this.modelValue).length},emptyOptions(){return!this.options||0===this.options.length},listId:()=>e.UniqueComponentId()+"_list"},components:{TSTree:a.default,Portal:c.default},directives:{ripple:d.default}};const h={class:"p-hidden-accessible"},u=["id","disabled","tabindex","aria-labelledby","aria-label","aria-expanded","aria-controls"],y={class:"p-treeselect-label-container"},m={class:"p-treeselect-token-label"},f=["aria-expanded"],b=s.createElementVNode("span",{class:"p-treeselect-trigger-icon pi pi-chevron-down"},null,-1),v={key:0,class:"p-treeselect-empty-message"};!function(e,t){void 0===t&&(t={});var l=t.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===l&&i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-treeselect {\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    cursor: pointer;\n    position: relative;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n.p-treeselect-trigger {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n}\n.p-treeselect-label-container {\n    overflow: hidden;\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n            flex: 1 1 auto;\n    cursor: pointer;\n}\n.p-treeselect-label  {\n    display: block;\n    white-space: nowrap;\n    cursor: pointer;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.p-treeselect-label-empty {\n    overflow: hidden;\n    visibility: hidden;\n}\n.p-treeselect-token {\n    cursor: default;\n    display: -webkit-inline-box;\n    display: -ms-inline-flexbox;\n    display: inline-flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-flex: 0;\n        -ms-flex: 0 0 auto;\n            flex: 0 0 auto;\n}\n.p-treeselect .p-treeselect-panel {\n    min-width: 100%;\n}\n.p-treeselect-panel {\n    position: absolute;\n    top: 0;\n    left: 0;\n}\n.p-treeselect-items-wrapper {\n    overflow: auto;\n}\n.p-fluid .p-treeselect {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n}\n"),p.render=function(e,t,l,i,n,o){const r=s.resolveComponent("TSTree"),a=s.resolveComponent("Portal");return s.openBlock(),s.createElementBlock("div",{ref:"container",class:s.normalizeClass(o.containerClass),onClick:t[6]||(t[6]=(...e)=>o.onClick&&o.onClick(...e))},[s.createElementVNode("div",h,[s.createElementVNode("input",s.mergeProps({ref:"focusInput",type:"text",role:"combobox",id:l.inputId,class:l.inputClass,style:l.inputStyle,readonly:"",disabled:l.disabled,tabindex:l.disabled?-1:l.tabindex,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-haspopup":"tree","aria-expanded":n.overlayVisible,"aria-controls":o.listId,onFocus:t[0]||(t[0]=e=>o.onFocus(e)),onBlur:t[1]||(t[1]=e=>o.onBlur(e)),onKeydown:t[2]||(t[2]=e=>o.onKeyDown(e))},l.inputProps),null,16,u)]),s.createElementVNode("div",y,[s.createElementVNode("div",{class:s.normalizeClass(o.labelClass)},[s.renderSlot(e.$slots,"value",{value:o.selectedNodes,placeholder:l.placeholder},(()=>["comma"===l.display?(s.openBlock(),s.createElementBlock(s.Fragment,{key:0},[s.createTextVNode(s.toDisplayString(o.label||"empty"),1)],64)):"chip"===l.display?(s.openBlock(),s.createElementBlock(s.Fragment,{key:1},[(s.openBlock(!0),s.createElementBlock(s.Fragment,null,s.renderList(o.selectedNodes,(e=>(s.openBlock(),s.createElementBlock("div",{class:"p-treeselect-token",key:e.key},[s.createElementVNode("span",m,s.toDisplayString(e.label),1)])))),128)),o.emptyValue?(s.openBlock(),s.createElementBlock(s.Fragment,{key:0},[s.createTextVNode(s.toDisplayString(l.placeholder||"empty"),1)],64)):s.createCommentVNode("",!0)],64)):s.createCommentVNode("",!0)]))],2)]),s.createElementVNode("div",{class:"p-treeselect-trigger",role:"button","aria-haspopup":"tree","aria-expanded":n.overlayVisible},[s.renderSlot(e.$slots,"indicator",{},(()=>[b]))],8,f),s.createVNode(a,{appendTo:l.appendTo},{default:s.withCtx((()=>[s.createVNode(s.Transition,{name:"p-connected-overlay",onEnter:o.onOverlayEnter,onLeave:o.onOverlayLeave,onAfterLeave:o.onOverlayAfterLeave},{default:s.withCtx((()=>[n.overlayVisible?(s.openBlock(),s.createElementBlock("div",s.mergeProps({key:0,ref:o.overlayRef,onClick:t[5]||(t[5]=(...e)=>o.onOverlayClick&&o.onOverlayClick(...e)),class:o.panelStyleClass},l.panelProps),[s.renderSlot(e.$slots,"header",{value:l.modelValue,options:l.options}),s.createElementVNode("div",{class:"p-treeselect-items-wrapper",style:s.normalizeStyle({"max-height":l.scrollHeight})},[s.createVNode(r,{id:o.listId,value:l.options,selectionMode:l.selectionMode,"onUpdate:selectionKeys":o.onSelectionChange,selectionKeys:l.modelValue,expandedKeys:n.expandedKeys,"onUpdate:expandedKeys":o.onNodeToggle,metaKeySelection:l.metaKeySelection,onNodeExpand:t[3]||(t[3]=t=>e.$emit("node-expand",t)),onNodeCollapse:t[4]||(t[4]=t=>e.$emit("node-collapse",t)),onNodeSelect:o.onNodeSelect,onNodeUnselect:o.onNodeUnselect,level:0},null,8,["id","value","selectionMode","onUpdate:selectionKeys","selectionKeys","expandedKeys","onUpdate:expandedKeys","metaKeySelection","onNodeSelect","onNodeUnselect"]),o.emptyOptions?(s.openBlock(),s.createElementBlock("div",v,[s.renderSlot(e.$slots,"empty",{},(()=>[s.createTextVNode(s.toDisplayString(o.emptyMessageText),1)]))])):s.createCommentVNode("",!0)],4),s.renderSlot(e.$slots,"footer",{value:l.modelValue,options:l.options})],16)):s.createCommentVNode("",!0)])),_:3},8,["onEnter","onLeave","onAfterLeave"])])),_:3},8,["appendTo"])],2)},module.exports=p;