@dialpad/dialtone-vue 2.157.0 → 2.157.1

package/dist/components/stack/utils.js

@@ -0,0 +1,68 @@
+import { DT_STACK_DIRECTION, DT_STACK_GAP, DT_STACK_RESPONSIVE_BREAKPOINTS } from "./stack_constants.js";
+function _isDefaultDirection(direction) {
+  return direction === DT_STACK_DIRECTION.default;
+}
+function _getValidDirection(direction) {
+  if (directionPropType(direction) === "string") {
+    return !_isDefaultDirection(direction) ? DT_STACK_DIRECTION[direction] : null;
+  } else if (directionPropType(direction) === "object") {
+    const { default: defaultStyle } = direction;
+    return !_isDefaultDirection(defaultStyle) ? DT_STACK_DIRECTION[defaultStyle] : null;
+  } else {
+    return null;
+  }
+}
+function _getValidGap(gap) {
+  if (typeof gap === "string") {
+    return gap;
+  } else if (typeof gap === "object") {
+    return gap.default;
+  } else {
+    return null;
+  }
+}
+function directionPropType(value) {
+  return typeof value;
+}
+function getDefaultDirectionClass(direction) {
+  return _getValidDirection(direction) ? `d-stack--${DT_STACK_DIRECTION[_getValidDirection(direction)]}` : null;
+}
+function getResposiveDirectionClasses(direction) {
+  if (directionPropType(direction) === "object") {
+    return [
+      ...DT_STACK_RESPONSIVE_BREAKPOINTS.map((breakpoint) => {
+        return direction[breakpoint] ? `d-stack--${breakpoint}-${direction[breakpoint]}` : null;
+      })
+    ];
+  } else {
+    return [];
+  }
+}
+function getResposiveGapClasses(gap) {
+  if (typeof gap === "object") {
+    return [
+      ...DT_STACK_RESPONSIVE_BREAKPOINTS.map((breakpoint) => {
+        return DT_STACK_GAP.includes(gap[breakpoint]) ? `d-stack--${breakpoint}-gap-${gap[breakpoint]}` : null;
+      })
+    ];
+  } else {
+    return [];
+  }
+}
+function getResponsiveClasses(direction, gap) {
+  return [
+    ...getResposiveDirectionClasses(direction),
+    ...getResposiveGapClasses(gap)
+  ];
+}
+function getDefaultGapClass(gap) {
+  const validGap = _getValidGap(gap);
+  return DT_STACK_GAP.includes(validGap) ? `d-stack--gap-${validGap}` : null;
+}
+export {
+  directionPropType,
+  getDefaultDirectionClass,
+  getDefaultGapClass,
+  getResponsiveClasses
+};
+//# sourceMappingURL=utils.js.map

