UNPKG

primevue

Version:

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

2 lines (1 loc) 5.49 kB
this.primevue=this.primevue||{},this.primevue.steps=function(e,t,n){"use strict";function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i={name:"Steps",extends:s(e).default,props:{id:{type:String,default:t.UniqueComponentId()},model:{type:Array,default:null},readonly:{type:Boolean,default:!0},exact:{type:Boolean,default:!0}},mounted(){this.findFirstItem().tabIndex="0"},methods:{onItemClick(e,t,n){this.disabled(t)||this.readonly?e.preventDefault():(t.command&&t.command({originalEvent:e,item:t}),t.to&&n&&n(e))},onItemKeydown(e,t,n){switch(e.code){case"ArrowRight":this.navigateToNextItem(e.target),e.preventDefault();break;case"ArrowLeft":this.navigateToPrevItem(e.target),e.preventDefault();break;case"Home":this.navigateToFirstItem(e.target),e.preventDefault();break;case"End":this.navigateToLastItem(e.target),e.preventDefault();break;case"Tab":break;case"Enter":case"Space":this.onItemClick(e,t,n),e.preventDefault()}},navigateToNextItem(e){const t=this.findNextItem(e);t&&this.setFocusToMenuitem(e,t)},navigateToPrevItem(e){const t=this.findPrevItem(e);t&&this.setFocusToMenuitem(e,t)},navigateToFirstItem(e){const t=this.findFirstItem(e);t&&this.setFocusToMenuitem(e,t)},navigateToLastItem(e){const t=this.findLastItem(e);t&&this.setFocusToMenuitem(e,t)},findNextItem(e){const t=e.parentElement.nextElementSibling;return t?t.children[0]:null},findPrevItem(e){const t=e.parentElement.previousElementSibling;return t?t.children[0]:null},findFirstItem(){const e=t.DomHandler.findSingle(this.$refs.list,".p-steps-item");return e?e.children[0]:null},findLastItem(){const e=t.DomHandler.find(this.$refs.list,".p-steps-item");return e?e[e.length-1].children[0]:null},setFocusToMenuitem(e,t){e.tabIndex="-1",t.tabIndex="0",t.focus()},isActive(e){return!!e.to&&this.$router.resolve(e.to).path===this.$route.path},getItemClass(e){return["p-steps-item",e.class,{"p-highlight p-steps-current":this.isActive(e),"p-disabled":this.isItemDisabled(e)}]},linkClass(e){return["p-menuitem-link",{"router-link-active":e&&e.isActive,"router-link-active-exact":this.exact&&e&&e.isExactActive}]},isItemDisabled(e){return this.disabled(e)||this.readonly&&!this.isActive(e)},visible:e=>"function"==typeof e.visible?e.visible():!1!==e.visible,disabled:e=>"function"==typeof e.disabled?e.disabled():e.disabled,label:e=>"function"==typeof e.label?e.label():e.label},computed:{containerClass(){return["p-steps p-component",{"p-readonly":this.readonly}]}}};const l=["id"],o=["href","aria-current","onClick","onKeydown"],a=["onKeydown"];return function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var s=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&s.firstChild?s.insertBefore(i,s.firstChild):s.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}("\n.p-steps {\n position: relative;\n}\n.p-steps .p-steps-list {\n padding: 0;\n margin: 0;\n list-style-type: none;\n display: flex;\n}\n.p-steps-item {\n position: relative;\n display: flex;\n justify-content: center;\n flex: 1 1 auto;\n}\n.p-steps-item .p-menuitem-link {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n overflow: hidden;\n text-decoration: none;\n}\n.p-steps.p-steps-readonly .p-steps-item {\n cursor: auto;\n}\n.p-steps-item.p-steps-current .p-menuitem-link {\n cursor: default;\n}\n.p-steps-title {\n white-space: nowrap;\n}\n.p-steps-number {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.p-steps-title {\n display: block;\n}\n"),i.render=function(e,t,s,i,r,p){const c=n.resolveComponent("router-link");return n.openBlock(),n.createElementBlock("nav",n.mergeProps({id:s.id,class:p.containerClass},e.ptm("root")),[n.createElementVNode("ol",n.mergeProps({ref:"list",class:"p-steps-list"},e.ptm("menu")),[(n.openBlock(!0),n.createElementBlock(n.Fragment,null,n.renderList(s.model,((t,s)=>(n.openBlock(),n.createElementBlock(n.Fragment,{key:t.to},[p.visible(t)?(n.openBlock(),n.createElementBlock("li",n.mergeProps({key:0,class:p.getItemClass(t),style:t.style},e.ptm("menuitem")),[e.$slots.item?(n.openBlock(),n.createBlock(n.resolveDynamicComponent(e.$slots.item),{key:1,item:t},null,8,["item"])):(n.openBlock(),n.createElementBlock(n.Fragment,{key:0},[p.isItemDisabled(t)?(n.openBlock(),n.createElementBlock("span",n.mergeProps({key:1,class:p.linkClass(),onKeydown:e=>p.onItemKeydown(e,t)},e.ptm("action")),[n.createElementVNode("span",n.mergeProps({class:"p-steps-number"},e.ptm("step")),n.toDisplayString(s+1),17),n.createElementVNode("span",n.mergeProps({class:"p-steps-title"},e.ptm("label")),n.toDisplayString(p.label(t)),17)],16,a)):(n.openBlock(),n.createBlock(c,{key:0,to:t.to,custom:""},{default:n.withCtx((({navigate:i,href:l,isActive:a,isExactActive:r})=>[n.createElementVNode("a",n.mergeProps({href:l,class:p.linkClass({isActive:a,isExactActive:r}),tabindex:-1,"aria-current":r?"step":void 0,onClick:e=>p.onItemClick(e,t,i),onKeydown:e=>p.onItemKeydown(e,t,i)},e.ptm("action")),[n.createElementVNode("span",n.mergeProps({class:"p-steps-number"},e.ptm("step")),n.toDisplayString(s+1),17),n.createElementVNode("span",n.mergeProps({class:"p-steps-title"},e.ptm("label")),n.toDisplayString(p.label(t)),17)],16,o)])),_:2},1032,["to"]))],64))],16)):n.createCommentVNode("",!0)],64)))),128))],16)],16,l)},i}(primevue.basecomponent,primevue.utils,Vue);