@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
112 lines (111 loc) • 2.98 kB
JavaScript
import normalizeComponent from "../../_virtual/_plugin-vue2_normalizer.js";
import DtButton from "../button/button.vue.js";
import { BUTTON_ICON_SIZES } from "../button/button_constants.js";
const _sfc_main = {
name: "SplitButtonAlpha",
components: {
DtButton
},
props: {
/**
* Determines whether the button should have active styling
*/
active: {
type: Boolean,
default: false
},
/**
* Descriptive label for the button
*/
ariaLabel: {
type: String,
default: null
},
/**
* The position of the icon slot within the button.
*/
iconPosition: {
type: String,
default: "left"
},
/**
* Used to customize the label container
*/
labelClass: {
type: [String, Array, Object],
default: ""
},
/**
* Whether the button should display a loading animation or not.
*/
loading: {
type: Boolean,
default: false
},
/**
* Text shown in tooltip when you hover the button
*/
tooltipText: {
type: String,
default: ""
},
/**
* Determines whether a screenreader reads live updates of
* the button content to the user while the button is in focus.
*/
assertiveOnFocus: {
type: Boolean,
default: false
},
/**
* HTML button disabled attribute
*/
disabled: {
type: Boolean,
default: false
},
/**
* The fill and outline of the button associated with its visual importance.
*/
importance: {
type: String,
default: "primary"
},
/**
* The color of the button.
*/
kind: {
type: String,
default: "default"
},
/**
* The size of the button.
*/
size: {
type: String,
default: "md"
}
},
data() {
return {
BUTTON_ICON_SIZES
};
}
};
var _sfc_render = function render() {
var _vm = this, _c = _vm._self._c;
return _c("dt-button", { directives: [{ name: "dt-tooltip", rawName: "v-dt-tooltip", value: _vm.tooltipText, expression: "tooltipText" }], class: `d-split-btn__alpha d-split-btn__alpha--${_vm.size}`, attrs: { "data-qa": "dt-split-button-alpha", "active": _vm.active, "aria-label": _vm.ariaLabel, "assertive-on-focus": _vm.assertiveOnFocus, "disabled": _vm.disabled, "icon-position": _vm.iconPosition, "importance": _vm.importance, "kind": _vm.kind, "label-class": _vm.labelClass, "loading": _vm.loading, "size": _vm.size }, scopedSlots: _vm._u([{ key: "icon", fn: function() {
return [_vm._t("icon", null, { "size": _vm.BUTTON_ICON_SIZES[_vm.size] })];
}, proxy: true }], null, true) }, [_vm._t("default")], 2);
};
var _sfc_staticRenderFns = [];
var __component__ = /* @__PURE__ */ normalizeComponent(
_sfc_main,
_sfc_render,
_sfc_staticRenderFns
);
const SplitButtonAlpha = __component__.exports;
export {
SplitButtonAlpha as default
};
//# sourceMappingURL=split_button-alpha.vue.js.map