primevue 3.28.0 → 3.29.1

package/vetur-tags.json

@@ -71,7 +71,8 @@
       "emptySearchMessage",
       "tabindex",
       "aria-label",
-      "aria-labelledby"
+      "aria-labelledby",
+      "pt"
     ]
   },
   "Avatar": {
@@ -201,7 +202,8 @@
       "inputProps",
       "panelClass",
       "panelStyle",
-      "panelProps"
+      "panelProps",
+      "pt"
     ]
   },
   "Carousel": {
@@ -220,7 +222,8 @@
       "containerClass",
       "indicatorsContentClass",
       "showNavigators",
-      "showIndicators"
+      "showIndicators",
+      "pt"
     ]
   },
   "CascadeSelect": {
@@ -256,7 +259,8 @@
       "emptySearchMessage",
       "tabindex",
       "aria-label",
-      "aria-labelledby"
+      "aria-labelledby",
+      "pt"
     ]
   },
   "Chart": {
@@ -288,7 +292,8 @@
       "inputStyle",
       "inputProps",
       "aria-labelledby",
-      "aria-label"
+      "aria-label",
+      "pt"
     ]
   },
   "Chip": {
@@ -315,7 +320,8 @@
       "inputId",
       "inputClass",
       "inputStyle",
-      "inputProps"
+      "inputProps",
+      "pt"
     ]
   },
   "ColorPicker": {
@@ -332,7 +338,8 @@
       "panelClass",
       "appendTo",
       "aria-labelledby",
-      "aria-label"
+      "aria-label",
+      "pt"
     ]
   },
   "Column": {
@@ -379,7 +386,15 @@
       "exportable",
       "exportHeader",
       "exportFooter",
-      "hidden"
+      "hidden",
+      "pt"
+    ]
+  },
+  "ColumnGroup": {
+    "description": "Columns can be grouped at header and footer sections by defining a ColumnGroup with nested rows and columns",
+    "attributes": [
+      "type",
+      "pt"
     ]
   },
   "ConfirmDialog": {
@@ -475,7 +490,8 @@
       "showGridlines",
       "stripedRows",
       "tableStyle",
-      "tableClass"
+      "tableClass",
+      "pt"
     ]
   },
   "DataView": {
@@ -496,13 +512,15 @@
       "sortField",
       "sortOrder",
       "lazy",
-      "dataKey"
+      "dataKey",
+      "pt"
     ]
   },
   "DataViewLayoutOptions": {
     "description": "When both layout modes are enabled in DataView, a UI element would be necessary to let the user toggle between the view. DataViewLayoutOptions is a helper component to display a buttonset to choose the layout mode in DataView.",
     "attributes": [
-      "modelValue"
+      "modelValue",
+      "pt"
     ]
   },
   "DeferredContent": {
@@ -605,7 +623,8 @@
       "emptyMessage",
       "tabindex",
       "aria-label",
-      "aria-labelledby"
+      "aria-labelledby",
+      "pt"
     ]
   },
   "Editor": {
@@ -616,7 +635,8 @@
       "readonly",
       "formats",
       "editorStyle",
-      "modules"
+      "modules",
+      "pt"
     ]
   },
   "Fieldset": {
@@ -685,14 +705,18 @@
       "baseZIndex",
       "maskClass",
       "containerStyle",
-      "containerClass"
+      "containerClass",
+      "pt"
     ]
   },
   "Image": {
     "description": "Displays an image with preview and tranformation options.",
     "attributes": [
       "preview",
-      "indicatorIcon"
+      "indicatorIcon",
+      "zoomInDisabled",
+      "zoomOutDisabled",
+      "pt"
     ]
   },
   "InlineMessage": {
@@ -719,7 +743,8 @@
       "mask",
       "slotChar",
       "autoClear",
-      "unmask"
+      "unmask",
+      "pt"
     ]
   },
   "InputNumber": {
@@ -754,7 +779,8 @@
       "inputClass",
       "inputProps",
       "incrementButtonProps",
-      "decrementButtonProps"
+      "decrementButtonProps",
+      "pt"
     ]
   },
   "InputSwitch": {
@@ -766,13 +792,15 @@
       "inputId",
       "inputStyle",
       "inputClass",
-      "inputProps"
+      "inputProps",
+      "pt"
     ]
   },
   "InputText": {
     "description": "InputText renders a text field to enter data.",
     "attributes": [
-      "modelValue"
+      "modelValue",
+      "pt"
     ]
   },
   "Knob": {
@@ -793,7 +821,8 @@
       "valueTemplate",
       "tabindex",
       "aria-labelledby",
-      "aria-label"
+      "aria-label",
+      "pt"
     ]
   },
   "Listbox": {
@@ -827,7 +856,8 @@
       "emptyMessage",
       "tabindex",
       "aria-label",
-      "aria-labelledby"
+      "aria-labelledby",
+      "pt"
     ]
   },
   "MegaMenu": {
@@ -922,7 +952,8 @@
       "emptyMessage",
       "tabindex",
       "aria-label",
-      "aria-labelledby"
+      "aria-labelledby",
+      "pt"
     ]
   },
   "OrderList": {
@@ -935,7 +966,8 @@
       "listStyle",
       "responsive",
       "breakpoint",
-      "stripedRows"
+      "stripedRows",
+      "pt"
     ]
   },
   "OrganizationChart": {
@@ -945,7 +977,8 @@
       "selectionKeys",
       "selectionMode",
       "collapsible",
-      "collapsedKeys"
+      "collapsedKeys",
+      "pt"
     ]
   },
   "OverlayPanel": {
@@ -972,7 +1005,8 @@
       "rowsPerPageOptions",
       "template",
       "currentPageReportTemplate",
-      "alwaysShow"
+      "alwaysShow",
+      "pt"
     ]
   },
   "Panel": {
@@ -1019,7 +1053,8 @@
       "panelId",
       "panelClass",
       "panelStyle",
-      "panelProps"
+      "panelProps",
+      "pt"
     ]
   },
   "PickList": {
@@ -1034,7 +1069,8 @@
       "breakpoint",
       "stripedRows",
       "showSourceControls",
-      "showTargetControls"
+      "showTargetControls",
+      "pt"
     ]
   },
   "Portal": {
@@ -1074,7 +1110,8 @@
       "inputStyle",
       "inputProps",
       "aria-labelledby",
-      "aria-label"
+      "aria-label",
+      "pt"
     ]
   },
   "rating": {
@@ -1087,7 +1124,15 @@
       "cancel",
       "onIcon",
       "offIcon",
-      "cancelIcon"
+      "cancelIcon",
+      "pt"
+    ]
+  },
+  "Row": {
+    "description": "DataTable can be grouped by defining a Row component with nested columns",
+    "attributes": [
+      "type",
+      "pt"
     ]
   },
   "ScrollPanel": {
@@ -1119,7 +1164,8 @@
       "disabled",
       "dataKey",
       "unselectable",
-      "aria-labelledby"
+      "aria-labelledby",
+      "pt"
     ]
   },
   "Sidebar": {
@@ -1162,7 +1208,8 @@
       "disabled",
       "tabindex",
       "aria-labelledby",
-      "aria-label"
+      "aria-label",
+      "pt"
     ]
   },
   "SpeedDial": {
@@ -1302,7 +1349,8 @@
     "description": "Textarea is a multi-line text input element.",
     "attributes": [
       "modelValue",
-      "autoResize"
+      "autoResize",
+      "pt"
     ]
   },
   "TieredMenu": {
@@ -1323,7 +1371,8 @@
       "value",
       "align",
       "layout",
-      "dataKey"
+      "dataKey",
+      "pt"
     ]
   },
   "Toast": {
@@ -1351,7 +1400,8 @@
       "inputId",
       "inputClass",
       "inputStyle",
-      "inputProps"
+      "inputProps",
+      "pt"
     ]
   },
   "Toolbar": {
@@ -1376,7 +1426,8 @@
       "filterMode",
       "filterPlaceholder",
       "filterLocale",
-      "scrollHeight"
+      "scrollHeight",
+      "pt"
     ]
   },
   "TreeSelect": {
@@ -1398,7 +1449,8 @@
       "display",
       "metaKeySelection",
       "aria-labelledby",
-      "aria-label"
+      "aria-label",
+      "pt"
     ]
   },
   "TreeTable": {
@@ -1440,7 +1492,8 @@
       "scrollable",
       "scrollDirection",
       "scrollHeight",
-      "responsiveLayout"
+      "responsiveLayout",
+      "pt"
     ]
   },
   "TriStateCheckbox": {
@@ -1452,7 +1505,8 @@
       "inputId",
       "inputProps",
       "aria-labelledby",
-      "aria-label"
+      "aria-label",
+      "pt"
     ]
   },
   "VirtualScroller": {
@@ -1474,7 +1528,8 @@
       "loading",
       "showSpacer",
       "showLoader",
-      "tabindex"
+      "tabindex",
+      "pt"
     ]
   }
 }

