primevue 3.28.0 → 3.29.0

package/selectbutton/selectbutton.cjs.js

@@ -1,15 +1,18 @@
 'use strict';
 
+var BaseComponent = require('primevue/basecomponent');
 var Ripple = require('primevue/ripple');
 var utils = require('primevue/utils');
 var vue = require('vue');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
 var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
 
 var script = {
     name: 'SelectButton',
+    extends: BaseComponent__default["default"],
     emits: ['update:modelValue', 'focus', 'blur', 'change'],
     props: {
         modelValue: null,
@@ -57,6 +60,14 @@ var script = {
         getOptionRenderKey(option) {
             return this.dataKey ? utils.ObjectUtils.resolveFieldData(option, this.dataKey) : this.getOptionLabel(option);
         },
+        getPTOptions(option, key) {
+            return this.ptm(key, {
+                context: {
+                    active: this.isSelected(option),
+                    disabled: this.isOptionDisabled(option)
+                }
+            });
+        },
         isOptionDisabled(option) {
             return this.optionDisabled ? utils.ObjectUtils.resolveFieldData(option, this.optionDisabled) : false;
         },
@@ -187,42 +198,41 @@ var script = {
 
 const _hoisted_1 = ["aria-labelledby"];
 const _hoisted_2 = ["tabindex", "aria-label", "role", "aria-checked", "aria-disabled", "onClick", "onKeydown", "onBlur"];
-const _hoisted_3 = { class: "p-button-label" };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _directive_ripple = vue.resolveDirective("ripple");
 
-  return (vue.openBlock(), vue.createElementBlock("div", {
+  return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
     ref: "container",
-    class: vue.normalizeClass($options.containerClass),
+    class: $options.containerClass,
     role: "group",
     "aria-labelledby": _ctx.ariaLabelledby
-  }, [
+  }, _ctx.ptm('root')), [
     (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.options, (option, i) => {
-      return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+      return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         key: $options.getOptionRenderKey(option),
         tabindex: i === $data.focusedIndex ? '0' : '-1',
         "aria-label": $options.getOptionLabel(option),
         role: $props.multiple ? 'checkbox' : 'radio',
         "aria-checked": $options.isSelected(option),
         "aria-disabled": $props.optionDisabled,
-        class: vue.normalizeClass($options.getButtonClass(option, i)),
+        class: $options.getButtonClass(option, i),
         onClick: $event => ($options.onOptionSelect($event, option, i)),
         onKeydown: $event => ($options.onKeydown($event, option, i)),
         onFocus: _cache[0] || (_cache[0] = $event => ($options.onFocus($event))),
         onBlur: $event => ($options.onBlur($event, option))
-      }, [
+      }, $options.getPTOptions(option, 'button')), [
         vue.renderSlot(_ctx.$slots, "option", {
           option: option,
           index: i
         }, () => [
-          vue.createElementVNode("span", _hoisted_3, vue.toDisplayString($options.getOptionLabel(option)), 1)
+          vue.createElementVNode("span", vue.mergeProps({ class: "p-button-label" }, $options.getPTOptions(option, 'label')), vue.toDisplayString($options.getOptionLabel(option)), 17)
         ])
-      ], 42, _hoisted_2)), [
+      ], 16, _hoisted_2)), [
         [_directive_ripple]
       ])
     }), 128))
-  ], 10, _hoisted_1))
+  ], 16, _hoisted_1))
 }
 
 script.render = render;

package/selectbutton/selectbutton.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/ripple"),t=require("primevue/utils"),l=require("vue");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n={name:"SelectButton",emits:["update:modelValue","focus","blur","change"],props:{modelValue:null,options:Array,optionLabel:null,optionValue:null,optionDisabled:null,multiple:Boolean,unselectable:{type:Boolean,default:!1},disabled:Boolean,dataKey:null,"aria-labelledby":{type:String,default:null}},data:()=>({focusedIndex:0}),mounted(){this.defaultTabIndexes()},methods:{defaultTabIndexes(){let e=t.DomHandler.find(this.$refs.container,".p-button"),l=t.DomHandler.findSingle(this.$refs.container,".p-highlight");for(let i=0;i<e.length;i++)(t.DomHandler.hasClass(e[i],"p-highlight")&&t.ObjectUtils.equals(e[i],l)||null===l&&0==i)&&(this.focusedIndex=i)},getOptionLabel(e){return this.optionLabel?t.ObjectUtils.resolveFieldData(e,this.optionLabel):e},getOptionValue(e){return this.optionValue?t.ObjectUtils.resolveFieldData(e,this.optionValue):e},getOptionRenderKey(e){return this.dataKey?t.ObjectUtils.resolveFieldData(e,this.dataKey):this.getOptionLabel(e)},isOptionDisabled(e){return!!this.optionDisabled&&t.ObjectUtils.resolveFieldData(e,this.optionDisabled)},onOptionSelect(e,l,i){if(this.disabled||this.isOptionDisabled(l))return;let n=this.isSelected(l);if(n&&this.unselectable)return;let a,o=this.getOptionValue(l);a=this.multiple?n?this.modelValue.filter((e=>!t.ObjectUtils.equals(e,o,this.equalityKey))):this.modelValue?[...this.modelValue,o]:[o]:n?null:o,this.focusedIndex=i,this.$emit("update:modelValue",a),this.$emit("change",{event:e,value:a})},isSelected(e){let l=!1,i=this.getOptionValue(e);if(this.multiple){if(this.modelValue)for(let e of this.modelValue)if(t.ObjectUtils.equals(e,i,this.equalityKey)){l=!0;break}}else l=t.ObjectUtils.equals(this.modelValue,i,this.equalityKey);return l},onKeydown(e,t,l){switch(e.code){case"Space":this.onOptionSelect(e,t,l),e.preventDefault();break;case"ArrowDown":case"ArrowRight":this.changeTabIndexes(e,"next"),e.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.changeTabIndexes(e,"prev"),e.preventDefault()}},changeTabIndexes(e,t){let l,i;for(let e=0;e<=this.$refs.container.children.length-1;e++)"0"===this.$refs.container.children[e].getAttribute("tabindex")&&(l={elem:this.$refs.container.children[e],index:e});i="prev"===t?0===l.index?this.$refs.container.children.length-1:l.index-1:l.index===this.$refs.container.children.length-1?0:l.index+1,this.focusedIndex=i,this.$refs.container.children[i].focus()},onFocus(e){this.$emit("focus",e)},onBlur(e,t){e.target&&e.relatedTarget&&e.target.parentElement!==e.relatedTarget.parentElement&&this.defaultTabIndexes(),this.$emit("blur",e,t)},getButtonClass(e){return["p-button p-component",{"p-highlight":this.isSelected(e),"p-disabled":this.isOptionDisabled(e)}]}},computed:{containerClass(){return["p-selectbutton p-buttonset p-component",{"p-disabled":this.disabled}]},equalityKey(){return this.optionValue?null:this.dataKey}},directives:{ripple:i(e).default}};const a=["aria-labelledby"],o=["tabindex","aria-label","role","aria-checked","aria-disabled","onClick","onKeydown","onBlur"],s={class:"p-button-label"};n.render=function(e,t,i,n,r,d){const u=l.resolveDirective("ripple");return l.openBlock(),l.createElementBlock("div",{ref:"container",class:l.normalizeClass(d.containerClass),role:"group","aria-labelledby":e.ariaLabelledby},[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(i.options,((n,a)=>l.withDirectives((l.openBlock(),l.createElementBlock("div",{key:d.getOptionRenderKey(n),tabindex:a===r.focusedIndex?"0":"-1","aria-label":d.getOptionLabel(n),role:i.multiple?"checkbox":"radio","aria-checked":d.isSelected(n),"aria-disabled":i.optionDisabled,class:l.normalizeClass(d.getButtonClass(n,a)),onClick:e=>d.onOptionSelect(e,n,a),onKeydown:e=>d.onKeydown(e,n,a),onFocus:t[0]||(t[0]=e=>d.onFocus(e)),onBlur:e=>d.onBlur(e,n)},[l.renderSlot(e.$slots,"option",{option:n,index:a},(()=>[l.createElementVNode("span",s,l.toDisplayString(d.getOptionLabel(n)),1)]))],42,o)),[[u]]))),128))],10,a)},module.exports=n;
+"use strict";var e=require("primevue/basecomponent"),t=require("primevue/ripple"),i=require("primevue/utils"),l=require("vue");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=n(e),o=n(t),s={name:"SelectButton",extends:a.default,emits:["update:modelValue","focus","blur","change"],props:{modelValue:null,options:Array,optionLabel:null,optionValue:null,optionDisabled:null,multiple:Boolean,unselectable:{type:Boolean,default:!1},disabled:Boolean,dataKey:null,"aria-labelledby":{type:String,default:null}},data:()=>({focusedIndex:0}),mounted(){this.defaultTabIndexes()},methods:{defaultTabIndexes(){let e=i.DomHandler.find(this.$refs.container,".p-button"),t=i.DomHandler.findSingle(this.$refs.container,".p-highlight");for(let l=0;l<e.length;l++)(i.DomHandler.hasClass(e[l],"p-highlight")&&i.ObjectUtils.equals(e[l],t)||null===t&&0==l)&&(this.focusedIndex=l)},getOptionLabel(e){return this.optionLabel?i.ObjectUtils.resolveFieldData(e,this.optionLabel):e},getOptionValue(e){return this.optionValue?i.ObjectUtils.resolveFieldData(e,this.optionValue):e},getOptionRenderKey(e){return this.dataKey?i.ObjectUtils.resolveFieldData(e,this.dataKey):this.getOptionLabel(e)},getPTOptions(e,t){return this.ptm(t,{context:{active:this.isSelected(e),disabled:this.isOptionDisabled(e)}})},isOptionDisabled(e){return!!this.optionDisabled&&i.ObjectUtils.resolveFieldData(e,this.optionDisabled)},onOptionSelect(e,t,l){if(this.disabled||this.isOptionDisabled(t))return;let n=this.isSelected(t);if(n&&this.unselectable)return;let a,o=this.getOptionValue(t);a=this.multiple?n?this.modelValue.filter((e=>!i.ObjectUtils.equals(e,o,this.equalityKey))):this.modelValue?[...this.modelValue,o]:[o]:n?null:o,this.focusedIndex=l,this.$emit("update:modelValue",a),this.$emit("change",{event:e,value:a})},isSelected(e){let t=!1,l=this.getOptionValue(e);if(this.multiple){if(this.modelValue)for(let e of this.modelValue)if(i.ObjectUtils.equals(e,l,this.equalityKey)){t=!0;break}}else t=i.ObjectUtils.equals(this.modelValue,l,this.equalityKey);return t},onKeydown(e,t,i){switch(e.code){case"Space":this.onOptionSelect(e,t,i),e.preventDefault();break;case"ArrowDown":case"ArrowRight":this.changeTabIndexes(e,"next"),e.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.changeTabIndexes(e,"prev"),e.preventDefault()}},changeTabIndexes(e,t){let i,l;for(let e=0;e<=this.$refs.container.children.length-1;e++)"0"===this.$refs.container.children[e].getAttribute("tabindex")&&(i={elem:this.$refs.container.children[e],index:e});l="prev"===t?0===i.index?this.$refs.container.children.length-1:i.index-1:i.index===this.$refs.container.children.length-1?0:i.index+1,this.focusedIndex=l,this.$refs.container.children[l].focus()},onFocus(e){this.$emit("focus",e)},onBlur(e,t){e.target&&e.relatedTarget&&e.target.parentElement!==e.relatedTarget.parentElement&&this.defaultTabIndexes(),this.$emit("blur",e,t)},getButtonClass(e){return["p-button p-component",{"p-highlight":this.isSelected(e),"p-disabled":this.isOptionDisabled(e)}]}},computed:{containerClass(){return["p-selectbutton p-buttonset p-component",{"p-disabled":this.disabled}]},equalityKey(){return this.optionValue?null:this.dataKey}},directives:{ripple:o.default}};const r=["aria-labelledby"],d=["tabindex","aria-label","role","aria-checked","aria-disabled","onClick","onKeydown","onBlur"];s.render=function(e,t,i,n,a,o){const s=l.resolveDirective("ripple");return l.openBlock(),l.createElementBlock("div",l.mergeProps({ref:"container",class:o.containerClass,role:"group","aria-labelledby":e.ariaLabelledby},e.ptm("root")),[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(i.options,((n,r)=>l.withDirectives((l.openBlock(),l.createElementBlock("div",l.mergeProps({key:o.getOptionRenderKey(n),tabindex:r===a.focusedIndex?"0":"-1","aria-label":o.getOptionLabel(n),role:i.multiple?"checkbox":"radio","aria-checked":o.isSelected(n),"aria-disabled":i.optionDisabled,class:o.getButtonClass(n,r),onClick:e=>o.onOptionSelect(e,n,r),onKeydown:e=>o.onKeydown(e,n,r),onFocus:t[0]||(t[0]=e=>o.onFocus(e)),onBlur:e=>o.onBlur(e,n)},o.getPTOptions(n,"button")),[l.renderSlot(e.$slots,"option",{option:n,index:r},(()=>[l.createElementVNode("span",l.mergeProps({class:"p-button-label"},o.getPTOptions(n,"label")),l.toDisplayString(o.getOptionLabel(n)),17)]))],16,d)),[[s]]))),128))],16,r)},module.exports=s;

