@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
1 lines • 3.98 kB
Source Map (JSON)
{"version":3,"file":"split-button-alpha.cjs","names":[],"sources":["../../../components/split_button/split_button-alpha.vue"],"sourcesContent":["<template>\n <dt-button\n v-dt-tooltip=\"tooltipConfig\"\n data-qa=\"dt-split-button-alpha\"\n :active=\"active\"\n :aria-label=\"ariaLabel\"\n :assertive-on-focus=\"assertiveOnFocus\"\n :class=\"`d-split-btn__alpha d-split-btn__alpha--${size}`\"\n :disabled=\"disabled\"\n :icon-position=\"iconPosition\"\n :importance=\"importance\"\n :kind=\"kind\"\n :label-class=\"labelClass\"\n :loading=\"loading\"\n :size=\"size\"\n >\n <template #icon>\n <slot\n name=\"icon\"\n :size=\"BUTTON_ICON_SIZES[size]\"\n />\n </template>\n <slot name=\"default\" />\n </dt-button>\n</template>\n\n<script>\nimport { BUTTON_ICON_SIZES, DtButton } from '@/components/button';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'SplitButtonAlpha',\n\n components: {\n DtButton,\n },\n\n props: {\n /**\n * Determines whether the button should have active styling\n */\n active: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Descriptive label for the button\n */\n ariaLabel: {\n type: String,\n default: null,\n },\n\n /**\n * The position of the icon slot within the button.\n */\n iconPosition: {\n type: String,\n default: 'left',\n },\n\n /**\n * Used to customize the label container\n */\n labelClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Whether the button should display a loading animation or not.\n */\n loading: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Text shown in tooltip when you hover the button\n */\n tooltipText: {\n type: String,\n default: '',\n },\n\n /**\n * Determines whether a screenreader reads live updates of\n * the button content to the user while the button is in focus.\n */\n assertiveOnFocus: {\n type: Boolean,\n default: false,\n },\n\n /**\n * HTML button disabled attribute\n */\n disabled: {\n type: Boolean,\n default: false,\n },\n\n /**\n * The fill and outline of the button associated with its visual importance.\n */\n importance: {\n type: String,\n default: 'primary',\n },\n\n /**\n * The color of the button.\n */\n kind: {\n type: String,\n default: 'default',\n },\n\n /**\n * The size of the button.\n */\n size: {\n type: String,\n default: 'md',\n },\n },\n\n data () {\n return {\n BUTTON_ICON_SIZES,\n };\n },\n\n computed: {\n tooltipConfig () {\n return {\n message: this.tooltipText,\n inverted: this.kind === 'inverted',\n };\n },\n },\n};\n</script>\n"],"mappings":"sSA6BA,IAAK,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,mBAEN,WAAY,CACV,SAAA,EAAA,QACD,CAED,MAAO,CAIL,OAAQ,CACN,KAAM,QACN,QAAS,GACV,CAKD,UAAW,CACT,KAAM,OACN,QAAS,KACV,CAKD,aAAc,CACZ,KAAM,OACN,QAAS,OACV,CAKD,WAAY,CACV,KAAM,CAAC,OAAQ,MAAO,OAAO,CAC7B,QAAS,GACV,CAKD,QAAS,CACP,KAAM,QACN,QAAS,GACV,CAKD,YAAa,CACX,KAAM,OACN,QAAS,GACV,CAMD,iBAAkB,CAChB,KAAM,QACN,QAAS,GACV,CAKD,SAAU,CACR,KAAM,QACN,QAAS,GACV,CAKD,WAAY,CACV,KAAM,OACN,QAAS,UACV,CAKD,KAAM,CACJ,KAAM,OACN,QAAS,UACV,CAKD,KAAM,CACJ,KAAM,OACN,QAAS,KACV,CACF,CAED,MAAQ,CACN,MAAO,CACL,kBAAA,EAAA,kBACD,EAGH,SAAU,CACR,eAAiB,CACf,MAAO,CACL,QAAS,KAAK,YACd,SAAU,KAAK,OAAS,WACzB,EAEJ,CACF,0KAvHa,EAAA,CApBV,UAAQ,wBACP,OAAQ,EAAA,OACR,aAAY,EAAA,UACZ,qBAAoB,EAAA,iBACpB,OAAA,EAAA,EAAA,gBAAK,0CAA4C,EAAA,OAAI,CACrD,SAAU,EAAA,SACV,gBAAe,EAAA,aACf,WAAY,EAAA,WACZ,KAAM,EAAA,KACN,cAAa,EAAA,WACb,QAAS,EAAA,QACT,KAAM,EAAA,OAEI,MAAA,EAAA,EAAA,aAIP,EAAA,EAAA,EAAA,YAAA,EAAA,OAAA,OAAA,CADC,KAAM,EAAA,kBAAkB,EAAA,MAAA,CAAA,CAAA,CAAA,2BAGN,EAAA,EAAA,EAAA,YAAA,EAAA,OAAA,UAAA,CAAA,CAAA,iJApBT,EAAA,cAAa,CAAA,CAAA"}