primevue 3.30.1 → 3.30.2

package/dock/dock.esm.js

@@ -158,10 +158,11 @@ var script$1 = {
     getItemProp: function getItemProp(processedItem, name) {
       return processedItem && processedItem.item ? ObjectUtils.getItemValue(processedItem.item[name]) : undefined;
     },
-    getPTOptions: function getPTOptions(id, key) {
+    getPTOptions: function getPTOptions(key, index) {
       return this.ptm(key, {
         context: {
-          active: this.isItemActive(id)
+          index: index,
+          active: this.isItemActive(this.getItemId(index))
         }
       });
     },
@@ -349,12 +350,12 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
       onMouseenter: function onMouseenter($event) {
         return $options.onItemMouseEnter(index);
       }
-    }, $options.getPTOptions($options.getItemId(index), 'menuitem'), {
+    }, $options.getPTOptions('menuitem', index), {
       "data-p-focused": $options.isItemActive($options.getItemId(index)),
       "data-p-disabled": $options.disabled(processedItem) || false
     }), [createElementVNode("div", mergeProps({
       "class": _ctx.cx('content')
-    }, $options.getPTOptions($options.getItemId(index), 'content')), [!$props.templates['item'] ? (openBlock(), createElementBlock(Fragment, {
+    }, $options.getPTOptions('content', index)), [!$props.templates['item'] ? (openBlock(), createElementBlock(Fragment, {
       key: 0
     }, [processedItem.to && !$options.disabled(processedItem) ? (openBlock(), createBlock(_component_router_link, {
       key: 0,
@@ -378,10 +379,10 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
           onClick: function onClick($event) {
             return $options.onItemActionClick($event, processedItem, navigate);
           }
-        }, $options.getPTOptions($options.getItemId(index), 'action')), [!$props.templates['icon'] ? withDirectives((openBlock(), createElementBlock("span", mergeProps({
+        }, $options.getPTOptions('action', index)), [!$props.templates['icon'] ? withDirectives((openBlock(), createElementBlock("span", mergeProps({
           key: 0,
           "class": [_ctx.cx('icon'), processedItem.icon]
-        }, $options.getPTOptions($options.getItemId(index), 'icon')), null, 16)), [[_directive_ripple]]) : (openBlock(), createBlock(resolveDynamicComponent($props.templates['icon']), {
+        }, $options.getPTOptions('icon', index)), null, 16)), [[_directive_ripple]]) : (openBlock(), createBlock(resolveDynamicComponent($props.templates['icon']), {
           key: 1,
           item: processedItem,
           "class": normalizeClass(_ctx.cx('icon'))
@@ -398,10 +399,10 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
       target: processedItem.target,
       tabindex: "-1",
       "aria-hidden": "true"
-    }, $options.getPTOptions($options.getItemId(index), 'action')), [!$props.templates['icon'] ? withDirectives((openBlock(), createElementBlock("span", mergeProps({
+    }, $options.getPTOptions('action', index)), [!$props.templates['icon'] ? withDirectives((openBlock(), createElementBlock("span", mergeProps({
       key: 0,
       "class": [_ctx.cx('icon'), processedItem.icon]
-    }, $options.getPTOptions($options.getItemId(index), 'icon')), null, 16)), [[_directive_ripple]]) : (openBlock(), createBlock(resolveDynamicComponent($props.templates['icon']), {
+    }, $options.getPTOptions('icon', index)), null, 16)), [[_directive_ripple]]) : (openBlock(), createBlock(resolveDynamicComponent($props.templates['icon']), {
       key: 1,
       item: processedItem,
       "class": normalizeClass(_ctx.cx('icon'))

package/dock/dock.esm.min.js

@@ -1 +1 @@
-import t from"primevue/basecomponent";import{useStyle as e}from"primevue/usestyle";import n from"primevue/ripple";import i from"primevue/tooltip";import{UniqueComponentId as o,ObjectUtils as r,DomHandler as a}from"primevue/utils";import{resolveComponent as c,resolveDirective as s,openBlock as l,createElementBlock as d,mergeProps as u,createElementVNode as p,Fragment as m,renderList as f,createBlock as b,withCtx as h,withDirectives as x,resolveDynamicComponent as y,normalizeClass as g,createVNode as I}from"vue";var k=e("\n.p-dock {\n    position: absolute;\n    z-index: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    pointer-events: none;\n}\n\n.p-dock-list-container {\n    display: flex;\n    pointer-events: auto;\n}\n\n.p-dock-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-dock-item {\n    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n    will-change: transform;\n}\n\n.p-dock-link {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    overflow: hidden;\n    cursor: default;\n}\n\n.p-dock-item-second-prev,\n.p-dock-item-second-next {\n    transform: scale(1.2);\n}\n\n.p-dock-item-prev,\n.p-dock-item-next {\n    transform: scale(1.4);\n}\n\n.p-dock-item-current {\n    transform: scale(1.6);\n    z-index: 1;\n}\n\n/* Position */\n/* top */\n.p-dock-top {\n    left: 0;\n    top: 0;\n    width: 100%;\n}\n\n.p-dock-top .p-dock-item {\n    transform-origin: center top;\n}\n\n/* bottom */\n.p-dock-bottom {\n    left: 0;\n    bottom: 0;\n    width: 100%;\n}\n\n.p-dock-bottom .p-dock-item {\n    transform-origin: center bottom;\n}\n\n/* right */\n.p-dock-right {\n    right: 0;\n    top: 0;\n    height: 100%;\n}\n\n.p-dock-right .p-dock-item {\n    transform-origin: center right;\n}\n\n.p-dock-right .p-dock-list {\n    flex-direction: column;\n}\n\n/* left */\n.p-dock-left {\n    left: 0;\n    top: 0;\n    height: 100%;\n}\n\n.p-dock-left .p-dock-item {\n    transform-origin: center left;\n}\n\n.p-dock-left .p-dock-list {\n    flex-direction: column;\n}\n",{name:"dock",manual:!0}),v={name:"BaseDock",extends:t,props:{position:{type:String,default:"bottom"},model:null,class:null,style:null,tooltipOptions:null,exact:{type:Boolean,default:!0},menuId:{type:String,default:null},tabindex:{type:Number,default:0},"aria-label":{type:String,default:null},"aria-labelledby":{type:String,default:null}},css:{classes:{root:function(t){var e=t.props;return["p-dock p-component","p-dock-".concat(e.position),e.class]},container:"p-dock-list-container",menu:"p-dock-list",menuitem:function(t){var e=t.instance,n=t.processedItem,i=t.index;return["p-dock-item",{"p-focus":e.isItemActive(t.id),"p-disabled":e.disabled(n),"p-dock-item-second-prev":e.currentIndex-2===i,"p-dock-item-prev":e.currentIndex-1===i,"p-dock-item-current":e.currentIndex===i,"p-dock-item-next":e.currentIndex+1===i,"p-dock-item-second-next":e.currentIndex+2===i}]},content:"p-menuitem-content",action:function(t){return["p-dock-link",{"router-link-active":t.isActive,"router-link-active-exact":t.props.exact&&t.isExactActive}]},icon:"p-dock-icon"},loadStyle:k.load},provide:function(){return{$parentInstance:this}}};function O(t){return D(t)||S(t)||w(t)||A()}function A(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function w(t,e){if(t){if("string"==typeof t)return L(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?L(t,e):void 0}}function S(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}function D(t){if(Array.isArray(t))return L(t)}function L(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}var K={name:"DockSub",hostName:"Dock",extends:t,emits:["focus","blur"],props:{position:{type:String,default:"bottom"},model:{type:Array,default:null},templates:{type:null,default:null},exact:{type:Boolean,default:!0},tooltipOptions:null,menuId:{type:String,default:null},tabindex:{type:Number,default:0},"aria-label":{type:String,default:null},"aria-labelledby":{type:String,default:null}},data:function(){return{id:this.menuId,currentIndex:-3,focused:!1,focusedOptionIndex:-1}},watch:{menuId:function(t){this.id=t||o()}},mounted:function(){this.id=this.id||o()},methods:{getItemId:function(t){return"".concat(this.id,"_").concat(t)},getItemProp:function(t,e){return t&&t.item?r.getItemValue(t.item[e]):void 0},getPTOptions:function(t,e){return this.ptm(e,{context:{active:this.isItemActive(t)}})},isSameMenuItem:function(t){return t.currentTarget&&(t.currentTarget.isSameNode(t.target)||t.currentTarget.isSameNode(t.target.closest('[data-pc-section="menuitem"]')))},isItemActive:function(t){return t===this.focusedOptionIndex},onListMouseLeave:function(){this.currentIndex=-3},onItemMouseEnter:function(t){this.currentIndex=t},onItemActionClick:function(t,e){e&&e(t)},onItemClick:function(t,e){if(this.isSameMenuItem(t)){var n=this.getItemProp(e,"command");n&&n({originalEvent:t,item:e.item})}},onListFocus:function(t){this.focused=!0,this.changeFocusedOptionIndex(0),this.$emit("focus",t)},onListBlur:function(t){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",t)},onListKeyDown:function(t){switch(t.code){case"ArrowDown":"left"!==this.position&&"right"!==this.position||this.onArrowDownKey(),t.preventDefault();break;case"ArrowUp":"left"!==this.position&&"right"!==this.position||this.onArrowUpKey(),t.preventDefault();break;case"ArrowRight":"top"!==this.position&&"bottom"!==this.position||this.onArrowDownKey(),t.preventDefault();break;case"ArrowLeft":"top"!==this.position&&"bottom"!==this.position||this.onArrowUpKey(),t.preventDefault();break;case"Home":this.onHomeKey(),t.preventDefault();break;case"End":this.onEndKey(),t.preventDefault();break;case"Enter":case"Space":this.onSpaceKey(t),t.preventDefault()}},onArrowDownKey:function(){var t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t)},onArrowUpKey:function(){var t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t)},onHomeKey:function(){this.changeFocusedOptionIndex(0)},onEndKey:function(){this.changeFocusedOptionIndex(a.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]').length-1)},onSpaceKey:function(){var t=a.findSingle(this.$refs.list,'li[id="'.concat("".concat(this.focusedOptionIndex),'"]')),e=t&&a.findSingle(t,'[data-pc-section="action"]');e?e.click():t&&t.click()},findNextOptionIndex:function(t){var e=O(a.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(e){return e.id===t}));return e>-1?e+1:0},findPrevOptionIndex:function(t){var e=O(a.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(e){return e.id===t}));return e>-1?e-1:0},changeFocusedOptionIndex:function(t){var e=a.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]');this.focusedOptionIndex=e[t>=e.length?e.length-1:t<0?0:t].getAttribute("id")},disabled:function(t){return"function"==typeof t.disabled?t.disabled():t.disabled}},computed:{focusedOptionId:function(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null}},directives:{ripple:n,tooltip:i}},P=["id","aria-orientation","aria-activedescendant","tabindex","aria-label","aria-labelledby"],E=["id","aria-label","aria-disabled","onClick","onMouseenter","data-p-focused","data-p-disabled"],M=["href","target","onClick"],T=["href","target"];K.render=function(t,e,n,i,o,r){var a=c("router-link"),I=s("ripple"),k=s("tooltip");return l(),d("div",u({class:t.cx("container")},t.ptm("container")),[p("ul",u({ref:"list",id:o.id,class:t.cx("menu"),role:"menu","aria-orientation":"bottom"===n.position||"top"===n.position?"horizontal":"vertical","aria-activedescendant":o.focused?r.focusedOptionId:void 0,tabindex:n.tabindex,"aria-label":t.ariaLabel,"aria-labelledby":t.ariaLabelledby,onFocus:e[0]||(e[0]=function(){return r.onListFocus&&r.onListFocus.apply(r,arguments)}),onBlur:e[1]||(e[1]=function(){return r.onListBlur&&r.onListBlur.apply(r,arguments)}),onKeydown:e[2]||(e[2]=function(){return r.onListKeyDown&&r.onListKeyDown.apply(r,arguments)}),onMouseleave:e[3]||(e[3]=function(){return r.onListMouseLeave&&r.onListMouseLeave.apply(r,arguments)})},t.ptm("menu")),[(l(!0),d(m,null,f(n.model,(function(e,i){return l(),d("li",u({key:i,id:r.getItemId(i),class:t.cx("menuitem",{processedItem:e,index:i,id:r.getItemId(i)}),role:"menuitem","aria-label":e.label,"aria-disabled":r.disabled(e),onClick:function(t){return r.onItemClick(t,e)},onMouseenter:function(t){return r.onItemMouseEnter(i)}},r.getPTOptions(r.getItemId(i),"menuitem"),{"data-p-focused":r.isItemActive(r.getItemId(i)),"data-p-disabled":r.disabled(e)||!1}),[p("div",u({class:t.cx("content")},r.getPTOptions(r.getItemId(i),"content")),[n.templates.item?(l(),b(y(n.templates.item),{key:1,item:e,index:i},null,8,["item","index"])):(l(),d(m,{key:0},[e.to&&!r.disabled(e)?(l(),b(a,{key:0,to:e.to,custom:""},{default:h((function(o){var a=o.navigate,c=o.href,s=o.isActive,p=o.isExactActive;return[x((l(),d("a",u({href:c,class:t.cx("action",{isActive:s,isExactActive:p}),target:e.target,tabindex:"-1","aria-hidden":"true",onClick:function(t){return r.onItemActionClick(t,e,a)}},r.getPTOptions(r.getItemId(i),"action")),[n.templates.icon?(l(),b(y(n.templates.icon),{key:1,item:e,class:g(t.cx("icon"))},null,8,["item","class"])):x((l(),d("span",u({key:0,class:[t.cx("icon"),e.icon]},r.getPTOptions(r.getItemId(i),"icon")),null,16)),[[I]])],16,M)),[[k,{value:e.label,disabled:!n.tooltipOptions},n.tooltipOptions]])]})),_:2},1032,["to"])):x((l(),d("a",u({key:1,href:e.url,class:t.cx("action"),target:e.target,tabindex:"-1","aria-hidden":"true"},r.getPTOptions(r.getItemId(i),"action")),[n.templates.icon?(l(),b(y(n.templates.icon),{key:1,item:e,class:g(t.cx("icon"))},null,8,["item","class"])):x((l(),d("span",u({key:0,class:[t.cx("icon"),e.icon]},r.getPTOptions(r.getItemId(i),"icon")),null,16)),[[I]])],16,T)),[[k,{value:e.label,disabled:!n.tooltipOptions},n.tooltipOptions]])],64))],16)],16,E)})),128))],16,P)],16)};var F={name:"Dock",extends:v,components:{DockSub:K}};F.render=function(t,e,n,i,o,r){var a=c("DockSub");return l(),d("div",u({class:t.cx("root"),style:t.style},t.ptm("root"),{"data-pc-name":"dock"}),[I(a,{model:t.model,templates:t.$slots,exact:t.exact,tooltipOptions:t.tooltipOptions,position:t.position,menuId:t.menuId,"aria-label":t.ariaLabel,"aria-labelledby":t.ariaLabelledby,tabindex:t.tabindex,pt:t.pt},null,8,["model","templates","exact","tooltipOptions","position","menuId","aria-label","aria-labelledby","tabindex","pt"])],16)};export{F as default};
+import t from"primevue/basecomponent";import{useStyle as e}from"primevue/usestyle";import n from"primevue/ripple";import i from"primevue/tooltip";import{UniqueComponentId as o,ObjectUtils as r,DomHandler as a}from"primevue/utils";import{resolveComponent as c,resolveDirective as s,openBlock as l,createElementBlock as d,mergeProps as u,createElementVNode as p,Fragment as m,renderList as f,createBlock as b,withCtx as h,withDirectives as x,resolveDynamicComponent as y,normalizeClass as k,createVNode as g}from"vue";var v=e("\n.p-dock {\n    position: absolute;\n    z-index: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    pointer-events: none;\n}\n\n.p-dock-list-container {\n    display: flex;\n    pointer-events: auto;\n}\n\n.p-dock-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-dock-item {\n    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n    will-change: transform;\n}\n\n.p-dock-link {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    overflow: hidden;\n    cursor: default;\n}\n\n.p-dock-item-second-prev,\n.p-dock-item-second-next {\n    transform: scale(1.2);\n}\n\n.p-dock-item-prev,\n.p-dock-item-next {\n    transform: scale(1.4);\n}\n\n.p-dock-item-current {\n    transform: scale(1.6);\n    z-index: 1;\n}\n\n/* Position */\n/* top */\n.p-dock-top {\n    left: 0;\n    top: 0;\n    width: 100%;\n}\n\n.p-dock-top .p-dock-item {\n    transform-origin: center top;\n}\n\n/* bottom */\n.p-dock-bottom {\n    left: 0;\n    bottom: 0;\n    width: 100%;\n}\n\n.p-dock-bottom .p-dock-item {\n    transform-origin: center bottom;\n}\n\n/* right */\n.p-dock-right {\n    right: 0;\n    top: 0;\n    height: 100%;\n}\n\n.p-dock-right .p-dock-item {\n    transform-origin: center right;\n}\n\n.p-dock-right .p-dock-list {\n    flex-direction: column;\n}\n\n/* left */\n.p-dock-left {\n    left: 0;\n    top: 0;\n    height: 100%;\n}\n\n.p-dock-left .p-dock-item {\n    transform-origin: center left;\n}\n\n.p-dock-left .p-dock-list {\n    flex-direction: column;\n}\n",{name:"dock",manual:!0}),I={name:"BaseDock",extends:t,props:{position:{type:String,default:"bottom"},model:null,class:null,style:null,tooltipOptions:null,exact:{type:Boolean,default:!0},menuId:{type:String,default:null},tabindex:{type:Number,default:0},"aria-label":{type:String,default:null},"aria-labelledby":{type:String,default:null}},css:{classes:{root:function(t){var e=t.props;return["p-dock p-component","p-dock-".concat(e.position),e.class]},container:"p-dock-list-container",menu:"p-dock-list",menuitem:function(t){var e=t.instance,n=t.processedItem,i=t.index;return["p-dock-item",{"p-focus":e.isItemActive(t.id),"p-disabled":e.disabled(n),"p-dock-item-second-prev":e.currentIndex-2===i,"p-dock-item-prev":e.currentIndex-1===i,"p-dock-item-current":e.currentIndex===i,"p-dock-item-next":e.currentIndex+1===i,"p-dock-item-second-next":e.currentIndex+2===i}]},content:"p-menuitem-content",action:function(t){return["p-dock-link",{"router-link-active":t.isActive,"router-link-active-exact":t.props.exact&&t.isExactActive}]},icon:"p-dock-icon"},loadStyle:v.load},provide:function(){return{$parentInstance:this}}};function O(t){return D(t)||S(t)||w(t)||A()}function A(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function w(t,e){if(t){if("string"==typeof t)return L(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?L(t,e):void 0}}function S(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}function D(t){if(Array.isArray(t))return L(t)}function L(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}var K={name:"DockSub",hostName:"Dock",extends:t,emits:["focus","blur"],props:{position:{type:String,default:"bottom"},model:{type:Array,default:null},templates:{type:null,default:null},exact:{type:Boolean,default:!0},tooltipOptions:null,menuId:{type:String,default:null},tabindex:{type:Number,default:0},"aria-label":{type:String,default:null},"aria-labelledby":{type:String,default:null}},data:function(){return{id:this.menuId,currentIndex:-3,focused:!1,focusedOptionIndex:-1}},watch:{menuId:function(t){this.id=t||o()}},mounted:function(){this.id=this.id||o()},methods:{getItemId:function(t){return"".concat(this.id,"_").concat(t)},getItemProp:function(t,e){return t&&t.item?r.getItemValue(t.item[e]):void 0},getPTOptions:function(t,e){return this.ptm(t,{context:{index:e,active:this.isItemActive(this.getItemId(e))}})},isSameMenuItem:function(t){return t.currentTarget&&(t.currentTarget.isSameNode(t.target)||t.currentTarget.isSameNode(t.target.closest('[data-pc-section="menuitem"]')))},isItemActive:function(t){return t===this.focusedOptionIndex},onListMouseLeave:function(){this.currentIndex=-3},onItemMouseEnter:function(t){this.currentIndex=t},onItemActionClick:function(t,e){e&&e(t)},onItemClick:function(t,e){if(this.isSameMenuItem(t)){var n=this.getItemProp(e,"command");n&&n({originalEvent:t,item:e.item})}},onListFocus:function(t){this.focused=!0,this.changeFocusedOptionIndex(0),this.$emit("focus",t)},onListBlur:function(t){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",t)},onListKeyDown:function(t){switch(t.code){case"ArrowDown":"left"!==this.position&&"right"!==this.position||this.onArrowDownKey(),t.preventDefault();break;case"ArrowUp":"left"!==this.position&&"right"!==this.position||this.onArrowUpKey(),t.preventDefault();break;case"ArrowRight":"top"!==this.position&&"bottom"!==this.position||this.onArrowDownKey(),t.preventDefault();break;case"ArrowLeft":"top"!==this.position&&"bottom"!==this.position||this.onArrowUpKey(),t.preventDefault();break;case"Home":this.onHomeKey(),t.preventDefault();break;case"End":this.onEndKey(),t.preventDefault();break;case"Enter":case"Space":this.onSpaceKey(t),t.preventDefault()}},onArrowDownKey:function(){var t=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t)},onArrowUpKey:function(){var t=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(t)},onHomeKey:function(){this.changeFocusedOptionIndex(0)},onEndKey:function(){this.changeFocusedOptionIndex(a.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]').length-1)},onSpaceKey:function(){var t=a.findSingle(this.$refs.list,'li[id="'.concat("".concat(this.focusedOptionIndex),'"]')),e=t&&a.findSingle(t,'[data-pc-section="action"]');e?e.click():t&&t.click()},findNextOptionIndex:function(t){var e=O(a.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(e){return e.id===t}));return e>-1?e+1:0},findPrevOptionIndex:function(t){var e=O(a.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(e){return e.id===t}));return e>-1?e-1:0},changeFocusedOptionIndex:function(t){var e=a.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]');this.focusedOptionIndex=e[t>=e.length?e.length-1:t<0?0:t].getAttribute("id")},disabled:function(t){return"function"==typeof t.disabled?t.disabled():t.disabled}},computed:{focusedOptionId:function(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null}},directives:{ripple:n,tooltip:i}},P=["id","aria-orientation","aria-activedescendant","tabindex","aria-label","aria-labelledby"],E=["id","aria-label","aria-disabled","onClick","onMouseenter","data-p-focused","data-p-disabled"],M=["href","target","onClick"],T=["href","target"];K.render=function(t,e,n,i,o,r){var a=c("router-link"),g=s("ripple"),v=s("tooltip");return l(),d("div",u({class:t.cx("container")},t.ptm("container")),[p("ul",u({ref:"list",id:o.id,class:t.cx("menu"),role:"menu","aria-orientation":"bottom"===n.position||"top"===n.position?"horizontal":"vertical","aria-activedescendant":o.focused?r.focusedOptionId:void 0,tabindex:n.tabindex,"aria-label":t.ariaLabel,"aria-labelledby":t.ariaLabelledby,onFocus:e[0]||(e[0]=function(){return r.onListFocus&&r.onListFocus.apply(r,arguments)}),onBlur:e[1]||(e[1]=function(){return r.onListBlur&&r.onListBlur.apply(r,arguments)}),onKeydown:e[2]||(e[2]=function(){return r.onListKeyDown&&r.onListKeyDown.apply(r,arguments)}),onMouseleave:e[3]||(e[3]=function(){return r.onListMouseLeave&&r.onListMouseLeave.apply(r,arguments)})},t.ptm("menu")),[(l(!0),d(m,null,f(n.model,(function(e,i){return l(),d("li",u({key:i,id:r.getItemId(i),class:t.cx("menuitem",{processedItem:e,index:i,id:r.getItemId(i)}),role:"menuitem","aria-label":e.label,"aria-disabled":r.disabled(e),onClick:function(t){return r.onItemClick(t,e)},onMouseenter:function(t){return r.onItemMouseEnter(i)}},r.getPTOptions("menuitem",i),{"data-p-focused":r.isItemActive(r.getItemId(i)),"data-p-disabled":r.disabled(e)||!1}),[p("div",u({class:t.cx("content")},r.getPTOptions("content",i)),[n.templates.item?(l(),b(y(n.templates.item),{key:1,item:e,index:i},null,8,["item","index"])):(l(),d(m,{key:0},[e.to&&!r.disabled(e)?(l(),b(a,{key:0,to:e.to,custom:""},{default:h((function(o){var a=o.navigate,c=o.href,s=o.isActive,p=o.isExactActive;return[x((l(),d("a",u({href:c,class:t.cx("action",{isActive:s,isExactActive:p}),target:e.target,tabindex:"-1","aria-hidden":"true",onClick:function(t){return r.onItemActionClick(t,e,a)}},r.getPTOptions("action",i)),[n.templates.icon?(l(),b(y(n.templates.icon),{key:1,item:e,class:k(t.cx("icon"))},null,8,["item","class"])):x((l(),d("span",u({key:0,class:[t.cx("icon"),e.icon]},r.getPTOptions("icon",i)),null,16)),[[g]])],16,M)),[[v,{value:e.label,disabled:!n.tooltipOptions},n.tooltipOptions]])]})),_:2},1032,["to"])):x((l(),d("a",u({key:1,href:e.url,class:t.cx("action"),target:e.target,tabindex:"-1","aria-hidden":"true"},r.getPTOptions("action",i)),[n.templates.icon?(l(),b(y(n.templates.icon),{key:1,item:e,class:k(t.cx("icon"))},null,8,["item","class"])):x((l(),d("span",u({key:0,class:[t.cx("icon"),e.icon]},r.getPTOptions("icon",i)),null,16)),[[g]])],16,T)),[[v,{value:e.label,disabled:!n.tooltipOptions},n.tooltipOptions]])],64))],16)],16,E)})),128))],16,P)],16)};var F={name:"Dock",extends:I,components:{DockSub:K}};F.render=function(t,e,n,i,o,r){var a=c("DockSub");return l(),d("div",u({class:t.cx("root"),style:t.style},t.ptm("root"),{"data-pc-name":"dock"}),[g(a,{model:t.model,templates:t.$slots,exact:t.exact,tooltipOptions:t.tooltipOptions,position:t.position,menuId:t.menuId,"aria-label":t.ariaLabel,"aria-labelledby":t.ariaLabelledby,tabindex:t.tabindex,pt:t.pt},null,8,["model","templates","exact","tooltipOptions","position","menuId","aria-label","aria-labelledby","tabindex","pt"])],16)};export{F as default};

package/dock/dock.js

@@ -161,10 +161,11 @@ this.primevue.dock = (function (BaseComponent, usestyle, Ripple, Tooltip, utils,
         getItemProp: function getItemProp(processedItem, name) {
           return processedItem && processedItem.item ? utils.ObjectUtils.getItemValue(processedItem.item[name]) : undefined;
         },
-        getPTOptions: function getPTOptions(id, key) {
+        getPTOptions: function getPTOptions(key, index) {
           return this.ptm(key, {
             context: {
-              active: this.isItemActive(id)
+              index: index,
+              active: this.isItemActive(this.getItemId(index))
             }
           });
         },
@@ -352,12 +353,12 @@ this.primevue.dock = (function (BaseComponent, usestyle, Ripple, Tooltip, utils,
           onMouseenter: function onMouseenter($event) {
             return $options.onItemMouseEnter(index);
           }
-        }, $options.getPTOptions($options.getItemId(index), 'menuitem'), {
+        }, $options.getPTOptions('menuitem', index), {
           "data-p-focused": $options.isItemActive($options.getItemId(index)),
           "data-p-disabled": $options.disabled(processedItem) || false
         }), [vue.createElementVNode("div", vue.mergeProps({
           "class": _ctx.cx('content')
-        }, $options.getPTOptions($options.getItemId(index), 'content')), [!$props.templates['item'] ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
+        }, $options.getPTOptions('content', index)), [!$props.templates['item'] ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
           key: 0
         }, [processedItem.to && !$options.disabled(processedItem) ? (vue.openBlock(), vue.createBlock(_component_router_link, {
           key: 0,
@@ -381,10 +382,10 @@ this.primevue.dock = (function (BaseComponent, usestyle, Ripple, Tooltip, utils,
               onClick: function onClick($event) {
                 return $options.onItemActionClick($event, processedItem, navigate);
               }
-            }, $options.getPTOptions($options.getItemId(index), 'action')), [!$props.templates['icon'] ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+            }, $options.getPTOptions('action', index)), [!$props.templates['icon'] ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
               key: 0,
               "class": [_ctx.cx('icon'), processedItem.icon]
-            }, $options.getPTOptions($options.getItemId(index), 'icon')), null, 16)), [[_directive_ripple]]) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates['icon']), {
+            }, $options.getPTOptions('icon', index)), null, 16)), [[_directive_ripple]]) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates['icon']), {
               key: 1,
               item: processedItem,
               "class": vue.normalizeClass(_ctx.cx('icon'))
@@ -401,10 +402,10 @@ this.primevue.dock = (function (BaseComponent, usestyle, Ripple, Tooltip, utils,
           target: processedItem.target,
           tabindex: "-1",
           "aria-hidden": "true"
-        }, $options.getPTOptions($options.getItemId(index), 'action')), [!$props.templates['icon'] ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
+        }, $options.getPTOptions('action', index)), [!$props.templates['icon'] ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", vue.mergeProps({
           key: 0,
           "class": [_ctx.cx('icon'), processedItem.icon]
-        }, $options.getPTOptions($options.getItemId(index), 'icon')), null, 16)), [[_directive_ripple]]) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates['icon']), {
+        }, $options.getPTOptions('icon', index)), null, 16)), [[_directive_ripple]]) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates['icon']), {
           key: 1,
           item: processedItem,
           "class": vue.normalizeClass(_ctx.cx('icon'))

package/dock/dock.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.dock=function(e,t,n,o,i,r){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=a(e),l=a(n),s=a(o),d=t.useStyle("\n.p-dock {\n    position: absolute;\n    z-index: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    pointer-events: none;\n}\n\n.p-dock-list-container {\n    display: flex;\n    pointer-events: auto;\n}\n\n.p-dock-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-dock-item {\n    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n    will-change: transform;\n}\n\n.p-dock-link {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    overflow: hidden;\n    cursor: default;\n}\n\n.p-dock-item-second-prev,\n.p-dock-item-second-next {\n    transform: scale(1.2);\n}\n\n.p-dock-item-prev,\n.p-dock-item-next {\n    transform: scale(1.4);\n}\n\n.p-dock-item-current {\n    transform: scale(1.6);\n    z-index: 1;\n}\n\n/* Position */\n/* top */\n.p-dock-top {\n    left: 0;\n    top: 0;\n    width: 100%;\n}\n\n.p-dock-top .p-dock-item {\n    transform-origin: center top;\n}\n\n/* bottom */\n.p-dock-bottom {\n    left: 0;\n    bottom: 0;\n    width: 100%;\n}\n\n.p-dock-bottom .p-dock-item {\n    transform-origin: center bottom;\n}\n\n/* right */\n.p-dock-right {\n    right: 0;\n    top: 0;\n    height: 100%;\n}\n\n.p-dock-right .p-dock-item {\n    transform-origin: center right;\n}\n\n.p-dock-right .p-dock-list {\n    flex-direction: column;\n}\n\n/* left */\n.p-dock-left {\n    left: 0;\n    top: 0;\n    height: 100%;\n}\n\n.p-dock-left .p-dock-item {\n    transform-origin: center left;\n}\n\n.p-dock-left .p-dock-list {\n    flex-direction: column;\n}\n",{name:"dock",manual:!0}),p={name:"BaseDock",extends:c.default,props:{position:{type:String,default:"bottom"},model:null,class:null,style:null,tooltipOptions:null,exact:{type:Boolean,default:!0},menuId:{type:String,default:null},tabindex:{type:Number,default:0},"aria-label":{type:String,default:null},"aria-labelledby":{type:String,default:null}},css:{classes:{root:function(e){var t=e.props;return["p-dock p-component","p-dock-".concat(t.position),t.class]},container:"p-dock-list-container",menu:"p-dock-list",menuitem:function(e){var t=e.instance,n=e.processedItem,o=e.index;return["p-dock-item",{"p-focus":t.isItemActive(e.id),"p-disabled":t.disabled(n),"p-dock-item-second-prev":t.currentIndex-2===o,"p-dock-item-prev":t.currentIndex-1===o,"p-dock-item-current":t.currentIndex===o,"p-dock-item-next":t.currentIndex+1===o,"p-dock-item-second-next":t.currentIndex+2===o}]},content:"p-menuitem-content",action:function(e){return["p-dock-link",{"router-link-active":e.isActive,"router-link-active-exact":e.props.exact&&e.isExactActive}]},icon:"p-dock-icon"},loadStyle:d.load},provide:function(){return{$parentInstance:this}}};function u(e){return h(e)||k(e)||f(e)||m()}function m(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function f(e,t){if(e){if("string"==typeof e)return b(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?b(e,t):void 0}}function k(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function h(e){if(Array.isArray(e))return b(e)}function b(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}var g={name:"DockSub",hostName:"Dock",extends:c.default,emits:["focus","blur"],props:{position:{type:String,default:"bottom"},model:{type:Array,default:null},templates:{type:null,default:null},exact:{type:Boolean,default:!0},tooltipOptions:null,menuId:{type:String,default:null},tabindex:{type:Number,default:0},"aria-label":{type:String,default:null},"aria-labelledby":{type:String,default:null}},data:function(){return{id:this.menuId,currentIndex:-3,focused:!1,focusedOptionIndex:-1}},watch:{menuId:function(e){this.id=e||i.UniqueComponentId()}},mounted:function(){this.id=this.id||i.UniqueComponentId()},methods:{getItemId:function(e){return"".concat(this.id,"_").concat(e)},getItemProp:function(e,t){return e&&e.item?i.ObjectUtils.getItemValue(e.item[t]):void 0},getPTOptions:function(e,t){return this.ptm(t,{context:{active:this.isItemActive(e)}})},isSameMenuItem:function(e){return e.currentTarget&&(e.currentTarget.isSameNode(e.target)||e.currentTarget.isSameNode(e.target.closest('[data-pc-section="menuitem"]')))},isItemActive:function(e){return e===this.focusedOptionIndex},onListMouseLeave:function(){this.currentIndex=-3},onItemMouseEnter:function(e){this.currentIndex=e},onItemActionClick:function(e,t){t&&t(e)},onItemClick:function(e,t){if(this.isSameMenuItem(e)){var n=this.getItemProp(t,"command");n&&n({originalEvent:e,item:t.item})}},onListFocus:function(e){this.focused=!0,this.changeFocusedOptionIndex(0),this.$emit("focus",e)},onListBlur:function(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onListKeyDown:function(e){switch(e.code){case"ArrowDown":"left"!==this.position&&"right"!==this.position||this.onArrowDownKey(),e.preventDefault();break;case"ArrowUp":"left"!==this.position&&"right"!==this.position||this.onArrowUpKey(),e.preventDefault();break;case"ArrowRight":"top"!==this.position&&"bottom"!==this.position||this.onArrowDownKey(),e.preventDefault();break;case"ArrowLeft":"top"!==this.position&&"bottom"!==this.position||this.onArrowUpKey(),e.preventDefault();break;case"Home":this.onHomeKey(),e.preventDefault();break;case"End":this.onEndKey(),e.preventDefault();break;case"Enter":case"Space":this.onSpaceKey(e),e.preventDefault()}},onArrowDownKey:function(){var e=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(e)},onArrowUpKey:function(){var e=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(e)},onHomeKey:function(){this.changeFocusedOptionIndex(0)},onEndKey:function(){this.changeFocusedOptionIndex(i.DomHandler.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]').length-1)},onSpaceKey:function(){var e=i.DomHandler.findSingle(this.$refs.list,'li[id="'.concat("".concat(this.focusedOptionIndex),'"]')),t=e&&i.DomHandler.findSingle(e,'[data-pc-section="action"]');t?t.click():e&&e.click()},findNextOptionIndex:function(e){var t=u(i.DomHandler.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(t){return t.id===e}));return t>-1?t+1:0},findPrevOptionIndex:function(e){var t=u(i.DomHandler.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(t){return t.id===e}));return t>-1?t-1:0},changeFocusedOptionIndex:function(e){var t=i.DomHandler.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]');this.focusedOptionIndex=t[e>=t.length?t.length-1:e<0?0:e].getAttribute("id")},disabled:function(e){return"function"==typeof e.disabled?e.disabled():e.disabled}},computed:{focusedOptionId:function(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null}},directives:{ripple:l.default,tooltip:s.default}},v=["id","aria-orientation","aria-activedescendant","tabindex","aria-label","aria-labelledby"],y=["id","aria-label","aria-disabled","onClick","onMouseenter","data-p-focused","data-p-disabled"],x=["href","target","onClick"],I=["href","target"];g.render=function(e,t,n,o,i,a){var c=r.resolveComponent("router-link"),l=r.resolveDirective("ripple"),s=r.resolveDirective("tooltip");return r.openBlock(),r.createElementBlock("div",r.mergeProps({class:e.cx("container")},e.ptm("container")),[r.createElementVNode("ul",r.mergeProps({ref:"list",id:i.id,class:e.cx("menu"),role:"menu","aria-orientation":"bottom"===n.position||"top"===n.position?"horizontal":"vertical","aria-activedescendant":i.focused?a.focusedOptionId:void 0,tabindex:n.tabindex,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,onFocus:t[0]||(t[0]=function(){return a.onListFocus&&a.onListFocus.apply(a,arguments)}),onBlur:t[1]||(t[1]=function(){return a.onListBlur&&a.onListBlur.apply(a,arguments)}),onKeydown:t[2]||(t[2]=function(){return a.onListKeyDown&&a.onListKeyDown.apply(a,arguments)}),onMouseleave:t[3]||(t[3]=function(){return a.onListMouseLeave&&a.onListMouseLeave.apply(a,arguments)})},e.ptm("menu")),[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(n.model,(function(t,o){return r.openBlock(),r.createElementBlock("li",r.mergeProps({key:o,id:a.getItemId(o),class:e.cx("menuitem",{processedItem:t,index:o,id:a.getItemId(o)}),role:"menuitem","aria-label":t.label,"aria-disabled":a.disabled(t),onClick:function(e){return a.onItemClick(e,t)},onMouseenter:function(e){return a.onItemMouseEnter(o)}},a.getPTOptions(a.getItemId(o),"menuitem"),{"data-p-focused":a.isItemActive(a.getItemId(o)),"data-p-disabled":a.disabled(t)||!1}),[r.createElementVNode("div",r.mergeProps({class:e.cx("content")},a.getPTOptions(a.getItemId(o),"content")),[n.templates.item?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.item),{key:1,item:t,index:o},null,8,["item","index"])):(r.openBlock(),r.createElementBlock(r.Fragment,{key:0},[t.to&&!a.disabled(t)?(r.openBlock(),r.createBlock(c,{key:0,to:t.to,custom:""},{default:r.withCtx((function(i){var c=i.navigate,d=i.href,p=i.isActive,u=i.isExactActive;return[r.withDirectives((r.openBlock(),r.createElementBlock("a",r.mergeProps({href:d,class:e.cx("action",{isActive:p,isExactActive:u}),target:t.target,tabindex:"-1","aria-hidden":"true",onClick:function(e){return a.onItemActionClick(e,t,c)}},a.getPTOptions(a.getItemId(o),"action")),[n.templates.icon?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.icon),{key:1,item:t,class:r.normalizeClass(e.cx("icon"))},null,8,["item","class"])):r.withDirectives((r.openBlock(),r.createElementBlock("span",r.mergeProps({key:0,class:[e.cx("icon"),t.icon]},a.getPTOptions(a.getItemId(o),"icon")),null,16)),[[l]])],16,x)),[[s,{value:t.label,disabled:!n.tooltipOptions},n.tooltipOptions]])]})),_:2},1032,["to"])):r.withDirectives((r.openBlock(),r.createElementBlock("a",r.mergeProps({key:1,href:t.url,class:e.cx("action"),target:t.target,tabindex:"-1","aria-hidden":"true"},a.getPTOptions(a.getItemId(o),"action")),[n.templates.icon?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.icon),{key:1,item:t,class:r.normalizeClass(e.cx("icon"))},null,8,["item","class"])):r.withDirectives((r.openBlock(),r.createElementBlock("span",r.mergeProps({key:0,class:[e.cx("icon"),t.icon]},a.getPTOptions(a.getItemId(o),"icon")),null,16)),[[l]])],16,I)),[[s,{value:t.label,disabled:!n.tooltipOptions},n.tooltipOptions]])],64))],16)],16,y)})),128))],16,v)],16)};var O={name:"Dock",extends:p,components:{DockSub:g}};return O.render=function(e,t,n,o,i,a){var c=r.resolveComponent("DockSub");return r.openBlock(),r.createElementBlock("div",r.mergeProps({class:e.cx("root"),style:e.style},e.ptm("root"),{"data-pc-name":"dock"}),[r.createVNode(c,{model:e.model,templates:e.$slots,exact:e.exact,tooltipOptions:e.tooltipOptions,position:e.position,menuId:e.menuId,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,tabindex:e.tabindex,pt:e.pt},null,8,["model","templates","exact","tooltipOptions","position","menuId","aria-label","aria-labelledby","tabindex","pt"])],16)},O}(primevue.basecomponent,primevue.usestyle,primevue.ripple,primevue.tooltip,primevue.utils,Vue);
+this.primevue=this.primevue||{},this.primevue.dock=function(e,t,n,o,i,r){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=a(e),l=a(n),s=a(o),d=t.useStyle("\n.p-dock {\n    position: absolute;\n    z-index: 1;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    pointer-events: none;\n}\n\n.p-dock-list-container {\n    display: flex;\n    pointer-events: auto;\n}\n\n.p-dock-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.p-dock-item {\n    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n    will-change: transform;\n}\n\n.p-dock-link {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    overflow: hidden;\n    cursor: default;\n}\n\n.p-dock-item-second-prev,\n.p-dock-item-second-next {\n    transform: scale(1.2);\n}\n\n.p-dock-item-prev,\n.p-dock-item-next {\n    transform: scale(1.4);\n}\n\n.p-dock-item-current {\n    transform: scale(1.6);\n    z-index: 1;\n}\n\n/* Position */\n/* top */\n.p-dock-top {\n    left: 0;\n    top: 0;\n    width: 100%;\n}\n\n.p-dock-top .p-dock-item {\n    transform-origin: center top;\n}\n\n/* bottom */\n.p-dock-bottom {\n    left: 0;\n    bottom: 0;\n    width: 100%;\n}\n\n.p-dock-bottom .p-dock-item {\n    transform-origin: center bottom;\n}\n\n/* right */\n.p-dock-right {\n    right: 0;\n    top: 0;\n    height: 100%;\n}\n\n.p-dock-right .p-dock-item {\n    transform-origin: center right;\n}\n\n.p-dock-right .p-dock-list {\n    flex-direction: column;\n}\n\n/* left */\n.p-dock-left {\n    left: 0;\n    top: 0;\n    height: 100%;\n}\n\n.p-dock-left .p-dock-item {\n    transform-origin: center left;\n}\n\n.p-dock-left .p-dock-list {\n    flex-direction: column;\n}\n",{name:"dock",manual:!0}),p={name:"BaseDock",extends:c.default,props:{position:{type:String,default:"bottom"},model:null,class:null,style:null,tooltipOptions:null,exact:{type:Boolean,default:!0},menuId:{type:String,default:null},tabindex:{type:Number,default:0},"aria-label":{type:String,default:null},"aria-labelledby":{type:String,default:null}},css:{classes:{root:function(e){var t=e.props;return["p-dock p-component","p-dock-".concat(t.position),t.class]},container:"p-dock-list-container",menu:"p-dock-list",menuitem:function(e){var t=e.instance,n=e.processedItem,o=e.index;return["p-dock-item",{"p-focus":t.isItemActive(e.id),"p-disabled":t.disabled(n),"p-dock-item-second-prev":t.currentIndex-2===o,"p-dock-item-prev":t.currentIndex-1===o,"p-dock-item-current":t.currentIndex===o,"p-dock-item-next":t.currentIndex+1===o,"p-dock-item-second-next":t.currentIndex+2===o}]},content:"p-menuitem-content",action:function(e){return["p-dock-link",{"router-link-active":e.isActive,"router-link-active-exact":e.props.exact&&e.isExactActive}]},icon:"p-dock-icon"},loadStyle:d.load},provide:function(){return{$parentInstance:this}}};function u(e){return k(e)||h(e)||f(e)||m()}function m(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function f(e,t){if(e){if("string"==typeof e)return b(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?b(e,t):void 0}}function h(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function k(e){if(Array.isArray(e))return b(e)}function b(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,o=new Array(t);n<t;n++)o[n]=e[n];return o}var v={name:"DockSub",hostName:"Dock",extends:c.default,emits:["focus","blur"],props:{position:{type:String,default:"bottom"},model:{type:Array,default:null},templates:{type:null,default:null},exact:{type:Boolean,default:!0},tooltipOptions:null,menuId:{type:String,default:null},tabindex:{type:Number,default:0},"aria-label":{type:String,default:null},"aria-labelledby":{type:String,default:null}},data:function(){return{id:this.menuId,currentIndex:-3,focused:!1,focusedOptionIndex:-1}},watch:{menuId:function(e){this.id=e||i.UniqueComponentId()}},mounted:function(){this.id=this.id||i.UniqueComponentId()},methods:{getItemId:function(e){return"".concat(this.id,"_").concat(e)},getItemProp:function(e,t){return e&&e.item?i.ObjectUtils.getItemValue(e.item[t]):void 0},getPTOptions:function(e,t){return this.ptm(e,{context:{index:t,active:this.isItemActive(this.getItemId(t))}})},isSameMenuItem:function(e){return e.currentTarget&&(e.currentTarget.isSameNode(e.target)||e.currentTarget.isSameNode(e.target.closest('[data-pc-section="menuitem"]')))},isItemActive:function(e){return e===this.focusedOptionIndex},onListMouseLeave:function(){this.currentIndex=-3},onItemMouseEnter:function(e){this.currentIndex=e},onItemActionClick:function(e,t){t&&t(e)},onItemClick:function(e,t){if(this.isSameMenuItem(e)){var n=this.getItemProp(t,"command");n&&n({originalEvent:e,item:t.item})}},onListFocus:function(e){this.focused=!0,this.changeFocusedOptionIndex(0),this.$emit("focus",e)},onListBlur:function(e){this.focused=!1,this.focusedOptionIndex=-1,this.$emit("blur",e)},onListKeyDown:function(e){switch(e.code){case"ArrowDown":"left"!==this.position&&"right"!==this.position||this.onArrowDownKey(),e.preventDefault();break;case"ArrowUp":"left"!==this.position&&"right"!==this.position||this.onArrowUpKey(),e.preventDefault();break;case"ArrowRight":"top"!==this.position&&"bottom"!==this.position||this.onArrowDownKey(),e.preventDefault();break;case"ArrowLeft":"top"!==this.position&&"bottom"!==this.position||this.onArrowUpKey(),e.preventDefault();break;case"Home":this.onHomeKey(),e.preventDefault();break;case"End":this.onEndKey(),e.preventDefault();break;case"Enter":case"Space":this.onSpaceKey(e),e.preventDefault()}},onArrowDownKey:function(){var e=this.findNextOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(e)},onArrowUpKey:function(){var e=this.findPrevOptionIndex(this.focusedOptionIndex);this.changeFocusedOptionIndex(e)},onHomeKey:function(){this.changeFocusedOptionIndex(0)},onEndKey:function(){this.changeFocusedOptionIndex(i.DomHandler.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]').length-1)},onSpaceKey:function(){var e=i.DomHandler.findSingle(this.$refs.list,'li[id="'.concat("".concat(this.focusedOptionIndex),'"]')),t=e&&i.DomHandler.findSingle(e,'[data-pc-section="action"]');t?t.click():e&&e.click()},findNextOptionIndex:function(e){var t=u(i.DomHandler.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(t){return t.id===e}));return t>-1?t+1:0},findPrevOptionIndex:function(e){var t=u(i.DomHandler.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]')).findIndex((function(t){return t.id===e}));return t>-1?t-1:0},changeFocusedOptionIndex:function(e){var t=i.DomHandler.find(this.$refs.list,'li[data-pc-section="menuitem"][data-p-disabled="false"]');this.focusedOptionIndex=t[e>=t.length?t.length-1:e<0?0:e].getAttribute("id")},disabled:function(e){return"function"==typeof e.disabled?e.disabled():e.disabled}},computed:{focusedOptionId:function(){return-1!==this.focusedOptionIndex?this.focusedOptionIndex:null}},directives:{ripple:l.default,tooltip:s.default}},g=["id","aria-orientation","aria-activedescendant","tabindex","aria-label","aria-labelledby"],x=["id","aria-label","aria-disabled","onClick","onMouseenter","data-p-focused","data-p-disabled"],y=["href","target","onClick"],I=["href","target"];v.render=function(e,t,n,o,i,a){var c=r.resolveComponent("router-link"),l=r.resolveDirective("ripple"),s=r.resolveDirective("tooltip");return r.openBlock(),r.createElementBlock("div",r.mergeProps({class:e.cx("container")},e.ptm("container")),[r.createElementVNode("ul",r.mergeProps({ref:"list",id:i.id,class:e.cx("menu"),role:"menu","aria-orientation":"bottom"===n.position||"top"===n.position?"horizontal":"vertical","aria-activedescendant":i.focused?a.focusedOptionId:void 0,tabindex:n.tabindex,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,onFocus:t[0]||(t[0]=function(){return a.onListFocus&&a.onListFocus.apply(a,arguments)}),onBlur:t[1]||(t[1]=function(){return a.onListBlur&&a.onListBlur.apply(a,arguments)}),onKeydown:t[2]||(t[2]=function(){return a.onListKeyDown&&a.onListKeyDown.apply(a,arguments)}),onMouseleave:t[3]||(t[3]=function(){return a.onListMouseLeave&&a.onListMouseLeave.apply(a,arguments)})},e.ptm("menu")),[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(n.model,(function(t,o){return r.openBlock(),r.createElementBlock("li",r.mergeProps({key:o,id:a.getItemId(o),class:e.cx("menuitem",{processedItem:t,index:o,id:a.getItemId(o)}),role:"menuitem","aria-label":t.label,"aria-disabled":a.disabled(t),onClick:function(e){return a.onItemClick(e,t)},onMouseenter:function(e){return a.onItemMouseEnter(o)}},a.getPTOptions("menuitem",o),{"data-p-focused":a.isItemActive(a.getItemId(o)),"data-p-disabled":a.disabled(t)||!1}),[r.createElementVNode("div",r.mergeProps({class:e.cx("content")},a.getPTOptions("content",o)),[n.templates.item?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.item),{key:1,item:t,index:o},null,8,["item","index"])):(r.openBlock(),r.createElementBlock(r.Fragment,{key:0},[t.to&&!a.disabled(t)?(r.openBlock(),r.createBlock(c,{key:0,to:t.to,custom:""},{default:r.withCtx((function(i){var c=i.navigate,d=i.href,p=i.isActive,u=i.isExactActive;return[r.withDirectives((r.openBlock(),r.createElementBlock("a",r.mergeProps({href:d,class:e.cx("action",{isActive:p,isExactActive:u}),target:t.target,tabindex:"-1","aria-hidden":"true",onClick:function(e){return a.onItemActionClick(e,t,c)}},a.getPTOptions("action",o)),[n.templates.icon?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.icon),{key:1,item:t,class:r.normalizeClass(e.cx("icon"))},null,8,["item","class"])):r.withDirectives((r.openBlock(),r.createElementBlock("span",r.mergeProps({key:0,class:[e.cx("icon"),t.icon]},a.getPTOptions("icon",o)),null,16)),[[l]])],16,y)),[[s,{value:t.label,disabled:!n.tooltipOptions},n.tooltipOptions]])]})),_:2},1032,["to"])):r.withDirectives((r.openBlock(),r.createElementBlock("a",r.mergeProps({key:1,href:t.url,class:e.cx("action"),target:t.target,tabindex:"-1","aria-hidden":"true"},a.getPTOptions("action",o)),[n.templates.icon?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(n.templates.icon),{key:1,item:t,class:r.normalizeClass(e.cx("icon"))},null,8,["item","class"])):r.withDirectives((r.openBlock(),r.createElementBlock("span",r.mergeProps({key:0,class:[e.cx("icon"),t.icon]},a.getPTOptions("icon",o)),null,16)),[[l]])],16,I)),[[s,{value:t.label,disabled:!n.tooltipOptions},n.tooltipOptions]])],64))],16)],16,x)})),128))],16,g)],16)};var O={name:"Dock",extends:p,components:{DockSub:v}};return O.render=function(e,t,n,o,i,a){var c=r.resolveComponent("DockSub");return r.openBlock(),r.createElementBlock("div",r.mergeProps({class:e.cx("root"),style:e.style},e.ptm("root"),{"data-pc-name":"dock"}),[r.createVNode(c,{model:e.model,templates:e.$slots,exact:e.exact,tooltipOptions:e.tooltipOptions,position:e.position,menuId:e.menuId,"aria-label":e.ariaLabel,"aria-labelledby":e.ariaLabelledby,tabindex:e.tabindex,pt:e.pt},null,8,["model","templates","exact","tooltipOptions","position","menuId","aria-label","aria-labelledby","tabindex","pt"])],16)},O}(primevue.basecomponent,primevue.usestyle,primevue.ripple,primevue.tooltip,primevue.utils,Vue);