package/selectbutton/selectbutton.esm.js

@@ -1,9 +1,11 @@
+import BaseComponent from 'primevue/basecomponent';
 import Ripple from 'primevue/ripple';
 import { DomHandler, ObjectUtils } from 'primevue/utils';
-import { resolveDirective, openBlock, createElementBlock, normalizeClass, Fragment, renderList, withDirectives, renderSlot, createElementVNode, toDisplayString } from 'vue';
+import { resolveDirective, openBlock, createElementBlock, mergeProps, Fragment, renderList, withDirectives, renderSlot, createElementVNode, toDisplayString } from 'vue';
 
 var script = {
     name: 'SelectButton',
+    extends: BaseComponent,
     emits: ['update:modelValue', 'focus', 'blur', 'change'],
     props: {
         modelValue: null,
@@ -51,6 +53,14 @@ var script = {
         getOptionRenderKey(option) {
             return this.dataKey ? ObjectUtils.resolveFieldData(option, this.dataKey) : this.getOptionLabel(option);
         },
+        getPTOptions(option, key) {
+            return this.ptm(key, {
+                context: {
+                    active: this.isSelected(option),
+                    disabled: this.isOptionDisabled(option)
+                }
+            });
+        },
         isOptionDisabled(option) {
             return this.optionDisabled ? ObjectUtils.resolveFieldData(option, this.optionDisabled) : false;
         },
@@ -181,42 +191,41 @@ var script = {
 
 const _hoisted_1 = ["aria-labelledby"];
 const _hoisted_2 = ["tabindex", "aria-label", "role", "aria-checked", "aria-disabled", "onClick", "onKeydown", "onBlur"];
-const _hoisted_3 = { class: "p-button-label" };
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _directive_ripple = resolveDirective("ripple");
 
-  return (openBlock(), createElementBlock("div", {
+  return (openBlock(), createElementBlock("div", mergeProps({
     ref: "container",
-    class: normalizeClass($options.containerClass),
+    class: $options.containerClass,
     role: "group",
     "aria-labelledby": _ctx.ariaLabelledby
-  }, [
+  }, _ctx.ptm('root')), [
     (openBlock(true), createElementBlock(Fragment, null, renderList($props.options, (option, i) => {
-      return withDirectives((openBlock(), createElementBlock("div", {
+      return withDirectives((openBlock(), createElementBlock("div", mergeProps({
         key: $options.getOptionRenderKey(option),
         tabindex: i === $data.focusedIndex ? '0' : '-1',
         "aria-label": $options.getOptionLabel(option),
         role: $props.multiple ? 'checkbox' : 'radio',
         "aria-checked": $options.isSelected(option),
         "aria-disabled": $props.optionDisabled,
-        class: normalizeClass($options.getButtonClass(option, i)),
+        class: $options.getButtonClass(option, i),
         onClick: $event => ($options.onOptionSelect($event, option, i)),
         onKeydown: $event => ($options.onKeydown($event, option, i)),
         onFocus: _cache[0] || (_cache[0] = $event => ($options.onFocus($event))),
         onBlur: $event => ($options.onBlur($event, option))
-      }, [
+      }, $options.getPTOptions(option, 'button')), [
         renderSlot(_ctx.$slots, "option", {
           option: option,
           index: i
         }, () => [
-          createElementVNode("span", _hoisted_3, toDisplayString($options.getOptionLabel(option)), 1)
+          createElementVNode("span", mergeProps({ class: "p-button-label" }, $options.getPTOptions(option, 'label')), toDisplayString($options.getOptionLabel(option)), 17)
         ])
-      ], 42, _hoisted_2)), [
+      ], 16, _hoisted_2)), [
         [_directive_ripple]
       ])
     }), 128))
-  ], 10, _hoisted_1))
+  ], 16, _hoisted_1))
 }
 
 script.render = render;

package/selectbutton/selectbutton.esm.min.js

@@ -1 +1 @@
-import e from"primevue/ripple";import{DomHandler as t,ObjectUtils as i}from"primevue/utils";import{resolveDirective as l,openBlock as n,createElementBlock as a,normalizeClass as o,Fragment as s,renderList as r,withDirectives as d,renderSlot as u,createElementVNode as h,toDisplayString as p}from"vue";var c={name:"SelectButton",emits:["update:modelValue","focus","blur","change"],props:{modelValue:null,options:Array,optionLabel:null,optionValue:null,optionDisabled:null,multiple:Boolean,unselectable:{type:Boolean,default:!1},disabled:Boolean,dataKey:null,"aria-labelledby":{type:String,default:null}},data:()=>({focusedIndex:0}),mounted(){this.defaultTabIndexes()},methods:{defaultTabIndexes(){let e=t.find(this.$refs.container,".p-button"),l=t.findSingle(this.$refs.container,".p-highlight");for(let n=0;n<e.length;n++)(t.hasClass(e[n],"p-highlight")&&i.equals(e[n],l)||null===l&&0==n)&&(this.focusedIndex=n)},getOptionLabel(e){return this.optionLabel?i.resolveFieldData(e,this.optionLabel):e},getOptionValue(e){return this.optionValue?i.resolveFieldData(e,this.optionValue):e},getOptionRenderKey(e){return this.dataKey?i.resolveFieldData(e,this.dataKey):this.getOptionLabel(e)},isOptionDisabled(e){return!!this.optionDisabled&&i.resolveFieldData(e,this.optionDisabled)},onOptionSelect(e,t,l){if(this.disabled||this.isOptionDisabled(t))return;let n=this.isSelected(t);if(n&&this.unselectable)return;let a,o=this.getOptionValue(t);a=this.multiple?n?this.modelValue.filter((e=>!i.equals(e,o,this.equalityKey))):this.modelValue?[...this.modelValue,o]:[o]:n?null:o,this.focusedIndex=l,this.$emit("update:modelValue",a),this.$emit("change",{event:e,value:a})},isSelected(e){let t=!1,l=this.getOptionValue(e);if(this.multiple){if(this.modelValue)for(let e of this.modelValue)if(i.equals(e,l,this.equalityKey)){t=!0;break}}else t=i.equals(this.modelValue,l,this.equalityKey);return t},onKeydown(e,t,i){switch(e.code){case"Space":this.onOptionSelect(e,t,i),e.preventDefault();break;case"ArrowDown":case"ArrowRight":this.changeTabIndexes(e,"next"),e.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.changeTabIndexes(e,"prev"),e.preventDefault()}},changeTabIndexes(e,t){let i,l;for(let e=0;e<=this.$refs.container.children.length-1;e++)"0"===this.$refs.container.children[e].getAttribute("tabindex")&&(i={elem:this.$refs.container.children[e],index:e});l="prev"===t?0===i.index?this.$refs.container.children.length-1:i.index-1:i.index===this.$refs.container.children.length-1?0:i.index+1,this.focusedIndex=l,this.$refs.container.children[l].focus()},onFocus(e){this.$emit("focus",e)},onBlur(e,t){e.target&&e.relatedTarget&&e.target.parentElement!==e.relatedTarget.parentElement&&this.defaultTabIndexes(),this.$emit("blur",e,t)},getButtonClass(e){return["p-button p-component",{"p-highlight":this.isSelected(e),"p-disabled":this.isOptionDisabled(e)}]}},computed:{containerClass(){return["p-selectbutton p-buttonset p-component",{"p-disabled":this.disabled}]},equalityKey(){return this.optionValue?null:this.dataKey}},directives:{ripple:e}};const b=["aria-labelledby"],f=["tabindex","aria-label","role","aria-checked","aria-disabled","onClick","onKeydown","onBlur"],g={class:"p-button-label"};c.render=function(e,t,i,c,m,y){const x=l("ripple");return n(),a("div",{ref:"container",class:o(y.containerClass),role:"group","aria-labelledby":e.ariaLabelledby},[(n(!0),a(s,null,r(i.options,((l,s)=>d((n(),a("div",{key:y.getOptionRenderKey(l),tabindex:s===m.focusedIndex?"0":"-1","aria-label":y.getOptionLabel(l),role:i.multiple?"checkbox":"radio","aria-checked":y.isSelected(l),"aria-disabled":i.optionDisabled,class:o(y.getButtonClass(l,s)),onClick:e=>y.onOptionSelect(e,l,s),onKeydown:e=>y.onKeydown(e,l,s),onFocus:t[0]||(t[0]=e=>y.onFocus(e)),onBlur:e=>y.onBlur(e,l)},[u(e.$slots,"option",{option:l,index:s},(()=>[h("span",g,p(y.getOptionLabel(l)),1)]))],42,f)),[[x]]))),128))],10,b)};export{c as default};
+import e from"primevue/basecomponent";import t from"primevue/ripple";import{DomHandler as i,ObjectUtils as l}from"primevue/utils";import{resolveDirective as n,openBlock as a,createElementBlock as o,mergeProps as s,Fragment as r,renderList as d,withDirectives as u,renderSlot as p,createElementVNode as h,toDisplayString as c}from"vue";var b={name:"SelectButton",extends:e,emits:["update:modelValue","focus","blur","change"],props:{modelValue:null,options:Array,optionLabel:null,optionValue:null,optionDisabled:null,multiple:Boolean,unselectable:{type:Boolean,default:!1},disabled:Boolean,dataKey:null,"aria-labelledby":{type:String,default:null}},data:()=>({focusedIndex:0}),mounted(){this.defaultTabIndexes()},methods:{defaultTabIndexes(){let e=i.find(this.$refs.container,".p-button"),t=i.findSingle(this.$refs.container,".p-highlight");for(let n=0;n<e.length;n++)(i.hasClass(e[n],"p-highlight")&&l.equals(e[n],t)||null===t&&0==n)&&(this.focusedIndex=n)},getOptionLabel(e){return this.optionLabel?l.resolveFieldData(e,this.optionLabel):e},getOptionValue(e){return this.optionValue?l.resolveFieldData(e,this.optionValue):e},getOptionRenderKey(e){return this.dataKey?l.resolveFieldData(e,this.dataKey):this.getOptionLabel(e)},getPTOptions(e,t){return this.ptm(t,{context:{active:this.isSelected(e),disabled:this.isOptionDisabled(e)}})},isOptionDisabled(e){return!!this.optionDisabled&&l.resolveFieldData(e,this.optionDisabled)},onOptionSelect(e,t,i){if(this.disabled||this.isOptionDisabled(t))return;let n=this.isSelected(t);if(n&&this.unselectable)return;let a,o=this.getOptionValue(t);a=this.multiple?n?this.modelValue.filter((e=>!l.equals(e,o,this.equalityKey))):this.modelValue?[...this.modelValue,o]:[o]:n?null:o,this.focusedIndex=i,this.$emit("update:modelValue",a),this.$emit("change",{event:e,value:a})},isSelected(e){let t=!1,i=this.getOptionValue(e);if(this.multiple){if(this.modelValue)for(let e of this.modelValue)if(l.equals(e,i,this.equalityKey)){t=!0;break}}else t=l.equals(this.modelValue,i,this.equalityKey);return t},onKeydown(e,t,i){switch(e.code){case"Space":this.onOptionSelect(e,t,i),e.preventDefault();break;case"ArrowDown":case"ArrowRight":this.changeTabIndexes(e,"next"),e.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.changeTabIndexes(e,"prev"),e.preventDefault()}},changeTabIndexes(e,t){let i,l;for(let e=0;e<=this.$refs.container.children.length-1;e++)"0"===this.$refs.container.children[e].getAttribute("tabindex")&&(i={elem:this.$refs.container.children[e],index:e});l="prev"===t?0===i.index?this.$refs.container.children.length-1:i.index-1:i.index===this.$refs.container.children.length-1?0:i.index+1,this.focusedIndex=l,this.$refs.container.children[l].focus()},onFocus(e){this.$emit("focus",e)},onBlur(e,t){e.target&&e.relatedTarget&&e.target.parentElement!==e.relatedTarget.parentElement&&this.defaultTabIndexes(),this.$emit("blur",e,t)},getButtonClass(e){return["p-button p-component",{"p-highlight":this.isSelected(e),"p-disabled":this.isOptionDisabled(e)}]}},computed:{containerClass(){return["p-selectbutton p-buttonset p-component",{"p-disabled":this.disabled}]},equalityKey(){return this.optionValue?null:this.dataKey}},directives:{ripple:t}};const f=["aria-labelledby"],m=["tabindex","aria-label","role","aria-checked","aria-disabled","onClick","onKeydown","onBlur"];b.render=function(e,t,i,l,b,g){const y=n("ripple");return a(),o("div",s({ref:"container",class:g.containerClass,role:"group","aria-labelledby":e.ariaLabelledby},e.ptm("root")),[(a(!0),o(r,null,d(i.options,((l,n)=>u((a(),o("div",s({key:g.getOptionRenderKey(l),tabindex:n===b.focusedIndex?"0":"-1","aria-label":g.getOptionLabel(l),role:i.multiple?"checkbox":"radio","aria-checked":g.isSelected(l),"aria-disabled":i.optionDisabled,class:g.getButtonClass(l,n),onClick:e=>g.onOptionSelect(e,l,n),onKeydown:e=>g.onKeydown(e,l,n),onFocus:t[0]||(t[0]=e=>g.onFocus(e)),onBlur:e=>g.onBlur(e,l)},g.getPTOptions(l,"button")),[p(e.$slots,"option",{option:l,index:n},(()=>[h("span",s({class:"p-button-label"},g.getPTOptions(l,"label")),c(g.getOptionLabel(l)),17)]))],16,m)),[[y]]))),128))],16,f)};export{b as default};

package/selectbutton/selectbutton.js

@@ -1,13 +1,15 @@
 this.primevue = this.primevue || {};
-this.primevue.selectbutton = (function (Ripple, utils, vue) {
+this.primevue.selectbutton = (function (BaseComponent, Ripple, utils, vue) {
     'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+    var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
     var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
 
     var script = {
         name: 'SelectButton',
+        extends: BaseComponent__default["default"],
         emits: ['update:modelValue', 'focus', 'blur', 'change'],
         props: {
             modelValue: null,
@@ -55,6 +57,14 @@ this.primevue.selectbutton = (function (Ripple, utils, vue) {
             getOptionRenderKey(option) {
                 return this.dataKey ? utils.ObjectUtils.resolveFieldData(option, this.dataKey) : this.getOptionLabel(option);
             },
+            getPTOptions(option, key) {
+                return this.ptm(key, {
+                    context: {
+                        active: this.isSelected(option),
+                        disabled: this.isOptionDisabled(option)
+                    }
+                });
+            },
             isOptionDisabled(option) {
                 return this.optionDisabled ? utils.ObjectUtils.resolveFieldData(option, this.optionDisabled) : false;
             },
@@ -185,46 +195,45 @@ this.primevue.selectbutton = (function (Ripple, utils, vue) {
 
     const _hoisted_1 = ["aria-labelledby"];
     const _hoisted_2 = ["tabindex", "aria-label", "role", "aria-checked", "aria-disabled", "onClick", "onKeydown", "onBlur"];
-    const _hoisted_3 = { class: "p-button-label" };
 
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       const _directive_ripple = vue.resolveDirective("ripple");
 
-      return (vue.openBlock(), vue.createElementBlock("div", {
+      return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         ref: "container",
-        class: vue.normalizeClass($options.containerClass),
+        class: $options.containerClass,
         role: "group",
         "aria-labelledby": _ctx.ariaLabelledby
-      }, [
+      }, _ctx.ptm('root')), [
         (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($props.options, (option, i) => {
-          return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
+          return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
             key: $options.getOptionRenderKey(option),
             tabindex: i === $data.focusedIndex ? '0' : '-1',
             "aria-label": $options.getOptionLabel(option),
             role: $props.multiple ? 'checkbox' : 'radio',
             "aria-checked": $options.isSelected(option),
             "aria-disabled": $props.optionDisabled,
-            class: vue.normalizeClass($options.getButtonClass(option, i)),
+            class: $options.getButtonClass(option, i),
             onClick: $event => ($options.onOptionSelect($event, option, i)),
             onKeydown: $event => ($options.onKeydown($event, option, i)),
             onFocus: _cache[0] || (_cache[0] = $event => ($options.onFocus($event))),
             onBlur: $event => ($options.onBlur($event, option))
-          }, [
+          }, $options.getPTOptions(option, 'button')), [
             vue.renderSlot(_ctx.$slots, "option", {
               option: option,
               index: i
             }, () => [
-              vue.createElementVNode("span", _hoisted_3, vue.toDisplayString($options.getOptionLabel(option)), 1)
+              vue.createElementVNode("span", vue.mergeProps({ class: "p-button-label" }, $options.getPTOptions(option, 'label')), vue.toDisplayString($options.getOptionLabel(option)), 17)
             ])
-          ], 42, _hoisted_2)), [
+          ], 16, _hoisted_2)), [
             [_directive_ripple]
           ])
         }), 128))
-      ], 10, _hoisted_1))
+      ], 16, _hoisted_1))
     }
 
     script.render = render;
 
     return script;
 
-})(primevue.ripple, primevue.utils, Vue);
+})(primevue.basecomponent, primevue.ripple, primevue.utils, Vue);

