@dialpad/dialtone 9.110.1-beta.2 → 9.110.2

package/dist/vue2/localization/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../localization/index.js"],"sourcesContent":["import { LocaleManager, RawBundleSource } from '@dialpad/i18n-vue2';\n\n/**\n * @type {{[key: string]: string}}\n */\nexport const allowedLocales = {\n  ENGLISH: 'en-US',\n  DIALPADISTAN: 'dp-DP',\n  SPANISH: 'es-LA',\n};\n\nexport const DialtoneLocalizationPlugin = {\n  async install (Vue) {\n    const locales = Object.values(allowedLocales);\n    const dialtoneNamespace = 'dialtone';\n    const bundleSource = new RawBundleSource({\n      resources: await RawBundleSource.dynamicResources(\n        locales.map(locale => [locale, dialtoneNamespace, import(`./${locale}.ftl?raw`)]),\n      ),\n    });\n    const preferredLocale = locales[0];\n\n    const manager = new LocaleManager({\n      bundleSource,\n      preferredLocale,\n      allowedLocales: locales,\n      fallbackLocale: preferredLocale,\n      namespaces: [dialtoneNamespace],\n    });\n\n    await manager.ready;\n\n    Vue.use(manager);\n  },\n};\n"],"names":["allowedLocales","DialtoneLocalizationPlugin","Vue","locales","dialtoneNamespace","bundleSource","RawBundleSource","locale","__variableDynamicImportRuntimeHelper","preferredLocale","manager","LocaleManager"],"mappings":";;;;;;;;;;;;;GAKaA,IAAiB;AAAA,EAC5B,SAAS;AAAA,EACT,cAAc;AAAA,EACd,SAAS;AACX,GAEaC,IAA6B;AAAA,EACxC,MAAM,QAASC,GAAK;AAClB,UAAMC,IAAU,OAAO,OAAOH,CAAc,GACtCI,IAAoB,YACpBC,IAAe,IAAIC,EAAgB;AAAA,MACvC,WAAW,MAAMA,EAAgB;AAAA,QAC/BH,EAAQ,IAAI,CAAAI,MAAU,CAACA,GAAQH,GAAmBI,sKAAA,KAAAD,CAAA,QAAA,CAAA,CAA6B,CAAC;AAAA,MACjF;AAAA,IACP,CAAK,GACKE,IAAkBN,EAAQ,CAAC,GAE3BO,IAAU,IAAIC,EAAc;AAAA,MAChC,cAAAN;AAAA,MACA,iBAAAI;AAAA,MACA,gBAAgBN;AAAA,MAChB,gBAAgBM;AAAA,MAChB,YAAY,CAACL,CAAiB;AAAA,IACpC,CAAK;AAED,UAAMM,EAAQ,OAEdR,EAAI,IAAIQ,CAAO;AAAA,EAChB;AACH;"}
+{"version":3,"file":"index.js","sources":["../../localization/index.js"],"sourcesContent":["import { LocaleManager, RawBundleSource } from '@dialpad/i18n-vue2';\n\n/**\n * @type {{[key: string]: string}}\n */\nexport const allowedLocales = {\n  ENGLISH: 'en-US',\n  DIALPADISTAN: 'dp-DP',\n  SPANISH: 'es-LA',\n};\n\nexport const DialtoneLocalizationPlugin = {\n  async install (Vue) {\n    const bundleSource = new RawBundleSource({\n      resources: await RawBundleSource.dynamicResources([\n        ['en-US', 'dialtone', import('./en-US.ftl?raw')],\n        ['dp-DP', 'dialtone', import('./dp-DP.ftl?raw')],\n        ['es-LA', 'dialtone', import('./es-LA.ftl?raw')],\n      ]),\n    });\n\n    const manager = new LocaleManager({\n      bundleSource,\n      preferredLocale: 'en-US', // optional\n      allowedLocales: Object.values(allowedLocales), // optional\n      fallbackLocale: 'en-US',\n      namespaces: ['dialtone'],\n    });\n\n    await manager.ready;\n\n    Vue.use(manager);\n  },\n};\n"],"names":[],"mappings":";AAKY,MAAC,iBAAiB;AAAA,EAC5B,SAAS;AAAA,EACT,cAAc;AAAA,EACd,SAAS;AACX;AAEY,MAAC,6BAA6B;AAAA,EACxC,MAAM,QAAS,KAAK;AAClB,UAAM,eAAe,IAAI,gBAAgB;AAAA,MACvC,WAAW,MAAM,gBAAgB,iBAAiB;AAAA,QAChD,CAAC,SAAS,YAAY,OAAO,gBAAiB,CAAC;AAAA,QAC/C,CAAC,SAAS,YAAY,OAAO,gBAAiB,CAAC;AAAA,QAC/C,CAAC,SAAS,YAAY,OAAO,gBAAiB,CAAC;AAAA,MACvD,CAAO;AAAA,IACP,CAAK;AAED,UAAM,UAAU,IAAI,cAAc;AAAA,MAChC;AAAA,MACA,iBAAiB;AAAA;AAAA,MACjB,gBAAgB,OAAO,OAAO,cAAc;AAAA;AAAA,MAC5C,gBAAgB;AAAA,MAChB,YAAY,CAAC,UAAU;AAAA,IAC7B,CAAK;AAED,UAAM,QAAQ;AAEd,QAAI,IAAI,OAAO;AAAA,EAChB;AACH;"}

