primevue 4.3.2 → 4.3.4

package/metergroup/MeterGroup.vue

@@ -1,13 +1,13 @@
 <template>
-    <div :class="cx('root')" role="meter" :aria-valuemin="min" :aria-valuemax="max" :aria-valuenow="totalPercent" v-bind="ptmi('root')">
+    <div :class="cx('root')" role="meter" :aria-valuemin="min" :aria-valuemax="max" :aria-valuenow="totalPercent" :data-p="dataP" v-bind="ptmi('root')">
         <slot v-if="labelPosition === 'start'" name="label" :value="value" :totalPercent="totalPercent" :percentages="percentages">
             <MeterGroupLabel :value="value" :labelPosition="labelPosition" :labelOrientation="labelOrientation" :unstyled="unstyled" :pt="pt" />
         </slot>
         <slot name="start" :value="value" :totalPercent="totalPercent" :percentages="percentages" />
-        <div :class="cx('meters')" v-bind="ptm('meters')">
+        <div :class="cx('meters')" :data-p="dataP" v-bind="ptm('meters')">
             <template v-for="(val, index) in value" :key="index">
                 <slot name="meter" :value="val" :index="index" :class="cx('meter')" :orientation="orientation" :size="percentValue(val.value)" :totalPercent="totalPercent">
-                    <span v-if="percent(val.value)" :class="cx('meter')" :style="meterCalculatedStyles(val)" v-bind="getPTOptions('meter', val, index)" />
+                    <span v-if="percent(val.value)" :class="cx('meter')" :style="meterCalculatedStyles(val)" :data-p="dataP" v-bind="getPTOptions('meter', val, index)" />
                 </slot>
             </template>
         </div>
@@ -19,6 +19,7 @@
 </template>
 
 <script>
+import { cn } from '@primeuix/utils';
 import BaseMeterGroup from './BaseMeterGroup.vue';
 import MeterGroupLabel from './MeterGroupLabel.vue';
 
@@ -65,6 +66,11 @@ export default {
             });
 
             return sumsArray;
+        },
+        dataP() {
+            return cn({
+                [this.orientation]: this.orientation
+            });
         }
     },
     components: {

package/metergroup/MeterGroupLabel.vue

@@ -1,5 +1,5 @@
 <template>
-    <ol :class="cx('labelList')" v-bind="ptm('labelList')">
+    <ol :class="cx('labelList')" :data-p="dataP" v-bind="ptm('labelList')">
         <li v-for="(val, index) in value" :key="index + '_label'" :class="cx('label')" v-bind="ptm('label')">
             <slot name="icon" :value="val" :class="cx('labelIcon')">
                 <i v-if="val.icon" :class="[val.icon, cx('labelIcon')]" :style="{ color: val.color }" v-bind="ptm('labelIcon')" />
@@ -11,6 +11,7 @@
 </template>
 
 <script>
+import { cn } from '@primeuix/utils';
 import BaseComponent from '@primevue/core/basecomponent';
 
 export default {
@@ -18,6 +19,7 @@ export default {
     hostName: 'MeterGroup',
     extends: BaseComponent,
     inheritAttrs: false,
+    inject: ['$pcMeterGroup'],
     props: {
         value: {
             type: Array,
@@ -31,6 +33,13 @@ export default {
             type: String,
             default: 'horizontal'
         }
+    },
+    computed: {
+        dataP() {
+            return cn({
+                [this.$pcMeterGroup.labelOrientation]: this.$pcMeterGroup.labelOrientation
+            });
+        }
     }
 };
 </script>

package/metergroup/index.d.ts

@@ -118,7 +118,7 @@ export interface MeterItem {
     /**
      * Current color of the meter item.
      */
-    color: string;
+    color?: string;
     /**
      * Current icon of the meter item.
      */

package/metergroup/index.mjs

@@ -1,3 +1,4 @@
+import { cn } from '@primeuix/utils';
 import BaseComponent from '@primevue/core/basecomponent';
 import MeterGroupStyle from 'primevue/metergroup/style';
 import { createElementBlock, openBlock, mergeProps, Fragment, renderList, renderSlot, createElementVNode, normalizeClass, toDisplayString, resolveComponent, createCommentVNode, createVNode } from 'vue';
@@ -40,11 +41,16 @@ var script$2 = {
   }
 };
 
+function _typeof$1(o) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof$1(o); }
+function _defineProperty$1(e, r, t) { return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey$1(t) { var i = _toPrimitive$1(t, "string"); return "symbol" == _typeof$1(i) ? i : i + ""; }
+function _toPrimitive$1(t, r) { if ("object" != _typeof$1(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof$1(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var script$1 = {
   name: 'MeterGroupLabel',
   hostName: 'MeterGroup',
   "extends": BaseComponent,
   inheritAttrs: false,
+  inject: ['$pcMeterGroup'],
   props: {
     value: {
       type: Array,
@@ -58,12 +64,19 @@ var script$1 = {
       type: String,
       "default": 'horizontal'
     }
+  },
+  computed: {
+    dataP: function dataP() {
+      return cn(_defineProperty$1({}, this.$pcMeterGroup.labelOrientation, this.$pcMeterGroup.labelOrientation));
+    }
   }
 };
 
+var _hoisted_1$1 = ["data-p"];
 function render$1(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("ol", mergeProps({
-    "class": _ctx.cx('labelList')
+    "class": _ctx.cx('labelList'),
+    "data-p": $options.dataP
   }, _ctx.ptm('labelList')), [(openBlock(true), createElementBlock(Fragment, null, renderList($props.value, function (val, index) {
     return openBlock(), createElementBlock("li", mergeProps({
       key: index + '_label',
@@ -92,11 +105,15 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
       "class": _ctx.cx('labelText'),
       ref_for: true
     }, _ctx.ptm('labelText')), toDisplayString(val.label) + " (" + toDisplayString(_ctx.$parentInstance.percentValue(val.value)) + ")", 17)], 16);
-  }), 128))], 16);
+  }), 128))], 16, _hoisted_1$1);
 }
 
 script$1.render = render$1;
 
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: true, configurable: true, writable: true }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var script = {
   name: 'MeterGroup',
   "extends": script$2,
@@ -140,6 +157,9 @@ var script = {
         sumsArray.push(sum);
       });
       return sumsArray;