package/selectbutton/selectbutton.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.selectbutton=function(e,t,l){"use strict";function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n={name:"SelectButton",emits:["update:modelValue","focus","blur","change"],props:{modelValue:null,options:Array,optionLabel:null,optionValue:null,optionDisabled:null,multiple:Boolean,unselectable:{type:Boolean,default:!1},disabled:Boolean,dataKey:null,"aria-labelledby":{type:String,default:null}},data:()=>({focusedIndex:0}),mounted(){this.defaultTabIndexes()},methods:{defaultTabIndexes(){let e=t.DomHandler.find(this.$refs.container,".p-button"),l=t.DomHandler.findSingle(this.$refs.container,".p-highlight");for(let i=0;i<e.length;i++)(t.DomHandler.hasClass(e[i],"p-highlight")&&t.ObjectUtils.equals(e[i],l)||null===l&&0==i)&&(this.focusedIndex=i)},getOptionLabel(e){return this.optionLabel?t.ObjectUtils.resolveFieldData(e,this.optionLabel):e},getOptionValue(e){return this.optionValue?t.ObjectUtils.resolveFieldData(e,this.optionValue):e},getOptionRenderKey(e){return this.dataKey?t.ObjectUtils.resolveFieldData(e,this.dataKey):this.getOptionLabel(e)},isOptionDisabled(e){return!!this.optionDisabled&&t.ObjectUtils.resolveFieldData(e,this.optionDisabled)},onOptionSelect(e,l,i){if(this.disabled||this.isOptionDisabled(l))return;let n=this.isSelected(l);if(n&&this.unselectable)return;let a,s=this.getOptionValue(l);a=this.multiple?n?this.modelValue.filter((e=>!t.ObjectUtils.equals(e,s,this.equalityKey))):this.modelValue?[...this.modelValue,s]:[s]:n?null:s,this.focusedIndex=i,this.$emit("update:modelValue",a),this.$emit("change",{event:e,value:a})},isSelected(e){let l=!1,i=this.getOptionValue(e);if(this.multiple){if(this.modelValue)for(let e of this.modelValue)if(t.ObjectUtils.equals(e,i,this.equalityKey)){l=!0;break}}else l=t.ObjectUtils.equals(this.modelValue,i,this.equalityKey);return l},onKeydown(e,t,l){switch(e.code){case"Space":this.onOptionSelect(e,t,l),e.preventDefault();break;case"ArrowDown":case"ArrowRight":this.changeTabIndexes(e,"next"),e.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.changeTabIndexes(e,"prev"),e.preventDefault()}},changeTabIndexes(e,t){let l,i;for(let e=0;e<=this.$refs.container.children.length-1;e++)"0"===this.$refs.container.children[e].getAttribute("tabindex")&&(l={elem:this.$refs.container.children[e],index:e});i="prev"===t?0===l.index?this.$refs.container.children.length-1:l.index-1:l.index===this.$refs.container.children.length-1?0:l.index+1,this.focusedIndex=i,this.$refs.container.children[i].focus()},onFocus(e){this.$emit("focus",e)},onBlur(e,t){e.target&&e.relatedTarget&&e.target.parentElement!==e.relatedTarget.parentElement&&this.defaultTabIndexes(),this.$emit("blur",e,t)},getButtonClass(e){return["p-button p-component",{"p-highlight":this.isSelected(e),"p-disabled":this.isOptionDisabled(e)}]}},computed:{containerClass(){return["p-selectbutton p-buttonset p-component",{"p-disabled":this.disabled}]},equalityKey(){return this.optionValue?null:this.dataKey}},directives:{ripple:i(e).default}};const a=["aria-labelledby"],s=["tabindex","aria-label","role","aria-checked","aria-disabled","onClick","onKeydown","onBlur"],o={class:"p-button-label"};return n.render=function(e,t,i,n,r,d){const u=l.resolveDirective("ripple");return l.openBlock(),l.createElementBlock("div",{ref:"container",class:l.normalizeClass(d.containerClass),role:"group","aria-labelledby":e.ariaLabelledby},[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(i.options,((n,a)=>l.withDirectives((l.openBlock(),l.createElementBlock("div",{key:d.getOptionRenderKey(n),tabindex:a===r.focusedIndex?"0":"-1","aria-label":d.getOptionLabel(n),role:i.multiple?"checkbox":"radio","aria-checked":d.isSelected(n),"aria-disabled":i.optionDisabled,class:l.normalizeClass(d.getButtonClass(n,a)),onClick:e=>d.onOptionSelect(e,n,a),onKeydown:e=>d.onKeydown(e,n,a),onFocus:t[0]||(t[0]=e=>d.onFocus(e)),onBlur:e=>d.onBlur(e,n)},[l.renderSlot(e.$slots,"option",{option:n,index:a},(()=>[l.createElementVNode("span",o,l.toDisplayString(d.getOptionLabel(n)),1)]))],42,s)),[[u]]))),128))],10,a)},n}(primevue.ripple,primevue.utils,Vue);
+this.primevue=this.primevue||{},this.primevue.selectbutton=function(e,t,i,l){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=n(e),s=n(t),o={name:"SelectButton",extends:a.default,emits:["update:modelValue","focus","blur","change"],props:{modelValue:null,options:Array,optionLabel:null,optionValue:null,optionDisabled:null,multiple:Boolean,unselectable:{type:Boolean,default:!1},disabled:Boolean,dataKey:null,"aria-labelledby":{type:String,default:null}},data:()=>({focusedIndex:0}),mounted(){this.defaultTabIndexes()},methods:{defaultTabIndexes(){let e=i.DomHandler.find(this.$refs.container,".p-button"),t=i.DomHandler.findSingle(this.$refs.container,".p-highlight");for(let l=0;l<e.length;l++)(i.DomHandler.hasClass(e[l],"p-highlight")&&i.ObjectUtils.equals(e[l],t)||null===t&&0==l)&&(this.focusedIndex=l)},getOptionLabel(e){return this.optionLabel?i.ObjectUtils.resolveFieldData(e,this.optionLabel):e},getOptionValue(e){return this.optionValue?i.ObjectUtils.resolveFieldData(e,this.optionValue):e},getOptionRenderKey(e){return this.dataKey?i.ObjectUtils.resolveFieldData(e,this.dataKey):this.getOptionLabel(e)},getPTOptions(e,t){return this.ptm(t,{context:{active:this.isSelected(e),disabled:this.isOptionDisabled(e)}})},isOptionDisabled(e){return!!this.optionDisabled&&i.ObjectUtils.resolveFieldData(e,this.optionDisabled)},onOptionSelect(e,t,l){if(this.disabled||this.isOptionDisabled(t))return;let n=this.isSelected(t);if(n&&this.unselectable)return;let a,s=this.getOptionValue(t);a=this.multiple?n?this.modelValue.filter((e=>!i.ObjectUtils.equals(e,s,this.equalityKey))):this.modelValue?[...this.modelValue,s]:[s]:n?null:s,this.focusedIndex=l,this.$emit("update:modelValue",a),this.$emit("change",{event:e,value:a})},isSelected(e){let t=!1,l=this.getOptionValue(e);if(this.multiple){if(this.modelValue)for(let e of this.modelValue)if(i.ObjectUtils.equals(e,l,this.equalityKey)){t=!0;break}}else t=i.ObjectUtils.equals(this.modelValue,l,this.equalityKey);return t},onKeydown(e,t,i){switch(e.code){case"Space":this.onOptionSelect(e,t,i),e.preventDefault();break;case"ArrowDown":case"ArrowRight":this.changeTabIndexes(e,"next"),e.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.changeTabIndexes(e,"prev"),e.preventDefault()}},changeTabIndexes(e,t){let i,l;for(let e=0;e<=this.$refs.container.children.length-1;e++)"0"===this.$refs.container.children[e].getAttribute("tabindex")&&(i={elem:this.$refs.container.children[e],index:e});l="prev"===t?0===i.index?this.$refs.container.children.length-1:i.index-1:i.index===this.$refs.container.children.length-1?0:i.index+1,this.focusedIndex=l,this.$refs.container.children[l].focus()},onFocus(e){this.$emit("focus",e)},onBlur(e,t){e.target&&e.relatedTarget&&e.target.parentElement!==e.relatedTarget.parentElement&&this.defaultTabIndexes(),this.$emit("blur",e,t)},getButtonClass(e){return["p-button p-component",{"p-highlight":this.isSelected(e),"p-disabled":this.isOptionDisabled(e)}]}},computed:{containerClass(){return["p-selectbutton p-buttonset p-component",{"p-disabled":this.disabled}]},equalityKey(){return this.optionValue?null:this.dataKey}},directives:{ripple:s.default}};const r=["aria-labelledby"],d=["tabindex","aria-label","role","aria-checked","aria-disabled","onClick","onKeydown","onBlur"];return o.render=function(e,t,i,n,a,s){const o=l.resolveDirective("ripple");return l.openBlock(),l.createElementBlock("div",l.mergeProps({ref:"container",class:s.containerClass,role:"group","aria-labelledby":e.ariaLabelledby},e.ptm("root")),[(l.openBlock(!0),l.createElementBlock(l.Fragment,null,l.renderList(i.options,((n,r)=>l.withDirectives((l.openBlock(),l.createElementBlock("div",l.mergeProps({key:s.getOptionRenderKey(n),tabindex:r===a.focusedIndex?"0":"-1","aria-label":s.getOptionLabel(n),role:i.multiple?"checkbox":"radio","aria-checked":s.isSelected(n),"aria-disabled":i.optionDisabled,class:s.getButtonClass(n,r),onClick:e=>s.onOptionSelect(e,n,r),onKeydown:e=>s.onKeydown(e,n,r),onFocus:t[0]||(t[0]=e=>s.onFocus(e)),onBlur:e=>s.onBlur(e,n)},s.getPTOptions(n,"button")),[l.renderSlot(e.$slots,"option",{option:n,index:r},(()=>[l.createElementVNode("span",l.mergeProps({class:"p-button-label"},s.getPTOptions(n,"label")),l.toDisplayString(s.getOptionLabel(n)),17)]))],16,d)),[[o]]))),128))],16,r)},o}(primevue.basecomponent,primevue.ripple,primevue.utils,Vue);

