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) 3.97 kB
import e from"primevue/basecomponent";import{ObjectUtils as n}from"primevue/utils";import{openBlock as t,createElementBlock as i,mergeProps as l,Fragment as o,renderList as p,createElementVNode as m,renderSlot as r,createCommentVNode as a}from"vue";var s={name:"Timeline",extends:e,props:{value:null,align:{mode:String,default:"left"},layout:{mode:String,default:"vertical"},dataKey:null},methods:{getKey(e,t){return this.dataKey?n.resolveFieldData(e,this.dataKey):t}},computed:{containerClass(){return["p-timeline p-component","p-timeline-"+this.align,"p-timeline-"+this.layout]}}};!function(e,n){void 0===n&&(n={});var t=n.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],l=document.createElement("style");l.type="text/css","top"===t&&i.firstChild?i.insertBefore(l,i.firstChild):i.appendChild(l),l.styleSheet?l.styleSheet.cssText=e:l.appendChild(document.createTextNode(e))}}("\n.p-timeline {\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n}\n.p-timeline-left .p-timeline-event-opposite {\n text-align: right;\n}\n.p-timeline-left .p-timeline-event-content {\n text-align: left;\n}\n.p-timeline-right .p-timeline-event {\n flex-direction: row-reverse;\n}\n.p-timeline-right .p-timeline-event-opposite {\n text-align: left;\n}\n.p-timeline-right .p-timeline-event-content {\n text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {\n flex-direction: row-reverse;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {\n text-align: right;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {\n text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {\n text-align: left;\n}\n.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {\n text-align: right;\n}\n.p-timeline-event {\n display: flex;\n position: relative;\n min-height: 70px;\n}\n.p-timeline-event:last-child {\n min-height: 0;\n}\n.p-timeline-event-opposite {\n flex: 1;\n padding: 0 1rem;\n}\n.p-timeline-event-content {\n flex: 1;\n padding: 0 1rem;\n}\n.p-timeline-event-separator {\n flex: 0;\n display: flex;\n align-items: center;\n flex-direction: column;\n}\n.p-timeline-event-marker {\n display: flex;\n align-self: baseline;\n}\n.p-timeline-event-connector {\n flex-grow: 1;\n}\n.p-timeline-horizontal {\n flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event {\n flex-direction: column;\n flex: 1;\n}\n.p-timeline-horizontal .p-timeline-event:last-child {\n flex: 0;\n}\n.p-timeline-horizontal .p-timeline-event-separator {\n flex-direction: row;\n}\n.p-timeline-horizontal .p-timeline-event-connector {\n width: 100%;\n}\n.p-timeline-bottom .p-timeline-event {\n flex-direction: column-reverse;\n}\n.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {\n flex-direction: column-reverse;\n}\n"),s.render=function(e,n,s,d,c,v){return t(),i("div",l({class:v.containerClass},e.ptm("root")),[(t(!0),i(o,null,p(s.value,((n,o)=>(t(),i("div",l({key:v.getKey(n,o),class:"p-timeline-event"},e.ptm("event")),[m("div",l({class:"p-timeline-event-opposite"},e.ptm("opposite")),[r(e.$slots,"opposite",{item:n,index:o})],16),m("div",l({class:"p-timeline-event-separator"},e.ptm("separator")),[r(e.$slots,"marker",{item:n,index:o},(()=>[m("div",l({class:"p-timeline-event-marker"},e.ptm("marker")),null,16)])),o!==s.value.length-1?r(e.$slots,"connector",{key:0,item:n,index:o},(()=>[m("div",l({class:"p-timeline-event-connector"},e.ptm("connector")),null,16)])):a("",!0)],16),m("div",l({class:"p-timeline-event-content"},e.ptm("content")),[r(e.$slots,"content",{item:n,index:o})],16)],16)))),128))],16)};export{s as default};