@dialpad/dialtone-vue 2.157.1-beta.1 → 2.158.0

package/dist/components/button/button_constants.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button_constants.cjs","sources":["../../../components/button/button_constants.js"],"sourcesContent":["export const BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-btn--xs',\n  sm: 'd-btn--sm',\n  md: '',\n  lg: 'd-btn--lg',\n  xl: 'd-btn--xl',\n};\n\nexport const BUTTON_KIND_MODIFIERS = {\n  default: '',\n  muted: 'd-btn--muted',\n  danger: 'd-btn--danger',\n  inverted: 'd-btn--inverted',\n};\n\nexport const BUTTON_IMPORTANCE_MODIFIERS = {\n  clear: '',\n  primary: 'd-btn--primary',\n  outlined: 'd-btn--outlined',\n};\n\nexport const BUTTON_TYPES = ['submit', 'reset', 'button'];\n\nexport const ICON_POSITION_MODIFIERS = {\n  left: 'd-btn__icon--left',\n  right: 'd-btn__icon--right',\n  top: 'd-btn__icon--top',\n  bottom: 'd-btn__icon--bottom',\n};\n\nexport const INVALID_COMBINATION = [\n  {\n    circle: true,\n    kind: 'default',\n    importance: 'primary',\n    message: _invalidCombinationMessage(true, 'default', 'primary'),\n  },\n  {\n    circle: true,\n    kind: 'danger',\n    importance: 'outlined',\n    message: _invalidCombinationMessage(true, 'danger', 'outlined'),\n  },\n  {\n    circle: true,\n    kind: 'muted',\n    importance: 'primary',\n    message: _invalidCombinationMessage(true, 'muted', 'primary'),\n  },\n  {\n    circle: false,\n    kind: 'muted',\n    importance: 'primary',\n    message: _invalidCombinationMessage(false, 'muted', 'primary'),\n  },\n];\n\nexport const BUTTON_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '300',\n  lg: '400',\n  xl: '500',\n};\n\nfunction _invalidCombinationMessage (circle, kind, importance) {\n  return `You cannot have a ${circle ? 'circle ' : ''}button \\\nwith kind: ${kind} and importance: ${importance} as it \\\ndoes not exist in our design system. \\\nSee https://dialtone.dialpad.com/components/button.html for a \\\nlist of available button styles`;\n}\n\nexport default {\n  BUTTON_SIZE_MODIFIERS,\n  BUTTON_KIND_MODIFIERS,\n  BUTTON_IMPORTANCE_MODIFIERS,\n  BUTTON_TYPES,\n  ICON_POSITION_MODIFIERS,\n  INVALID_COMBINATION,\n  BUTTON_ICON_SIZES,\n};\n"],"names":[],"mappings":";;AAAY,MAAC,wBAAwB;AAAA,EACnC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEY,MAAC,wBAAwB;AAAA,EACnC,SAAS;AAAA,EACT,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,UAAU;AACZ;AAEY,MAAC,8BAA8B;AAAA,EACzC,OAAO;AAAA,EACP,SAAS;AAAA,EACT,UAAU;AACZ;AAEY,MAAC,eAAe,CAAC,UAAU,SAAS,QAAQ;AAE5C,MAAC,0BAA0B;AAAA,EACrC,MAAM;AAAA,EACN,OAAO;AAAA,EACP,KAAK;AAAA,EACL,QAAQ;AACV;AAEY,MAAC,sBAAsB;AAAA,EACjC;AAAA,IACE,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,SAAS,2BAA2B,MAAM,WAAW,SAAS;AAAA,EAC/D;AAAA,EACD;AAAA,IACE,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,SAAS,2BAA2B,MAAM,UAAU,UAAU;AAAA,EAC/D;AAAA,EACD;AAAA,IACE,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,SAAS,2BAA2B,MAAM,SAAS,SAAS;AAAA,EAC7D;AAAA,EACD;AAAA,IACE,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,SAAS,2BAA2B,OAAO,SAAS,SAAS;AAAA,EAC9D;AACH;AAEY,MAAC,oBAAoB;AAAA,EAC/B,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,SAAS,2BAA4B,QAAQ,MAAM,YAAY;AAC7D,SAAO,qBAAqB,SAAS,YAAY,EAAE,qBACxC,IAAI,oBAAoB,UAAU;AAI/C;;;;;;;;"}

package/dist/components/button/button_constants.js

@@ -0,0 +1,71 @@
+const BUTTON_SIZE_MODIFIERS = {
+  xs: "d-btn--xs",
+  sm: "d-btn--sm",
+  md: "",
+  lg: "d-btn--lg",
+  xl: "d-btn--xl"
+};
+const BUTTON_KIND_MODIFIERS = {
+  default: "",
+  muted: "d-btn--muted",
+  danger: "d-btn--danger",
+  inverted: "d-btn--inverted"
+};
+const BUTTON_IMPORTANCE_MODIFIERS = {
+  clear: "",
+  primary: "d-btn--primary",
+  outlined: "d-btn--outlined"
+};
+const BUTTON_TYPES = ["submit", "reset", "button"];
+const ICON_POSITION_MODIFIERS = {
+  left: "d-btn__icon--left",
+  right: "d-btn__icon--right",
+  top: "d-btn__icon--top",
+  bottom: "d-btn__icon--bottom"
+};
+const INVALID_COMBINATION = [
+  {
+    circle: true,
+    kind: "default",
+    importance: "primary",
+    message: _invalidCombinationMessage(true, "default", "primary")
+  },
+  {
+    circle: true,
+    kind: "danger",
+    importance: "outlined",
+    message: _invalidCombinationMessage(true, "danger", "outlined")
+  },
+  {
+    circle: true,
+    kind: "muted",
+    importance: "primary",
+    message: _invalidCombinationMessage(true, "muted", "primary")
+  },
+  {
+    circle: false,
+    kind: "muted",
+    importance: "primary",
+    message: _invalidCombinationMessage(false, "muted", "primary")
+  }
+];
+const BUTTON_ICON_SIZES = {
+  xs: "200",
+  sm: "200",
+  md: "300",
+  lg: "400",
+  xl: "500"
+};
+function _invalidCombinationMessage(circle, kind, importance) {
+  return `You cannot have a ${circle ? "circle " : ""}button with kind: ${kind} and importance: ${importance} as it does not exist in our design system. See https://dialtone.dialpad.com/components/button.html for a list of available button styles`;
+}
+export {
+  BUTTON_ICON_SIZES,
+  BUTTON_IMPORTANCE_MODIFIERS,
+  BUTTON_KIND_MODIFIERS,
+  BUTTON_SIZE_MODIFIERS,
+  BUTTON_TYPES,
+  ICON_POSITION_MODIFIERS,
+  INVALID_COMBINATION
+};
+//# sourceMappingURL=button_constants.js.map