package/galleria/Galleria.d.ts

@@ -101,6 +101,10 @@ export interface GalleriaPassThroughOptions {
      * Uses to pass attributes to the indicator's DOM element.
      */
     indicator?: GalleriaPassThroughOptionType;
+    /**
+     * Uses to pass attributes to the indicator button's DOM element.
+     */
+    indicatorButton?: GalleriaPassThroughOptionType;
     /**
      * Uses to pass attributes to the thumbnail wrapper's DOM element.
      */

package/galleria/GalleriaContent.vue

@@ -1,12 +1,12 @@
 <template>
-    <div v-if="$attrs.value && $attrs.value.length > 0" :id="id" :class="[cx('root'), $attrs.containerClass]" :style="$attrs.containerStyle" v-bind="{ ...$attrs.containerProps, ...ptm('root') }" data-pc-name="galleria">
-        <button v-if="$attrs.fullScreen" v-ripple autofocus type="button" :class="cx('closeButton')" :aria-label="closeAriaLabel" @click="$emit('mask-hide')" v-bind="ptm('closeButton')">
-            <component :is="$attrs.templates['closeicon'] || 'TimesIcon'" :class="cx('closeIcon')" v-bind="ptm('closeIcon')" />
+    <div v-if="$attrs.value && $attrs.value.length > 0" :id="id" :class="[cx('root'), $attrs.containerClass]" :style="$attrs.containerStyle" v-bind="{ ...$attrs.containerProps, ...getPTOptions('root') }" data-pc-name="galleria">
+        <button v-if="$attrs.fullScreen" v-ripple autofocus type="button" :class="cx('closeButton')" :aria-label="closeAriaLabel" @click="$emit('mask-hide')" v-bind="getPTOptions('closeButton')">
+            <component :is="$attrs.templates['closeicon'] || 'TimesIcon'" :class="cx('closeIcon')" v-bind="getPTOptions('closeIcon')" />
         </button>
-        <div v-if="$attrs.templates && $attrs.templates['header']" :class="cx('header')" v-bind="ptm('header')">
+        <div v-if="$attrs.templates && $attrs.templates['header']" :class="cx('header')" v-bind="getPTOptions('header')">
             <component :is="$attrs.templates['header']" />
         </div>
-        <div :class="cx('content')" :aria-live="$attrs.autoPlay ? 'polite' : 'off'" v-bind="ptm('content')">
+        <div :class="cx('content')" :aria-live="$attrs.autoPlay ? 'polite' : 'off'" v-bind="getPTOptions('content')">
             <GalleriaItem
                 :id="id"
                 v-model:activeIndex="activeIndex"
@@ -44,7 +44,7 @@
                 :unstyled="unstyled"
             />
         </div>
-        <div v-if="$attrs.templates && $attrs.templates['footer']" :class="cx('footer')" v-bind="ptm('footer')">
+        <div v-if="$attrs.templates && $attrs.templates['footer']" :class="cx('footer')" v-bind="getPTOptions('footer')">
             <component :is="$attrs.templates['footer']" />
         </div>
     </div>
@@ -60,6 +60,7 @@ import GalleriaThumbnails from './GalleriaThumbnails.vue';
 
 export default {
     name: 'GalleriaContent',
+    hostName: 'Galleria',
     extends: BaseComponent,
     inheritAttrs: false,
     interval: null,
@@ -97,6 +98,15 @@ export default {
         }
     },
     methods: {
+        getPTOptions(key) {
+            return this.ptm(key, {
+                props: {
+                    ...this.$attrs,
+                    pt: this.pt,
+                    unstyled: this.unstyled
+                }
+            });
+        },
         isAutoPlayActive() {
             return this.slideShowActive;
         },

package/galleria/GalleriaItem.vue

@@ -29,7 +29,7 @@
                 v-bind="ptm('indicator')"
                 :data-p-highlight="isIndicatorItemActive(index)"
             >
-                <button v-if="!templates['indicator']" type="button" tabindex="-1" :class="cx('indicatorButton')"></button>
+                <button v-if="!templates['indicator']" type="button" tabindex="-1" :class="cx('indicatorButton')" v-bind="ptm('indicatorButton')"></button>
                 <component v-if="templates.indicator" :is="templates.indicator" :index="index" />
             </li>
         </ul>
@@ -44,6 +44,7 @@ import Ripple from 'primevue/ripple';
 
 export default {
     name: 'GalleriaItem',
+    hostName: 'Galleria',
     extends: BaseComponent,
     emits: ['start-slideshow', 'stop-slideshow', 'update:activeIndex'],
     props: {

package/galleria/GalleriaThumbnails.vue

@@ -70,6 +70,7 @@ import { DomHandler } from 'primevue/utils';
 
 export default {
     name: 'GalleriaThumbnails',
+    hostName: 'Galleria',
     extends: BaseComponent,
     emits: ['stop-slideshow', 'update:activeIndex'],
     props: {

package/galleria/galleria.cjs.js

@@ -238,6 +238,7 @@ var script$4 = {
 
 var script$3 = {
   name: 'GalleriaItem',
+  hostName: 'Galleria',
   "extends": BaseComponent__default["default"],
   emits: ['start-slideshow', 'stop-slideshow', 'update:activeIndex'],
   props: {
@@ -443,12 +444,12 @@ function render$3(_ctx, _cache, $props, $setup, $data, $options) {
       }
     }, _ctx.ptm('indicator'), {
       "data-p-highlight": $options.isIndicatorItemActive(index)
-    }), [!$props.templates['indicator'] ? (vue.openBlock(), vue.createElementBlock("button", {
+    }), [!$props.templates['indicator'] ? (vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
       key: 0,
       type: "button",
       tabindex: "-1",
-      "class": vue.normalizeClass(_ctx.cx('indicatorButton'))
-    }, null, 2)) : vue.createCommentVNode("", true), $props.templates.indicator ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.indicator), {
+      "class": _ctx.cx('indicatorButton')
+    }, _ctx.ptm('indicatorButton')), null, 16)) : vue.createCommentVNode("", true), $props.templates.indicator ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.indicator), {
       key: 1,
       index: index
     }, null, 8, ["index"])) : vue.createCommentVNode("", true)], 16, _hoisted_4$1);