+    },
+    dataP: function dataP() {
+      return cn(_defineProperty({}, this.orientation, this.orientation));
     }
   },
   components: {
@@ -147,7 +167,9 @@ var script = {
   }
 };
 
-var _hoisted_1 = ["aria-valuemin", "aria-valuemax", "aria-valuenow"];
+var _hoisted_1 = ["aria-valuemin", "aria-valuemax", "aria-valuenow", "data-p"];
+var _hoisted_2 = ["data-p"];
+var _hoisted_3 = ["data-p"];
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   var _component_MeterGroupLabel = resolveComponent("MeterGroupLabel");
   return openBlock(), createElementBlock("div", mergeProps({
@@ -155,7 +177,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     role: "meter",
     "aria-valuemin": _ctx.min,
     "aria-valuemax": _ctx.max,
-    "aria-valuenow": $options.totalPercent
+    "aria-valuenow": $options.totalPercent,
+    "data-p": $options.dataP
   }, _ctx.ptmi('root')), [_ctx.labelPosition === 'start' ? renderSlot(_ctx.$slots, "label", {
     key: 0,
     value: _ctx.value,
@@ -174,7 +197,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     totalPercent: $options.totalPercent,
     percentages: $options.percentages
   }), createElementVNode("div", mergeProps({
-    "class": _ctx.cx('meters')
+    "class": _ctx.cx('meters'),
+    "data-p": $options.dataP
   }, _ctx.ptm('meters')), [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.value, function (val, index) {
     return renderSlot(_ctx.$slots, "meter", {
       key: index,
@@ -189,10 +213,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         key: 0,
         "class": _ctx.cx('meter'),
         style: $options.meterCalculatedStyles(val),
+        "data-p": $options.dataP,
         ref_for: true
-      }, $options.getPTOptions('meter', val, index)), null, 16)) : createCommentVNode("", true)];
+      }, $options.getPTOptions('meter', val, index)), null, 16, _hoisted_3)) : createCommentVNode("", true)];
     });