package/dist/components/button/button_constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button_constants.js","sources":["../../../components/button/button_constants.js"],"sourcesContent":["export const BUTTON_SIZE_MODIFIERS = {\n  xs: 'd-btn--xs',\n  sm: 'd-btn--sm',\n  md: '',\n  lg: 'd-btn--lg',\n  xl: 'd-btn--xl',\n};\n\nexport const BUTTON_KIND_MODIFIERS = {\n  default: '',\n  muted: 'd-btn--muted',\n  danger: 'd-btn--danger',\n  inverted: 'd-btn--inverted',\n};\n\nexport const BUTTON_IMPORTANCE_MODIFIERS = {\n  clear: '',\n  primary: 'd-btn--primary',\n  outlined: 'd-btn--outlined',\n};\n\nexport const BUTTON_TYPES = ['submit', 'reset', 'button'];\n\nexport const ICON_POSITION_MODIFIERS = {\n  left: 'd-btn__icon--left',\n  right: 'd-btn__icon--right',\n  top: 'd-btn__icon--top',\n  bottom: 'd-btn__icon--bottom',\n};\n\nexport const INVALID_COMBINATION = [\n  {\n    circle: true,\n    kind: 'default',\n    importance: 'primary',\n    message: _invalidCombinationMessage(true, 'default', 'primary'),\n  },\n  {\n    circle: true,\n    kind: 'danger',\n    importance: 'outlined',\n    message: _invalidCombinationMessage(true, 'danger', 'outlined'),\n  },\n  {\n    circle: true,\n    kind: 'muted',\n    importance: 'primary',\n    message: _invalidCombinationMessage(true, 'muted', 'primary'),\n  },\n  {\n    circle: false,\n    kind: 'muted',\n    importance: 'primary',\n    message: _invalidCombinationMessage(false, 'muted', 'primary'),\n  },\n];\n\nexport const BUTTON_ICON_SIZES = {\n  xs: '200',\n  sm: '200',\n  md: '300',\n  lg: '400',\n  xl: '500',\n};\n\nfunction _invalidCombinationMessage (circle, kind, importance) {\n  return `You cannot have a ${circle ? 'circle ' : ''}button \\\nwith kind: ${kind} and importance: ${importance} as it \\\ndoes not exist in our design system. \\\nSee https://dialtone.dialpad.com/components/button.html for a \\\nlist of available button styles`;\n}\n\nexport default {\n  BUTTON_SIZE_MODIFIERS,\n  BUTTON_KIND_MODIFIERS,\n  BUTTON_IMPORTANCE_MODIFIERS,\n  BUTTON_TYPES,\n  ICON_POSITION_MODIFIERS,\n  INVALID_COMBINATION,\n  BUTTON_ICON_SIZES,\n};\n"],"names":[],"mappings":"AAAY,MAAC,wBAAwB;AAAA,EACnC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEY,MAAC,wBAAwB;AAAA,EACnC,SAAS;AAAA,EACT,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,UAAU;AACZ;AAEY,MAAC,8BAA8B;AAAA,EACzC,OAAO;AAAA,EACP,SAAS;AAAA,EACT,UAAU;AACZ;AAEY,MAAC,eAAe,CAAC,UAAU,SAAS,QAAQ;AAE5C,MAAC,0BAA0B;AAAA,EACrC,MAAM;AAAA,EACN,OAAO;AAAA,EACP,KAAK;AAAA,EACL,QAAQ;AACV;AAEY,MAAC,sBAAsB;AAAA,EACjC;AAAA,IACE,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,SAAS,2BAA2B,MAAM,WAAW,SAAS;AAAA,EAC/D;AAAA,EACD;AAAA,IACE,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,SAAS,2BAA2B,MAAM,UAAU,UAAU;AAAA,EAC/D;AAAA,EACD;AAAA,IACE,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,SAAS,2BAA2B,MAAM,SAAS,SAAS;AAAA,EAC7D;AAAA,EACD;AAAA,IACE,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,SAAS,2BAA2B,OAAO,SAAS,SAAS;AAAA,EAC9D;AACH;AAEY,MAAC,oBAAoB;AAAA,EAC/B,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,SAAS,2BAA4B,QAAQ,MAAM,YAAY;AAC7D,SAAO,qBAAqB,SAAS,YAAY,EAAE,qBACxC,IAAI,oBAAoB,UAAU;AAI/C;"}

package/dist/components/button_group/button_group.vue.cjs

@@ -0,0 +1,40 @@
+"use strict";
+const button_group_constants = require("./button_group_constants.cjs");
+const _pluginVue2_normalizer = require("../../_virtual/_plugin-vue2_normalizer.cjs");
+const _sfc_main = {
+  name: "DtButtonGroup",
+  props: {
+    /**
+     * Alignment of the buttons inside the container
+     */
+    alignment: {
+      type: String,
+      default: "start",
+      validator: (alignment) => Object.keys(button_group_constants.BUTTON_GROUP_ALIGNMENT).includes(alignment)
+    }
+  },
+  data() {
+    return {
+      BUTTON_GROUP_ALIGNMENT: button_group_constants.BUTTON_GROUP_ALIGNMENT
+    };
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", { class: [
+    "d-btn-group",
+    _vm.BUTTON_GROUP_ALIGNMENT[_vm.alignment]
+  ], attrs: { "role": "group" } }, [_vm._t("default")], 2);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ _pluginVue2_normalizer(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  null
+);
+const button_group = __component__.exports;
+module.exports = button_group;
+//# sourceMappingURL=button_group.vue.cjs.map