@@ -465,6 +466,7 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 var script$2 = {
   name: 'GalleriaThumbnails',
+  hostName: 'Galleria',
   "extends": BaseComponent__default["default"],
   emits: ['stop-slideshow', 'update:activeIndex'],
   props: {
@@ -867,12 +869,12 @@ var script$2 = {
   }
 };
 
-function _typeof$1(obj) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$1(obj); }
-function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty$1(obj, key, value) { key = _toPropertyKey$1(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey$1(arg) { var key = _toPrimitive$1(arg, "string"); return _typeof$1(key) === "symbol" ? key : String(key); }
-function _toPrimitive$1(input, hint) { if (_typeof$1(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof$1(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _typeof$2(obj) { "@babel/helpers - typeof"; return _typeof$2 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$2(obj); }
+function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty$2(obj, key, value) { key = _toPropertyKey$2(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey$2(arg) { var key = _toPrimitive$2(arg, "string"); return _typeof$2(key) === "symbol" ? key : String(key); }
+function _toPrimitive$2(input, hint) { if (_typeof$2(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof$2(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 var _hoisted_1$2 = ["disabled", "aria-label"];
 var _hoisted_2$1 = ["data-p-active", "aria-selected", "aria-controls", "onKeydown", "data-p-galleria-thumbnail-item-current", "data-p-galleria-thumbnail-item-active", "data-p-galleria-thumbnail-item-start", "data-p-galleria-thumbnail-item-end"];
 var _hoisted_3$1 = ["tabindex", "aria-label", "aria-current", "onClick"];
@@ -892,7 +894,7 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _cache[0] || (_cache[0] = function ($event) {
       return $options.navBackward($event);
     })
-  }, _objectSpread$1(_objectSpread$1({}, $props.prevButtonProps), _ctx.ptm('previousThumbnailButton'))), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.previousthumbnailicon || ($props.isVertical ? 'ChevronUpIcon' : 'ChevronLeftIcon')), vue.mergeProps({
+  }, _objectSpread$2(_objectSpread$2({}, $props.prevButtonProps), _ctx.ptm('previousThumbnailButton'))), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.previousthumbnailicon || ($props.isVertical ? 'ChevronUpIcon' : 'ChevronLeftIcon')), vue.mergeProps({
     "class": _ctx.cx('previousThumbnailIcon')
   }, _ctx.ptm('previousThumbnailIcon')), null, 16, ["class"]))], 16, _hoisted_1$2)), [[_directive_ripple]]) : vue.createCommentVNode("", true), vue.createElementVNode("div", vue.mergeProps({
     "class": _ctx.cx('thumbnailItemsContainer'),
@@ -955,15 +957,22 @@ function render$2(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _cache[5] || (_cache[5] = function ($event) {
       return $options.navForward($event);
     })
-  }, _objectSpread$1(_objectSpread$1({}, $props.nextButtonProps), _ctx.ptm('nextThumbnailButton'))), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.nextthumbnailicon || ($props.isVertical ? 'ChevronDownIcon' : 'ChevronRightIcon')), vue.mergeProps({
+  }, _objectSpread$2(_objectSpread$2({}, $props.nextButtonProps), _ctx.ptm('nextThumbnailButton'))), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent($props.templates.nextthumbnailicon || ($props.isVertical ? 'ChevronDownIcon' : 'ChevronRightIcon')), vue.mergeProps({
     "class": _ctx.cx('nextThumbnailIcon')
   }, _ctx.ptm('nextThumbnailIcon')), null, 16, ["class"]))], 16, _hoisted_4)), [[_directive_ripple]]) : vue.createCommentVNode("", true)], 16)], 16);
 }
 
 script$2.render = render$2;
 
