primevue
Version:
PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBloc
2 lines (1 loc) • 8.78 kB
JavaScript
this.primevue=this.primevue||{},this.primevue.chips=function(e,t,n,o,r){"use strict";function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=i(e);function l(e){return d(e)||c(e)||s(e)||u()}function u(){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 s(e,t){if(e){if("string"==typeof e)return p(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?p(e,t):void 0}}function c(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function d(e){if(Array.isArray(e))return p(e)}function p(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}var f={name:"Chips",extends:{name:"BaseChips",extends:i(n).default,props:{modelValue:{type:Array,default:null},max:{type:Number,default:null},separator:{type:[String,Object],default:null},addOnBlur:{type:Boolean,default:null},allowDuplicate:{type:Boolean,default:!0},placeholder:{type:String,default:null},disabled:{type:Boolean,default:!1},inputId:{type:String,default:null},inputClass:{type:[String,Object],default:null},inputStyle:{type:Object,default:null},inputProps:{type:null,default:null},removeTokenIcon:{type:String,default:void 0},ariaLabelledby:{type:String,default:null},ariaLabel:{type:String,default:null}},style:i(o).default,provide:function(){return{$parentInstance:this}}},emits:["update:modelValue","add","remove","focus","blur"],data:function(){return{id:t.UniqueComponentId(),inputValue:null,focused:!1,focusedIndex:null}},methods:{onWrapperClick:function(){this.$refs.input.focus()},onInput:function(e){this.inputValue=e.target.value,this.focusedIndex=null},onFocus:function(e){this.focused=!0,this.focusedIndex=null,this.$emit("focus",e)},onBlur:function(e){this.focused=!1,this.focusedIndex=null,this.addOnBlur&&this.addItem(e,e.target.value,!1),this.$emit("blur",e)},onKeyDown:function(e){var t=e.target.value;switch(e.code){case"Backspace":0===t.length&&this.modelValue&&this.modelValue.length>0&&this.removeItem(e,null!==this.focusedIndex?this.focusedIndex:this.modelValue.length-1);break;case"Enter":case"NumpadEnter":t&&t.trim().length&&!this.maxedOut&&this.addItem(e,t,!0);break;case"ArrowLeft":0===t.length&&this.modelValue&&this.modelValue.length>0&&this.$refs.container.focus();break;case"ArrowRight":e.stopPropagation();break;default:this.separator&&(this.separator===e.key||e.key.match(this.separator))&&this.addItem(e,t,!0)}},onPaste:function(e){var t=this;if(this.separator){var n=(e.clipboardData||window.clipboardData).getData("Text");if(n){var o=this.modelValue||[],r=n.split(this.separator);r=r.filter((function(e){return t.allowDuplicate||-1===o.indexOf(e)})),o=[].concat(l(o),l(r)),this.updateModel(e,o,!0)}}},onContainerFocus:function(){this.focused=!0},onContainerBlur:function(){this.focusedIndex=-1,this.focused=!1},onContainerKeyDown:function(e){switch(e.code){case"ArrowLeft":this.onArrowLeftKeyOn(e);break;case"ArrowRight":this.onArrowRightKeyOn(e);break;case"Backspace":this.onBackspaceKeyOn(e)}},onArrowLeftKeyOn:function(){0===this.inputValue.length&&this.modelValue&&this.modelValue.length>0&&(this.focusedIndex=null===this.focusedIndex?this.modelValue.length-1:this.focusedIndex-1,this.focusedIndex<0&&(this.focusedIndex=0))},onArrowRightKeyOn:function(){0===this.inputValue.length&&this.modelValue&&this.modelValue.length>0&&(this.focusedIndex===this.modelValue.length-1?(this.focusedIndex=null,this.$refs.input.focus()):this.focusedIndex++)},onBackspaceKeyOn:function(e){null!==this.focusedIndex&&this.removeItem(e,this.focusedIndex)},updateModel:function(e,t,n){var o=this;this.$emit("update:modelValue",t),this.$emit("add",{originalEvent:e,value:t}),this.$refs.input.value="",this.inputValue="",setTimeout((function(){o.maxedOut&&(o.focused=!1)}),0),n&&e.preventDefault()},addItem:function(e,t,n){if(t&&t.trim().length){var o=this.modelValue?l(this.modelValue):[];(this.allowDuplicate||-1===o.indexOf(t))&&(o.push(t),this.updateModel(e,o,n))}},removeItem:function(e,t){if(!this.disabled){var n=l(this.modelValue),o=n.splice(t,1);this.focusedIndex=null,this.$refs.input.focus(),this.$emit("update:modelValue",n),this.$emit("remove",{originalEvent:e,value:o})}}},computed:{maxedOut:function(){return this.max&&this.modelValue&&this.max===this.modelValue.length},focusedOptionId:function(){return null!==this.focusedIndex?"".concat(this.id,"_chips_item_").concat(this.focusedIndex):null}},components:{TimesCircleIcon:a.default}};function m(e){return m="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},m(e)}function h(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function y(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?h(Object(n),!0).forEach((function(t){b(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):h(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function b(e,t,n){var o;return(t="symbol"==m(o=v(t,"string"))?o:String(o))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function v(e,t){if("object"!=m(e)||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!=m(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var g=["aria-labelledby","aria-label","aria-activedescendant"],I=["id","aria-label","aria-setsize","aria-posinset","data-p-focused"],x=["id","disabled","placeholder"];return f.render=function(e,t,n,o,i,a){return r.openBlock(),r.createElementBlock("div",r.mergeProps({class:e.cx("root")},e.ptm("root"),{"data-pc-name":"chips"}),[r.createElementVNode("ul",r.mergeProps({ref:"container",class:e.cx("container"),tabindex:"-1",role:"listbox","aria-orientation":"horizontal","aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-activedescendant":i.focused?a.focusedOptionId:void 0,onClick:t[5]||(t[5]=function(e){return a.onWrapperClick()}),onFocus:t[6]||(t[6]=function(){return a.onContainerFocus&&a.onContainerFocus.apply(a,arguments)}),onBlur:t[7]||(t[7]=function(){return a.onContainerBlur&&a.onContainerBlur.apply(a,arguments)}),onKeydown:t[8]||(t[8]=function(){return a.onContainerKeyDown&&a.onContainerKeyDown.apply(a,arguments)})},e.ptm("container")),[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(e.modelValue,(function(t,n){return r.openBlock(),r.createElementBlock("li",r.mergeProps({key:"".concat(n,"_").concat(t),id:i.id+"_chips_item_"+n,role:"option",class:e.cx("token",{index:n}),"aria-label":t,"aria-selected":!0,"aria-setsize":e.modelValue.length,"aria-posinset":n+1},e.ptm("token"),{"data-p-focused":i.focusedIndex===n}),[r.renderSlot(e.$slots,"chip",{class:r.normalizeClass(e.cx("label")),value:t},(function(){return[r.createElementVNode("span",r.mergeProps({class:e.cx("label")},e.ptm("label")),r.toDisplayString(t),17)]})),r.renderSlot(e.$slots,"removetokenicon",{class:r.normalizeClass(e.cx("removeTokenIcon")),index:n,onClick:function(e){return a.removeItem(e,n)},removeCallback:function(e){return a.removeItem(e,n)}},(function(){return[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.removeTokenIcon?"span":"TimesCircleIcon"),r.mergeProps({class:[e.cx("removeTokenIcon"),e.removeTokenIcon],onClick:function(e){return a.removeItem(e,n)},"aria-hidden":"true"},e.ptm("removeTokenIcon")),null,16,["class","onClick"]))]}))],16,I)})),128)),r.createElementVNode("li",r.mergeProps({class:e.cx("inputToken"),role:"option"},e.ptm("inputToken")),[r.createElementVNode("input",r.mergeProps({ref:"input",id:e.inputId,type:"text",class:e.inputClass,style:e.inputStyle,disabled:e.disabled||a.maxedOut,placeholder:e.placeholder,onFocus:t[0]||(t[0]=function(e){return a.onFocus(e)}),onBlur:t[1]||(t[1]=function(e){return a.onBlur(e)}),onInput:t[2]||(t[2]=function(){return a.onInput&&a.onInput.apply(a,arguments)}),onKeydown:t[3]||(t[3]=function(e){return a.onKeyDown(e)}),onPaste:t[4]||(t[4]=function(e){return a.onPaste(e)})},y(y({},e.inputProps),e.ptm("input"))),null,16,x)],16)],16,g)],16)},f}(primevue.icons.timescircle,primevue.utils,primevue.basecomponent,primevue.chips.style,Vue);