package/dist/components/button_group/button_group.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button_group.vue.cjs","sources":["../../../components/button_group/button_group.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'd-btn-group',\n      BUTTON_GROUP_ALIGNMENT[alignment],\n    ]\"\n    role=\"group\"\n  >\n    <!-- @slot Default slot for button items -->\n    <slot />\n  </div>\n</template>\n\n<script>\nimport { BUTTON_GROUP_ALIGNMENT } from './button_group_constants';\n\nexport default {\n  name: 'DtButtonGroup',\n\n  props: {\n    /**\n     * Alignment of the buttons inside the container\n     */\n    alignment: {\n      type: String,\n      default: 'start',\n      validator: (alignment) => Object.keys(BUTTON_GROUP_ALIGNMENT).includes(alignment),\n    },\n  },\n\n  data () {\n    return {\n      BUTTON_GROUP_ALIGNMENT,\n    };\n  },\n};\n</script>\n"],"names":["BUTTON_GROUP_ALIGNMENT"],"mappings":";;;AAgBA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,cAAA,OAAA,KAAAA,6CAAA,EAAA,SAAA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA,wBAAAA,uBAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;"}

package/dist/components/button_group/button_group.vue.js

@@ -0,0 +1,41 @@
+import { BUTTON_GROUP_ALIGNMENT } from "./button_group_constants.js";
+import normalizeComponent from "../../_virtual/_plugin-vue2_normalizer.js";
+const _sfc_main = {
+  name: "DtButtonGroup",
+  props: {
+    /**
+     * Alignment of the buttons inside the container
+     */
+    alignment: {
+      type: String,
+      default: "start",
+      validator: (alignment) => Object.keys(BUTTON_GROUP_ALIGNMENT).includes(alignment)
+    }
+  },
+  data() {
+    return {
+      BUTTON_GROUP_ALIGNMENT
+    };
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", { class: [
+    "d-btn-group",
+    _vm.BUTTON_GROUP_ALIGNMENT[_vm.alignment]
+  ], attrs: { "role": "group" } }, [_vm._t("default")], 2);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  null
+);
+const button_group = __component__.exports;
+export {
+  button_group as default
+};
+//# sourceMappingURL=button_group.vue.js.map

package/dist/components/button_group/button_group.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button_group.vue.js","sources":["../../../components/button_group/button_group.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'd-btn-group',\n      BUTTON_GROUP_ALIGNMENT[alignment],\n    ]\"\n    role=\"group\"\n  >\n    <!-- @slot Default slot for button items -->\n    <slot />\n  </div>\n</template>\n\n<script>\nimport { BUTTON_GROUP_ALIGNMENT } from './button_group_constants';\n\nexport default {\n  name: 'DtButtonGroup',\n\n  props: {\n    /**\n     * Alignment of the buttons inside the container\n     */\n    alignment: {\n      type: String,\n      default: 'start',\n      validator: (alignment) => Object.keys(BUTTON_GROUP_ALIGNMENT).includes(alignment),\n    },\n  },\n\n  data () {\n    return {\n      BUTTON_GROUP_ALIGNMENT,\n    };\n  },\n};\n</script>\n"],"names":[],"mappings":";;AAgBA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA,CAAA,cAAA,OAAA,KAAA,sBAAA,EAAA,SAAA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AACA,WAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;"}

package/dist/components/button_group/button_group_constants.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const BUTTON_GROUP_ALIGNMENT = {
+  start: "d-btn-group--start",
+  end: "d-btn-group--end",
+  "space-between": "d-btn-group--space-between"
+};
+exports.BUTTON_GROUP_ALIGNMENT = BUTTON_GROUP_ALIGNMENT;
+//# sourceMappingURL=button_group_constants.cjs.map

package/dist/components/button_group/button_group_constants.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"button_group_constants.cjs","sources":["../../../components/button_group/button_group_constants.js"],"sourcesContent":["export const BUTTON_GROUP_ALIGNMENT = {\n  start: 'd-btn-group--start',\n  end: 'd-btn-group--end',\n  'space-between': 'd-btn-group--space-between',\n};\n"],"names":[],"mappings":";;AAAY,MAAC,yBAAyB;AAAA,EACpC,OAAO;AAAA,EACP,KAAK;AAAA,EACL,iBAAiB;AACnB;;"}

package/dist/components/button_group/button_group_constants.js

@@ -0,0 +1,9 @@
+const BUTTON_GROUP_ALIGNMENT = {
+  start: "d-btn-group--start",
+  end: "d-btn-group--end",
+  "space-between": "d-btn-group--space-between"
+};
+export {
+  BUTTON_GROUP_ALIGNMENT
+};
+//# sourceMappingURL=button_group_constants.js.map

package/dist/components/button_group/button_group_constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button_group_constants.js","sources":["../../../components/button_group/button_group_constants.js"],"sourcesContent":["export const BUTTON_GROUP_ALIGNMENT = {\n  start: 'd-btn-group--start',\n  end: 'd-btn-group--end',\n  'space-between': 'd-btn-group--space-between',\n};\n"],"names":[],"mappings":"AAAY,MAAC,yBAAyB;AAAA,EACpC,OAAO;AAAA,EACP,KAAK;AAAA,EACL,iBAAiB;AACnB;"}

package/dist/components/card/card.vue.cjs