+function _typeof$1(obj) { "@babel/helpers - typeof"; return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof$1(obj); }
+function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty$1(obj, key, value) { key = _toPropertyKey$1(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey$1(arg) { var key = _toPrimitive$1(arg, "string"); return _typeof$1(key) === "symbol" ? key : String(key); }
+function _toPrimitive$1(input, hint) { if (_typeof$1(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof$1(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 var script$1 = {
   name: 'GalleriaContent',
+  hostName: 'Galleria',
   "extends": BaseComponent__default["default"],
   inheritAttrs: false,
   interval: null,
@@ -1001,6 +1010,14 @@ var script$1 = {
     }
   },
   methods: {
+    getPTOptions: function getPTOptions(key) {
+      return this.ptm(key, {
+        props: _objectSpread$1(_objectSpread$1({}, this.$attrs), {}, {
+          pt: this.pt,
+          unstyled: this.unstyled
+        })
+      });
+    },
     isAutoPlayActive: function isAutoPlayActive() {
       return this.slideShowActive;
     },
@@ -1062,7 +1079,7 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
     id: $data.id,
     "class": [_ctx.cx('root'), _ctx.$attrs.containerClass],
     style: _ctx.$attrs.containerStyle
-  }, _objectSpread(_objectSpread({}, _ctx.$attrs.containerProps), _ctx.ptm('root')), {
+  }, _objectSpread(_objectSpread({}, _ctx.$attrs.containerProps), $options.getPTOptions('root')), {
     "data-pc-name": "galleria"
   }), [_ctx.$attrs.fullScreen ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("button", vue.mergeProps({
     key: 0,
@@ -1073,15 +1090,15 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _cache[0] || (_cache[0] = function ($event) {
       return _ctx.$emit('mask-hide');
     })
-  }, _ctx.ptm('closeButton')), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$attrs.templates['closeicon'] || 'TimesIcon'), vue.mergeProps({
+  }, $options.getPTOptions('closeButton')), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$attrs.templates['closeicon'] || 'TimesIcon'), vue.mergeProps({
     "class": _ctx.cx('closeIcon')
-  }, _ctx.ptm('closeIcon')), null, 16, ["class"]))], 16, _hoisted_2)), [[_directive_ripple]]) : vue.createCommentVNode("", true), _ctx.$attrs.templates && _ctx.$attrs.templates['header'] ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
+  }, $options.getPTOptions('closeIcon')), null, 16, ["class"]))], 16, _hoisted_2)), [[_directive_ripple]]) : vue.createCommentVNode("", true), _ctx.$attrs.templates && _ctx.$attrs.templates['header'] ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
     key: 1,
     "class": _ctx.cx('header')