package/dist/components/stack/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../../components/stack/utils.js"],"sourcesContent":["import { DT_STACK_DIRECTION, DT_STACK_GAP, DT_STACK_RESPONSIVE_BREAKPOINTS } from '@/components/stack/stack_constants';\n\nfunction _isDefaultDirection (direction) {\n  return direction === DT_STACK_DIRECTION.default;\n}\n\nfunction _getValidDirection (direction) {\n  if (directionPropType(direction) === 'string') {\n    return !_isDefaultDirection(direction) ? DT_STACK_DIRECTION[direction] : null;\n  } else if (directionPropType(direction) === 'object') {\n    const { default: defaultStyle } = direction;\n\n    return !_isDefaultDirection(defaultStyle) ? DT_STACK_DIRECTION[defaultStyle] : null;\n  } else { return null; }\n}\n\nfunction _getValidGap (gap) {\n  if (typeof gap === 'string') {\n    return gap;\n  } else if (typeof gap === 'object') {\n    return gap.default;\n  } else { return null; }\n}\n\nexport function directionPropType (value) {\n  return typeof value;\n}\n\nexport function getDefaultDirectionClass (direction) {\n  return _getValidDirection(direction)\n    ? `d-stack--${DT_STACK_DIRECTION[_getValidDirection(direction)]}`\n    : null;\n}\n\nfunction getResposiveDirectionClasses (direction) {\n  if (directionPropType(direction) === 'object') {\n    return [\n      ...DT_STACK_RESPONSIVE_BREAKPOINTS.map((breakpoint) => {\n        return direction[breakpoint]\n          ? `d-stack--${breakpoint}-${direction[breakpoint]}`\n          : null;\n      })];\n  } else { return []; }\n}\n\nfunction getResposiveGapClasses (gap) {\n  if (typeof gap === 'object') {\n    return [\n      ...DT_STACK_RESPONSIVE_BREAKPOINTS.map((breakpoint) => {\n        return DT_STACK_GAP.includes(gap[breakpoint])\n          ? `d-stack--${breakpoint}-gap-${gap[breakpoint]}`\n          : null;\n      })];\n  } else { return []; }\n}\n\nexport function getResponsiveClasses (direction, gap) {\n  return [\n    ...getResposiveDirectionClasses(direction),\n    ...getResposiveGapClasses(gap),\n  ];\n}\n\nexport function getDefaultGapClass (gap) {\n  const validGap = _getValidGap(gap);\n  return DT_STACK_GAP.includes(validGap) ? `d-stack--gap-${validGap}` : null;\n}\n"],"names":[],"mappings":";AAEA,SAAS,oBAAqB,WAAW;AACvC,SAAO,cAAc,mBAAmB;AAC1C;AAEA,SAAS,mBAAoB,WAAW;AACtC,MAAI,kBAAkB,SAAS,MAAM,UAAU;AAC7C,WAAO,CAAC,oBAAoB,SAAS,IAAI,mBAAmB,SAAS,IAAI;AAAA,EAC1E,WAAU,kBAAkB,SAAS,MAAM,UAAU;AACpD,UAAM,EAAE,SAAS,aAAc,IAAG;AAElC,WAAO,CAAC,oBAAoB,YAAY,IAAI,mBAAmB,YAAY,IAAI;AAAA,EACnF,OAAS;AAAE,WAAO;AAAA,EAAO;AACzB;AAEA,SAAS,aAAc,KAAK;AAC1B,MAAI,OAAO,QAAQ,UAAU;AAC3B,WAAO;AAAA,EACX,WAAa,OAAO,QAAQ,UAAU;AAClC,WAAO,IAAI;AAAA,EACf,OAAS;AAAE,WAAO;AAAA,EAAO;AACzB;AAEO,SAAS,kBAAmB,OAAO;AACxC,SAAO,OAAO;AAChB;AAEO,SAAS,yBAA0B,WAAW;AACnD,SAAO,mBAAmB,SAAS,IAC/B,YAAY,mBAAmB,mBAAmB,SAAS,CAAC,CAAC,KAC7D;AACN;AAEA,SAAS,6BAA8B,WAAW;AAChD,MAAI,kBAAkB,SAAS,MAAM,UAAU;AAC7C,WAAO;AAAA,MACL,GAAG,gCAAgC,IAAI,CAAC,eAAe;AACrD,eAAO,UAAU,UAAU,IACvB,YAAY,UAAU,IAAI,UAAU,UAAU,CAAC,KAC/C;AAAA,MACL,CAAA;AAAA,IAAC;AAAA,EACR,OAAS;AAAE,WAAO,CAAA;AAAA,EAAK;AACvB;AAEA,SAAS,uBAAwB,KAAK;AACpC,MAAI,OAAO,QAAQ,UAAU;AAC3B,WAAO;AAAA,MACL,GAAG,gCAAgC,IAAI,CAAC,eAAe;AACrD,eAAO,aAAa,SAAS,IAAI,UAAU,CAAC,IACxC,YAAY,UAAU,QAAQ,IAAI,UAAU,CAAC,KAC7C;AAAA,MACL,CAAA;AAAA,IAAC;AAAA,EACR,OAAS;AAAE,WAAO,CAAA;AAAA,EAAK;AACvB;AAEO,SAAS,qBAAsB,WAAW,KAAK;AACpD,SAAO;AAAA,IACL,GAAG,6BAA6B,SAAS;AAAA,IACzC,GAAG,uBAAuB,GAAG;AAAA,EACjC;AACA;AAEO,SAAS,mBAAoB,KAAK;AACvC,QAAM,WAAW,aAAa,GAAG;AACjC,SAAO,aAAa,SAAS,QAAQ,IAAI,gBAAgB,QAAQ,KAAK;AACxE;"}

package/dist/components/stack/validators.cjs

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const stack_constants = require("./stack_constants.cjs");
+const utils = require("./utils.cjs");
+function directionValidator(direction) {
+  if (utils.directionPropType(direction) === "string") {
+    return Object.keys(stack_constants.DT_STACK_DIRECTION).includes(direction);
+  } else if (utils.directionPropType(direction) === "object") {
+    const { default: defaultStyle } = direction;
+    return Object.keys(stack_constants.DT_STACK_DIRECTION).includes(defaultStyle);
+  } else {
+    return null;
+  }
+}
+function gapValidator(gap) {
+  if (typeof gap === "string") {
+    return stack_constants.DT_STACK_GAP.includes(gap);
+  }
+  if (typeof gap === "object") {
+    const { default: defaultStyle } = gap;
+    return stack_constants.DT_STACK_GAP.includes(defaultStyle);
+  }
+}
+exports.directionValidator = directionValidator;
+exports.gapValidator = gapValidator;
+//# sourceMappingURL=validators.cjs.map