-  }), 128))], 16), renderSlot(_ctx.$slots, "end", {
+  }), 128))], 16, _hoisted_2), renderSlot(_ctx.$slots, "end", {
     value: _ctx.value,
     totalPercent: $options.totalPercent,
     percentages: $options.percentages

package/metergroup/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/metergroup/BaseMeterGroup.vue","../../src/metergroup/MeterGroupLabel.vue","../../src/metergroup/MeterGroupLabel.vue?vue&type=template&id=4d13db80&lang.js","../../src/metergroup/MeterGroup.vue","../../src/metergroup/MeterGroup.vue?vue&type=template&id=4050d94c&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevue/core/basecomponent';\nimport MeterGroupStyle from 'primevue/metergroup/style';\n\nexport default {\n    name: 'MeterGroup',\n    extends: BaseComponent,\n    props: {\n        value: {\n            type: Array,\n            default: null\n        },\n        min: {\n            type: Number,\n            default: 0\n        },\n        max: {\n            type: Number,\n            default: 100\n        },\n        orientation: {\n            type: String,\n            default: 'horizontal'\n        },\n        labelPosition: {\n            type: String,\n            default: 'end'\n        },\n        labelOrientation: {\n            type: String,\n            default: 'horizontal'\n        }\n    },\n    style: MeterGroupStyle,\n    provide() {\n        return {\n            $pcMeterGroup: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <ol :class=\"cx('labelList')\" v-bind=\"ptm('labelList')\">\n        <li v-for=\"(val, index) in value\" :key=\"index + '_label'\" :class=\"cx('label')\" v-bind=\"ptm('label')\">\n            <slot name=\"icon\" :value=\"val\" :class=\"cx('labelIcon')\">\n                <i v-if=\"val.icon\" :class=\"[val.icon, cx('labelIcon')]\" :style=\"{ color: val.color }\" v-bind=\"ptm('labelIcon')\" />\n                <span v-else :class=\"cx('labelMarker')\" :style=\"{ backgroundColor: val.color }\" v-bind=\"ptm('labelMarker')\" />\n            </slot>\n            <span :class=\"cx('labelText')\" v-bind=\"ptm('labelText')\">{{ val.label }} ({{ $parentInstance.percentValue(val.value) }})</span>\n        </li>\n    </ol>\n</template>\n\n<script>\nimport BaseComponent from '@primevue/core/basecomponent';\n\nexport default {\n    name: 'MeterGroupLabel',\n    hostName: 'MeterGroup',\n    extends: BaseComponent,\n    inheritAttrs: false,\n    props: {\n        value: {\n            type: Array,\n            default: null\n        },\n        labelPosition: {\n            type: String,\n            default: 'end'\n        },\n        labelOrientation: {\n            type: String,\n            default: 'horizontal'\n        }\n    }\n};\n</script>\n","<template>\n    <ol :class=\"cx('labelList')\" v-bind=\"ptm('labelList')\">\n        <li v-for=\"(val, index) in value\" :key=\"index + '_label'\" :class=\"cx('label')\" v-bind=\"ptm('label')\">\n            <slot name=\"icon\" :value=\"val\" :class=\"cx('labelIcon')\">\n                <i v-if=\"val.icon\" :class=\"[val.icon, cx('labelIcon')]\" :style=\"{ color: val.color }\" v-bind=\"ptm('labelIcon')\" />\n                <span v-else :class=\"cx('labelMarker')\" :style=\"{ backgroundColor: val.color }\" v-bind=\"ptm('labelMarker')\" />\n            </slot>\n            <span :class=\"cx('labelText')\" v-bind=\"ptm('labelText')\">{{ val.label }} ({{ $parentInstance.percentValue(val.value) }})</span>\n        </li>\n    </ol>\n</template>\n\n<script>\nimport BaseComponent from '@primevue/core/basecomponent';\n\nexport default {\n    name: 'MeterGroupLabel',\n    hostName: 'MeterGroup',\n    extends: BaseComponent,\n    inheritAttrs: false,\n    props: {\n        value: {\n            type: Array,\n            default: null\n        },\n        labelPosition: {\n            type: String,\n            default: 'end'\n        },\n        labelOrientation: {\n            type: String,\n            default: 'horizontal'\n        }\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" role=\"meter\" :aria-valuemin=\"min\" :aria-valuemax=\"max\" :aria-valuenow=\"totalPercent\" v-bind=\"ptmi('root')\">\n        <slot v-if=\"labelPosition === 'start'\" name=\"label\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\">\n            <MeterGroupLabel :value=\"value\" :labelPosition=\"labelPosition\" :labelOrientation=\"labelOrientation\" :unstyled=\"unstyled\" :pt=\"pt\" />\n        </slot>\n        <slot name=\"start\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\" />\n        <div :class=\"cx('meters')\" v-bind=\"ptm('meters')\">\n            <template v-for=\"(val, index) in value\" :key=\"index\">\n                <slot name=\"meter\" :value=\"val\" :index=\"index\" :class=\"cx('meter')\" :orientation=\"orientation\" :size=\"percentValue(val.value)\" :totalPercent=\"totalPercent\">\n                    <span v-if=\"percent(val.value)\" :class=\"cx('meter')\" :style=\"meterCalculatedStyles(val)\" v-bind=\"getPTOptions('meter', val, index)\" />\n                </slot>\n            </template>\n        </div>\n        <slot name=\"end\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\" />\n        <slot v-if=\"labelPosition === 'end'\" name=\"label\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\">\n            <MeterGroupLabel :value=\"value\" :labelPosition=\"labelPosition\" :labelOrientation=\"labelOrientation\" :unstyled=\"unstyled\" :pt=\"pt\" />\n        </slot>\n    </div>\n</template>\n\n<script>\nimport BaseMeterGroup from './BaseMeterGroup.vue';\nimport MeterGroupLabel from './MeterGroupLabel.vue';\n\nexport default {\n    name: 'MeterGroup',\n    extends: BaseMeterGroup,\n    inheritAttrs: false,\n    methods: {\n        getPTOptions(key, value, index) {\n            return this.ptm(key, {\n                context: {\n                    value,\n                    index\n                }\n            });\n        },\n        percent(meter = 0) {\n            const percentOfItem = ((meter - this.min) / (this.max - this.min)) * 100;\n\n            return Math.round(Math.max(0, Math.min(100, percentOfItem)));\n        },\n        percentValue(meter) {\n            return this.percent(meter) + '%';\n        },\n        meterCalculatedStyles(val) {\n            return {\n                backgroundColor: val.color,\n                width: this.orientation === 'horizontal' && this.percentValue(val.value),\n                height: this.orientation === 'vertical' && this.percentValue(val.value)\n            };\n        }\n    },\n    computed: {\n        totalPercent() {\n            return this.percent(this.value.reduce((total, val) => total + val.value, 0));\n        },\n        percentages() {\n            let sum = 0;\n            const sumsArray = [];\n\n            this.value.forEach((item) => {\n                sum += item.value;\n                sumsArray.push(sum);\n            });\n\n            return sumsArray;\n        }\n    },\n    components: {\n        MeterGroupLabel\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" role=\"meter\" :aria-valuemin=\"min\" :aria-valuemax=\"max\" :aria-valuenow=\"totalPercent\" v-bind=\"ptmi('root')\">\n        <slot v-if=\"labelPosition === 'start'\" name=\"label\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\">\n            <MeterGroupLabel :value=\"value\" :labelPosition=\"labelPosition\" :labelOrientation=\"labelOrientation\" :unstyled=\"unstyled\" :pt=\"pt\" />\n        </slot>\n        <slot name=\"start\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\" />\n        <div :class=\"cx('meters')\" v-bind=\"ptm('meters')\">\n            <template v-for=\"(val, index) in value\" :key=\"index\">\n                <slot name=\"meter\" :value=\"val\" :index=\"index\" :class=\"cx('meter')\" :orientation=\"orientation\" :size=\"percentValue(val.value)\" :totalPercent=\"totalPercent\">\n                    <span v-if=\"percent(val.value)\" :class=\"cx('meter')\" :style=\"meterCalculatedStyles(val)\" v-bind=\"getPTOptions('meter', val, index)\" />\n                </slot>\n            </template>\n        </div>\n        <slot name=\"end\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\" />\n        <slot v-if=\"labelPosition === 'end'\" name=\"label\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\">\n            <MeterGroupLabel :value=\"value\" :labelPosition=\"labelPosition\" :labelOrientation=\"labelOrientation\" :unstyled=\"unstyled\" :pt=\"pt\" />\n        </slot>\n    </div>\n</template>\n\n<script>\nimport BaseMeterGroup from './BaseMeterGroup.vue';\nimport MeterGroupLabel from './MeterGroupLabel.vue';\n\nexport default {\n    name: 'MeterGroup',\n    extends: BaseMeterGroup,\n    inheritAttrs: false,\n    methods: {\n        getPTOptions(key, value, index) {\n            return this.ptm(key, {\n                context: {\n                    value,\n                    index\n                }\n            });\n        },\n        percent(meter = 0) {\n            const percentOfItem = ((meter - this.min) / (this.max - this.min)) * 100;\n\n            return Math.round(Math.max(0, Math.min(100, percentOfItem)));\n        },\n        percentValue(meter) {\n            return this.percent(meter) + '%';\n        },\n        meterCalculatedStyles(val) {\n            return {\n                backgroundColor: val.color,\n                width: this.orientation === 'horizontal' && this.percentValue(val.value),\n                height: this.orientation === 'vertical' && this.percentValue(val.value)\n            };\n        }\n    },\n    computed: {\n        totalPercent() {\n            return this.percent(this.value.reduce((total, val) => total + val.value, 0));\n        },\n        percentages() {\n            let sum = 0;\n            const sumsArray = [];\n\n            this.value.forEach((item) => {\n                sum += item.value;\n                sumsArray.push(sum);\n            });\n\n            return sumsArray;\n        }\n    },\n    components: {\n        MeterGroupLabel\n    }\n};\n</script>\n"],"names":["name","BaseComponent","props","value","type","Array","min","Number","max","orientation","String","labelPosition","labelOrientation","style","MeterGroupStyle","provide","$pcMeterGroup","$parentInstance","hostName","inheritAttrs","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","ptm","_Fragment","_renderList","$props","val","index","key","_renderSlot","$slots","icon","color","backgroundColor","_createElementVNode","_toDisplayString","label","percentValue","BaseMeterGroup","methods","getPTOptions","context","percent","meter","arguments","length","undefined","percentOfItem","Math","round","meterCalculatedStyles","width","height","computed","totalPercent","reduce","total","percentages","sum","sumsArray","forEach","item","push","components","MeterGroupLabel","role","$options","ptmi","_createVNode","_component_MeterGroupLabel","unstyled","pt","size"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../src/metergroup/BaseMeterGroup.vue","../../src/metergroup/MeterGroupLabel.vue","../../src/metergroup/MeterGroupLabel.vue?vue&type=template&id=485edff9&lang.js","../../src/metergroup/MeterGroup.vue","../../src/metergroup/MeterGroup.vue?vue&type=template&id=5bb0f8ea&lang.js"],"sourcesContent":["<script>\nimport BaseComponent from '@primevue/core/basecomponent';\nimport MeterGroupStyle from 'primevue/metergroup/style';\n\nexport default {\n    name: 'MeterGroup',\n    extends: BaseComponent,\n    props: {\n        value: {\n            type: Array,\n            default: null\n        },\n        min: {\n            type: Number,\n            default: 0\n        },\n        max: {\n            type: Number,\n            default: 100\n        },\n        orientation: {\n            type: String,\n            default: 'horizontal'\n        },\n        labelPosition: {\n            type: String,\n            default: 'end'\n        },\n        labelOrientation: {\n            type: String,\n            default: 'horizontal'\n        }\n    },\n    style: MeterGroupStyle,\n    provide() {\n        return {\n            $pcMeterGroup: this,\n            $parentInstance: this\n        };\n    }\n};\n</script>\n","<template>\n    <ol :class=\"cx('labelList')\" :data-p=\"dataP\" v-bind=\"ptm('labelList')\">\n        <li v-for=\"(val, index) in value\" :key=\"index + '_label'\" :class=\"cx('label')\" v-bind=\"ptm('label')\">\n            <slot name=\"icon\" :value=\"val\" :class=\"cx('labelIcon')\">\n                <i v-if=\"val.icon\" :class=\"[val.icon, cx('labelIcon')]\" :style=\"{ color: val.color }\" v-bind=\"ptm('labelIcon')\" />\n                <span v-else :class=\"cx('labelMarker')\" :style=\"{ backgroundColor: val.color }\" v-bind=\"ptm('labelMarker')\" />\n            </slot>\n            <span :class=\"cx('labelText')\" v-bind=\"ptm('labelText')\">{{ val.label }} ({{ $parentInstance.percentValue(val.value) }})</span>\n        </li>\n    </ol>\n</template>\n\n<script>\nimport { cn } from '@primeuix/utils';\nimport BaseComponent from '@primevue/core/basecomponent';\n\nexport default {\n    name: 'MeterGroupLabel',\n    hostName: 'MeterGroup',\n    extends: BaseComponent,\n    inheritAttrs: false,\n    inject: ['$pcMeterGroup'],\n    props: {\n        value: {\n            type: Array,\n            default: null\n        },\n        labelPosition: {\n            type: String,\n            default: 'end'\n        },\n        labelOrientation: {\n            type: String,\n            default: 'horizontal'\n        }\n    },\n    computed: {\n        dataP() {\n            return cn({\n                [this.$pcMeterGroup.labelOrientation]: this.$pcMeterGroup.labelOrientation\n            });\n        }\n    }\n};\n</script>\n","<template>\n    <ol :class=\"cx('labelList')\" :data-p=\"dataP\" v-bind=\"ptm('labelList')\">\n        <li v-for=\"(val, index) in value\" :key=\"index + '_label'\" :class=\"cx('label')\" v-bind=\"ptm('label')\">\n            <slot name=\"icon\" :value=\"val\" :class=\"cx('labelIcon')\">\n                <i v-if=\"val.icon\" :class=\"[val.icon, cx('labelIcon')]\" :style=\"{ color: val.color }\" v-bind=\"ptm('labelIcon')\" />\n                <span v-else :class=\"cx('labelMarker')\" :style=\"{ backgroundColor: val.color }\" v-bind=\"ptm('labelMarker')\" />\n            </slot>\n            <span :class=\"cx('labelText')\" v-bind=\"ptm('labelText')\">{{ val.label }} ({{ $parentInstance.percentValue(val.value) }})</span>\n        </li>\n    </ol>\n</template>\n\n<script>\nimport { cn } from '@primeuix/utils';\nimport BaseComponent from '@primevue/core/basecomponent';\n\nexport default {\n    name: 'MeterGroupLabel',\n    hostName: 'MeterGroup',\n    extends: BaseComponent,\n    inheritAttrs: false,\n    inject: ['$pcMeterGroup'],\n    props: {\n        value: {\n            type: Array,\n            default: null\n        },\n        labelPosition: {\n            type: String,\n            default: 'end'\n        },\n        labelOrientation: {\n            type: String,\n            default: 'horizontal'\n        }\n    },\n    computed: {\n        dataP() {\n            return cn({\n                [this.$pcMeterGroup.labelOrientation]: this.$pcMeterGroup.labelOrientation\n            });\n        }\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" role=\"meter\" :aria-valuemin=\"min\" :aria-valuemax=\"max\" :aria-valuenow=\"totalPercent\" :data-p=\"dataP\" v-bind=\"ptmi('root')\">\n        <slot v-if=\"labelPosition === 'start'\" name=\"label\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\">\n            <MeterGroupLabel :value=\"value\" :labelPosition=\"labelPosition\" :labelOrientation=\"labelOrientation\" :unstyled=\"unstyled\" :pt=\"pt\" />\n        </slot>\n        <slot name=\"start\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\" />\n        <div :class=\"cx('meters')\" :data-p=\"dataP\" v-bind=\"ptm('meters')\">\n            <template v-for=\"(val, index) in value\" :key=\"index\">\n                <slot name=\"meter\" :value=\"val\" :index=\"index\" :class=\"cx('meter')\" :orientation=\"orientation\" :size=\"percentValue(val.value)\" :totalPercent=\"totalPercent\">\n                    <span v-if=\"percent(val.value)\" :class=\"cx('meter')\" :style=\"meterCalculatedStyles(val)\" :data-p=\"dataP\" v-bind=\"getPTOptions('meter', val, index)\" />\n                </slot>\n            </template>\n        </div>\n        <slot name=\"end\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\" />\n        <slot v-if=\"labelPosition === 'end'\" name=\"label\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\">\n            <MeterGroupLabel :value=\"value\" :labelPosition=\"labelPosition\" :labelOrientation=\"labelOrientation\" :unstyled=\"unstyled\" :pt=\"pt\" />\n        </slot>\n    </div>\n</template>\n\n<script>\nimport { cn } from '@primeuix/utils';\nimport BaseMeterGroup from './BaseMeterGroup.vue';\nimport MeterGroupLabel from './MeterGroupLabel.vue';\n\nexport default {\n    name: 'MeterGroup',\n    extends: BaseMeterGroup,\n    inheritAttrs: false,\n    methods: {\n        getPTOptions(key, value, index) {\n            return this.ptm(key, {\n                context: {\n                    value,\n                    index\n                }\n            });\n        },\n        percent(meter = 0) {\n            const percentOfItem = ((meter - this.min) / (this.max - this.min)) * 100;\n\n            return Math.round(Math.max(0, Math.min(100, percentOfItem)));\n        },\n        percentValue(meter) {\n            return this.percent(meter) + '%';\n        },\n        meterCalculatedStyles(val) {\n            return {\n                backgroundColor: val.color,\n                width: this.orientation === 'horizontal' && this.percentValue(val.value),\n                height: this.orientation === 'vertical' && this.percentValue(val.value)\n            };\n        }\n    },\n    computed: {\n        totalPercent() {\n            return this.percent(this.value.reduce((total, val) => total + val.value, 0));\n        },\n        percentages() {\n            let sum = 0;\n            const sumsArray = [];\n\n            this.value.forEach((item) => {\n                sum += item.value;\n                sumsArray.push(sum);\n            });\n\n            return sumsArray;\n        },\n        dataP() {\n            return cn({\n                [this.orientation]: this.orientation\n            });\n        }\n    },\n    components: {\n        MeterGroupLabel\n    }\n};\n</script>\n","<template>\n    <div :class=\"cx('root')\" role=\"meter\" :aria-valuemin=\"min\" :aria-valuemax=\"max\" :aria-valuenow=\"totalPercent\" :data-p=\"dataP\" v-bind=\"ptmi('root')\">\n        <slot v-if=\"labelPosition === 'start'\" name=\"label\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\">\n            <MeterGroupLabel :value=\"value\" :labelPosition=\"labelPosition\" :labelOrientation=\"labelOrientation\" :unstyled=\"unstyled\" :pt=\"pt\" />\n        </slot>\n        <slot name=\"start\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\" />\n        <div :class=\"cx('meters')\" :data-p=\"dataP\" v-bind=\"ptm('meters')\">\n            <template v-for=\"(val, index) in value\" :key=\"index\">\n                <slot name=\"meter\" :value=\"val\" :index=\"index\" :class=\"cx('meter')\" :orientation=\"orientation\" :size=\"percentValue(val.value)\" :totalPercent=\"totalPercent\">\n                    <span v-if=\"percent(val.value)\" :class=\"cx('meter')\" :style=\"meterCalculatedStyles(val)\" :data-p=\"dataP\" v-bind=\"getPTOptions('meter', val, index)\" />\n                </slot>\n            </template>\n        </div>\n        <slot name=\"end\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\" />\n        <slot v-if=\"labelPosition === 'end'\" name=\"label\" :value=\"value\" :totalPercent=\"totalPercent\" :percentages=\"percentages\">\n            <MeterGroupLabel :value=\"value\" :labelPosition=\"labelPosition\" :labelOrientation=\"labelOrientation\" :unstyled=\"unstyled\" :pt=\"pt\" />\n        </slot>\n    </div>\n</template>\n\n<script>\nimport { cn } from '@primeuix/utils';\nimport BaseMeterGroup from './BaseMeterGroup.vue';\nimport MeterGroupLabel from './MeterGroupLabel.vue';\n\nexport default {\n    name: 'MeterGroup',\n    extends: BaseMeterGroup,\n    inheritAttrs: false,\n    methods: {\n        getPTOptions(key, value, index) {\n            return this.ptm(key, {\n                context: {\n                    value,\n                    index\n                }\n            });\n        },\n        percent(meter = 0) {\n            const percentOfItem = ((meter - this.min) / (this.max - this.min)) * 100;\n\n            return Math.round(Math.max(0, Math.min(100, percentOfItem)));\n        },\n        percentValue(meter) {\n            return this.percent(meter) + '%';\n        },\n        meterCalculatedStyles(val) {\n            return {\n                backgroundColor: val.color,\n                width: this.orientation === 'horizontal' && this.percentValue(val.value),\n                height: this.orientation === 'vertical' && this.percentValue(val.value)\n            };\n        }\n    },\n    computed: {\n        totalPercent() {\n            return this.percent(this.value.reduce((total, val) => total + val.value, 0));\n        },\n        percentages() {\n            let sum = 0;\n            const sumsArray = [];\n\n            this.value.forEach((item) => {\n                sum += item.value;\n                sumsArray.push(sum);\n            });\n\n            return sumsArray;\n        },\n        dataP() {\n            return cn({\n                [this.orientation]: this.orientation\n            });\n        }\n    },\n    components: {\n        MeterGroupLabel\n    }\n};\n</script>\n"],"names":["name","BaseComponent","props","value","type","Array","min","Number","max","orientation","String","labelPosition","labelOrientation","style","MeterGroupStyle","provide","$pcMeterGroup","$parentInstance","hostName","inheritAttrs","inject","computed","dataP","cn","_defineProperty","_openBlock","_createElementBlock","_mergeProps","_ctx","cx","$options","ptm","_Fragment","_renderList","$props","val","index","key","_renderSlot","$slots","icon","color","backgroundColor","_createElementVNode","_toDisplayString","label","percentValue","BaseMeterGroup","methods","getPTOptions","context","percent","meter","arguments","length","undefined","percentOfItem","Math","round","meterCalculatedStyles","width","height","totalPercent","reduce","total","percentages","sum","sumsArray","forEach","item","push","components","MeterGroupLabel","role","ptmi","_createVNode","_component_MeterGroupLabel","unstyled","pt","size","_hoisted_3"],"mappings":"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"}

package/multiselect/MultiSelect.vue

@@ -1,5 +1,5 @@
 <template>
-    <div ref="container" :class="cx('root')" :style="sx('root')" @click="onContainerClick" v-bind="ptmi('root')">
+    <div ref="container" :class="cx('root')" :style="sx('root')" @click="onContainerClick" :data-p="containerDataP" v-bind="ptmi('root')">
         <div class="p-hidden-accessible" v-bind="ptm('hiddenInputContainer')" :data-p-hidden-accessible="true">
             <input
                 ref="focusInput"
@@ -24,7 +24,7 @@
             />
         </div>
         <div :class="cx('labelContainer')" v-bind="ptm('labelContainer')">
-            <div :class="cx('label')" v-bind="ptm('label')">
+            <div :class="cx('label')" :data-p="labelDataP" v-bind="ptm('label')">
                 <slot name="value" :value="d_value" :placeholder="placeholder">
                     <template v-if="display === 'comma'">
                         {{ label || 'empty' }}
@@ -59,12 +59,12 @@
                 <SpinnerIcon v-else :class="cx('loadingIcon')" spin aria-hidden="true" v-bind="ptm('loadingIcon')" />
             </slot>
             <slot v-else name="dropdownicon" :class="cx('dropdownIcon')">
-                <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="[cx('dropdownIcon'), dropdownIcon]" aria-hidden="true" v-bind="ptm('dropdownIcon')" />
+                <component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="[cx('dropdownIcon'), dropdownIcon]" aria-hidden="true" :data-p="dropdownIconDataP" v-bind="ptm('dropdownIcon')" />
             </slot>
         </div>
         <Portal :appendTo="appendTo">
             <transition name="p-connected-overlay" @enter="onOverlayEnter" @after-enter="onOverlayAfterEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave" v-bind="ptm('transition')">
-                <div v-if="overlayVisible" :ref="overlayRef" :style="[panelStyle, overlayStyle]" :class="[cx('overlay'), panelClass, overlayClass]" @click="onOverlayClick" @keydown="onOverlayKeyDown" v-bind="ptm('overlay')">
+                <div v-if="overlayVisible" :ref="overlayRef" :style="[panelStyle, overlayStyle]" :class="[cx('overlay'), panelClass, overlayClass]" @click="onOverlayClick" @keydown="onOverlayKeyDown" :data-p="overlayDataP" v-bind="ptm('overlay')">
                     <span
                         ref="firstHiddenFocusableElementOnOverlay"
                         role="presentation"
@@ -223,6 +223,7 @@
 </template>
 
 <script>
+import { cn } from '@primeuix/utils';
 import { absolutePosition, addStyle, findSingle, focus, getFirstFocusableElement, getFocusableElements, getLastFocusableElement, getOuterWidth, isTouchDevice, relativePosition } from '@primeuix/utils/dom';
 import { equals, findLastIndex, isEmpty, isNotEmpty, isPrintableCharacter, resolveFieldData } from '@primeuix/utils/object';
 import { ZIndex } from '@primeuix/utils/zindex';
@@ -733,12 +734,15 @@ export default {
         onOverlayEnter(el) {
             ZIndex.set('overlay', el, this.$primevue.config.zIndex.overlay);
 
-            addStyle(el, { position: 'absolute', top: '0', left: '0' });
+            addStyle(el, { position: 'absolute', top: '0' });
             this.alignOverlay();
             this.scrollInView();
 
             this.autoFilterFocus && focus(this.$refs.filterInput.$el);
             this.autoUpdateModel();
+
+            // Issue: #7508
+            this.$attrSelector && el.setAttribute(this.$attrSelector, '');
         },
         onOverlayAfterEnter() {
             this.bindOutsideClickListener();
@@ -933,7 +937,7 @@ export default {
             return matchedOptionIndex > -1 ? matchedOptionIndex : index;
         },
         findFirstFocusedOptionIndex() {
-            const selectedIndex = this.findSelectedOptionIndex();
+            const selectedIndex = this.findFirstSelectedOptionIndex();
 
             return selectedIndex < 0 ? this.findFirstOptionIndex() : selectedIndex;
         },
@@ -1142,6 +1146,36 @@ export default {
         },
         isClearIconVisible() {
             return this.showClear && this.d_value && this.d_value.length && this.d_value != null && isNotEmpty(this.options);
+        },
+        containerDataP() {
+            return cn({
+                invalid: this.$invalid,
+                disabled: this.disabled,
+                focus: this.focused,
+                fluid: this.$fluid,
+                filled: this.$variant === 'filled',
+                [this.size]: this.size
+            });
+        },
+        labelDataP() {
+            return cn({
+                placeholder: this.label === this.placeholder,
+                clearable: this.showClear,
+                disabled: this.disabled,
+                [this.size]: this.size,
+                'has-chip': this.display === 'chip' && this.d_value && this.d_value.length && (this.maxSelectedLabels ? this.d_value.length <= this.maxSelectedLabels : true),
+                empty: !this.placeholder && !this.$filled
+            });
+        },
+        dropdownIconDataP() {
+            return cn({
+                [this.size]: this.size
+            });
+        },
+        overlayDataP() {
+            return cn({
+                ['portal-' + this.appendTo]: 'portal-' + this.appendTo
+            });
         }
     },
     directives: {

package/multiselect/index.d.ts

@@ -787,7 +787,7 @@ export interface MultiSelectSlots {
         /**
          * Options of the loader items for virtualscroller
          */
-        allSelected: boolean;
+        checked: boolean;
         /**
          * Style class of the loading icon.
          */