@dialpad/dialtone-vue
Version:
Vue component library for Dialpad's design system Dialtone
118 lines (117 loc) • 2.89 kB
JavaScript
import { n as a } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
import i from "../button/button.js";
import { BUTTON_ICON_SIZES as o } from "../button/button-constants.js";
const n = {
name: "SplitButtonAlpha",
components: {
DtButton: i
},
props: {
/**
* Determines whether the button should have active styling
*/
active: {
type: Boolean,
default: !1
},
/**
* 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: !1
},
/**
* 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: !1
},
/**
* HTML button disabled attribute
*/
disabled: {
type: Boolean,
default: !1
},
/**
* 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: o
};
},
computed: {
tooltipConfig() {
return {
message: this.tooltipText,
inverted: this.kind === "inverted"
};
}
}
};
var l = function() {
var t = this, e = t._self._c;
return e("dt-button", { directives: [{ name: "dt-tooltip", rawName: "v-dt-tooltip", value: t.tooltipConfig, expression: "tooltipConfig" }], class: `d-split-btn__alpha d-split-btn__alpha--${t.size}`, attrs: { "data-qa": "dt-split-button-alpha", active: t.active, "aria-label": t.ariaLabel, "assertive-on-focus": t.assertiveOnFocus, disabled: t.disabled, "icon-position": t.iconPosition, importance: t.importance, kind: t.kind, "label-class": t.labelClass, loading: t.loading, size: t.size }, scopedSlots: t._u([{ key: "icon", fn: function() {
return [t._t("icon", null, { size: t.BUTTON_ICON_SIZES[t.size] })];
}, proxy: !0 }], null, !0) }, [t._t("default")], 2);
}, s = [], r = /* @__PURE__ */ a(
n,
l,
s
);
const c = r.exports;
export {
c as default
};
//# sourceMappingURL=split-button-alpha.js.map