package/dist/components/stack/validators.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"validators.cjs","sources":["../../../components/stack/validators.js"],"sourcesContent":["import { DT_STACK_DIRECTION, DT_STACK_GAP } from '@/components/stack/stack_constants';\nimport { directionPropType } from './utils';\n\nexport function directionValidator (direction) {\n  if (directionPropType(direction) === 'string') {\n    return Object.keys(DT_STACK_DIRECTION).includes(direction);\n  } else if (directionPropType(direction) === 'object') {\n    const { default: defaultStyle } = direction;\n\n    return Object.keys(DT_STACK_DIRECTION).includes(defaultStyle);\n  } else { return null; }\n}\n\nexport function gapValidator (gap) {\n  if (typeof gap === 'string') {\n    return DT_STACK_GAP.includes(gap);\n  }\n  if (typeof gap === 'object') {\n    const { default: defaultStyle } = gap;\n\n    return DT_STACK_GAP.includes(defaultStyle);\n  }\n}\n"],"names":["directionPropType","DT_STACK_DIRECTION","DT_STACK_GAP"],"mappings":";;;;AAGO,SAAS,mBAAoB,WAAW;AAC7C,MAAIA,MAAiB,kBAAC,SAAS,MAAM,UAAU;AAC7C,WAAO,OAAO,KAAKC,gBAAAA,kBAAkB,EAAE,SAAS,SAAS;AAAA,EAC1D,WAAUD,MAAiB,kBAAC,SAAS,MAAM,UAAU;AACpD,UAAM,EAAE,SAAS,aAAc,IAAG;AAElC,WAAO,OAAO,KAAKC,gBAAAA,kBAAkB,EAAE,SAAS,YAAY;AAAA,EAChE,OAAS;AAAE,WAAO;AAAA,EAAO;AACzB;AAEO,SAAS,aAAc,KAAK;AACjC,MAAI,OAAO,QAAQ,UAAU;AAC3B,WAAOC,gBAAY,aAAC,SAAS,GAAG;AAAA,EACjC;AACD,MAAI,OAAO,QAAQ,UAAU;AAC3B,UAAM,EAAE,SAAS,aAAc,IAAG;AAElC,WAAOA,gBAAY,aAAC,SAAS,YAAY;AAAA,EAC1C;AACH;;;"}

package/dist/components/stack/validators.js

@@ -0,0 +1,26 @@
+import { DT_STACK_DIRECTION, DT_STACK_GAP } from "./stack_constants.js";
+import { directionPropType } from "./utils.js";
+function directionValidator(direction) {
+  if (directionPropType(direction) === "string") {
+    return Object.keys(DT_STACK_DIRECTION).includes(direction);
+  } else if (directionPropType(direction) === "object") {
+    const { default: defaultStyle } = direction;
+    return Object.keys(DT_STACK_DIRECTION).includes(defaultStyle);
+  } else {
+    return null;
+  }
+}
+function gapValidator(gap) {
+  if (typeof gap === "string") {
+    return DT_STACK_GAP.includes(gap);
+  }
+  if (typeof gap === "object") {
+    const { default: defaultStyle } = gap;
+    return DT_STACK_GAP.includes(defaultStyle);
+  }
+}
+export {
+  directionValidator,
+  gapValidator
+};
+//# sourceMappingURL=validators.js.map

package/dist/components/stack/validators.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validators.js","sources":["../../../components/stack/validators.js"],"sourcesContent":["import { DT_STACK_DIRECTION, DT_STACK_GAP } from '@/components/stack/stack_constants';\nimport { directionPropType } from './utils';\n\nexport function directionValidator (direction) {\n  if (directionPropType(direction) === 'string') {\n    return Object.keys(DT_STACK_DIRECTION).includes(direction);\n  } else if (directionPropType(direction) === 'object') {\n    const { default: defaultStyle } = direction;\n\n    return Object.keys(DT_STACK_DIRECTION).includes(defaultStyle);\n  } else { return null; }\n}\n\nexport function gapValidator (gap) {\n  if (typeof gap === 'string') {\n    return DT_STACK_GAP.includes(gap);\n  }\n  if (typeof gap === 'object') {\n    const { default: defaultStyle } = gap;\n\n    return DT_STACK_GAP.includes(defaultStyle);\n  }\n}\n"],"names":[],"mappings":";;AAGO,SAAS,mBAAoB,WAAW;AAC7C,MAAI,kBAAkB,SAAS,MAAM,UAAU;AAC7C,WAAO,OAAO,KAAK,kBAAkB,EAAE,SAAS,SAAS;AAAA,EAC1D,WAAU,kBAAkB,SAAS,MAAM,UAAU;AACpD,UAAM,EAAE,SAAS,aAAc,IAAG;AAElC,WAAO,OAAO,KAAK,kBAAkB,EAAE,SAAS,YAAY;AAAA,EAChE,OAAS;AAAE,WAAO;AAAA,EAAO;AACzB;AAEO,SAAS,aAAc,KAAK;AACjC,MAAI,OAAO,QAAQ,UAAU;AAC3B,WAAO,aAAa,SAAS,GAAG;AAAA,EACjC;AACD,MAAI,OAAO,QAAQ,UAAU;AAC3B,UAAM,EAAE,SAAS,aAAc,IAAG;AAElC,WAAO,aAAa,SAAS,YAAY;AAAA,EAC1C;AACH;"}