package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.cjs

@@ -0,0 +1,203 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const callbar_button_constants = require("./callbar_button_constants.cjs");
+const common_utils = require("../../../common/utils.cjs");
+const _pluginVue2_normalizer = require("../../../_virtual/_plugin-vue2_normalizer.cjs");
+const button = require("../../../components/button/button.vue.cjs");
+const tooltip = require("../../../components/tooltip/tooltip.vue.cjs");
+const _sfc_main = {
+  name: "DtRecipeCallbarButton",
+  components: { DtButton: button.default, DtTooltip: tooltip.default },
+  inheritAttrs: false,
+  props: {
+    /**
+     * Id for the item.
+     */
+    id: {
+      type: String,
+      default() {
+        return common_utils.default.getUniqueString();
+      }
+    },
+    /**
+     * Determines whether the button should have active styling
+     * default is false.
+     * @values true, false
+     * @see https://dialtone.dialpad.com/components/button/
+     */
+    active: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Determines whether the button should have danger styling
+     * default is false.
+     * @values true, false
+     * @see https://dialtone.dialpad.com/components/button/
+     */
+    danger: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Determines whether the button should be disabled
+     * default is false.
+     * @values true, false
+     */
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Whether the button is a circle or not.
+     * @values true, false
+     * @see https://dialtone.dialpad.com/components/button/
+     */
+    circle: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Aria label for the button. If empty, it takes its value from the default slot.
+     */
+    ariaLabel: {
+      type: String,
+      default: null,
+      validator: (label) => {
+        return label || (void 0).$slots.default;
+      }
+    },
+    /**
+     * Additional class name for the button wrapper element.
+     */
+    buttonClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * Additional class name for the button text.
+     */
+    textClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /*
+     * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.
+     */
+    buttonWidthSize: {
+      type: String,
+      default: "xl",
+      validator: (size) => callbar_button_constants.CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size)
+    },
+    /**
+     * The fill and outline of the button associated with its visual importance.
+     * @values clear, outlined, primary
+     */
+    importance: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Whether the tooltip has an inverted background color.
+     * @values true, false
+     */
+    invertedTooltip: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Use this if you would like to manually override the logic for when the tooltip shows.
+     * Otherwise it will just show on hover/focus.
+     * @values null, true, false
+     */
+    showTooltip: {
+      type: Boolean,
+      default: null
+    },
+    /**
+     * The message that displays in the tooltip. This will be overridden by the tooltip slot.
+     */
+    tooltipText: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Whether there is a delay before the tooltip shows on hover/focus.
+     * @values true, false
+     */
+    tooltipDelay: {
+      type: Boolean,
+      default: void 0
+    }
+  },
+  emits: [
+    /**
+     * Native click event
+     *
+     * @event click
+     * @type {PointerEvent | KeyboardEvent}
+     */
+    "click"
+  ],
+  computed: {
+    callbarButtonClass() {
+      return [
+        this.buttonClass,
+        "d-recipe-callbar-button",
+        {
+          "d-recipe-callbar-button--circle": this.circle,
+          "d-recipe-callbar-button--active": this.active,
+          "d-recipe-callbar-button--danger": this.danger,
+          "d-btn--disabled": this.disabled
+        }
+      ];
+    },
+    callbarButtonTextClass() {
+      return [
+        "d-recipe-callbar-button__text",
+        this.textClass
+      ];
+    },
+    buttonWidth() {
+      switch (this.buttonWidthSize) {
+        case "sm":
+          return "4.5rem";
+        case "md":
+          return "6rem";
+        default:
+          return "8.4rem";
+      }
+    },
+    buttonImportance() {
+      if (this.importance) {
+        return this.importance;
+      }
+      return this.circle ? "outlined" : "clear";
+    },
+    callbarButtonListeners() {
+      return {
+        ...this.$listeners,
+        click: (event) => this.$emit("click", event)
+      };
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("dt-tooltip", { attrs: { "id": _vm.id, "inverted": _vm.invertedTooltip, "delay": _vm.tooltipDelay, "show": _vm.showTooltip, "offset": [0, 24] }, scopedSlots: _vm._u([{ key: "anchor", fn: function() {
+    return [_c("span", { class: { "d-recipe-callbar-button--disabled": _vm.disabled } }, [_c("dt-button", _vm._g(_vm._b({ class: _vm.callbarButtonClass, attrs: { "importance": _vm.buttonImportance, "kind": "muted", "icon-position": "top", "aria-disabled": _vm.disabled, "aria-label": _vm.ariaLabel, "label-class": _vm.callbarButtonTextClass, "width": _vm.buttonWidth }, scopedSlots: _vm._u([{ key: "icon", fn: function() {
+      return [_vm._t("icon")];
+    }, proxy: true }], null, true) }, "dt-button", _vm.$attrs, false), _vm.callbarButtonListeners), [_vm._t("default")], 2)], 1)];
+  }, proxy: true }], null, true) }, [_vm._t("tooltip", function() {
+    return [_vm._v(" " + _vm._s(_vm.tooltipText) + " ")];
+  })], 2);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.default(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns
+);
+const DtRecipeCallbarButton = __component__.exports;
+exports.default = DtRecipeCallbarButton;
+//# sourceMappingURL=callbar_button.vue.cjs.map

package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"callbar_button.vue.cjs","sources":["../../../../recipes/buttons/callbar_button/callbar_button.vue"],"sourcesContent":["<template>\n  <dt-tooltip\n    :id=\"id\"\n    :inverted=\"invertedTooltip\"\n    :delay=\"tooltipDelay\"\n    :show=\"showTooltip\"\n    :offset=\"[0, 24]\"\n  >\n    <template #anchor>\n      <span\n        :class=\"{ 'd-recipe-callbar-button--disabled': disabled }\"\n      >\n        <dt-button\n          :importance=\"buttonImportance\"\n          kind=\"muted\"\n          icon-position=\"top\"\n          :aria-disabled=\"disabled\"\n          :aria-label=\"ariaLabel\"\n          :label-class=\"callbarButtonTextClass\"\n          :width=\"buttonWidth\"\n          :class=\"callbarButtonClass\"\n          v-bind=\"$attrs\"\n          v-on=\"callbarButtonListeners\"\n        >\n          <slot />\n          <template #icon>\n            <slot name=\"icon\" />\n          </template>\n        </dt-button>\n      </span>\n    </template>\n    <slot name=\"tooltip\">\n      {{ tooltipText }}\n    </slot>\n  </dt-tooltip>\n</template>\n\n<script>\nimport { CALLBAR_BUTTON_VALID_WIDTH_SIZE } from './callbar_button_constants';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport utils from '@/common/utils';\n\nexport default {\n  name: 'DtRecipeCallbarButton',\n\n  components: { DtButton, DtTooltip },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Id for the item.\n     */\n    id: {\n      type: String,\n      default () {\n        return utils.getUniqueString();\n      },\n    },\n\n    /**\n     * Determines whether the button should have active styling\n     * default is false.\n     * @values true, false\n     * @see https://dialtone.dialpad.com/components/button/\n     */\n    active: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines whether the button should have danger styling\n     * default is false.\n     * @values true, false\n     * @see https://dialtone.dialpad.com/components/button/\n     */\n    danger: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines whether the button should be disabled\n     * default is false.\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Whether the button is a circle or not.\n     * @values true, false\n     * @see https://dialtone.dialpad.com/components/button/\n     */\n    circle: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Aria label for the button. If empty, it takes its value from the default slot.\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n      validator: (label) => {\n        return label || this.$slots.default;\n      },\n    },\n\n    /**\n     * Additional class name for the button wrapper element.\n     */\n    buttonClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the button text.\n     */\n    textClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /*\n     * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.\n     */\n    buttonWidthSize: {\n      type: String,\n      default: 'xl',\n      validator: size => CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size),\n    },\n\n    /**\n     * The fill and outline of the button associated with its visual importance.\n     * @values clear, outlined, primary\n     */\n    importance: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Whether the tooltip has an inverted background color.\n     * @values true, false\n     */\n    invertedTooltip: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Use this if you would like to manually override the logic for when the tooltip shows.\n     * Otherwise it will just show on hover/focus.\n     * @values null, true, false\n     */\n    showTooltip: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * The message that displays in the tooltip. This will be overridden by the tooltip slot.\n     */\n    tooltipText: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Whether there is a delay before the tooltip shows on hover/focus.\n     * @values true, false\n     */\n    tooltipDelay: {\n      type: Boolean,\n      default: undefined,\n    },\n  },\n\n  emits: [\n    /**\n     * Native click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n  ],\n\n  computed: {\n    callbarButtonClass () {\n      return [\n        this.buttonClass,\n        'd-recipe-callbar-button',\n        {\n          'd-recipe-callbar-button--circle': this.circle,\n          'd-recipe-callbar-button--active': this.active,\n          'd-recipe-callbar-button--danger': this.danger,\n          'd-btn--disabled': this.disabled,\n        }];\n    },\n\n    callbarButtonTextClass () {\n      return [\n        'd-recipe-callbar-button__text',\n        this.textClass,\n      ];\n    },\n\n    buttonWidth () {\n      switch (this.buttonWidthSize) {\n        case 'sm':\n          return '4.5rem';\n        case 'md':\n          return '6rem';\n        default:\n          return '8.4rem';\n      }\n    },\n\n    buttonImportance () {\n      if (this.importance) {\n        return this.importance;\n      }\n      return this.circle ? 'outlined' : 'clear';\n    },\n\n    callbarButtonListeners () {\n      return {\n        ...this.$listeners,\n        click: (event) => this.$emit('click', event),\n      };\n    },\n  },\n};\n</script>\n"],"names":["DtButton","DtTooltip","utils","this","CALLBAR_BUTTON_VALID_WIDTH_SIZE"],"mappings":"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"}

package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.js

@@ -0,0 +1,203 @@
+import { CALLBAR_BUTTON_VALID_WIDTH_SIZE } from "./callbar_button_constants.js";
+import utils from "../../../common/utils.js";
+import normalizeComponent from "../../../_virtual/_plugin-vue2_normalizer.js";
+import DtButton from "../../../components/button/button.vue.js";
+import DtTooltip from "../../../components/tooltip/tooltip.vue.js";
+const _sfc_main = {
+  name: "DtRecipeCallbarButton",
+  components: { DtButton, DtTooltip },
+  inheritAttrs: false,
+  props: {
+    /**
+     * Id for the item.
+     */
+    id: {
+      type: String,
+      default() {
+        return utils.getUniqueString();
+      }
+    },
+    /**
+     * Determines whether the button should have active styling
+     * default is false.
+     * @values true, false
+     * @see https://dialtone.dialpad.com/components/button/
+     */
+    active: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Determines whether the button should have danger styling
+     * default is false.
+     * @values true, false
+     * @see https://dialtone.dialpad.com/components/button/
+     */
+    danger: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Determines whether the button should be disabled
+     * default is false.
+     * @values true, false
+     */
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Whether the button is a circle or not.
+     * @values true, false
+     * @see https://dialtone.dialpad.com/components/button/
+     */
+    circle: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Aria label for the button. If empty, it takes its value from the default slot.
+     */
+    ariaLabel: {
+      type: String,
+      default: null,
+      validator: (label) => {
+        return label || (void 0).$slots.default;
+      }
+    },
+    /**
+     * Additional class name for the button wrapper element.
+     */
+    buttonClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * Additional class name for the button text.
+     */
+    textClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /*
+     * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.
+     */
+    buttonWidthSize: {
+      type: String,
+      default: "xl",
+      validator: (size) => CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size)
+    },
+    /**
+     * The fill and outline of the button associated with its visual importance.
+     * @values clear, outlined, primary
+     */
+    importance: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Whether the tooltip has an inverted background color.
+     * @values true, false
+     */
+    invertedTooltip: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Use this if you would like to manually override the logic for when the tooltip shows.
+     * Otherwise it will just show on hover/focus.
+     * @values null, true, false
+     */
+    showTooltip: {
+      type: Boolean,
+      default: null
+    },
+    /**
+     * The message that displays in the tooltip. This will be overridden by the tooltip slot.
+     */
+    tooltipText: {
+      type: String,
+      default: void 0
+    },
+    /**
+     * Whether there is a delay before the tooltip shows on hover/focus.
+     * @values true, false
+     */
+    tooltipDelay: {
+      type: Boolean,
+      default: void 0
+    }
+  },
+  emits: [
+    /**
+     * Native click event
+     *
+     * @event click
+     * @type {PointerEvent | KeyboardEvent}
+     */
+    "click"
+  ],
+  computed: {
+    callbarButtonClass() {
+      return [
+        this.buttonClass,
+        "d-recipe-callbar-button",
+        {
+          "d-recipe-callbar-button--circle": this.circle,
+          "d-recipe-callbar-button--active": this.active,
+          "d-recipe-callbar-button--danger": this.danger,
+          "d-btn--disabled": this.disabled
+        }
+      ];
+    },
+    callbarButtonTextClass() {
+      return [
+        "d-recipe-callbar-button__text",
+        this.textClass
+      ];
+    },
+    buttonWidth() {
+      switch (this.buttonWidthSize) {
+        case "sm":
+          return "4.5rem";
+        case "md":
+          return "6rem";
+        default:
+          return "8.4rem";
+      }
+    },
+    buttonImportance() {
+      if (this.importance) {
+        return this.importance;
+      }
+      return this.circle ? "outlined" : "clear";
+    },
+    callbarButtonListeners() {
+      return {
+        ...this.$listeners,
+        click: (event) => this.$emit("click", event)
+      };
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("dt-tooltip", { attrs: { "id": _vm.id, "inverted": _vm.invertedTooltip, "delay": _vm.tooltipDelay, "show": _vm.showTooltip, "offset": [0, 24] }, scopedSlots: _vm._u([{ key: "anchor", fn: function() {
+    return [_c("span", { class: { "d-recipe-callbar-button--disabled": _vm.disabled } }, [_c("dt-button", _vm._g(_vm._b({ class: _vm.callbarButtonClass, attrs: { "importance": _vm.buttonImportance, "kind": "muted", "icon-position": "top", "aria-disabled": _vm.disabled, "aria-label": _vm.ariaLabel, "label-class": _vm.callbarButtonTextClass, "width": _vm.buttonWidth }, scopedSlots: _vm._u([{ key: "icon", fn: function() {
+      return [_vm._t("icon")];
+    }, proxy: true }], null, true) }, "dt-button", _vm.$attrs, false), _vm.callbarButtonListeners), [_vm._t("default")], 2)], 1)];
+  }, proxy: true }], null, true) }, [_vm._t("tooltip", function() {
+    return [_vm._v(" " + _vm._s(_vm.tooltipText) + " ")];
+  })], 2);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns
+);
+const DtRecipeCallbarButton = __component__.exports;
+export {
+  DtRecipeCallbarButton as default
+};
+//# sourceMappingURL=callbar_button.vue.js.map

package/dist/vue2/recipes/buttons/callbar_button/callbar_button.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"callbar_button.vue.js","sources":["../../../../recipes/buttons/callbar_button/callbar_button.vue"],"sourcesContent":["<template>\n  <dt-tooltip\n    :id=\"id\"\n    :inverted=\"invertedTooltip\"\n    :delay=\"tooltipDelay\"\n    :show=\"showTooltip\"\n    :offset=\"[0, 24]\"\n  >\n    <template #anchor>\n      <span\n        :class=\"{ 'd-recipe-callbar-button--disabled': disabled }\"\n      >\n        <dt-button\n          :importance=\"buttonImportance\"\n          kind=\"muted\"\n          icon-position=\"top\"\n          :aria-disabled=\"disabled\"\n          :aria-label=\"ariaLabel\"\n          :label-class=\"callbarButtonTextClass\"\n          :width=\"buttonWidth\"\n          :class=\"callbarButtonClass\"\n          v-bind=\"$attrs\"\n          v-on=\"callbarButtonListeners\"\n        >\n          <slot />\n          <template #icon>\n            <slot name=\"icon\" />\n          </template>\n        </dt-button>\n      </span>\n    </template>\n    <slot name=\"tooltip\">\n      {{ tooltipText }}\n    </slot>\n  </dt-tooltip>\n</template>\n\n<script>\nimport { CALLBAR_BUTTON_VALID_WIDTH_SIZE } from './callbar_button_constants';\nimport { DtButton } from '@/components/button';\nimport { DtTooltip } from '@/components/tooltip';\nimport utils from '@/common/utils';\n\nexport default {\n  name: 'DtRecipeCallbarButton',\n\n  components: { DtButton, DtTooltip },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Id for the item.\n     */\n    id: {\n      type: String,\n      default () {\n        return utils.getUniqueString();\n      },\n    },\n\n    /**\n     * Determines whether the button should have active styling\n     * default is false.\n     * @values true, false\n     * @see https://dialtone.dialpad.com/components/button/\n     */\n    active: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines whether the button should have danger styling\n     * default is false.\n     * @values true, false\n     * @see https://dialtone.dialpad.com/components/button/\n     */\n    danger: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines whether the button should be disabled\n     * default is false.\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Whether the button is a circle or not.\n     * @values true, false\n     * @see https://dialtone.dialpad.com/components/button/\n     */\n    circle: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Aria label for the button. If empty, it takes its value from the default slot.\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n      validator: (label) => {\n        return label || this.$slots.default;\n      },\n    },\n\n    /**\n     * Additional class name for the button wrapper element.\n     */\n    buttonClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the button text.\n     */\n    textClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /*\n     * Width size. Valid values are: 'xl', 'lg', 'md' and 'sm'.\n     */\n    buttonWidthSize: {\n      type: String,\n      default: 'xl',\n      validator: size => CALLBAR_BUTTON_VALID_WIDTH_SIZE.includes(size),\n    },\n\n    /**\n     * The fill and outline of the button associated with its visual importance.\n     * @values clear, outlined, primary\n     */\n    importance: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Whether the tooltip has an inverted background color.\n     * @values true, false\n     */\n    invertedTooltip: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Use this if you would like to manually override the logic for when the tooltip shows.\n     * Otherwise it will just show on hover/focus.\n     * @values null, true, false\n     */\n    showTooltip: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * The message that displays in the tooltip. This will be overridden by the tooltip slot.\n     */\n    tooltipText: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Whether there is a delay before the tooltip shows on hover/focus.\n     * @values true, false\n     */\n    tooltipDelay: {\n      type: Boolean,\n      default: undefined,\n    },\n  },\n\n  emits: [\n    /**\n     * Native click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n  ],\n\n  computed: {\n    callbarButtonClass () {\n      return [\n        this.buttonClass,\n        'd-recipe-callbar-button',\n        {\n          'd-recipe-callbar-button--circle': this.circle,\n          'd-recipe-callbar-button--active': this.active,\n          'd-recipe-callbar-button--danger': this.danger,\n          'd-btn--disabled': this.disabled,\n        }];\n    },\n\n    callbarButtonTextClass () {\n      return [\n        'd-recipe-callbar-button__text',\n        this.textClass,\n      ];\n    },\n\n    buttonWidth () {\n      switch (this.buttonWidthSize) {\n        case 'sm':\n          return '4.5rem';\n        case 'md':\n          return '6rem';\n        default:\n          return '8.4rem';\n      }\n    },\n\n    buttonImportance () {\n      if (this.importance) {\n        return this.importance;\n      }\n      return this.circle ? 'outlined' : 'clear';\n    },\n\n    callbarButtonListeners () {\n      return {\n        ...this.$listeners,\n        click: (event) => this.$emit('click', event),\n      };\n    },\n  },\n};\n</script>\n"],"names":["this"],"mappings":"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"}

package/dist/vue2/recipes/buttons/callbar_button/callbar_button_constants.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const CALLBAR_BUTTON_VALID_WIDTH_SIZE = ["sm", "md", "lg", "xl"];
+exports.CALLBAR_BUTTON_VALID_WIDTH_SIZE = CALLBAR_BUTTON_VALID_WIDTH_SIZE;
+//# sourceMappingURL=callbar_button_constants.cjs.map

package/dist/vue2/recipes/buttons/callbar_button/callbar_button_constants.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"callbar_button_constants.cjs","sources":["../../../../recipes/buttons/callbar_button/callbar_button_constants.js"],"sourcesContent":["export const CALLBAR_BUTTON_VALID_WIDTH_SIZE = ['sm', 'md', 'lg', 'xl'];\n\nexport default {\n  CALLBAR_BUTTON_VALID_WIDTH_SIZE,\n};\n"],"names":[],"mappings":";;AAAY,MAAC,kCAAkC,CAAC,MAAM,MAAM,MAAM,IAAI;;"}

package/dist/vue2/recipes/buttons/callbar_button/callbar_button_constants.js

@@ -0,0 +1,5 @@
+const CALLBAR_BUTTON_VALID_WIDTH_SIZE = ["sm", "md", "lg", "xl"];
+export {
+  CALLBAR_BUTTON_VALID_WIDTH_SIZE
+};
+//# sourceMappingURL=callbar_button_constants.js.map

package/dist/vue2/recipes/buttons/callbar_button/callbar_button_constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"callbar_button_constants.js","sources":["../../../../recipes/buttons/callbar_button/callbar_button_constants.js"],"sourcesContent":["export const CALLBAR_BUTTON_VALID_WIDTH_SIZE = ['sm', 'md', 'lg', 'xl'];\n\nexport default {\n  CALLBAR_BUTTON_VALID_WIDTH_SIZE,\n};\n"],"names":[],"mappings":"AAAY,MAAC,kCAAkC,CAAC,MAAM,MAAM,MAAM,IAAI;"}