@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
1 lines • 4.38 kB
Source Map (JSON)
{"version":3,"file":"split_button-alpha.vue.cjs","sources":["../../../components/split_button/split_button-alpha.vue"],"sourcesContent":["<template>\n <dt-button\n v-dt-tooltip=\"tooltipText\"\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</script>\n"],"names":["DtButton","BUTTON_ICON_SIZES","_createBlock","_normalizeClass","_renderSlot","_withCtx"],"mappings":";;;;;;AA6BA,MAAK,YAAU;AAAA,EACb,cAAc,EAAE,MAAM,EAAG;AAAA,EACzB,MAAM;AAAA,EAEN,YAAY;AAAA,IACV,UAAAA,OAAQ;AAAA,EACT;AAAA,EAED,OAAO;AAAA;AAAA;AAAA;AAAA,IAIL,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,cAAc;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,YAAY;AAAA,MACV,MAAM,CAAC,QAAQ,OAAO,MAAM;AAAA,MAC5B,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,aAAa;AAAA,MACX,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA;AAAA,IAMD,kBAAkB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA;AAAA;AAAA;AAAA,IAKD,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,SAAS;AAAA,IACV;AAAA,EACF;AAAA,EAED,OAAQ;AACN,WAAO;AAAA,MACL,mBAAAC,iBAAiB;AAAA;EAEpB;AACH;;;;8CApIEC,IAAAA,YAsBY,sBAAA;AAAA,IApBV,WAAQ;AAAA,IACP,QAAQ,OAAM;AAAA,IACd,cAAY,OAAS;AAAA,IACrB,sBAAoB,OAAgB;AAAA,IACpC,OAPLC,6DAOsD,OAAI,IAAA,EAAA;AAAA,IACrD,UAAU,OAAQ;AAAA,IAClB,iBAAe,OAAY;AAAA,IAC3B,YAAY,OAAU;AAAA,IACtB,MAAM,OAAI;AAAA,IACV,eAAa,OAAU;AAAA,IACvB,SAAS,OAAO;AAAA,IAChB,MAAM,OAAI;AAAA;IAEA,kBACT,MAGE;AAAA,MAHFC,eAGE,KAAA,QAAA,QAAA;AAAA,QADC,MAAM,MAAiB,kBAAC,OAAI,IAAA;AAAA;;IAnBrC,SAAAC,IAAA,QAsBI,MAAuB;AAAA,MAAvBD,eAAuB,KAAA,QAAA,SAAA;AAAA;IAtB3B,GAAA;AAAA;4BAEkB,OAAW,WAAA;AAAA;;;;"}