package/dist/components/tabs/tab.vue.cjs

@@ -0,0 +1,119 @@
+"use strict";
+const tabs_constants = require("./tabs_constants.cjs");
+const _pluginVue2_normalizer = require("../../_virtual/_plugin-vue2_normalizer.cjs");
+const button = require("../button/button.vue.cjs");
+const _sfc_main = {
+  name: "DtTab",
+  components: {
+    DtButton: button
+  },
+  inject: ["changeContentPanel", "groupContext", "setFocus"],
+  inheritAttrs: false,
+  props: {
+    /**
+     * Id of the tab
+     */
+    id: {
+      type: String,
+      required: true
+    },
+    /**
+     * Id of the associated content panel
+     */
+    panelId: {
+      type: String,
+      required: true
+    },
+    /**
+     * Describes the tab
+     */
+    label: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Controls the state of the tab
+     * @values true, false
+     */
+    selected: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * If true, disables the tab
+     * @values true, false
+     */
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Used to customize the tab element
+     */
+    tabClass: {
+      type: [String, Array, Object],
+      default: ""
+    }
+  },
+  data() {
+    return {
+      TAB_IMPORTANCE_MODIFIERS: tabs_constants.TAB_IMPORTANCE_MODIFIERS
+    };
+  },
+  computed: {
+    isSelected() {
+      return this.groupContext.selected === this.panelId;
+    },
+    tabListeners() {
+      return {
+        ...this.$listeners,
+        click: (event) => {
+          this.selectPanel();
+          this.$emit("click", event);
+        },
+        focus: (event) => {
+          this.setFocus(this.id);
+          this.$emit("focus", event);
+        }
+      };
+    }
+  },
+  mounted() {
+    this.setSelectedPanelByDefault();
+  },
+  methods: {
+    setSelectedPanelByDefault() {
+      if (this.selected) {
+        this.selectPanel(true);
+      }
+    },
+    selectPanel(selectOverride = false) {
+      this.changeContentPanel({
+        selected: this.panelId,
+        selectOverride
+      });
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("dt-button", _vm._g(_vm._b({ class: [
+    "d-tab",
+    {
+      [_vm.TAB_IMPORTANCE_MODIFIERS.selected]: _vm.isSelected
+    },
+    _vm.tabClass
+  ], attrs: { "id": `dt-tab-${_vm.id}`, "role": "tab", "aria-selected": `${_vm.isSelected}`, "aria-controls": `dt-panel-${_vm.panelId}`, "aria-label": _vm.label, "data-qa": "dt-tab", "tabindex": _vm.isSelected ? "0" : "-1", "disabled": _vm.groupContext.disabled || _vm.disabled } }, "dt-button", _vm.$attrs, false), _vm.tabListeners), [_vm._t("default")], 2);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ _pluginVue2_normalizer(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  null
+);
+const DtTab = __component__.exports;
+module.exports = DtTab;
+//# sourceMappingURL=tab.vue.cjs.map

package/dist/components/tabs/tab.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.vue.cjs","sources":["../../../components/tabs/tab.vue"],"sourcesContent":["<template>\n  <dt-button\n    :id=\"`dt-tab-${id}`\"\n    :class=\"[\n      'd-tab',\n      {\n        [TAB_IMPORTANCE_MODIFIERS.selected]: isSelected,\n      },\n      tabClass,\n    ]\"\n    role=\"tab\"\n    :aria-selected=\"`${isSelected}`\"\n    :aria-controls=\"`dt-panel-${panelId}`\"\n    :aria-label=\"label\"\n    data-qa=\"dt-tab\"\n    :tabindex=\"isSelected ? '0' : '-1'\"\n    :disabled=\"groupContext.disabled || disabled\"\n    v-bind=\"$attrs\"\n    v-on=\"tabListeners\"\n  >\n    <!-- @slot default slot, defaults contains dt-button -->\n    <slot />\n  </dt-button>\n</template>\n\n<script>\nimport { TAB_IMPORTANCE_MODIFIERS } from './tabs_constants';\nimport { DtButton } from '../button';\n\n/**\n * Tabs allow users to navigation between grouped content in different views while within the same page context.\n * @see https://dialtone.dialpad.com/components/tabs.html\n */\nexport default {\n  name: 'DtTab',\n  components: {\n    DtButton,\n  },\n\n  inject: ['changeContentPanel', 'groupContext', 'setFocus'],\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Id of the tab\n     */\n    id: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Id of the associated content panel\n     */\n    panelId: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Describes the tab\n     */\n    label: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Controls the state of the tab\n     * @values true, false\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * If true, disables the tab\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Used to customize the tab element\n     */\n    tabClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n\n  data () {\n    return {\n      TAB_IMPORTANCE_MODIFIERS,\n    };\n  },\n\n  computed: {\n    isSelected () {\n      return this.groupContext.selected === this.panelId;\n    },\n\n    tabListeners () {\n      return {\n        ...this.$listeners,\n\n        click: event => {\n          this.selectPanel();\n          this.$emit('click', event);\n        },\n\n        focus: event => {\n          this.setFocus(this.id);\n          this.$emit('focus', event);\n        },\n      };\n    },\n  },\n\n  mounted () {\n    this.setSelectedPanelByDefault();\n  },\n\n  methods: {\n    setSelectedPanelByDefault () {\n      if (this.selected) {\n        this.selectPanel(true);\n      }\n    },\n\n    selectPanel (selectOverride = false) {\n      this.changeContentPanel({\n        selected: this.panelId,\n        selectOverride,\n      });\n    },\n  },\n};\n</script>\n"],"names":["DtButton","TAB_IMPORTANCE_MODIFIERS"],"mappings":";;;;AAiCA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA,UAAAA;AAAAA,EACA;AAAA,EAEA,QAAA,CAAA,sBAAA,gBAAA,UAAA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,IAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,0BAAAC,eAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,aAAA;AACA,aAAA,KAAA,aAAA,aAAA,KAAA;AAAA,IACA;AAAA,IAEA,eAAA;AACA,aAAA;AAAA,QACA,GAAA,KAAA;AAAA,QAEA,OAAA,WAAA;AACA,eAAA,YAAA;AACA,eAAA,MAAA,SAAA,KAAA;AAAA,QACA;AAAA,QAEA,OAAA,WAAA;AACA,eAAA,SAAA,KAAA,EAAA;AACA,eAAA,MAAA,SAAA,KAAA;AAAA,QACA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,SAAA,0BAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,4BAAA;AACA,UAAA,KAAA,UAAA;AACA,aAAA,YAAA,IAAA;AAAA,MACA;AAAA,IACA;AAAA,IAEA,YAAA,iBAAA,OAAA;AACA,WAAA,mBAAA;AAAA,QACA,UAAA,KAAA;AAAA,QACA;AAAA,MACA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/tabs/tab.vue.js

@@ -0,0 +1,120 @@
+import { TAB_IMPORTANCE_MODIFIERS } from "./tabs_constants.js";
+import normalizeComponent from "../../_virtual/_plugin-vue2_normalizer.js";
+import DtButton from "../button/button.vue.js";
+const _sfc_main = {
+  name: "DtTab",
+  components: {
+    DtButton
+  },
+  inject: ["changeContentPanel", "groupContext", "setFocus"],
+  inheritAttrs: false,
+  props: {
+    /**
+     * Id of the tab
+     */
+    id: {
+      type: String,
+      required: true
+    },
+    /**
+     * Id of the associated content panel
+     */
+    panelId: {
+      type: String,
+      required: true
+    },
+    /**
+     * Describes the tab
+     */
+    label: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Controls the state of the tab
+     * @values true, false
+     */
+    selected: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * If true, disables the tab
+     * @values true, false
+     */
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Used to customize the tab element
+     */
+    tabClass: {
+      type: [String, Array, Object],
+      default: ""
+    }
+  },
+  data() {
+    return {
+      TAB_IMPORTANCE_MODIFIERS
+    };
+  },
+  computed: {
+    isSelected() {
+      return this.groupContext.selected === this.panelId;
+    },
+    tabListeners() {
+      return {
+        ...this.$listeners,
+        click: (event) => {
+          this.selectPanel();
+          this.$emit("click", event);
+        },
+        focus: (event) => {
+          this.setFocus(this.id);
+          this.$emit("focus", event);
+        }
+      };
+    }
+  },
+  mounted() {
+    this.setSelectedPanelByDefault();
+  },
+  methods: {
+    setSelectedPanelByDefault() {
+      if (this.selected) {
+        this.selectPanel(true);
+      }
+    },
+    selectPanel(selectOverride = false) {
+      this.changeContentPanel({
+        selected: this.panelId,
+        selectOverride
+      });
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("dt-button", _vm._g(_vm._b({ class: [
+    "d-tab",
+    {
+      [_vm.TAB_IMPORTANCE_MODIFIERS.selected]: _vm.isSelected
+    },
+    _vm.tabClass
+  ], attrs: { "id": `dt-tab-${_vm.id}`, "role": "tab", "aria-selected": `${_vm.isSelected}`, "aria-controls": `dt-panel-${_vm.panelId}`, "aria-label": _vm.label, "data-qa": "dt-tab", "tabindex": _vm.isSelected ? "0" : "-1", "disabled": _vm.groupContext.disabled || _vm.disabled } }, "dt-button", _vm.$attrs, false), _vm.tabListeners), [_vm._t("default")], 2);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  null
+);
+const DtTab = __component__.exports;
+export {
+  DtTab as default
+};
+//# sourceMappingURL=tab.vue.js.map

package/dist/components/tabs/tab.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.vue.js","sources":["../../../components/tabs/tab.vue"],"sourcesContent":["<template>\n  <dt-button\n    :id=\"`dt-tab-${id}`\"\n    :class=\"[\n      'd-tab',\n      {\n        [TAB_IMPORTANCE_MODIFIERS.selected]: isSelected,\n      },\n      tabClass,\n    ]\"\n    role=\"tab\"\n    :aria-selected=\"`${isSelected}`\"\n    :aria-controls=\"`dt-panel-${panelId}`\"\n    :aria-label=\"label\"\n    data-qa=\"dt-tab\"\n    :tabindex=\"isSelected ? '0' : '-1'\"\n    :disabled=\"groupContext.disabled || disabled\"\n    v-bind=\"$attrs\"\n    v-on=\"tabListeners\"\n  >\n    <!-- @slot default slot, defaults contains dt-button -->\n    <slot />\n  </dt-button>\n</template>\n\n<script>\nimport { TAB_IMPORTANCE_MODIFIERS } from './tabs_constants';\nimport { DtButton } from '../button';\n\n/**\n * Tabs allow users to navigation between grouped content in different views while within the same page context.\n * @see https://dialtone.dialpad.com/components/tabs.html\n */\nexport default {\n  name: 'DtTab',\n  components: {\n    DtButton,\n  },\n\n  inject: ['changeContentPanel', 'groupContext', 'setFocus'],\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Id of the tab\n     */\n    id: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Id of the associated content panel\n     */\n    panelId: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Describes the tab\n     */\n    label: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Controls the state of the tab\n     * @values true, false\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * If true, disables the tab\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Used to customize the tab element\n     */\n    tabClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n\n  data () {\n    return {\n      TAB_IMPORTANCE_MODIFIERS,\n    };\n  },\n\n  computed: {\n    isSelected () {\n      return this.groupContext.selected === this.panelId;\n    },\n\n    tabListeners () {\n      return {\n        ...this.$listeners,\n\n        click: event => {\n          this.selectPanel();\n          this.$emit('click', event);\n        },\n\n        focus: event => {\n          this.setFocus(this.id);\n          this.$emit('focus', event);\n        },\n      };\n    },\n  },\n\n  mounted () {\n    this.setSelectedPanelByDefault();\n  },\n\n  methods: {\n    setSelectedPanelByDefault () {\n      if (this.selected) {\n        this.selectPanel(true);\n      }\n    },\n\n    selectPanel (selectOverride = false) {\n      this.changeContentPanel({\n        selected: this.panelId,\n        selectOverride,\n      });\n    },\n  },\n};\n</script>\n"],"names":[],"mappings":";;;AAiCA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,QAAA,CAAA,sBAAA,gBAAA,UAAA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,IAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,UAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,aAAA;AACA,aAAA,KAAA,aAAA,aAAA,KAAA;AAAA,IACA;AAAA,IAEA,eAAA;AACA,aAAA;AAAA,QACA,GAAA,KAAA;AAAA,QAEA,OAAA,WAAA;AACA,eAAA,YAAA;AACA,eAAA,MAAA,SAAA,KAAA;AAAA,QACA;AAAA,QAEA,OAAA,WAAA;AACA,eAAA,SAAA,KAAA,EAAA;AACA,eAAA,MAAA,SAAA,KAAA;AAAA,QACA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,SAAA,0BAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,4BAAA;AACA,UAAA,KAAA,UAAA;AACA,aAAA,YAAA,IAAA;AAAA,MACA;AAAA,IACA;AAAA,IAEA,YAAA,iBAAA,OAAA;AACA,WAAA,mBAAA;AAAA,QACA,UAAA,KAAA;AAAA,QACA;AAAA,MACA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;"}

package/dist/{chunks/tab-FcsV5VmK.js → components/tabs/tab_group.vue.cjs}

@@ -1,20 +1,7 @@
 "use strict";
-const _pluginVue2_normalizer = require("./_plugin-vue2_normalizer-1aBeR4AK.js");
-const lib_button = require("../lib/button.cjs");
-const TAB_LIST_SIZES = ["default", "sm"];
-const TAB_LIST_SIZE_MODIFIERS = {
-  sm: "d-tablist--sm"
-};
-const TAB_LIST_KIND_MODIFIERS = {
-  inverted: "d-tablist--inverted"
-};
-const TAB_LIST_IMPORTANCE_MODIFIERS = {
-  borderless: "d-tablist--no-border"
-};
-const TAB_IMPORTANCE_MODIFIERS = {
-  selected: "d-tab--selected"
-};
-const _sfc_main$1 = {
+const tabs_constants = require("./tabs_constants.cjs");
+const _pluginVue2_normalizer = require("../../_virtual/_plugin-vue2_normalizer.cjs");
+const _sfc_main = {
   name: "DtTabGroup",
   provide() {
     return {
@@ -70,7 +57,7 @@ const _sfc_main$1 = {
       type: String,
       default: "default",
       validate(size) {
-        return TAB_LIST_SIZES.includes(size);
+        return tabs_constants.TAB_LIST_SIZES.includes(size);
       }
     },
     /**
@@ -107,9 +94,9 @@ const _sfc_main$1 = {
       },
       focusId: null,
       tabs: [],
-      TAB_LIST_SIZE_MODIFIERS,
-      TAB_LIST_KIND_MODIFIERS,
-      TAB_LIST_IMPORTANCE_MODIFIERS
+      TAB_LIST_SIZE_MODIFIERS: tabs_constants.TAB_LIST_SIZE_MODIFIERS,
+      TAB_LIST_KIND_MODIFIERS: tabs_constants.TAB_LIST_KIND_MODIFIERS,
+      TAB_LIST_IMPORTANCE_MODIFIERS: tabs_constants.TAB_LIST_IMPORTANCE_MODIFIERS
     };
   },
   watch: {
@@ -164,15 +151,13 @@ const _sfc_main$1 = {
     },
     tabLeft() {
       const { index, tabs } = this.getIndexAndTabs();
-      if (index === -1)
-        return;
+      if (index === -1) return;
       const indexElement = index - 1 < 0 ? tabs.length - 1 : index - 1;
       this.selectFocusOnTab(indexElement, tabs);
     },
     tabRight() {
       const { index, tabs } = this.getIndexAndTabs();
-      if (index === -1)
-        return;
+      if (index === -1) return;
       const indexElement = index + 1 > tabs.length - 1 ? 0 : index + 1;
       this.selectFocusOnTab(indexElement, tabs);
     },
@@ -198,19 +183,17 @@ const _sfc_main$1 = {
     },
     onHomeButton() {
       var _a, _b;
-      if (this.tabs.length === 0)
-        return;
+      if (this.tabs.length === 0) return;
       (_b = (_a = this.tabs[0]) == null ? void 0 : _a.context) == null ? void 0 : _b.focus();
     },
     onEndButton() {
       var _a, _b;
-      if (this.tabs.length === 0)
-        return;
+      if (this.tabs.length === 0) return;
       (_b = (_a = this.tabs[this.tabs.length - 1]) == null ? void 0 : _a.context) == null ? void 0 : _b.focus();
     }
   }
 };
-var _sfc_render$1 = function render() {
+var _sfc_render = function render() {
   var _vm = this, _c = _vm._self._c;
   return _c("div", { attrs: { "data-qa": "dt-tab-group" } }, [_c("div", _vm._b({ class: [
     "d-tablist",
@@ -221,166 +204,36 @@ var _sfc_render$1 = function render() {
     },
     _vm.tabListClass
   ], attrs: { "role": "tablist", "aria-label": _vm.label }, on: { "keyup": [function($event) {
-    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "left", 37, $event.key, ["Left", "ArrowLeft"]))
-      return null;
-    if ("button" in $event && $event.button !== 0)
-      return null;
+    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "left", 37, $event.key, ["Left", "ArrowLeft"])) return null;
+    if ("button" in $event && $event.button !== 0) return null;
     return _vm.tabLeft.apply(null, arguments);
   }, function($event) {
-    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "right", 39, $event.key, ["Right", "ArrowRight"]))
-      return null;
-    if ("button" in $event && $event.button !== 2)
-      return null;
+    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "right", 39, $event.key, ["Right", "ArrowRight"])) return null;
+    if ("button" in $event && $event.button !== 2) return null;
     return _vm.tabRight.apply(null, arguments);
   }, function($event) {
-    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "enter", 13, $event.key, "Enter"))
-      return null;
+    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "enter", 13, $event.key, "Enter")) return null;
     return _vm.selectTab.apply(null, arguments);
   }, function($event) {
-    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "space", 32, $event.key, [" ", "Spacebar"]))
-      return null;
+    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "space", 32, $event.key, [" ", "Spacebar"])) return null;
     return _vm.selectTab.apply(null, arguments);
   }], "keydown": [function($event) {
-    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "home", void 0, $event.key, void 0))
-      return null;
+    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "home", void 0, $event.key, void 0)) return null;
     return _vm.onHomeButton.apply(null, arguments);
   }, function($event) {
-    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "end", void 0, $event.key, void 0))
-      return null;
+    if (!$event.type.indexOf("key") && _vm._k($event.keyCode, "end", void 0, $event.key, void 0)) return null;
     return _vm.onEndButton.apply(null, arguments);
   }] } }, "div", _vm.tabListChildProps, false), [_vm._t("tabs")], 2), _vm._t("default")], 2);
 };
-var _sfc_staticRenderFns$1 = [];
-var __component__$1 = /* @__PURE__ */ _pluginVue2_normalizer.normalizeComponent(
-  _sfc_main$1,
-  _sfc_render$1,
-  _sfc_staticRenderFns$1,
-  false,
-  null,
-  null,
-  null,
-  null
-);
-const DtTabGroup = __component__$1.exports;
-const _sfc_main = {
-  name: "DtTab",
-  components: {
-    DtButton: lib_button.DtButton
-  },
-  inject: ["changeContentPanel", "groupContext", "setFocus"],
-  inheritAttrs: false,
-  props: {
-    /**
-     * Id of the tab
-     */
-    id: {
-      type: String,
-      required: true
-    },
-    /**
-     * Id of the associated content panel
-     */
-    panelId: {
-      type: String,
-      required: true
-    },
-    /**
-     * Describes the tab
-     */
-    label: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Controls the state of the tab
-     * @values true, false
-     */
-    selected: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * If true, disables the tab
-     * @values true, false
-     */
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Used to customize the tab element
-     */
-    tabClass: {
-      type: [String, Array, Object],
-      default: ""
-    }
-  },
-  data() {
-    return {
-      TAB_IMPORTANCE_MODIFIERS
-    };
-  },
-  computed: {
-    isSelected() {
-      return this.groupContext.selected === this.panelId;
-    },
-    tabListeners() {
-      return {
-        ...this.$listeners,
-        click: (event) => {
-          this.selectPanel();
-          this.$emit("click", event);
-        },
-        focus: (event) => {
-          this.setFocus(this.id);
-          this.$emit("focus", event);
-        }
-      };
-    }
-  },
-  mounted() {
-    this.setSelectedPanelByDefault();
-  },
-  methods: {
-    setSelectedPanelByDefault() {
-      if (this.selected) {
-        this.selectPanel(true);
-      }
-    },
-    selectPanel(selectOverride = false) {
-      this.changeContentPanel({
-        selected: this.panelId,
-        selectOverride
-      });
-    }
-  }
-};
-var _sfc_render = function render2() {
-  var _vm = this, _c = _vm._self._c;
-  return _c("dt-button", _vm._g(_vm._b({ class: [
-    "d-tab",
-    {
-      [_vm.TAB_IMPORTANCE_MODIFIERS.selected]: _vm.isSelected
-    },
-    _vm.tabClass
-  ], attrs: { "id": `dt-tab-${_vm.id}`, "role": "tab", "aria-selected": `${_vm.isSelected}`, "aria-controls": `dt-panel-${_vm.panelId}`, "aria-label": _vm.label, "data-qa": "dt-tab", "tabindex": _vm.isSelected ? "0" : "-1", "disabled": _vm.groupContext.disabled || _vm.disabled } }, "dt-button", _vm.$attrs, false), _vm.tabListeners), [_vm._t("default")], 2);
-};
 var _sfc_staticRenderFns = [];
-var __component__ = /* @__PURE__ */ _pluginVue2_normalizer.normalizeComponent(
+var __component__ = /* @__PURE__ */ _pluginVue2_normalizer(
   _sfc_main,
   _sfc_render,
   _sfc_staticRenderFns,
   false,
   null,
-  null,
-  null,
   null
 );
-const DtTab = __component__.exports;
-exports.DtTab = DtTab;
-exports.DtTabGroup = DtTabGroup;
-exports.TAB_IMPORTANCE_MODIFIERS = TAB_IMPORTANCE_MODIFIERS;
-exports.TAB_LIST_IMPORTANCE_MODIFIERS = TAB_LIST_IMPORTANCE_MODIFIERS;
-exports.TAB_LIST_KIND_MODIFIERS = TAB_LIST_KIND_MODIFIERS;
-exports.TAB_LIST_SIZES = TAB_LIST_SIZES;
-//# sourceMappingURL=tab-FcsV5VmK.js.map
+const DtTabGroup = __component__.exports;
+module.exports = DtTabGroup;
+//# sourceMappingURL=tab_group.vue.cjs.map