package/virtualscroller/VirtualScroller.d.ts

@@ -10,6 +10,16 @@
 import { VNode } from 'vue';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
 
+export declare type VirtualScrollerPassThroughOptionType = VirtualScrollerPassThroughAttributes | ((options: VirtualScrollerPassThroughMethodOptions) => VirtualScrollerPassThroughAttributes) | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface VirtualScrollerPassThroughMethodOptions {
+    props: VirtualScrollerProps;
+    state: VirtualScrollerState;
+}
+
 /**
  * Custom scroll index change event.
  * @see {@link VirtualScrollerEmits['scroll-index-change']}
@@ -92,6 +102,87 @@ export interface VirtualScrollerItemOptions {
     [key: string]: any;
 }
 
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link VirtualScrollerProps.pt}
+ */
+export interface VirtualScrollerPassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: VirtualScrollerPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the content's DOM element.
+     */
+    content?: VirtualScrollerPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the spacer's DOM element.
+     */
+    spacer?: VirtualScrollerPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the loader's DOM element.
+     */
+    loader?: VirtualScrollerPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the loading icon's DOM element.
+     */
+    loadingIcon?: VirtualScrollerPassThroughOptionType;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface VirtualScrollerPassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Defines current inline state in VirtualScroller component.
+ */
+export interface VirtualScrollerState {
+    /**
+     * First index of the new data range to be loaded as a number.
+     */
+    first: number;
+    /**
+     * Last index of the new data range to be loaded as a number.
+     */
+    last: number;
+    /**
+     * Index of the first item as a number.
+     */
+    page: number;
+    /**
+     * Visible item count in the viewport as a number.
+     */
+    numItemsInViewport: number;
+    /**
+     * Lastest scroll position as a number.
+     */
+    lastScrollPos: number;
+    /**
+     * Additional elements to add to the DOM outside of the view as a number.
+     */
+    d_numToleratedItems: number;
+    /**
+     * Current loading state as a boolean.
+     * @defaultValue false
+     */
+    d_loading: number;
+    /**
+     * Loadable items array.
+     */
+    loaderArr: any[];
+    /**
+     * The style of spacer element.
+     */
+    spacerStyle: any;
+    /**
+     * The style of content element.
+     */
+    contentStyle: any;
+}
+
 /**
  * Custom virtualscroller loader options
  * @see VirtualScrollerItemOptions
@@ -169,6 +260,7 @@ export interface VirtualScrollerProps {
     loaderDisabled?: boolean | undefined;
     /**
      * Whether to show loader.
+     * @defaultValue false
      */
     showLoader?: boolean | undefined;
     /**
@@ -211,6 +303,11 @@ export interface VirtualScrollerProps {
      * @defaultValue false
      */
     autoSize?: boolean | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {VirtualScrollerPassThroughOptions}