package/slider/Slider.d.ts

@@ -9,6 +9,49 @@
  */
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
+export declare type SliderPassThroughOptionType = SliderPassThroughAttributes | ((options: SliderPassThroughMethodOptions) => SliderPassThroughAttributes) | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface SliderPassThroughMethodOptions {
+    props: SliderProps;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link SliderProps.pt}
+ */
+export interface SliderPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: SliderPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the range's DOM element.
+     */
+    range?: SliderPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the handle's DOM element.
+     */
+    handle?: SliderPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the start handler's DOM element.
+     */
+    startHandler?: SliderPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the end handler's DOM element.
+     */
+    endHandler?: SliderPassThroughOptionType;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface SliderPassThroughAttributes {
+    [key: string]: any;
+}
+
 /**
  * Custom slide end event.
  * @see {@link SliderEmits.slideend}
@@ -74,6 +117,11 @@ export interface SliderProps {
      * Used to define a string that labels the element.
      */
     'aria-label'?: string | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {SliderPassThroughOptions}
+     */
+    pt?: SliderPassThroughOptions;
 }
 
 /**

package/slider/Slider.vue

@@ -1,6 +1,6 @@
 <template>
-    <div :class="containerClass" @click="onBarClick">
-        <span class="p-slider-range" :style="rangeStyle"></span>
+    <div :class="containerClass" @click="onBarClick" v-bind="ptm('root')">
+        <span class="p-slider-range" :style="rangeStyle" v-bind="ptm('range')"></span>
         <span
             v-if="!range"
             class="p-slider-handle"
@@ -18,6 +18,7 @@
             :aria-labelledby="ariaLabelledby"
             :aria-label="ariaLabel"
             :aria-orientation="orientation"
+            v-bind="ptm('handle')"
         ></span>
         <span
             v-if="range"
@@ -36,6 +37,7 @@
             :aria-labelledby="ariaLabelledby"
             :aria-label="ariaLabel"
             :aria-orientation="orientation"
+            v-bind="ptm('startHandler')"
         ></span>
         <span
             v-if="range"
@@ -54,15 +56,18 @@
             :aria-labelledby="ariaLabelledby"
             :aria-label="ariaLabel"
             :aria-orientation="orientation"
+            v-bind="ptm('endHandler')"
         ></span>
     </div>
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
 import { DomHandler } from 'primevue/utils';
 
 export default {
     name: 'Slider',
+    extends: BaseComponent,
     emits: ['update:modelValue', 'change', 'slideend'],
     props: {
         modelValue: [Number, Array],

package/slider/slider.cjs.js

@@ -1,10 +1,16 @@
 'use strict';
 
+var BaseComponent = require('primevue/basecomponent');
 var utils = require('primevue/utils');
 var vue = require('vue');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var BaseComponent__default = /*#__PURE__*/_interopDefaultLegacy(BaseComponent);