@@ -0,0 +1,71 @@
+"use strict";
+const _pluginVue2_normalizer = require("../../_virtual/_plugin-vue2_normalizer.cjs");
+const _sfc_main = {
+  name: "DtCard",
+  props: {
+    /**
+     * The maximum height of the card content.
+     * If given, makes content area scrollable.
+     */
+    maxHeight: {
+      type: String,
+      default: null
+    },
+    /**
+     * class for card container.
+     */
+    containerClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * class for card content.
+     */
+    contentClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * class for card header.
+     */
+    headerClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * class for card footer.
+     */
+    footerClass: {
+      type: [String, Array, Object],
+      default: ""
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", { class: [
+    "d-card",
+    _vm.containerClass
+  ], attrs: { "data-qa": "dt-card" } }, [_vm.$slots.header ? _c("div", { class: [
+    "d-card__header",
+    _vm.headerClass
+  ] }, [_vm._t("header")], 2) : _vm._e(), _c("div", { class: [
+    "d-card__content",
+    _vm.contentClass
+  ], style: { "max-height": _vm.maxHeight } }, [_vm._t("content")], 2), _vm.$slots.footer ? _c("div", { class: [
+    "d-card__footer",
+    _vm.footerClass
+  ] }, [_vm._t("footer")], 2) : _vm._e()]);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ _pluginVue2_normalizer(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  null
+);
+const DtCard = __component__.exports;
+module.exports = DtCard;
+//# sourceMappingURL=card.vue.cjs.map

package/dist/components/card/card.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.vue.cjs","sources":["../../../components/card/card.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'd-card',\n      containerClass,\n    ]\"\n    data-qa=\"dt-card\"\n  >\n    <div\n      v-if=\"$slots.header\"\n      :class=\"[\n        'd-card__header',\n        headerClass,\n      ]\"\n    >\n      <!-- @slot slot for header content -->\n      <slot name=\"header\" />\n    </div>\n\n    <div\n      :class=\"[\n        'd-card__content',\n        contentClass,\n      ]\"\n      :style=\"{ 'max-height': maxHeight }\"\n    >\n      <!-- @slot slot for main content -->\n      <slot name=\"content\" />\n    </div>\n\n    <div\n      v-if=\"$slots.footer\"\n      :class=\"[\n        'd-card__footer',\n        footerClass,\n      ]\"\n    >\n      <!-- @slot slot for footer content -->\n      <slot name=\"footer\" />\n    </div>\n  </div>\n</template>\n\n<script>\n/**\n * A card contains summary content and actions about a single subject.\n * It can be used by itself or within a list, and is generally interactive.\n * @see https://dialtone.dialpad.com/components/card.html\n */\nexport default {\n  name: 'DtCard',\n  props: {\n    /**\n     * The maximum height of the card content.\n     * If given, makes content area scrollable.\n     */\n    maxHeight: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * class for card container.\n     */\n    containerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * class for card content.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * class for card header.\n     */\n    headerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * class for card footer.\n     */\n    footerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n};\n</script>\n"],"names":[],"mappings":";;AAiDA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/card/card.vue.js

@@ -0,0 +1,72 @@
+import normalizeComponent from "../../_virtual/_plugin-vue2_normalizer.js";
+const _sfc_main = {
+  name: "DtCard",
+  props: {
+    /**
+     * The maximum height of the card content.
+     * If given, makes content area scrollable.
+     */
+    maxHeight: {
+      type: String,
+      default: null
+    },
+    /**
+     * class for card container.
+     */
+    containerClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * class for card content.
+     */
+    contentClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * class for card header.
+     */
+    headerClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * class for card footer.
+     */
+    footerClass: {
+      type: [String, Array, Object],
+      default: ""
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", { class: [
+    "d-card",
+    _vm.containerClass
+  ], attrs: { "data-qa": "dt-card" } }, [_vm.$slots.header ? _c("div", { class: [
+    "d-card__header",
+    _vm.headerClass
+  ] }, [_vm._t("header")], 2) : _vm._e(), _c("div", { class: [
+    "d-card__content",
+    _vm.contentClass
+  ], style: { "max-height": _vm.maxHeight } }, [_vm._t("content")], 2), _vm.$slots.footer ? _c("div", { class: [
+    "d-card__footer",
+    _vm.footerClass
+  ] }, [_vm._t("footer")], 2) : _vm._e()]);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  null
+);
+const DtCard = __component__.exports;
+export {
+  DtCard as default
+};
+//# sourceMappingURL=card.vue.js.map

package/dist/components/card/card.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.vue.js","sources":["../../../components/card/card.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'd-card',\n      containerClass,\n    ]\"\n    data-qa=\"dt-card\"\n  >\n    <div\n      v-if=\"$slots.header\"\n      :class=\"[\n        'd-card__header',\n        headerClass,\n      ]\"\n    >\n      <!-- @slot slot for header content -->\n      <slot name=\"header\" />\n    </div>\n\n    <div\n      :class=\"[\n        'd-card__content',\n        contentClass,\n      ]\"\n      :style=\"{ 'max-height': maxHeight }\"\n    >\n      <!-- @slot slot for main content -->\n      <slot name=\"content\" />\n    </div>\n\n    <div\n      v-if=\"$slots.footer\"\n      :class=\"[\n        'd-card__footer',\n        footerClass,\n      ]\"\n    >\n      <!-- @slot slot for footer content -->\n      <slot name=\"footer\" />\n    </div>\n  </div>\n</template>\n\n<script>\n/**\n * A card contains summary content and actions about a single subject.\n * It can be used by itself or within a list, and is generally interactive.\n * @see https://dialtone.dialpad.com/components/card.html\n */\nexport default {\n  name: 'DtCard',\n  props: {\n    /**\n     * The maximum height of the card content.\n     * If given, makes content area scrollable.\n     */\n    maxHeight: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * class for card container.\n     */\n    containerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * class for card content.\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * class for card header.\n     */\n    headerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * class for card footer.\n     */\n    footerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n};\n</script>\n"],"names":[],"mappings":";AAiDA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,gBAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/checkbox/checkbox.vue.cjs