-  }, _ctx.ptm('header')), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$attrs.templates['header'])))], 16)) : vue.createCommentVNode("", true), vue.createElementVNode("div", vue.mergeProps({
+  }, $options.getPTOptions('header')), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$attrs.templates['header'])))], 16)) : vue.createCommentVNode("", true), vue.createElementVNode("div", vue.mergeProps({
     "class": _ctx.cx('content'),
     "aria-live": _ctx.$attrs.autoPlay ? 'polite' : 'off'
-  }, _ctx.ptm('content')), [vue.createVNode(_component_GalleriaItem, {
+  }, $options.getPTOptions('content')), [vue.createVNode(_component_GalleriaItem, {
     id: $data.id,
     activeIndex: $data.activeIndex,
     "onUpdate:activeIndex": _cache[1] || (_cache[1] = function ($event) {
@@ -1129,7 +1146,7 @@ function render$1(_ctx, _cache, $props, $setup, $data, $options) {
   }, null, 8, ["activeIndex", "slideShowActive", "containerId", "value", "templates", "numVisible", "responsiveOptions", "circular", "isVertical", "contentHeight", "showThumbnailNavigators", "prevButtonProps", "nextButtonProps", "onStopSlideshow", "pt", "unstyled"])) : vue.createCommentVNode("", true)], 16, _hoisted_3), _ctx.$attrs.templates && _ctx.$attrs.templates['footer'] ? (vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
     key: 2,
     "class": _ctx.cx('footer')
-  }, _ctx.ptm('footer')), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$attrs.templates['footer'])))], 16)) : vue.createCommentVNode("", true)], 16, _hoisted_1$1)) : vue.createCommentVNode("", true);
+  }, $options.getPTOptions('footer')), [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.$attrs.templates['footer'])))], 16)) : vue.createCommentVNode("", true)], 16, _hoisted_1$1)) : vue.createCommentVNode("", true);
 }
 
 script$1.render = render$1;