primevue/dock/dock.esm.min.js

[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primevue) [![Discord Chat](https://img.shields.io/discord/55794023

import{resolveComponent as e,resolveDirective as n,openBlock as t,createBlock as o,createVNode as i,Fragment as l,renderList as c,withCtx as r,withDirectives as s,resolveDynamicComponent as a}from"vue";var d={name:"DockSub",props:{model:{type:Array,default:null},template:{type:Function,default:null},exact:{type:Boolean,default:!0},tooltipOptions:null},data:()=>({currentIndex:-3}),methods:{onListMouseLeave(){this.currentIndex=-3},onItemMouseEnter(e){this.currentIndex=e},onItemClick(e,n,t){this.disabled(n)?e.preventDefault():(n.command&&n.command({originalEvent:e,item:n}),n.to&&t&&t(e))},itemClass(e){return["p-dock-item",{"p-dock-item-second-prev":this.currentIndex-2===e,"p-dock-item-prev":this.currentIndex-1===e,"p-dock-item-current":this.currentIndex===e,"p-dock-item-next":this.currentIndex+1===e,"p-dock-item-second-next":this.currentIndex+2===e}]},linkClass(e,n){return["p-dock-action",{"p-disabled":this.disabled(e),"router-link-active":n&&n.isActive,"router-link-active-exact":this.exact&&n&&n.isExactActive}]},disabled:e=>"function"==typeof e.disabled?e.disabled():e.disabled}};const p={class:"p-dock-list-container"};d.render=function(d,m,k,u,f,b){const x=e("router-link"),y=n("ripple"),g=n("tooltip");return t(),o("div",p,[i("ul",{ref:"list",class:"p-dock-list",role:"menu",onMouseleave:m[1]||(m[1]=(...e)=>b.onListMouseLeave&&b.onListMouseLeave(...e))},[(t(!0),o(l,null,c(k.model,((e,n)=>(t(),o("li",{class:b.itemClass(n),key:n,role:"none",onMouseenter:e=>b.onItemMouseEnter(n)},[k.template?(t(),o(a(k.template),{key:1,item:e},null,8,["item"])):(t(),o(l,{key:0},[e.to&&!b.disabled(e)?(t(),o(x,{key:0,to:e.to,custom:""},{default:r((({navigate:n,href:l,isActive:c,isExactActive:r})=>[s(i("a",{href:l,role:"menuitem",class:b.linkClass(e,{isActive:c,isExactActive:r}),target:e.target,onClick:t=>b.onItemClick(t,e,n)},["string"==typeof e.icon?s((t(),o("span",{key:0,class:["p-dock-action-icon",e.icon]},null,2)),[[y]]):(t(),o(a(e.icon),{key:1}))],10,["href","target","onClick"]),[[g,{value:e.label,disabled:!k.tooltipOptions},k.tooltipOptions]])])),_:2},1032,["to"])):s((t(),o("a",{key:1,href:e.url,role:"menuitem",class:b.linkClass(e),target:e.target,onClick:n=>b.onItemClick(n,e),tabindex:b.disabled(e)?null:"0"},["string"==typeof e.icon?s((t(),o("span",{key:0,class:["p-dock-action-icon",e.icon]},null,2)),[[y]]):(t(),o(a(e.icon),{key:1}))],10,["href","target","onClick","tabindex"])),[[g,{value:e.label,disabled:!k.tooltipOptions},k.tooltipOptions]])],64))],42,["onMouseenter"])))),128))],544)])};var m={name:"Dock",props:{position:{type:String,default:"bottom"},model:null,class:null,style:null,tooltipOptions:null,exact:{type:Boolean,default:!0}},computed:{containerClass(){return["p-dock p-component",`p-dock-${this.position}`,this.class]}},components:{DockSub:d}};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var o=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===t&&o.firstChild?o.insertBefore(i,o.firstChild):o.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}("\n.p-dock {\n    position: absolute;\n    z-index: 1;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    pointer-events: none;\n}\n.p-dock-list-container {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    pointer-events: auto;\n}\n.p-dock-list {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n}\n.p-dock-item {\n    -webkit-transition: all .2s cubic-bezier(0.4, 0, 0.2, 1);\n    transition: all .2s cubic-bezier(0.4, 0, 0.2, 1);\n    will-change: transform;\n}\n.p-dock-action {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    -webkit-box-pack: center;\n        -ms-flex-pack: center;\n            justify-content: center;\n    position: relative;\n    overflow: hidden;\n    cursor: default;\n}\n.p-dock-item-second-prev,\n.p-dock-item-second-next {\n    -webkit-transform: scale(1.2);\n            transform: scale(1.2);\n}\n.p-dock-item-prev,\n.p-dock-item-next {\n    -webkit-transform: scale(1.4);\n            transform: scale(1.4);\n}\n.p-dock-item-current {\n    -webkit-transform: scale(1.6);\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.p-dock-top .p-dock-item {\n    -webkit-transform-origin: center top;\n            transform-origin: center top;\n}\n\n/* bottom */\n.p-dock-bottom {\n    left: 0;\n    bottom: 0;\n    width: 100%;\n}\n.p-dock-bottom .p-dock-item {\n    -webkit-transform-origin: center bottom;\n            transform-origin: center bottom;\n}\n\n/* right */\n.p-dock-right {\n    right: 0;\n    top: 0;\n    height: 100%;\n}\n.p-dock-right .p-dock-item {\n    -webkit-transform-origin: center right;\n            transform-origin: center right;\n}\n.p-dock-right .p-dock-list {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n\n/* left */\n.p-dock-left {\n    left: 0;\n    top: 0;\n    height: 100%;\n}\n.p-dock-left .p-dock-item {\n    -webkit-transform-origin: center left;\n            transform-origin: center left;\n}\n.p-dock-left .p-dock-list {\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n}\n"),m.render=function(n,l,c,r,s,a){const d=e("DockSub");return t(),o("div",{class:a.containerClass,style:c.style},[i(d,{model:c.model,template:n.$slots.item,exact:c.exact,tooltipOptions:c.tooltipOptions},null,8,["model","template","exact","tooltipOptions"])],6)};export default m;