+     */
+    pt?: VirtualScrollerPassThroughOptions;
 }
 
 /**

package/virtualscroller/VirtualScroller.vue

@@ -1,6 +1,6 @@
 <template>
     <template v-if="!disabled">
-        <div :ref="elementRef" :class="containerClass" :tabindex="tabindex" :style="style" @scroll="onScroll">
+        <div :ref="elementRef" :class="containerClass" :tabindex="tabindex" :style="style" @scroll="onScroll" v-bind="ptm('root')">
             <slot
                 name="content"
                 :styleClass="contentClass"
@@ -18,21 +18,21 @@
                 :horizontal="isHorizontal()"
                 :both="isBoth()"
             >
-                <div :ref="contentRef" :class="contentClass" :style="contentStyle">
+                <div :ref="contentRef" :class="contentClass" :style="contentStyle" v-bind="ptm('content')">
                     <template v-for="(item, index) of loadedItems" :key="index">
                         <slot name="item" :item="item" :options="getOptions(index)"></slot>
                     </template>
                 </div>
             </slot>
-            <div v-if="showSpacer" class="p-virtualscroller-spacer" :style="spacerStyle"></div>
-            <div v-if="!loaderDisabled && showLoader && d_loading" :class="loaderClass">
+            <div v-if="showSpacer" class="p-virtualscroller-spacer" :style="spacerStyle" v-bind="ptm('spacer')"></div>
+            <div v-if="!loaderDisabled && showLoader && d_loading" :class="loaderClass" v-bind="ptm('loader')">
                 <template v-if="$slots && $slots.loader">
                     <template v-for="(_, index) of loaderArr" :key="index">
                         <slot name="loader" :options="getLoaderOptions(index, isBoth() && { numCols: d_numItemsInViewport.cols })"></slot>
                     </template>
                 </template>
                 <slot name="loadingicon">
-                    <SpinnerIcon spin class="p-virtualscroller-loading-icon" />
+                    <SpinnerIcon spin class="p-virtualscroller-loading-icon" v-bind="ptm('loadingIcon')" />
                 </slot>
             </div>
         </div>
@@ -44,11 +44,13 @@
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
 import SpinnerIcon from 'primevue/icons/spinner';
 import { DomHandler } from 'primevue/utils';
 
 export default {
     name: 'VirtualScroller',
+    extends: BaseComponent,
     emits: ['update:numToleratedItems', 'scroll', 'scroll-index-change', 'lazy-load'],
     props: {
         id: {

package/virtualscroller/virtualscroller.cjs.js

@@ -1,15 +1,18 @@
 'use strict';
 
+var BaseComponent = require('primevue/basecomponent');
 var SpinnerIcon = require('primevue/icons/spinner');
 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 SpinnerIcon__default = /*#__PURE__*/_interopDefaultLegacy(SpinnerIcon);
 
 var script = {
     name: 'VirtualScroller',
+    extends: BaseComponent__default["default"],
     emits: ['update:numToleratedItems', 'scroll', 'scroll-index-change', 'lazy-load'],
     props: {
         id: {
@@ -718,14 +721,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_SpinnerIcon = vue.resolveComponent("SpinnerIcon");
 
   return (!$props.disabled)
-    ? (vue.openBlock(), vue.createElementBlock("div", {
+    ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         key: 0,
         ref: $options.elementRef,
-        class: vue.normalizeClass($options.containerClass),
+        class: $options.containerClass,
         tabindex: $props.tabindex,
-        style: vue.normalizeStyle($props.style),
+        style: $props.style,
         onScroll: _cache[0] || (_cache[0] = (...args) => ($options.onScroll && $options.onScroll(...args)))
-      }, [
+      }, _ctx.ptm('root')), [
         vue.renderSlot(_ctx.$slots, "content", {
           styleClass: $options.contentClass,
           items: $options.loadedItems,
@@ -742,11 +745,11 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           horizontal: $options.isHorizontal(),
           both: $options.isBoth()
         }, () => [
-          vue.createElementVNode("div", {
+          vue.createElementVNode("div", vue.mergeProps({
             ref: $options.contentRef,
-            class: vue.normalizeClass($options.contentClass),
-            style: vue.normalizeStyle($data.contentStyle)
-          }, [
+            class: $options.contentClass,
+            style: $data.contentStyle
+          }, _ctx.ptm('content')), [
             (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList($options.loadedItems, (item, index) => {
               return vue.renderSlot(_ctx.$slots, "item", {
                 key: index,
@@ -754,20 +757,20 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                 options: $options.getOptions(index)
               })
             }), 128))
-          ], 6)
+          ], 16)
         ]),
         ($props.showSpacer)
-          ? (vue.openBlock(), vue.createElementBlock("div", {
+          ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
               key: 0,
               class: "p-virtualscroller-spacer",
-              style: vue.normalizeStyle($data.spacerStyle)
-            }, null, 4))
+              style: $data.spacerStyle
+            }, _ctx.ptm('spacer')), null, 16))
           : vue.createCommentVNode("", true),
         (!$props.loaderDisabled && $props.showLoader && $data.d_loading)
-          ? (vue.openBlock(), vue.createElementBlock("div", {
+          ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
               key: 1,
-              class: vue.normalizeClass($options.loaderClass)
-            }, [
+              class: $options.loaderClass
+            }, _ctx.ptm('loader')), [
               (_ctx.$slots && _ctx.$slots.loader)
                 ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList($data.loaderArr, (_, index) => {
                     return vue.renderSlot(_ctx.$slots, "loader", {
@@ -777,14 +780,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
                   }), 128))
                 : vue.createCommentVNode("", true),
               vue.renderSlot(_ctx.$slots, "loadingicon", {}, () => [
-                vue.createVNode(_component_SpinnerIcon, {
+                vue.createVNode(_component_SpinnerIcon, vue.mergeProps({
                   spin: "",
                   class: "p-virtualscroller-loading-icon"
-                })
+                }, _ctx.ptm('loadingIcon')), null, 16)
               ])
-            ], 2))
+            ], 16))
           : vue.createCommentVNode("", true)
-      ], 46, _hoisted_1))
+      ], 16, _hoisted_1))
     : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
         vue.renderSlot(_ctx.$slots, "default"),
         vue.renderSlot(_ctx.$slots, "content", {