UNPKG

@dialpad/dialtone-vue

Version:

Vue component library for Dialpad's design system Dialtone

1 lines 2.11 kB
{"version":3,"file":"unread_pill.vue.cjs","sources":["../../../../recipes/leftbar/unread_pill/unread_pill.vue"],"sourcesContent":["<template>\n <button\n :class=\"['d-recipe-leftbar-unread-pill', `d-recipe-leftbar-unread-pill-${kind}`]\"\n type=\"button\"\n data-qa=\"dt-recipe-leftbar-unread-pill\"\n v-on=\"$listeners\"\n >\n <dt-icon-arrow-up\n v-if=\"direction === 'up'\"\n size=\"300\"\n />\n <dt-icon-arrow-down\n v-else\n size=\"300\"\n />\n <span data-qa=\"dt-recipe-leftbar-unread-pill__label\">\n <slot />\n </span>\n </button>\n</template>\n\n<script>\nimport { DtIconArrowUp, DtIconArrowDown } from '@dialpad/dialtone-icons/vue2';\nimport { UNREAD_PILL_DIRECTIONS, UNREAD_PILL_KINDS } from './unread_pill_constants';\nexport default {\n name: 'DtRecipeUnreadPill',\n\n components: {\n DtIconArrowUp,\n DtIconArrowDown,\n },\n\n props: {\n /**\n * The kind of unread pill which determines the styling\n * @values 'mentions', 'messages'\n **/\n kind: {\n type: String,\n required: true,\n validator: (kind) => UNREAD_PILL_KINDS.includes(kind),\n },\n\n /**\n * The direction of the arrow icon\n * @values 'up', 'down'\n **/\n direction: {\n type: String,\n required: true,\n validator: (dir) => UNREAD_PILL_DIRECTIONS.includes(dir),\n },\n },\n\n emits: [\n /**\n * Native click event\n *\n * @event click\n * @type {PointerEvent | KeyboardEvent}\n */\n 'click',\n ],\n};\n</script>\n"],"names":["DtIconArrowUp","DtIconArrowDown","UNREAD_PILL_KINDS","UNREAD_PILL_DIRECTIONS"],"mappings":";;;;;AAwBA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA;AAAA,IACA,eAAAA,KAAA;AAAA,IACA,iBAAAC,KAAA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,MAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,SAAAC,wCAAA,SAAA,IAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA,CAAA,QAAAC,6CAAA,SAAA,GAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA,EACA;AACA;;;;;;;;;;;;;"}