+
 var script = {
     name: 'Slider',
+    extends: BaseComponent__default["default"],
     emits: ['update:modelValue', 'change', 'slideend'],
     props: {
         modelValue: [Number, Array],
@@ -311,19 +317,19 @@ const _hoisted_2 = ["tabindex", "aria-valuemin", "aria-valuenow", "aria-valuemax
 const _hoisted_3 = ["tabindex", "aria-valuemin", "aria-valuenow", "aria-valuemax", "aria-labelledby", "aria-label", "aria-orientation"];
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return (vue.openBlock(), vue.createElementBlock("div", {
-    class: vue.normalizeClass($options.containerClass),
+  return (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+    class: $options.containerClass,
     onClick: _cache[15] || (_cache[15] = (...args) => ($options.onBarClick && $options.onBarClick(...args)))
-  }, [
-    vue.createElementVNode("span", {
+  }, _ctx.ptm('root')), [
+    vue.createElementVNode("span", vue.mergeProps({
       class: "p-slider-range",
-      style: vue.normalizeStyle($options.rangeStyle)
-    }, null, 4),
+      style: $options.rangeStyle
+    }, _ctx.ptm('range')), null, 16),
     (!$props.range)
-      ? (vue.openBlock(), vue.createElementBlock("span", {
+      ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
           key: 0,
           class: "p-slider-handle",
-          style: vue.normalizeStyle($options.handleStyle),
+          style: $options.handleStyle,
           onTouchstart: _cache[0] || (_cache[0] = $event => ($options.onDragStart($event))),
           onTouchmove: _cache[1] || (_cache[1] = $event => ($options.onDrag($event))),
           onTouchend: _cache[2] || (_cache[2] = $event => ($options.onDragEnd($event))),
@@ -337,13 +343,13 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           "aria-labelledby": _ctx.ariaLabelledby,
           "aria-label": _ctx.ariaLabel,
           "aria-orientation": $props.orientation
-        }, null, 44, _hoisted_1))
+        }, _ctx.ptm('handle')), null, 16, _hoisted_1))
       : vue.createCommentVNode("", true),
     ($props.range)
-      ? (vue.openBlock(), vue.createElementBlock("span", {
+      ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
           key: 1,
           class: "p-slider-handle",
-          style: vue.normalizeStyle($options.rangeStartHandleStyle),
+          style: $options.rangeStartHandleStyle,
           onTouchstart: _cache[5] || (_cache[5] = $event => ($options.onDragStart($event, 0))),
           onTouchmove: _cache[6] || (_cache[6] = $event => ($options.onDrag($event))),
           onTouchend: _cache[7] || (_cache[7] = $event => ($options.onDragEnd($event))),
@@ -357,13 +363,13 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           "aria-labelledby": _ctx.ariaLabelledby,
           "aria-label": _ctx.ariaLabel,
           "aria-orientation": $props.orientation
-        }, null, 44, _hoisted_2))
+        }, _ctx.ptm('startHandler')), null, 16, _hoisted_2))
       : vue.createCommentVNode("", true),
     ($props.range)
