@dialpad/dialtone 9.79.2 → 9.80.0

package/dist/vue3/lib/select-menu.js

@@ -1,5 +1,5 @@
-import { default as default2 } from "../packages/dialtone-vue3/components/select_menu/select_menu.vue.js";
-import { SELECT_SIZE_MODIFIERS, SELECT_STATE_MODIFIERS } from "../packages/dialtone-vue3/components/select_menu/select_menu_constants.js";
+import { default as default2 } from "../components/select_menu/select_menu.vue.js";
+import { SELECT_SIZE_MODIFIERS, SELECT_STATE_MODIFIERS } from "../components/select_menu/select_menu_constants.js";
 export {
   default2 as DtSelectMenu,
   SELECT_SIZE_MODIFIERS,

package/dist/vue3/lib/settings-menu-button.cjs

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const settings_menu_button = require("../packages/dialtone-vue3/recipes/header/settings_menu_button/settings_menu_button.vue.cjs");
-exports.DtRecipeSettingsMenuButton = settings_menu_button;
+const settings_menu_button = require("../recipes/header/settings_menu_button/settings_menu_button.vue.cjs");
+exports.DtRecipeSettingsMenuButton = settings_menu_button.default;
 //# sourceMappingURL=settings-menu-button.cjs.map

package/dist/vue3/lib/settings-menu-button.js

@@ -1,4 +1,4 @@
-import { default as default2 } from "../packages/dialtone-vue3/recipes/header/settings_menu_button/settings_menu_button.vue.js";
+import { default as default2 } from "../recipes/header/settings_menu_button/settings_menu_button.vue.js";
 export {
   default2 as DtRecipeSettingsMenuButton
 };

package/dist/vue3/lib/skeleton.cjs

@@ -1,16 +1,16 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const skeleton = require("../packages/dialtone-vue3/components/skeleton/skeleton.vue.cjs");
-const skeletonListItem = require("../packages/dialtone-vue3/components/skeleton/skeleton-list-item.vue.cjs");
-const skeletonText = require("../packages/dialtone-vue3/components/skeleton/skeleton-text.vue.cjs");
-const skeletonShape = require("../packages/dialtone-vue3/components/skeleton/skeleton-shape.vue.cjs");
-const skeletonParagraph = require("../packages/dialtone-vue3/components/skeleton/skeleton-paragraph.vue.cjs");
-const skeleton_constants = require("../packages/dialtone-vue3/components/skeleton/skeleton_constants.cjs");
-exports.DtSkeleton = skeleton;
-exports.DtSkeletonListItem = skeletonListItem;
-exports.DtSkeletonText = skeletonText;
-exports.DtSkeletonShape = skeletonShape;
-exports.DtSkeletonParagraph = skeletonParagraph;
+const skeleton = require("../components/skeleton/skeleton.vue.cjs");
+const skeletonListItem = require("../components/skeleton/skeleton-list-item.vue.cjs");
+const skeletonText = require("../components/skeleton/skeleton-text.vue.cjs");
+const skeletonShape = require("../components/skeleton/skeleton-shape.vue.cjs");
+const skeletonParagraph = require("../components/skeleton/skeleton-paragraph.vue.cjs");
+const skeleton_constants = require("../components/skeleton/skeleton_constants.cjs");
+exports.DtSkeleton = skeleton.default;
+exports.DtSkeletonListItem = skeletonListItem.default;
+exports.DtSkeletonText = skeletonText.default;
+exports.DtSkeletonShape = skeletonShape.default;
+exports.DtSkeletonParagraph = skeletonParagraph.default;
 exports.SKELETON_HEADING_HEIGHTS = skeleton_constants.SKELETON_HEADING_HEIGHTS;
 exports.SKELETON_RIPPLE_DURATION = skeleton_constants.SKELETON_RIPPLE_DURATION;
 exports.SKELETON_SHAPES = skeleton_constants.SKELETON_SHAPES;

package/dist/vue3/lib/skeleton.js

@@ -1,9 +1,9 @@
-import { default as default2 } from "../packages/dialtone-vue3/components/skeleton/skeleton.vue.js";
-import { default as default3 } from "../packages/dialtone-vue3/components/skeleton/skeleton-list-item.vue.js";
-import { default as default4 } from "../packages/dialtone-vue3/components/skeleton/skeleton-text.vue.js";
-import { default as default5 } from "../packages/dialtone-vue3/components/skeleton/skeleton-shape.vue.js";
-import { default as default6 } from "../packages/dialtone-vue3/components/skeleton/skeleton-paragraph.vue.js";
-import { SKELETON_HEADING_HEIGHTS, SKELETON_RIPPLE_DURATION, SKELETON_SHAPES, SKELETON_SHAPE_SIZES, SKELETON_TEXT_TYPES } from "../packages/dialtone-vue3/components/skeleton/skeleton_constants.js";
+import { default as default2 } from "../components/skeleton/skeleton.vue.js";
+import { default as default3 } from "../components/skeleton/skeleton-list-item.vue.js";
+import { default as default4 } from "../components/skeleton/skeleton-text.vue.js";
+import { default as default5 } from "../components/skeleton/skeleton-shape.vue.js";
+import { default as default6 } from "../components/skeleton/skeleton-paragraph.vue.js";
+import { SKELETON_HEADING_HEIGHTS, SKELETON_RIPPLE_DURATION, SKELETON_SHAPES, SKELETON_SHAPE_SIZES, SKELETON_TEXT_TYPES } from "../components/skeleton/skeleton_constants.js";
 export {
   default2 as DtSkeleton,
   default3 as DtSkeletonListItem,

package/dist/vue3/lib/split-button.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const split_button = require("../packages/dialtone-vue3/components/split_button/split_button.vue.cjs");
-const split_button_constants = require("../packages/dialtone-vue3/components/split_button/split_button_constants.cjs");
-exports.DtSplitButton = split_button;
+const split_button = require("../components/split_button/split_button.vue.cjs");
+const split_button_constants = require("../components/split_button/split_button_constants.cjs");
+exports.DtSplitButton = split_button.default;
 exports.SPLIT_BUTTON_ICON_SIZES = split_button_constants.SPLIT_BUTTON_ICON_SIZES;
 //# sourceMappingURL=split-button.cjs.map

package/dist/vue3/lib/split-button.js

@@ -1,5 +1,5 @@
-import { default as default2 } from "../packages/dialtone-vue3/components/split_button/split_button.vue.js";
-import { SPLIT_BUTTON_ICON_SIZES } from "../packages/dialtone-vue3/components/split_button/split_button_constants.js";
+import { default as default2 } from "../components/split_button/split_button.vue.js";
+import { SPLIT_BUTTON_ICON_SIZES } from "../components/split_button/split_button_constants.js";
 export {
   default2 as DtSplitButton,
   SPLIT_BUTTON_ICON_SIZES

package/dist/vue3/lib/stack.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const stack = require("../packages/dialtone-vue3/components/stack/stack.vue.cjs");
-const stack_constants = require("../packages/dialtone-vue3/components/stack/stack_constants.cjs");
-exports.DtStack = stack;
+const stack = require("../components/stack/stack.vue.cjs");
+const stack_constants = require("../components/stack/stack_constants.cjs");
+exports.DtStack = stack.default;
 exports.DT_STACK_DIRECTION = stack_constants.DT_STACK_DIRECTION;
 exports.DT_STACK_GAP = stack_constants.DT_STACK_GAP;
 exports.DT_STACK_RESPONSIVE_BREAKPOINTS = stack_constants.DT_STACK_RESPONSIVE_BREAKPOINTS;

package/dist/vue3/lib/stack.js

@@ -1,5 +1,5 @@
-import { default as default2 } from "../packages/dialtone-vue3/components/stack/stack.vue.js";
-import { DT_STACK_DIRECTION, DT_STACK_GAP, DT_STACK_RESPONSIVE_BREAKPOINTS } from "../packages/dialtone-vue3/components/stack/stack_constants.js";
+import { default as default2 } from "../components/stack/stack.vue.js";
+import { DT_STACK_DIRECTION, DT_STACK_GAP, DT_STACK_RESPONSIVE_BREAKPOINTS } from "../components/stack/stack_constants.js";
 export {
   DT_STACK_DIRECTION,
   DT_STACK_GAP,

package/dist/vue3/lib/tab.cjs

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const tab_group = require("../components/tab/tab_group.vue.cjs");
+const tab = require("../components/tab/tab.vue.cjs");
+const tab_panel = require("../components/tab/tab_panel.vue.cjs");
+const tabs_constants = require("../components/tab/tabs_constants.cjs");
+exports.DtTabGroup = tab_group.default;
+exports.DtTab = tab.default;
+exports.DtTabPanel = tab_panel.default;
+exports.TAB_IMPORTANCE_MODIFIERS = tabs_constants.TAB_IMPORTANCE_MODIFIERS;
+exports.TAB_LIST_IMPORTANCE_MODIFIERS = tabs_constants.TAB_LIST_IMPORTANCE_MODIFIERS;
+exports.TAB_LIST_KIND_MODIFIERS = tabs_constants.TAB_LIST_KIND_MODIFIERS;
+exports.TAB_LIST_SIZES = tabs_constants.TAB_LIST_SIZES;
+//# sourceMappingURL=tab.cjs.map

package/dist/vue3/lib/tab.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

package/dist/vue3/lib/tab.js

@@ -0,0 +1,14 @@
+import { default as default2 } from "../components/tab/tab_group.vue.js";
+import { default as default3 } from "../components/tab/tab.vue.js";
+import { default as default4 } from "../components/tab/tab_panel.vue.js";
+import { TAB_IMPORTANCE_MODIFIERS, TAB_LIST_IMPORTANCE_MODIFIERS, TAB_LIST_KIND_MODIFIERS, TAB_LIST_SIZES } from "../components/tab/tabs_constants.js";
+export {
+  default3 as DtTab,
+  default2 as DtTabGroup,
+  default4 as DtTabPanel,
+  TAB_IMPORTANCE_MODIFIERS,
+  TAB_LIST_IMPORTANCE_MODIFIERS,
+  TAB_LIST_KIND_MODIFIERS,
+  TAB_LIST_SIZES
+};
+//# sourceMappingURL=tab.js.map

package/dist/vue3/lib/tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/vue3/lib/time-pill.cjs

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const time_pill = require("../packages/dialtone-vue3/recipes/conversation_view/time_pill/time_pill.vue.cjs");
-exports.DtRecipeTimePill = time_pill;
+const time_pill = require("../recipes/conversation_view/time_pill/time_pill.vue.cjs");
+exports.DtRecipeTimePill = time_pill.default;
 //# sourceMappingURL=time-pill.cjs.map

package/dist/vue3/lib/time-pill.js

@@ -1,4 +1,4 @@
-import { default as default2 } from "../packages/dialtone-vue3/recipes/conversation_view/time_pill/time_pill.vue.js";
+import { default as default2 } from "../recipes/conversation_view/time_pill/time_pill.vue.js";
 export {
   default2 as DtRecipeTimePill
 };

package/dist/vue3/lib/toast.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const toast = require("../packages/dialtone-vue3/components/toast/toast.vue.cjs");
-const toast_constants = require("../packages/dialtone-vue3/components/toast/toast_constants.cjs");
-exports.DtToast = toast;
+const toast = require("../components/toast/toast.vue.cjs");
+const toast_constants = require("../components/toast/toast_constants.cjs");
+exports.DtToast = toast.default;
 exports.TOAST_MIN_DURATION = toast_constants.TOAST_MIN_DURATION;
 exports.TOAST_ROLES = toast_constants.TOAST_ROLES;
 //# sourceMappingURL=toast.cjs.map

package/dist/vue3/lib/toast.js

@@ -1,5 +1,5 @@
-import { default as default2 } from "../packages/dialtone-vue3/components/toast/toast.vue.js";
-import { TOAST_MIN_DURATION, TOAST_ROLES } from "../packages/dialtone-vue3/components/toast/toast_constants.js";
+import { default as default2 } from "../components/toast/toast.vue.js";
+import { TOAST_MIN_DURATION, TOAST_ROLES } from "../components/toast/toast_constants.js";
 export {
   default2 as DtToast,
   TOAST_MIN_DURATION,

package/dist/vue3/lib/toggle.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const toggle = require("../packages/dialtone-vue3/components/toggle/toggle.vue.cjs");
-const toggle_constants = require("../packages/dialtone-vue3/components/toggle/toggle_constants.cjs");
-exports.DtToggle = toggle;
+const toggle = require("../components/toggle/toggle.vue.cjs");
+const toggle_constants = require("../components/toggle/toggle_constants.cjs");
+exports.DtToggle = toggle.default;
 exports.TOGGLE_CHECKED_VALUES = toggle_constants.TOGGLE_CHECKED_VALUES;
 exports.TOGGLE_SIZE_MODIFIERS = toggle_constants.TOGGLE_SIZE_MODIFIERS;
 //# sourceMappingURL=toggle.cjs.map

package/dist/vue3/lib/toggle.js

@@ -1,5 +1,5 @@
-import { default as default2 } from "../packages/dialtone-vue3/components/toggle/toggle.vue.js";
-import { TOGGLE_CHECKED_VALUES, TOGGLE_SIZE_MODIFIERS } from "../packages/dialtone-vue3/components/toggle/toggle_constants.js";
+import { default as default2 } from "../components/toggle/toggle.vue.js";
+import { TOGGLE_CHECKED_VALUES, TOGGLE_SIZE_MODIFIERS } from "../components/toggle/toggle_constants.js";
 export {
   default2 as DtToggle,
   TOGGLE_CHECKED_VALUES,

package/dist/vue3/lib/tooltip-directive.cjs

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const tooltip = require("../packages/dialtone-vue3/directives/tooltip/tooltip.cjs");
+const tooltip = require("../directives/tooltip/tooltip.cjs");
 exports.DtTooltipDirective = tooltip.default;
 //# sourceMappingURL=tooltip-directive.cjs.map

package/dist/vue3/lib/tooltip-directive.js

@@ -1,4 +1,4 @@
-import { default as default2 } from "../packages/dialtone-vue3/directives/tooltip/tooltip.js";
+import { default as default2 } from "../directives/tooltip/tooltip.js";
 export {
   default2 as DtTooltipDirective
 };

package/dist/vue3/lib/tooltip.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const tooltip = require("../packages/dialtone-vue3/components/tooltip/tooltip.vue.cjs");
-const tooltip_constants = require("../packages/dialtone-vue3/components/tooltip/tooltip_constants.cjs");
-exports.DtTooltip = tooltip;
+const tooltip = require("../components/tooltip/tooltip.vue.cjs");
+const tooltip_constants = require("../components/tooltip/tooltip_constants.cjs");
+exports.DtTooltip = tooltip.default;
 exports.TOOLTIP_DELAY_MS = tooltip_constants.TOOLTIP_DELAY_MS;
 exports.TOOLTIP_DIRECTIONS = tooltip_constants.TOOLTIP_DIRECTIONS;
 exports.TOOLTIP_HIDE_ON_CLICK_VARIANTS = tooltip_constants.TOOLTIP_HIDE_ON_CLICK_VARIANTS;

package/dist/vue3/lib/tooltip.js

@@ -1,5 +1,5 @@
-import { default as default2 } from "../packages/dialtone-vue3/components/tooltip/tooltip.vue.js";
-import { TOOLTIP_DELAY_MS, TOOLTIP_DIRECTIONS, TOOLTIP_HIDE_ON_CLICK_VARIANTS, TOOLTIP_KIND_MODIFIERS, TOOLTIP_STICKY_VALUES } from "../packages/dialtone-vue3/components/tooltip/tooltip_constants.js";
+import { default as default2 } from "../components/tooltip/tooltip.vue.js";
+import { TOOLTIP_DELAY_MS, TOOLTIP_DIRECTIONS, TOOLTIP_HIDE_ON_CLICK_VARIANTS, TOOLTIP_KIND_MODIFIERS, TOOLTIP_STICKY_VALUES } from "../components/tooltip/tooltip_constants.js";
 export {
   default2 as DtTooltip,
   TOOLTIP_DELAY_MS,

package/dist/vue3/lib/top-banner-info.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const top_banner_info = require("../packages/dialtone-vue3/recipes/notices/top_banner_info/top_banner_info.vue.cjs");
-const top_banner_info_constants = require("../packages/dialtone-vue3/recipes/notices/top_banner_info/top_banner_info_constants.cjs");
-exports.DtRecipeTopBannerInfo = top_banner_info;
+const top_banner_info = require("../recipes/notices/top_banner_info/top_banner_info.vue.cjs");
+const top_banner_info_constants = require("../recipes/notices/top_banner_info/top_banner_info_constants.cjs");
+exports.DtRecipeTopBannerInfo = top_banner_info.default;
 exports.COLOR_CODES = top_banner_info_constants.COLOR_CODES;
 //# sourceMappingURL=top-banner-info.cjs.map

package/dist/vue3/lib/top-banner-info.js

@@ -1,5 +1,5 @@
-import { default as default2 } from "../packages/dialtone-vue3/recipes/notices/top_banner_info/top_banner_info.vue.js";
-import { COLOR_CODES } from "../packages/dialtone-vue3/recipes/notices/top_banner_info/top_banner_info_constants.js";
+import { default as default2 } from "../recipes/notices/top_banner_info/top_banner_info.vue.js";
+import { COLOR_CODES } from "../recipes/notices/top_banner_info/top_banner_info_constants.js";
 export {
   COLOR_CODES,
   default2 as DtRecipeTopBannerInfo

package/dist/vue3/lib/unread-pill.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const unread_pill = require("../packages/dialtone-vue3/recipes/leftbar/unread_pill/unread_pill.vue.cjs");
-const unread_pill_constants = require("../packages/dialtone-vue3/recipes/leftbar/unread_pill/unread_pill_constants.cjs");
-exports.DtRecipeUnreadPill = unread_pill;
+const unread_pill = require("../recipes/leftbar/unread_pill/unread_pill.vue.cjs");
+const unread_pill_constants = require("../recipes/leftbar/unread_pill/unread_pill_constants.cjs");
+exports.DtRecipeUnreadPill = unread_pill.default;
 exports.UNREAD_PILL_DIRECTIONS = unread_pill_constants.UNREAD_PILL_DIRECTIONS;
 exports.UNREAD_PILL_KINDS = unread_pill_constants.UNREAD_PILL_KINDS;
 //# sourceMappingURL=unread-pill.cjs.map

package/dist/vue3/lib/unread-pill.js

@@ -1,5 +1,5 @@
-import { default as default2 } from "../packages/dialtone-vue3/recipes/leftbar/unread_pill/unread_pill.vue.js";
-import { UNREAD_PILL_DIRECTIONS, UNREAD_PILL_KINDS } from "../packages/dialtone-vue3/recipes/leftbar/unread_pill/unread_pill_constants.js";
+import { default as default2 } from "../recipes/leftbar/unread_pill/unread_pill.vue.js";
+import { UNREAD_PILL_DIRECTIONS, UNREAD_PILL_KINDS } from "../recipes/leftbar/unread_pill/unread_pill_constants.js";
 export {
   default2 as DtRecipeUnreadPill,
   UNREAD_PILL_DIRECTIONS,

package/dist/vue3/lib/validation-messages.cjs

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const validation_messages = require("../packages/dialtone-vue3/components/validation_messages/validation_messages.vue.cjs");
-exports.DtValidationMessages = validation_messages;
+const validation_messages = require("../components/validation_messages/validation_messages.vue.cjs");
+exports.DtValidationMessages = validation_messages.default;
 //# sourceMappingURL=validation-messages.cjs.map

package/dist/vue3/lib/validation-messages.js

@@ -1,4 +1,4 @@
-import { default as default2 } from "../packages/dialtone-vue3/components/validation_messages/validation_messages.vue.js";
+import { default as default2 } from "../components/validation_messages/validation_messages.vue.js";
 export {
   default2 as DtValidationMessages
 };

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

@@ -0,0 +1,196 @@
+"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 vue = require("vue");
+;/* empty css                      */
+const _pluginVue_exportHelper = require("../../../_virtual/_plugin-vue_export-helper.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: ""
+    }
+  },
+  emits: [
+    /**
+     * Native click event
+     *
+     * @event click
+     * @type {PointerEvent | KeyboardEvent}
+     */
+    "click"
+  ],
+  computed: {
+    callbarButtonClass() {
+      return [
+        this.buttonClass,
+        "dt-recipe-callbar-button",
+        "d-px0",
+        {
+          "dt-recipe-callbar-button--circle": this.circle,
+          "dt-recipe-callbar-button--active": this.active,
+          "dt-recipe-callbar-button--danger": this.danger,
+          "d-btn--disabled d-bgc-transparent": this.disabled,
+          "d-fc-primary": !this.disabled
+        }
+      ];
+    },
+    callbarButtonTextClass() {
+      return [
+        "d-fs-100 lg:d-d-none md:d-d-none sm:d-d-none",
+        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 {
+        ...common_utils.extractVueListeners(this.$attrs),
+        click: (event) => this.$emit("click", event)
+      };
+    }
+  }
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dt_button = vue.resolveComponent("dt-button");
+  const _component_dt_tooltip = vue.resolveComponent("dt-tooltip");
+  return vue.openBlock(), vue.createBlock(_component_dt_tooltip, {
+    id: $props.id,
+    offset: [0, 24]
+  }, {
+    anchor: vue.withCtx(() => [
+      vue.createElementVNode("span", {
+        class: vue.normalizeClass({ "dt-recipe-callbar-button--disabled": $props.disabled })
+      }, [
+        vue.createVNode(_component_dt_button, vue.mergeProps({
+          importance: $options.buttonImportance,
+          kind: "muted",
+          "icon-position": "top",
+          "aria-disabled": $props.disabled,
+          "aria-label": $props.ariaLabel,
+          "label-class": $options.callbarButtonTextClass,
+          width: $options.buttonWidth,
+          class: $options.callbarButtonClass
+        }, _ctx.$attrs, vue.toHandlers($options.callbarButtonListeners)), {
+          icon: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "icon")
+          ]),
+          default: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "default")
+          ]),
+          _: 3
+        }, 16, ["importance", "aria-disabled", "aria-label", "label-class", "width", "class"])
+      ], 2)
+    ]),
+    default: vue.withCtx(() => [
+      vue.renderSlot(_ctx.$slots, "tooltip")
+    ]),
+    _: 3
+  }, 8, ["id"]);
+}
+const DtRecipeCallbarButton = /* @__PURE__ */ _pluginVue_exportHelper.default(_sfc_main, [["render", _sfc_render]]);
+exports.default = DtRecipeCallbarButton;
+//# sourceMappingURL=callbar_button.vue.cjs.map

package/dist/vue3/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    :offset=\"[0, 24]\"\n  >\n    <template #anchor>\n      <span\n        :class=\"{ 'dt-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  </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, { extractVueListeners } 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\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        'dt-recipe-callbar-button',\n        'd-px0',\n        {\n          'dt-recipe-callbar-button--circle': this.circle,\n          'dt-recipe-callbar-button--active': this.active,\n          'dt-recipe-callbar-button--danger': this.danger,\n          'd-btn--disabled d-bgc-transparent': this.disabled,\n          'd-fc-primary': !this.disabled,\n        }];\n    },\n\n    callbarButtonTextClass () {\n      return [\n        'd-fs-100 lg:d-d-none md:d-d-none sm:d-d-none',\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        ...extractVueListeners(this.$attrs),\n        click: (event) => this.$emit('click', event),\n      };\n    },\n  },\n};\n</script>\n\n<style lang=\"less\">\n.dt-recipe-callbar-button:not(.dt-recipe-callbar-button--circle) {\n  line-height: var(--dt-font-line-height-300);\n}\n\n.dt-recipe-callbar-button--circle {\n  border-radius: var(--dt-size-radius-circle);\n}\n\n.dt-recipe-callbar-button.d-btn[disabled] {\n  background-color: unset;\n  opacity: .5;\n}\n\n.dt-recipe-callbar-button--circle.d-btn[disabled] {\n  border-color: unset;\n}\n\n.dt-recipe-callbar-button--active,\n.dt-recipe-callbar-button--active:hover {\n  .base-button__icon {\n    color: var(--primary-color);\n  }\n}\n\n.dt-recipe-callbar-button--disabled {\n  cursor: not-allowed;\n}\n</style>\n"],"names":["DtButton","DtTooltip","utils","this","CALLBAR_BUTTON_VALID_WIDTH_SIZE","extractVueListeners","_createBlock","_createElementVNode","_normalizeClass","_createVNode","_mergeProps","_toHandlers","_renderSlot","_withCtx"],"mappings":"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"}