@@ -0,0 +1,117 @@
+"use strict";
+const input = require("../../common/mixins/input.cjs");
+const checkbox_constants = require("./checkbox_constants.cjs");
+const _pluginVue2_normalizer = require("../../_virtual/_plugin-vue2_normalizer.cjs");
+const validation_messages = require("../validation_messages/validation_messages.vue.cjs");
+const _sfc_main = {
+  name: "DtCheckbox",
+  components: { DtValidationMessages: validation_messages },
+  mixins: [input.InputMixin, input.CheckableMixin, input.GroupableMixin, input.MessagesMixin],
+  inheritAttrs: false,
+  emits: [
+    /**
+     * Native input event
+     *
+     * @event input
+     * @type {Boolean}
+     */
+    "input",
+    /**
+     * Native input focusin event
+     *
+     * @event focusin
+     * @type {FocusEvent}
+     */
+    "focusin",
+    /**
+     * Native input focusout event
+     *
+     * @event focusout
+     * @type {FocusEvent}
+     */
+    "focusout"
+  ],
+  computed: {
+    inputValidationClass() {
+      return checkbox_constants.CHECKBOX_INPUT_VALIDATION_CLASSES[this.internalValidationState];
+    },
+    checkboxGroupValueChecked() {
+      var _a, _b;
+      return ((_b = (_a = this.groupContext) == null ? void 0 : _a.selectedValues) == null ? void 0 : _b.includes(this.value)) ?? false;
+    },
+    hasLabel() {
+      return !!(this.$slots.default || this.label);
+    },
+    hasDescription() {
+      return !!(this.$slots.description || this.description);
+    },
+    hasLabelOrDescription() {
+      return this.hasLabel || this.hasDescription;
+    },
+    inputListeners() {
+      return {
+        /* TODO
+            Check if any usages of this component leverage $listeners and either remove if unused or scope the removal
+            and migration prior to upgrading to Vue 3.x
+        */
+        ...this.$listeners,
+        /*
+         * Override input listener to as no-op. Prevents parent input listeners from being passed through
+         * onto the input element which will result in the handler being called twice
+         * (once on the input element and once by the emitted input event by the change listener).
+        */
+        input: () => {
+        },
+        change: (event) => this.emitValue(event.target)
+      };
+    }
+  },
+  watch: {
+    checkboxGroupValueChecked: {
+      immediate: true,
+      handler(newCheckboxGroupValueChecked) {
+        if (this.hasGroup) {
+          this.internalChecked = newCheckboxGroupValueChecked;
+        }
+      }
+    }
+  },
+  mounted() {
+    this.runValidations();
+  },
+  methods: {
+    emitValue(target) {
+      let { value, checked } = target;
+      if (this.internalIndeterminate) {
+        checked = false;
+        this.internalIndeterminate = false;
+        target.checked = false;
+      }
+      this.setGroupValue(value, checked);
+      this.$emit("input", checked);
+    },
+    runValidations() {
+      this.validateInputLabels(this.hasLabel, this.$attrs["aria-label"]);
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", [_c("label", [_c("div", { class: ["d-checkbox-group", { "d-checkbox-group--disabled": _vm.internalDisabled }] }, [_c("div", { staticClass: "d-checkbox__input" }, [_c("input", _vm._g(_vm._b({ class: ["d-checkbox", _vm.inputValidationClass, _vm.inputClass], attrs: { "type": "checkbox", "name": _vm.internalName, "disabled": _vm.internalDisabled }, domProps: { "checked": _vm.internalChecked, "value": _vm.value, "indeterminate": _vm.internalIndeterminate } }, "input", _vm.$attrs, false), _vm.inputListeners))]), _vm.hasLabelOrDescription ? _c("div", { staticClass: "d-checkbox__copy d-checkbox__label", attrs: { "data-qa": "checkbox-label-description-container" } }, [_vm.hasLabel ? _c("div", _vm._b({ class: _vm.labelClass, attrs: { "data-qa": "checkbox-label" } }, "div", _vm.labelChildProps, false), [_vm._t("default", function() {
+    return [_vm._v(_vm._s(_vm.label))];
+  })], 2) : _vm._e(), _vm.hasDescription ? _c("div", _vm._b({ class: ["d-description", _vm.descriptionClass], attrs: { "data-qa": "checkbox-description" } }, "div", _vm.descriptionChildProps, false), [_vm._t("description", function() {
+    return [_vm._v(_vm._s(_vm.description))];
+  })], 2) : _vm._e(), _c("dt-validation-messages", _vm._b({ class: _vm.messagesClass, attrs: { "validation-messages": _vm.formattedMessages, "show-messages": _vm.showMessages, "data-qa": "dt-checkbox-validation-messages" } }, "dt-validation-messages", _vm.messagesChildProps, false))], 1) : _vm._e()])])]);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ _pluginVue2_normalizer(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  null
+);
+const checkbox = __component__.exports;
+module.exports = checkbox;
+//# sourceMappingURL=checkbox.vue.cjs.map