-      ? (vue.openBlock(), vue.createElementBlock("span", {
+      ? (vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
           key: 2,
           class: "p-slider-handle",
-          style: vue.normalizeStyle($options.rangeEndHandleStyle),
+          style: $options.rangeEndHandleStyle,
           onTouchstart: _cache[10] || (_cache[10] = $event => ($options.onDragStart($event, 1))),
           onTouchmove: _cache[11] || (_cache[11] = $event => ($options.onDrag($event))),
           onTouchend: _cache[12] || (_cache[12] = $event => ($options.onDragEnd($event))),
@@ -377,9 +383,9 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           "aria-labelledby": _ctx.ariaLabelledby,
           "aria-label": _ctx.ariaLabel,
           "aria-orientation": $props.orientation
-        }, null, 44, _hoisted_3))
+        }, _ctx.ptm('endHandler')), null, 16, _hoisted_3))
       : vue.createCommentVNode("", true)
-  ], 2))
+  ], 16))
 }
 
 function styleInject(css, ref) {

package/slider/slider.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),t=require("vue"),i={name:"Slider",emits:["update:modelValue","change","slideend"],props:{modelValue:[Number,Array],min:{type:Number,default:0},max:{type:Number,default:100},orientation:{type:String,default:"horizontal"},step:{type:Number,default:null},range:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},tabindex:{type:Number,default:0},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},dragging:!1,handleIndex:null,initX:null,initY:null,barWidth:null,barHeight:null,dragListener:null,dragEndListener:null,beforeUnmount(){this.unbindDragListeners()},methods:{updateDomData(){let t=this.$el.getBoundingClientRect();this.initX=t.left+e.DomHandler.getWindowScrollLeft(),this.initY=t.top+e.DomHandler.getWindowScrollTop(),this.barWidth=this.$el.offsetWidth,this.barHeight=this.$el.offsetHeight},setValue(e){let t,i=e.touches?e.touches[0].pageX:e.pageX,a=e.touches?e.touches[0].pageY:e.pageY;t="horizontal"===this.orientation?100*(i-this.initX)/this.barWidth:100*(this.initY+this.barHeight-a)/this.barHeight;let n=(this.max-this.min)*(t/100)+this.min;if(this.step){const e=this.range?this.modelValue[this.handleIndex]:this.modelValue,t=n-e;t<0?n=e+Math.ceil(n/this.step-e/this.step)*this.step:t>0&&(n=e+Math.floor(n/this.step-e/this.step)*this.step)}else n=Math.floor(n);this.updateModel(e,n)},updateModel(e,t){let i,a=parseFloat(t.toFixed(10));this.range?(i=this.modelValue?[...this.modelValue]:[],0==this.handleIndex?(a<this.min?a=this.min:a>=this.max&&(a=this.max),i[0]=a):(a>this.max?a=this.max:a<=this.min&&(a=this.min),i[1]=a)):(a<this.min?a=this.min:a>this.max&&(a=this.max),i=a),this.$emit("update:modelValue",i),this.$emit("change",i)},onDragStart(t,i){this.disabled||(e.DomHandler.addClass(this.$el,"p-slider-sliding"),this.dragging=!0,this.updateDomData(),this.range&&this.modelValue[0]===this.max?this.handleIndex=0:this.handleIndex=i,t.currentTarget.focus(),t.preventDefault())},onDrag(e){this.dragging&&(this.setValue(e),e.preventDefault())},onDragEnd(t){this.dragging&&(this.dragging=!1,e.DomHandler.removeClass(this.$el,"p-slider-sliding"),this.$emit("slideend",{originalEvent:t,value:this.modelValue}))},onBarClick(t){this.disabled||e.DomHandler.hasClass(t.target,"p-slider-handle")||(this.updateDomData(),this.setValue(t))},onMouseDown(e,t){this.bindDragListeners(),this.onDragStart(e,t)},onKeyDown(e,t){switch(this.handleIndex=t,e.code){case"ArrowDown":case"ArrowLeft":this.decrementValue(e,t),e.preventDefault();break;case"ArrowUp":case"ArrowRight":this.incrementValue(e,t),e.preventDefault();break;case"PageDown":this.decrementValue(e,t,!0),e.preventDefault();break;case"PageUp":this.incrementValue(e,t,!0),e.preventDefault();break;case"Home":this.updateModel(e,this.min),e.preventDefault();break;case"End":this.updateModel(e,this.max),e.preventDefault()}},decrementValue(e,t,i=!1){let a;a=this.range?this.step?this.modelValue[t]-this.step:this.modelValue[t]-1:this.step?this.modelValue-this.step:!this.step&&i?this.modelValue-10:this.modelValue-1,this.updateModel(e,a),e.preventDefault()},incrementValue(e,t,i=!1){let a;a=this.range?this.step?this.modelValue[t]+this.step:this.modelValue[t]+1:this.step?this.modelValue+this.step:!this.step&&i?this.modelValue+10:this.modelValue+1,this.updateModel(e,a),e.preventDefault()},bindDragListeners(){this.dragListener||(this.dragListener=this.onDrag.bind(this),document.addEventListener("mousemove",this.dragListener)),this.dragEndListener||(this.dragEndListener=this.onDragEnd.bind(this),document.addEventListener("mouseup",this.dragEndListener))},unbindDragListeners(){this.dragListener&&(document.removeEventListener("mousemove",this.dragListener),this.dragListener=null),this.dragEndListener&&(document.removeEventListener("mouseup",this.dragEndListener),this.dragEndListener=null)}},computed:{containerClass(){return["p-slider p-component",{"p-disabled":this.disabled,"p-slider-horizontal":"horizontal"===this.orientation,"p-slider-vertical":"vertical"===this.orientation}]},horizontal(){return"horizontal"===this.orientation},vertical(){return"vertical"===this.orientation},rangeStyle(){if(this.range){const e=this.rangeEndPosition>this.rangeStartPosition?this.rangeEndPosition-this.rangeStartPosition:this.rangeStartPosition-this.rangeEndPosition,t=this.rangeEndPosition>this.rangeStartPosition?this.rangeStartPosition:this.rangeEndPosition;return this.horizontal?{left:t+"%",width:e+"%"}:{bottom:t+"%",height:e+"%"}}return this.horizontal?{width:this.handlePosition+"%"}:{height:this.handlePosition+"%"}},handleStyle(){return this.horizontal?{left:this.handlePosition+"%"}:{bottom:this.handlePosition+"%"}},handlePosition(){return this.modelValue<this.min?0:this.modelValue>this.max?100:100*(this.modelValue-this.min)/(this.max-this.min)},rangeStartPosition(){return this.modelValue&&this.modelValue[0]?100*(this.modelValue[0]<this.min?0:this.modelValue[0]-this.min)/(this.max-this.min):0},rangeEndPosition(){return this.modelValue&&2===this.modelValue.length?100*(this.modelValue[1]>this.max?100:this.modelValue[1]-this.min)/(this.max-this.min):100},rangeStartHandleStyle(){return this.horizontal?{left:this.rangeStartPosition+"%"}:{bottom:this.rangeStartPosition+"%"}},rangeEndHandleStyle(){return this.horizontal?{left:this.rangeEndPosition+"%"}:{bottom:this.rangeEndPosition+"%"}}}};const a=["tabindex","aria-valuemin","aria-valuenow","aria-valuemax","aria-labelledby","aria-label","aria-orientation"],n=["tabindex","aria-valuemin","aria-valuenow","aria-valuemax","aria-labelledby","aria-label","aria-orientation"],l=["tabindex","aria-valuemin","aria-valuenow","aria-valuemax","aria-labelledby","aria-label","aria-orientation"];!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===i&&a.firstChild?a.insertBefore(n,a.firstChild):a.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-slider {\n    position: relative;\n}\n.p-slider .p-slider-handle {\n    position: absolute;\n    cursor: grab;\n    touch-action: none;\n    display: block;\n}\n.p-slider-range {\n    position: absolute;\n    display: block;\n}\n.p-slider-horizontal .p-slider-range {\n    top: 0;\n    left: 0;\n    height: 100%;\n}\n.p-slider-horizontal .p-slider-handle {\n    top: 50%;\n}\n.p-slider-vertical {\n    height: 100px;\n}\n.p-slider-vertical .p-slider-handle {\n    left: 50%;\n}\n.p-slider-vertical .p-slider-range {\n    bottom: 0;\n    left: 0;\n    width: 100%;\n}\n"),i.render=function(e,i,s,r,o,d){return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(d.containerClass),onClick:i[15]||(i[15]=(...e)=>d.onBarClick&&d.onBarClick(...e))},[t.createElementVNode("span",{class:"p-slider-range",style:t.normalizeStyle(d.rangeStyle)},null,4),s.range?t.createCommentVNode("",!0):(t.openBlock(),t.createElementBlock("span",{key:0,class:"p-slider-handle",style:t.normalizeStyle(d.handleStyle),onTouchstart:i[0]||(i[0]=e=>d.onDragStart(e)),onTouchmove:i[1]||(i[1]=e=>d.onDrag(e)),onTouchend:i[2]||(i[2]=e=>d.onDragEnd(e)),onMousedown:i[3]||(i[3]=e=>d.onMouseDown(e)),onKeydown:i[4]||(i[4]=e=>d.onKeyDown(e)),tabindex:s.tabindex,role:"slider","aria-valuemin":s.min,"aria-valuenow":s.modelValue,"aria-valuemax":s.max,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-orientation":s.orientation},null,44,a)),s.range?(t.openBlock(),t.createElementBlock("span",{key:1,class:"p-slider-handle",style:t.normalizeStyle(d.rangeStartHandleStyle),onTouchstart:i[5]||(i[5]=e=>d.onDragStart(e,0)),onTouchmove:i[6]||(i[6]=e=>d.onDrag(e)),onTouchend:i[7]||(i[7]=e=>d.onDragEnd(e)),onMousedown:i[8]||(i[8]=e=>d.onMouseDown(e,0)),onKeydown:i[9]||(i[9]=e=>d.onKeyDown(e,0)),tabindex:s.tabindex,role:"slider","aria-valuemin":s.min,"aria-valuenow":s.modelValue?s.modelValue[0]:null,"aria-valuemax":s.max,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-orientation":s.orientation},null,44,n)):t.createCommentVNode("",!0),s.range?(t.openBlock(),t.createElementBlock("span",{key:2,class:"p-slider-handle",style:t.normalizeStyle(d.rangeEndHandleStyle),onTouchstart:i[10]||(i[10]=e=>d.onDragStart(e,1)),onTouchmove:i[11]||(i[11]=e=>d.onDrag(e)),onTouchend:i[12]||(i[12]=e=>d.onDragEnd(e)),onMousedown:i[13]||(i[13]=e=>d.onMouseDown(e,1)),onKeydown:i[14]||(i[14]=e=>d.onKeyDown(e,1)),tabindex:s.tabindex,role:"slider","aria-valuemin":s.min,"aria-valuenow":s.modelValue?s.modelValue[1]:null,"aria-valuemax":s.max,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-orientation":s.orientation},null,44,l)):t.createCommentVNode("",!0)],2)},module.exports=i;
+"use strict";var e=require("primevue/basecomponent"),t=require("primevue/utils"),i=require("vue");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n={name:"Slider",extends:a(e).default,emits:["update:modelValue","change","slideend"],props:{modelValue:[Number,Array],min:{type:Number,default:0},max:{type:Number,default:100},orientation:{type:String,default:"horizontal"},step:{type:Number,default:null},range:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},tabindex:{type:Number,default:0},"aria-labelledby":{type:String,default:null},"aria-label":{type:String,default:null}},dragging:!1,handleIndex:null,initX:null,initY:null,barWidth:null,barHeight:null,dragListener:null,dragEndListener:null,beforeUnmount(){this.unbindDragListeners()},methods:{updateDomData(){let e=this.$el.getBoundingClientRect();this.initX=e.left+t.DomHandler.getWindowScrollLeft(),this.initY=e.top+t.DomHandler.getWindowScrollTop(),this.barWidth=this.$el.offsetWidth,this.barHeight=this.$el.offsetHeight},setValue(e){let t,i=e.touches?e.touches[0].pageX:e.pageX,a=e.touches?e.touches[0].pageY:e.pageY;t="horizontal"===this.orientation?100*(i-this.initX)/this.barWidth:100*(this.initY+this.barHeight-a)/this.barHeight;let n=(this.max-this.min)*(t/100)+this.min;if(this.step){const e=this.range?this.modelValue[this.handleIndex]:this.modelValue,t=n-e;t<0?n=e+Math.ceil(n/this.step-e/this.step)*this.step:t>0&&(n=e+Math.floor(n/this.step-e/this.step)*this.step)}else n=Math.floor(n);this.updateModel(e,n)},updateModel(e,t){let i,a=parseFloat(t.toFixed(10));this.range?(i=this.modelValue?[...this.modelValue]:[],0==this.handleIndex?(a<this.min?a=this.min:a>=this.max&&(a=this.max),i[0]=a):(a>this.max?a=this.max:a<=this.min&&(a=this.min),i[1]=a)):(a<this.min?a=this.min:a>this.max&&(a=this.max),i=a),this.$emit("update:modelValue",i),this.$emit("change",i)},onDragStart(e,i){this.disabled||(t.DomHandler.addClass(this.$el,"p-slider-sliding"),this.dragging=!0,this.updateDomData(),this.range&&this.modelValue[0]===this.max?this.handleIndex=0:this.handleIndex=i,e.currentTarget.focus(),e.preventDefault())},onDrag(e){this.dragging&&(this.setValue(e),e.preventDefault())},onDragEnd(e){this.dragging&&(this.dragging=!1,t.DomHandler.removeClass(this.$el,"p-slider-sliding"),this.$emit("slideend",{originalEvent:e,value:this.modelValue}))},onBarClick(e){this.disabled||t.DomHandler.hasClass(e.target,"p-slider-handle")||(this.updateDomData(),this.setValue(e))},onMouseDown(e,t){this.bindDragListeners(),this.onDragStart(e,t)},onKeyDown(e,t){switch(this.handleIndex=t,e.code){case"ArrowDown":case"ArrowLeft":this.decrementValue(e,t),e.preventDefault();break;case"ArrowUp":case"ArrowRight":this.incrementValue(e,t),e.preventDefault();break;case"PageDown":this.decrementValue(e,t,!0),e.preventDefault();break;case"PageUp":this.incrementValue(e,t,!0),e.preventDefault();break;case"Home":this.updateModel(e,this.min),e.preventDefault();break;case"End":this.updateModel(e,this.max),e.preventDefault()}},decrementValue(e,t,i=!1){let a;a=this.range?this.step?this.modelValue[t]-this.step:this.modelValue[t]-1:this.step?this.modelValue-this.step:!this.step&&i?this.modelValue-10:this.modelValue-1,this.updateModel(e,a),e.preventDefault()},incrementValue(e,t,i=!1){let a;a=this.range?this.step?this.modelValue[t]+this.step:this.modelValue[t]+1:this.step?this.modelValue+this.step:!this.step&&i?this.modelValue+10:this.modelValue+1,this.updateModel(e,a),e.preventDefault()},bindDragListeners(){this.dragListener||(this.dragListener=this.onDrag.bind(this),document.addEventListener("mousemove",this.dragListener)),this.dragEndListener||(this.dragEndListener=this.onDragEnd.bind(this),document.addEventListener("mouseup",this.dragEndListener))},unbindDragListeners(){this.dragListener&&(document.removeEventListener("mousemove",this.dragListener),this.dragListener=null),this.dragEndListener&&(document.removeEventListener("mouseup",this.dragEndListener),this.dragEndListener=null)}},computed:{containerClass(){return["p-slider p-component",{"p-disabled":this.disabled,"p-slider-horizontal":"horizontal"===this.orientation,"p-slider-vertical":"vertical"===this.orientation}]},horizontal(){return"horizontal"===this.orientation},vertical(){return"vertical"===this.orientation},rangeStyle(){if(this.range){const e=this.rangeEndPosition>this.rangeStartPosition?this.rangeEndPosition-this.rangeStartPosition:this.rangeStartPosition-this.rangeEndPosition,t=this.rangeEndPosition>this.rangeStartPosition?this.rangeStartPosition:this.rangeEndPosition;return this.horizontal?{left:t+"%",width:e+"%"}:{bottom:t+"%",height:e+"%"}}return this.horizontal?{width:this.handlePosition+"%"}:{height:this.handlePosition+"%"}},handleStyle(){return this.horizontal?{left:this.handlePosition+"%"}:{bottom:this.handlePosition+"%"}},handlePosition(){return this.modelValue<this.min?0:this.modelValue>this.max?100:100*(this.modelValue-this.min)/(this.max-this.min)},rangeStartPosition(){return this.modelValue&&this.modelValue[0]?100*(this.modelValue[0]<this.min?0:this.modelValue[0]-this.min)/(this.max-this.min):0},rangeEndPosition(){return this.modelValue&&2===this.modelValue.length?100*(this.modelValue[1]>this.max?100:this.modelValue[1]-this.min)/(this.max-this.min):100},rangeStartHandleStyle(){return this.horizontal?{left:this.rangeStartPosition+"%"}:{bottom:this.rangeStartPosition+"%"}},rangeEndHandleStyle(){return this.horizontal?{left:this.rangeEndPosition+"%"}:{bottom:this.rangeEndPosition+"%"}}}};const l=["tabindex","aria-valuemin","aria-valuenow","aria-valuemax","aria-labelledby","aria-label","aria-orientation"],s=["tabindex","aria-valuemin","aria-valuenow","aria-valuemax","aria-labelledby","aria-label","aria-orientation"],r=["tabindex","aria-valuemin","aria-valuenow","aria-valuemax","aria-labelledby","aria-label","aria-orientation"];!function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var a=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===i&&a.firstChild?a.insertBefore(n,a.firstChild):a.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}("\n.p-slider {\n    position: relative;\n}\n.p-slider .p-slider-handle {\n    position: absolute;\n    cursor: grab;\n    touch-action: none;\n    display: block;\n}\n.p-slider-range {\n    position: absolute;\n    display: block;\n}\n.p-slider-horizontal .p-slider-range {\n    top: 0;\n    left: 0;\n    height: 100%;\n}\n.p-slider-horizontal .p-slider-handle {\n    top: 50%;\n}\n.p-slider-vertical {\n    height: 100px;\n}\n.p-slider-vertical .p-slider-handle {\n    left: 50%;\n}\n.p-slider-vertical .p-slider-range {\n    bottom: 0;\n    left: 0;\n    width: 100%;\n}\n"),n.render=function(e,t,a,n,o,d){return i.openBlock(),i.createElementBlock("div",i.mergeProps({class:d.containerClass,onClick:t[15]||(t[15]=(...e)=>d.onBarClick&&d.onBarClick(...e))},e.ptm("root")),[i.createElementVNode("span",i.mergeProps({class:"p-slider-range",style:d.rangeStyle},e.ptm("range")),null,16),a.range?i.createCommentVNode("",!0):(i.openBlock(),i.createElementBlock("span",i.mergeProps({key:0,class:"p-slider-handle",style:d.handleStyle,onTouchstart:t[0]||(t[0]=e=>d.onDragStart(e)),onTouchmove:t[1]||(t[1]=e=>d.onDrag(e)),onTouchend:t[2]||(t[2]=e=>d.onDragEnd(e)),onMousedown:t[3]||(t[3]=e=>d.onMouseDown(e)),onKeydown:t[4]||(t[4]=e=>d.onKeyDown(e)),tabindex:a.tabindex,role:"slider","aria-valuemin":a.min,"aria-valuenow":a.modelValue,"aria-valuemax":a.max,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-orientation":a.orientation},e.ptm("handle")),null,16,l)),a.range?(i.openBlock(),i.createElementBlock("span",i.mergeProps({key:1,class:"p-slider-handle",style:d.rangeStartHandleStyle,onTouchstart:t[5]||(t[5]=e=>d.onDragStart(e,0)),onTouchmove:t[6]||(t[6]=e=>d.onDrag(e)),onTouchend:t[7]||(t[7]=e=>d.onDragEnd(e)),onMousedown:t[8]||(t[8]=e=>d.onMouseDown(e,0)),onKeydown:t[9]||(t[9]=e=>d.onKeyDown(e,0)),tabindex:a.tabindex,role:"slider","aria-valuemin":a.min,"aria-valuenow":a.modelValue?a.modelValue[0]:null,"aria-valuemax":a.max,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-orientation":a.orientation},e.ptm("startHandler")),null,16,s)):i.createCommentVNode("",!0),a.range?(i.openBlock(),i.createElementBlock("span",i.mergeProps({key:2,class:"p-slider-handle",style:d.rangeEndHandleStyle,onTouchstart:t[10]||(t[10]=e=>d.onDragStart(e,1)),onTouchmove:t[11]||(t[11]=e=>d.onDrag(e)),onTouchend:t[12]||(t[12]=e=>d.onDragEnd(e)),onMousedown:t[13]||(t[13]=e=>d.onMouseDown(e,1)),onKeydown:t[14]||(t[14]=e=>d.onKeyDown(e,1)),tabindex:a.tabindex,role:"slider","aria-valuemin":a.min,"aria-valuenow":a.modelValue?a.modelValue[1]:null,"aria-valuemax":a.max,"aria-labelledby":e.ariaLabelledby,"aria-label":e.ariaLabel,"aria-orientation":a.orientation},e.ptm("endHandler")),null,16,r)):i.createCommentVNode("",!0)],16)},module.exports=n;