@dpa-id-components/dpa-event-items-preview
DpaEventItemsPreview
Vue 2.x domain sepecific UI component for a 5 day preview of event items based on the dpa Design Kit
Installation
yarn add @dpa-id-components/dpa-event-items-preview
Usage
<template>
<DpaEventItemsPreview :events="eventsGroupedByDay" top="128">
<template v-slot:default="slotProps">
<DpaEventItem :event="slotProps.event" />
</template>
</DpaEventItemsPreview>
</template>
<script>
import DpaEventItemsPreview from "@dpa-id-components/dpa-event-items-preview";
import "@dpa-id-components/dpa-event-items-preview/dist/DpaEventItemsPreview.css";
export default {
components: { DpaEventItemsPreview },
};
</script>
Demo
View a demo of <dpa-event-items-preview>
on Storybook
API
Props
events | Array | true | [] | An array of event objects, formatted and grouped by day |
top | Number | false | 0 | top position for the sticky header in px |
Slots
default | slot for the rendering of the event item |