package/dist/components/checkbox/checkbox.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.vue.cjs","sources":["../../../components/checkbox/checkbox.vue"],"sourcesContent":["<template>\n  <div>\n    <label>\n      <div :class=\"['d-checkbox-group', { 'd-checkbox-group--disabled': internalDisabled }]\">\n        <div class=\"d-checkbox__input\">\n          <input\n            type=\"checkbox\"\n            :checked=\"internalChecked\"\n            :name=\"internalName\"\n            :value=\"value\"\n            :disabled=\"internalDisabled\"\n            :class=\"['d-checkbox', inputValidationClass, inputClass]\"\n            v-bind=\"$attrs\"\n            :indeterminate.prop=\"internalIndeterminate\"\n            v-on=\"inputListeners\"\n          >\n        </div>\n        <div\n          v-if=\"hasLabelOrDescription\"\n          class=\"d-checkbox__copy d-checkbox__label\"\n          data-qa=\"checkbox-label-description-container\"\n        >\n          <div\n            v-if=\"hasLabel\"\n            :class=\"labelClass\"\n            v-bind=\"labelChildProps\"\n            data-qa=\"checkbox-label\"\n          >\n            <!-- @slot slot for Checkbox Label -->\n            <slot>{{ label }}</slot>\n          </div>\n          <div\n            v-if=\"hasDescription\"\n            :class=\"['d-description', descriptionClass]\"\n            v-bind=\"descriptionChildProps\"\n            data-qa=\"checkbox-description\"\n          >\n            <!-- @slot slot for Checkbox Description -->\n            <slot name=\"description\">{{ description }}</slot>\n          </div>\n          <dt-validation-messages\n            :validation-messages=\"formattedMessages\"\n            :show-messages=\"showMessages\"\n            :class=\"messagesClass\"\n            v-bind=\"messagesChildProps\"\n            data-qa=\"dt-checkbox-validation-messages\"\n          />\n        </div>\n      </div>\n    </label>\n  </div>\n</template>\n\n<script>\n// Imports\nimport {\n  InputMixin,\n  CheckableMixin,\n  GroupableMixin,\n  MessagesMixin,\n} from '@/common/mixins/input';\nimport { CHECKBOX_INPUT_VALIDATION_CLASSES } from './checkbox_constants';\nimport { DtValidationMessages } from '../validation_messages';\n\n/**\n * Checkboxes are control elements that allow the user to make a selection.They are typically used in a\n * Checkbox Group which allows the user to make one or more selections from a list of options.\n * @see https://dialtone.dialpad.com/components/checkbox.html\n */\nexport default {\n  name: 'DtCheckbox',\n\n  components: { DtValidationMessages },\n\n  mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],\n\n  inheritAttrs: false,\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {Boolean}\n     */\n    'input',\n\n    /**\n     * Native input focusin event\n     *\n     * @event focusin\n     * @type {FocusEvent}\n     */\n    'focusin',\n\n    /**\n     * Native input focusout event\n     *\n     * @event focusout\n     * @type {FocusEvent}\n     */\n    'focusout',\n  ],\n\n  computed: {\n    inputValidationClass () {\n      return CHECKBOX_INPUT_VALIDATION_CLASSES[this.internalValidationState];\n    },\n\n    checkboxGroupValueChecked () {\n      return this.groupContext?.selectedValues?.includes(this.value) ?? false;\n    },\n\n    hasLabel () {\n      return !!(this.$slots.default || this.label);\n    },\n\n    hasDescription () {\n      return !!(this.$slots.description || this.description);\n    },\n\n    hasLabelOrDescription () {\n      return this.hasLabel || this.hasDescription;\n    },\n\n    inputListeners () {\n      return {\n        /* TODO\n            Check if any usages of this component leverage $listeners and either remove if unused or scope the removal\n            and migration prior to upgrading to Vue 3.x\n        */\n        ...this.$listeners,\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through\n         * onto the input element which will result in the handler being called twice\n         * (once on the input element and once by the emitted input event by the change listener).\n        */\n        input: () => {},\n        change: event => this.emitValue(event.target),\n      };\n    },\n  },\n\n  watch: {\n    checkboxGroupValueChecked: {\n      immediate: true,\n      handler (newCheckboxGroupValueChecked) {\n        if (this.hasGroup) {\n          // update internal value when the checkbox group value changes\n          this.internalChecked = newCheckboxGroupValueChecked;\n        }\n      },\n    },\n  },\n\n  mounted () {\n    this.runValidations();\n  },\n\n  methods: {\n    emitValue (target) {\n      let { value, checked } = target;\n      // Expected: Indeterminate -> unchecked. We need to manually set DOM property `checked` to false\n      // and update this.internalIndeterminate.\n      if (this.internalIndeterminate) {\n        checked = false;\n        this.internalIndeterminate = false;\n        target.checked = false;\n      }\n      // update provided value if injected\n      this.setGroupValue(value, checked);\n\n      // emit the state of the checkbox\n      this.$emit('input', checked);\n    },\n\n    runValidations () {\n      this.validateInputLabels(this.hasLabel, this.$attrs['aria-label']);\n    },\n  },\n};\n</script>\n"],"names":["DtValidationMessages","InputMixin","CheckableMixin","GroupableMixin","MessagesMixin","CHECKBOX_INPUT_VALIDATION_CLASSES"],"mappings":";;;;;AAqEA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA,EAAAA,sBAAAA,oBAAA;AAAA,EAEA,QAAA,CAAAC,MAAA,YAAAC,sBAAAC,MAAAA,gBAAAC,MAAAA,aAAA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,uBAAA;AACA,aAAAC,mBAAA,kCAAA,KAAA,uBAAA;AAAA,IACA;AAAA,IAEA,4BAAA;;AACA,eAAA,gBAAA,iBAAA,mBAAA,mBAAA,mBAAA,SAAA,KAAA,WAAA;AAAA,IACA;AAAA,IAEA,WAAA;AACA,aAAA,CAAA,EAAA,KAAA,OAAA,WAAA,KAAA;AAAA,IACA;AAAA,IAEA,iBAAA;AACA,aAAA,CAAA,EAAA,KAAA,OAAA,eAAA,KAAA;AAAA,IACA;AAAA,IAEA,wBAAA;AACA,aAAA,KAAA,YAAA,KAAA;AAAA,IACA;AAAA,IAEA,iBAAA;AACA,aAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAKA,GAAA,KAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMA,OAAA,MAAA;AAAA,QAAA;AAAA,QACA,QAAA,WAAA,KAAA,UAAA,MAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,2BAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAA,8BAAA;AACA,YAAA,KAAA,UAAA;AAEA,eAAA,kBAAA;AAAA,QACA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,SAAA,eAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,UAAA,QAAA;AACA,UAAA,EAAA,OAAA,QAAA,IAAA;AAGA,UAAA,KAAA,uBAAA;AACA,kBAAA;AACA,aAAA,wBAAA;AACA,eAAA,UAAA;AAAA,MACA;AAEA,WAAA,cAAA,OAAA,OAAA;AAGA,WAAA,MAAA,SAAA,OAAA;AAAA,IACA;AAAA,IAEA,iBAAA;AACA,WAAA,oBAAA,KAAA,UAAA,KAAA,OAAA,YAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/checkbox/checkbox.vue.js

@@ -0,0 +1,118 @@
+import { InputMixin, CheckableMixin, GroupableMixin, MessagesMixin } from "../../common/mixins/input.js";
+import { CHECKBOX_INPUT_VALIDATION_CLASSES } from "./checkbox_constants.js";
+import normalizeComponent from "../../_virtual/_plugin-vue2_normalizer.js";
+import DtValidationMessages from "../validation_messages/validation_messages.vue.js";
+const _sfc_main = {
+  name: "DtCheckbox",
+  components: { DtValidationMessages },
+  mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],
+  inheritAttrs: false,
+  emits: [
+    /**
+     * Native input event
+     *
+     * @event input
+     * @type {Boolean}
+     */
+    "input",
+    /**
+     * Native input focusin event
+     *
+     * @event focusin
+     * @type {FocusEvent}
+     */
+    "focusin",
+    /**
+     * Native input focusout event
+     *
+     * @event focusout
+     * @type {FocusEvent}
+     */
+    "focusout"
+  ],
+  computed: {
+    inputValidationClass() {
+      return CHECKBOX_INPUT_VALIDATION_CLASSES[this.internalValidationState];
+    },
+    checkboxGroupValueChecked() {
+      var _a, _b;
+      return ((_b = (_a = this.groupContext) == null ? void 0 : _a.selectedValues) == null ? void 0 : _b.includes(this.value)) ?? false;
+    },
+    hasLabel() {
+      return !!(this.$slots.default || this.label);
+    },
+    hasDescription() {
+      return !!(this.$slots.description || this.description);
+    },
+    hasLabelOrDescription() {
+      return this.hasLabel || this.hasDescription;
+    },
+    inputListeners() {
+      return {
+        /* TODO
+            Check if any usages of this component leverage $listeners and either remove if unused or scope the removal
+            and migration prior to upgrading to Vue 3.x
+        */
+        ...this.$listeners,
+        /*
+         * Override input listener to as no-op. Prevents parent input listeners from being passed through
+         * onto the input element which will result in the handler being called twice
+         * (once on the input element and once by the emitted input event by the change listener).
+        */
+        input: () => {
+        },
+        change: (event) => this.emitValue(event.target)
+      };
+    }
+  },
+  watch: {
+    checkboxGroupValueChecked: {
+      immediate: true,
+      handler(newCheckboxGroupValueChecked) {
+        if (this.hasGroup) {
+          this.internalChecked = newCheckboxGroupValueChecked;
+        }
+      }
+    }
+  },
+  mounted() {
+    this.runValidations();
+  },
+  methods: {
+    emitValue(target) {
+      let { value, checked } = target;
+      if (this.internalIndeterminate) {
+        checked = false;
+        this.internalIndeterminate = false;
+        target.checked = false;
+      }
+      this.setGroupValue(value, checked);
+      this.$emit("input", checked);
+    },
+    runValidations() {
+      this.validateInputLabels(this.hasLabel, this.$attrs["aria-label"]);
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", [_c("label", [_c("div", { class: ["d-checkbox-group", { "d-checkbox-group--disabled": _vm.internalDisabled }] }, [_c("div", { staticClass: "d-checkbox__input" }, [_c("input", _vm._g(_vm._b({ class: ["d-checkbox", _vm.inputValidationClass, _vm.inputClass], attrs: { "type": "checkbox", "name": _vm.internalName, "disabled": _vm.internalDisabled }, domProps: { "checked": _vm.internalChecked, "value": _vm.value, "indeterminate": _vm.internalIndeterminate } }, "input", _vm.$attrs, false), _vm.inputListeners))]), _vm.hasLabelOrDescription ? _c("div", { staticClass: "d-checkbox__copy d-checkbox__label", attrs: { "data-qa": "checkbox-label-description-container" } }, [_vm.hasLabel ? _c("div", _vm._b({ class: _vm.labelClass, attrs: { "data-qa": "checkbox-label" } }, "div", _vm.labelChildProps, false), [_vm._t("default", function() {
+    return [_vm._v(_vm._s(_vm.label))];
+  })], 2) : _vm._e(), _vm.hasDescription ? _c("div", _vm._b({ class: ["d-description", _vm.descriptionClass], attrs: { "data-qa": "checkbox-description" } }, "div", _vm.descriptionChildProps, false), [_vm._t("description", function() {
+    return [_vm._v(_vm._s(_vm.description))];
+  })], 2) : _vm._e(), _c("dt-validation-messages", _vm._b({ class: _vm.messagesClass, attrs: { "validation-messages": _vm.formattedMessages, "show-messages": _vm.showMessages, "data-qa": "dt-checkbox-validation-messages" } }, "dt-validation-messages", _vm.messagesChildProps, false))], 1) : _vm._e()])])]);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  null
+);
+const checkbox = __component__.exports;
+export {
+  checkbox as default
+};
+//# sourceMappingURL=checkbox.vue.js.map

package/dist/components/checkbox/checkbox.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.vue.js","sources":["../../../components/checkbox/checkbox.vue"],"sourcesContent":["<template>\n  <div>\n    <label>\n      <div :class=\"['d-checkbox-group', { 'd-checkbox-group--disabled': internalDisabled }]\">\n        <div class=\"d-checkbox__input\">\n          <input\n            type=\"checkbox\"\n            :checked=\"internalChecked\"\n            :name=\"internalName\"\n            :value=\"value\"\n            :disabled=\"internalDisabled\"\n            :class=\"['d-checkbox', inputValidationClass, inputClass]\"\n            v-bind=\"$attrs\"\n            :indeterminate.prop=\"internalIndeterminate\"\n            v-on=\"inputListeners\"\n          >\n        </div>\n        <div\n          v-if=\"hasLabelOrDescription\"\n          class=\"d-checkbox__copy d-checkbox__label\"\n          data-qa=\"checkbox-label-description-container\"\n        >\n          <div\n            v-if=\"hasLabel\"\n            :class=\"labelClass\"\n            v-bind=\"labelChildProps\"\n            data-qa=\"checkbox-label\"\n          >\n            <!-- @slot slot for Checkbox Label -->\n            <slot>{{ label }}</slot>\n          </div>\n          <div\n            v-if=\"hasDescription\"\n            :class=\"['d-description', descriptionClass]\"\n            v-bind=\"descriptionChildProps\"\n            data-qa=\"checkbox-description\"\n          >\n            <!-- @slot slot for Checkbox Description -->\n            <slot name=\"description\">{{ description }}</slot>\n          </div>\n          <dt-validation-messages\n            :validation-messages=\"formattedMessages\"\n            :show-messages=\"showMessages\"\n            :class=\"messagesClass\"\n            v-bind=\"messagesChildProps\"\n            data-qa=\"dt-checkbox-validation-messages\"\n          />\n        </div>\n      </div>\n    </label>\n  </div>\n</template>\n\n<script>\n// Imports\nimport {\n  InputMixin,\n  CheckableMixin,\n  GroupableMixin,\n  MessagesMixin,\n} from '@/common/mixins/input';\nimport { CHECKBOX_INPUT_VALIDATION_CLASSES } from './checkbox_constants';\nimport { DtValidationMessages } from '../validation_messages';\n\n/**\n * Checkboxes are control elements that allow the user to make a selection.They are typically used in a\n * Checkbox Group which allows the user to make one or more selections from a list of options.\n * @see https://dialtone.dialpad.com/components/checkbox.html\n */\nexport default {\n  name: 'DtCheckbox',\n\n  components: { DtValidationMessages },\n\n  mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],\n\n  inheritAttrs: false,\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {Boolean}\n     */\n    'input',\n\n    /**\n     * Native input focusin event\n     *\n     * @event focusin\n     * @type {FocusEvent}\n     */\n    'focusin',\n\n    /**\n     * Native input focusout event\n     *\n     * @event focusout\n     * @type {FocusEvent}\n     */\n    'focusout',\n  ],\n\n  computed: {\n    inputValidationClass () {\n      return CHECKBOX_INPUT_VALIDATION_CLASSES[this.internalValidationState];\n    },\n\n    checkboxGroupValueChecked () {\n      return this.groupContext?.selectedValues?.includes(this.value) ?? false;\n    },\n\n    hasLabel () {\n      return !!(this.$slots.default || this.label);\n    },\n\n    hasDescription () {\n      return !!(this.$slots.description || this.description);\n    },\n\n    hasLabelOrDescription () {\n      return this.hasLabel || this.hasDescription;\n    },\n\n    inputListeners () {\n      return {\n        /* TODO\n            Check if any usages of this component leverage $listeners and either remove if unused or scope the removal\n            and migration prior to upgrading to Vue 3.x\n        */\n        ...this.$listeners,\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through\n         * onto the input element which will result in the handler being called twice\n         * (once on the input element and once by the emitted input event by the change listener).\n        */\n        input: () => {},\n        change: event => this.emitValue(event.target),\n      };\n    },\n  },\n\n  watch: {\n    checkboxGroupValueChecked: {\n      immediate: true,\n      handler (newCheckboxGroupValueChecked) {\n        if (this.hasGroup) {\n          // update internal value when the checkbox group value changes\n          this.internalChecked = newCheckboxGroupValueChecked;\n        }\n      },\n    },\n  },\n\n  mounted () {\n    this.runValidations();\n  },\n\n  methods: {\n    emitValue (target) {\n      let { value, checked } = target;\n      // Expected: Indeterminate -> unchecked. We need to manually set DOM property `checked` to false\n      // and update this.internalIndeterminate.\n      if (this.internalIndeterminate) {\n        checked = false;\n        this.internalIndeterminate = false;\n        target.checked = false;\n      }\n      // update provided value if injected\n      this.setGroupValue(value, checked);\n\n      // emit the state of the checkbox\n      this.$emit('input', checked);\n    },\n\n    runValidations () {\n      this.validateInputLabels(this.hasLabel, this.$attrs['aria-label']);\n    },\n  },\n};\n</script>\n"],"names":[],"mappings":";;;;AAqEA,MAAA,YAAA;AAAA,EACA,MAAA;AAAA,EAEA,YAAA,EAAA,qBAAA;AAAA,EAEA,QAAA,CAAA,YAAA,gBAAA,gBAAA,aAAA;AAAA,EAEA,cAAA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,uBAAA;AACA,aAAA,kCAAA,KAAA,uBAAA;AAAA,IACA;AAAA,IAEA,4BAAA;;AACA,eAAA,gBAAA,iBAAA,mBAAA,mBAAA,mBAAA,SAAA,KAAA,WAAA;AAAA,IACA;AAAA,IAEA,WAAA;AACA,aAAA,CAAA,EAAA,KAAA,OAAA,WAAA,KAAA;AAAA,IACA;AAAA,IAEA,iBAAA;AACA,aAAA,CAAA,EAAA,KAAA,OAAA,eAAA,KAAA;AAAA,IACA;AAAA,IAEA,wBAAA;AACA,aAAA,KAAA,YAAA,KAAA;AAAA,IACA;AAAA,IAEA,iBAAA;AACA,aAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAKA,GAAA,KAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAMA,OAAA,MAAA;AAAA,QAAA;AAAA,QACA,QAAA,WAAA,KAAA,UAAA,MAAA,MAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,2BAAA;AAAA,MACA,WAAA;AAAA,MACA,QAAA,8BAAA;AACA,YAAA,KAAA,UAAA;AAEA,eAAA,kBAAA;AAAA,QACA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AACA,SAAA,eAAA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,UAAA,QAAA;AACA,UAAA,EAAA,OAAA,QAAA,IAAA;AAGA,UAAA,KAAA,uBAAA;AACA,kBAAA;AACA,aAAA,wBAAA;AACA,eAAA,UAAA;AAAA,MACA;AAEA,WAAA,cAAA,OAAA,OAAA;AAGA,WAAA,MAAA,SAAA,OAAA;AAAA,IACA;AAAA,IAEA,iBAAA;AACA,WAAA,oBAAA,KAAA,UAAA,KAAA,OAAA,YAAA,CAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;"}

package/dist/components/checkbox/checkbox_constants.cjs

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const CHECKBOX_INPUT_VALIDATION_CLASSES = {
+  error: "d-checkbox--error",
+  warning: "d-checkbox--warning",
+  success: "d-checkbox--success"
+};
+exports.CHECKBOX_INPUT_VALIDATION_CLASSES = CHECKBOX_INPUT_VALIDATION_CLASSES;
+//# sourceMappingURL=checkbox_constants.cjs.map