@dialpad/dialtone-vue 3.220.0-next.4 → 3.220.0

package/dist/lib/keyboard-shortcut/keyboard-shortcut.js

@@ -1,17 +1,16 @@
 import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
-import t from "../text/text.js";
-import { Fragment as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, normalizeClass as s, openBlock as c, renderList as l, resolveComponent as u, resolveDynamicComponent as d, toDisplayString as f, withCtx as p } from "vue";
-import { DtIconArrowDown as m, DtIconArrowLeft as h, DtIconArrowRight as g, DtIconArrowUp as _, DtIconCommand as v, DtIconLayoutGrid as y, DtIconOption as b, DtIconPlus as x } from "@dialpad/dialtone-icons/vue";
+import { Fragment as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, normalizeClass as o, openBlock as s, renderList as c, resolveDynamicComponent as l, toDisplayString as u } from "vue";
+import { DtIconArrowDown as d, DtIconArrowLeft as f, DtIconArrowRight as p, DtIconArrowUp as m, DtIconCommand as h, DtIconLayoutGrid as g, DtIconOption as _, DtIconPlus as v } from "@dialpad/dialtone-icons/vue3";
 //#region components/keyboard_shortcut/keyboard_shortcut.vue
-var S = {
-	"{win}": y,
-	"{arrow-right}": g,
-	"{arrow-left}": h,
-	"{arrow-up}": _,
-	"{arrow-down}": m,
-	"{cmd}": v,
-	"{opt}": b
-}, C = {
+var y = {
+	"{win}": g,
+	"{arrow-right}": p,
+	"{arrow-left}": f,
+	"{arrow-up}": m,
+	"{arrow-down}": d,
+	"{cmd}": h,
+	"{opt}": _
+}, b = {
 	"{cmd}": "Command",
 	"{opt}": "Option",
 	"{win}": "Windows",
@@ -20,7 +19,7 @@ var S = {
 	"{arrow-up}": "Up Arrow",
 	"{arrow-down}": "Down Arrow",
 	"{plus}": "plus"
-}, w = {
+}, x = {
 	ctrl: "Control",
 	alt: "Alt",
 	esc: "Escape",
@@ -30,19 +29,18 @@ var S = {
 	pgdn: "Page Down",
 	num: "Number",
 	caps: "Caps Lock"
-}, T = {
+}, S = {
 	compatConfig: { MODE: 3 },
 	name: "DtKeyboardShortcut",
 	components: {
-		DtIconLayoutGrid: y,
-		DtIconArrowRight: g,
-		DtIconArrowLeft: h,
-		DtIconArrowUp: _,
-		DtIconArrowDown: m,
-		DtIconCommand: v,
-		DtIconOption: b,
-		DtIconPlus: x,
-		DtText: t
+		DtIconLayoutGrid: g,
+		DtIconArrowRight: p,
+		DtIconArrowLeft: f,
+		DtIconArrowUp: m,
+		DtIconArrowDown: d,
+		DtIconCommand: h,
+		DtIconOption: _,
+		DtIconPlus: v
 	},
 	props: {
 		inverted: {
@@ -64,15 +62,15 @@ var S = {
 	computed: {
 		icons() {
 			return {
-				...S,
-				"{plus}": x
+				...y,
+				"{plus}": v
 			};
 		},
 		shortcutWithSeparator() {
 			return this.shortcut.replace(this.separator, "{plus}");
 		},
 		formattedShortcut() {
-			return Object.keys(S).reduce((e, t) => e.replace(RegExp("{" + t + "}", "gi"), S[t]), this.shortcutWithSeparator);
+			return Object.keys(y).reduce((e, t) => e.replace(RegExp("{" + t + "}", "gi"), y[t]), this.shortcutWithSeparator);
 		},
 		formattedShortcutSplit() {
 			let e = Object.keys(this.icons).join("|"), t = RegExp(`(${e})`, "gi");
@@ -81,36 +79,28 @@ var S = {
 		generatedScreenReaderText() {
 			return this.formattedShortcutSplit.map((e) => {
 				let t = e.trim();
-				if (C[t]) return C[t];
+				if (b[t]) return b[t];
 				let n = t.toLowerCase();
-				return w[n] ? w[n] : t;
+				return x[n] ? x[n] : t;
 			}).filter((e) => e).join(" ");
 		}
 	}
-}, E = { class: "d-keyboard-shortcut--sr-only" }, D = ["innerHTML"];
-function O(e, t, m, h, g, _) {
-	let v = u("dt-text");
-	return c(), a("kbd", { class: s(["d-keyboard-shortcut", { "d-keyboard-shortcut--inverted": m.inverted }]) }, [o("span", E, f(m.screenReaderText || _.generatedScreenReaderText), 1), (c(!0), a(n, null, l(_.formattedShortcutSplit, (e, t) => (c(), a(n, null, [_.icons[e] ? (c(), r(d(_.icons[e]), {
-		key: `icon-${t}-${e}`,
+}, C = { class: "d-keyboard-shortcut--sr-only" }, w = ["innerHTML"];
+function T(e, d, f, p, m, h) {
+	return s(), i("kbd", { class: o(["d-keyboard-shortcut", { "d-keyboard-shortcut--inverted": f.inverted }]) }, [a("span", C, u(f.screenReaderText || h.generatedScreenReaderText), 1), (s(!0), i(t, null, c(h.formattedShortcutSplit, (e, a) => (s(), i(t, null, [h.icons[e] ? (s(), n(l(h.icons[e]), {
+		key: `icon-${a}-${e}`,
 		size: "100",
 		"aria-hidden": "true",
-		class: s(["d-keyboard-shortcut__icon", { "d-keyboard-shortcut__icon--inverted": m.inverted }])
-	}, null, 8, ["class"])) : e.trim() ? (c(), r(v, {
-		key: `text-${t}-${e}`,
-		kind: "body",
-		size: 200,
-		numeric: "",
-		density: 400,
-		tone: "tertiary",
+		class: o(["d-keyboard-shortcut__icon", { "d-keyboard-shortcut__icon--inverted": f.inverted }])
+	}, null, 8, ["class"])) : e.trim() ? (s(), i("span", {
+		key: `text-${a}-${e}`,
 		"aria-hidden": "true",
-		class: s(["d-keyboard-shortcut__item", { "d-keyboard-shortcut__item--inverted": m.inverted }])
-	}, {
-		default: p(() => [o("span", { innerHTML: e }, null, 8, D)]),
-		_: 2
-	}, 1032, ["class"])) : i("", !0)], 64))), 256))], 2);
+		class: o(["d-keyboard-shortcut__item", { "d-keyboard-shortcut__item--inverted": f.inverted }]),
+		innerHTML: e
+	}, null, 10, w)) : r("", !0)], 64))), 256))], 2);
 }
-var k = /* @__PURE__ */ e(T, [["render", O]]);
+var E = /* @__PURE__ */ e(S, [["render", T]]);
 //#endregion
-export { k as default };
+export { E as default };
 
 //# sourceMappingURL=keyboard-shortcut.js.map

package/dist/lib/keyboard-shortcut/keyboard-shortcut.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.js","names":[],"sources":["../../../components/keyboard_shortcut/keyboard_shortcut.vue"],"sourcesContent":["<template>\n  <kbd\n    :class=\"[\n      'd-keyboard-shortcut',\n      { 'd-keyboard-shortcut--inverted': inverted },\n    ]\"\n  >\n    <span class=\"d-keyboard-shortcut--sr-only\">\n      {{ screenReaderText || generatedScreenReaderText }}\n    </span>\n    <template\n      v-for=\"(item, i) in formattedShortcutSplit\"\n    >\n      <component\n        :is=\"icons[item]\"\n        v-if=\"icons[item]\"\n        :key=\"`icon-${i}-${item}`\"\n        size=\"100\"\n        aria-hidden=\"true\"\n        :class=\"[\n          'd-keyboard-shortcut__icon',\n          { 'd-keyboard-shortcut__icon--inverted': inverted },\n        ]\"\n      />\n      <dt-text\n        v-else-if=\"item.trim()\"\n        :key=\"`text-${i}-${item}`\"\n        kind=\"body\"\n        :size=\"200\"\n        numeric\n        :density=\"400\"\n        tone=\"tertiary\"\n        aria-hidden=\"true\"\n        :class=\"[\n          'd-keyboard-shortcut__item',\n          { 'd-keyboard-shortcut__item--inverted': inverted },\n        ]\"\n      >\n        <!-- eslint-disable-next-line vue/no-v-html -->\n        <span v-html=\"item\" />\n      </dt-text>\n    </template>\n  </kbd>\n</template>\n\n<script>\nimport {\n  DtIconLayoutGrid,\n  DtIconArrowRight,\n  DtIconArrowLeft,\n  DtIconArrowUp,\n  DtIconArrowDown,\n  DtIconCommand,\n  DtIconOption,\n  DtIconPlus,\n} from '@dialpad/dialtone-icons/vue';\nimport { DtText } from '@/components/text';\n\nconst SHORTCUTS_ICON_ALIASES = {\n  '{win}': DtIconLayoutGrid,\n  '{arrow-right}': DtIconArrowRight,\n  '{arrow-left}': DtIconArrowLeft,\n  '{arrow-up}': DtIconArrowUp,\n  '{arrow-down}': DtIconArrowDown,\n  '{cmd}': DtIconCommand,\n  '{opt}': DtIconOption,\n};\n\n// Mapping of icon aliases to readable text for accessibility\nconst ICON_ALIAS_TO_TEXT = {\n  '{cmd}': 'Command',\n  '{opt}': 'Option',\n  '{win}': 'Windows',\n  '{arrow-right}': 'Right Arrow',\n  '{arrow-left}': 'Left Arrow',\n  '{arrow-up}': 'Up Arrow',\n  '{arrow-down}': 'Down Arrow',\n  '{plus}': 'plus',\n};\n\n// Mapping of common key abbreviations to full names for accessibility\nconst KEY_ABBREVIATIONS = {\n  'ctrl': 'Control',\n  'alt': 'Alt',\n  'esc': 'Escape',\n  'del': 'Delete',\n  'ins': 'Insert',\n  'pgup': 'Page Up',\n  'pgdn': 'Page Down',\n  'num': 'Number',\n  'caps': 'Caps Lock',\n};\n\n/**\n * This component displays a visual representation of a keyboard shortcut to the user.\n * @see https://dialtone.dialpad.com/components/keyboard_shortcut.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtKeyboardShortcut',\n\n  components: {\n    DtIconLayoutGrid,\n    DtIconArrowRight,\n    DtIconArrowLeft,\n    DtIconArrowUp,\n    DtIconArrowDown,\n    DtIconCommand,\n    DtIconOption,\n    DtIconPlus,\n    DtText,\n  },\n\n  props: {\n    /**\n     * @deprecated Use v-dt-mode instead.\n     * If true, applies inverted styles.\n     * @values true, false\n     * @deprecated Use v-dt-mode directive instead.\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Include any of these tokens in your string to render the corresponding symbol:\n     * {cmd} {opt} {win} {arrow-right} {arrow-left} {arrow-up} {arrow-down}\n     */\n    shortcut: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Optional text to override the auto-generated accessible text for assistive technology.\n     * If not provided, accessible text will be automatically generated from the shortcut.\n     */\n    screenReaderText: {\n      type: String,\n      default: null,\n    },\n  },\n\n  data () {\n    return {\n      separator: /\\+/gi,\n    };\n  },\n\n  computed: {\n    icons () {\n      return {\n        ...SHORTCUTS_ICON_ALIASES,\n        '{plus}': DtIconPlus,\n      };\n    },\n\n    shortcutWithSeparator () {\n      return this.shortcut.replace(this.separator, '{plus}');\n    },\n\n    formattedShortcut () {\n      return Object.keys(SHORTCUTS_ICON_ALIASES).reduce((result, key) => {\n        return result.replace(new RegExp('{' + key + '}', 'gi'), SHORTCUTS_ICON_ALIASES[key]);\n      }, this.shortcutWithSeparator);\n    },\n\n    // Splits any icon based aliases into their own array items.\n    formattedShortcutSplit () {\n      const iconAliasString = Object.keys(this.icons).join('|');\n\n      /*\n         The regexp splits a given string with icon alias and is filtered by empty strings after:\n         if {win} is our delimiter AKA shortcut icon alias\n         '{win} + D K + {win}' returned value will be [{win}, ' ', '{plus}', ' D K ', '{plus}', ' ', {win}]\n      */\n      const regex = new RegExp(`(${iconAliasString})`, 'gi');\n      return this.formattedShortcut.split(regex).filter(Boolean);\n    },\n\n    // Generates accessible text for the keyboard shortcut\n    generatedScreenReaderText () {\n      return this.formattedShortcutSplit\n        .map(item => {\n          const trimmedItem = item.trim();\n\n          // Convert icon aliases to readable text\n          if (ICON_ALIAS_TO_TEXT[trimmedItem]) {\n            return ICON_ALIAS_TO_TEXT[trimmedItem];\n          }\n\n          // Convert key abbreviations to full names (case-insensitive)\n          const lowerItem = trimmedItem.toLowerCase();\n          if (KEY_ABBREVIATIONS[lowerItem]) {\n            return KEY_ABBREVIATIONS[lowerItem];\n          }\n\n          // Return the key as-is if it's not an alias or abbreviation\n          return trimmedItem;\n        })\n        .filter(item => item) // Remove empty strings\n        .join(' ');\n    },\n  },\n};\n</script>\n"],"mappings":";;;;;AA0DA,IAAM,IAAyB;CAC7B,SAAS;CACT,iBAAiB;CACjB,gBAAgB;CAChB,cAAc;CACd,gBAAgB;CAChB,SAAS;CACT,SAAS;CACV,EAGK,IAAqB;CACzB,SAAS;CACT,SAAS;CACT,SAAS;CACT,iBAAiB;CACjB,gBAAgB;CAChB,cAAc;CACd,gBAAgB;CAChB,UAAU;CACX,EAGK,IAAoB;CACxB,MAAQ;CACR,KAAO;CACP,KAAO;CACP,KAAO;CACP,KAAO;CACP,MAAQ;CACR,MAAQ;CACR,KAAO;CACP,MAAQ;CACT,EAMI,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,YAAY;EACV;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,QAAA;EACD;CAED,OAAO;EAOL,UAAU;GACR,MAAM;GACN,SAAS;GACV;EAMD,UAAU;GACR,MAAM;GACN,UAAU;GACX;EAMD,kBAAkB;GAChB,MAAM;GACN,SAAS;GACV;EACF;CAED,OAAQ;AACN,SAAO,EACL,WAAW,QACZ;;CAGH,UAAU;EACR,QAAS;AACP,UAAO;IACL,GAAG;IACH,UAAU;IACX;;EAGH,wBAAyB;AACvB,UAAO,KAAK,SAAS,QAAQ,KAAK,WAAW,SAAS;;EAGxD,oBAAqB;AACnB,UAAO,OAAO,KAAK,EAAuB,CAAC,QAAQ,GAAQ,MAClD,EAAO,QAAY,OAAO,MAAM,IAAM,KAAK,KAAK,EAAE,EAAuB,GAAK,EACpF,KAAK,sBAAsB;;EAIhC,yBAA0B;GACxB,IAAM,IAAkB,OAAO,KAAK,KAAK,MAAM,CAAC,KAAK,IAAI,EAOnD,IAAY,OAAO,IAAI,EAAgB,IAAI,KAAK;AACtD,UAAO,KAAK,kBAAkB,MAAM,EAAM,CAAC,OAAO,QAAQ;;EAI5D,4BAA6B;AAC3B,UAAO,KAAK,uBACT,KAAI,MAAQ;IACX,IAAM,IAAc,EAAK,MAAM;AAG/B,QAAI,EAAmB,GACrB,QAAO,EAAmB;IAI5B,IAAM,IAAY,EAAY,aAAa;AAM3C,WALI,EAAkB,KACb,EAAkB,KAIpB;KACR,CACA,QAAO,MAAQ,EAAI,CACnB,KAAK,IAAI;;EAEf;CACF,QAtMS,OAAM,gCAA8B;;;aAN5C,EAyCM,OAAA,EAxCH,OAAK,EAAA,CAAA,uBAAA,EAAA,iCAA0E,EAAA,UAAQ,CAAA,CAAA,EAAA,EAAA,CAKxF,EAEO,QAFP,GAEO,EADF,EAAA,oBAAoB,EAAA,0BAAyB,EAAA,EAAA,GAAA,EAAA,GAAA,EAElD,EA+BW,GAAA,MAAA,EA9BW,EAAA,yBAAZ,GAAM,wBAIN,EAAA,MAAM,MAAA,GAAA,EAFd,EAUE,EATK,EAAA,MAAM,GAAI,EAAA;EAEd,KAAG,QAAU,EAAC,GAAI;EACnB,MAAK;EACL,eAAY;EACX,OAAK,EAAA,CAAA,6BAAA,EAAA,uCAA8F,EAAA,UAAQ,CAAA,CAAA;2BAMjG,EAAK,MAAI,IAAA,GAAA,EADtB,EAgBU,GAAA;EAdP,KAAG,QAAU,EAAC,GAAI;EACnB,MAAK;EACJ,MAAM;EACP,SAAA;EACC,SAAS;EACV,MAAK;EACL,eAAY;EACX,OAAK,EAAA,CAAA,6BAAA,EAAA,uCAA8F,EAAA,UAAQ,CAAA,CAAA;;mBAMtF,CAAtB,EAAsB,QAAA,EAAhB,WAAQ,GAAI,EAAA,MAAA,GAAA,EAAA,CAAA,CAAA"}
+{"version":3,"file":"keyboard-shortcut.js","names":[],"sources":["../../../components/keyboard_shortcut/keyboard_shortcut.vue"],"sourcesContent":["<!-- eslint-disable vue/no-v-html -->\n<template>\n  <kbd\n    :class=\"[\n      'd-keyboard-shortcut',\n      { 'd-keyboard-shortcut--inverted': inverted },\n    ]\"\n  >\n    <span class=\"d-keyboard-shortcut--sr-only\">\n      {{ screenReaderText || generatedScreenReaderText }}\n    </span>\n    <template\n      v-for=\"(item, i) in formattedShortcutSplit\"\n    >\n      <component\n        :is=\"icons[item]\"\n        v-if=\"icons[item]\"\n        :key=\"`icon-${i}-${item}`\"\n        size=\"100\"\n        aria-hidden=\"true\"\n        :class=\"[\n          'd-keyboard-shortcut__icon',\n          { 'd-keyboard-shortcut__icon--inverted': inverted },\n        ]\"\n      />\n      <span\n        v-else-if=\"item.trim()\"\n        :key=\"`text-${i}-${item}`\"\n        aria-hidden=\"true\"\n        :class=\"[\n          'd-keyboard-shortcut__item',\n          { 'd-keyboard-shortcut__item--inverted': inverted },\n        ]\"\n        v-html=\"item\"\n      />\n    </template>\n  </kbd>\n</template>\n\n<script>\nimport {\n  DtIconLayoutGrid,\n  DtIconArrowRight,\n  DtIconArrowLeft,\n  DtIconArrowUp,\n  DtIconArrowDown,\n  DtIconCommand,\n  DtIconOption,\n  DtIconPlus,\n} from '@dialpad/dialtone-icons/vue3';\n\nconst SHORTCUTS_ICON_ALIASES = {\n  '{win}': DtIconLayoutGrid,\n  '{arrow-right}': DtIconArrowRight,\n  '{arrow-left}': DtIconArrowLeft,\n  '{arrow-up}': DtIconArrowUp,\n  '{arrow-down}': DtIconArrowDown,\n  '{cmd}': DtIconCommand,\n  '{opt}': DtIconOption,\n};\n\n// Mapping of icon aliases to readable text for accessibility\nconst ICON_ALIAS_TO_TEXT = {\n  '{cmd}': 'Command',\n  '{opt}': 'Option',\n  '{win}': 'Windows',\n  '{arrow-right}': 'Right Arrow',\n  '{arrow-left}': 'Left Arrow',\n  '{arrow-up}': 'Up Arrow',\n  '{arrow-down}': 'Down Arrow',\n  '{plus}': 'plus',\n};\n\n// Mapping of common key abbreviations to full names for accessibility\nconst KEY_ABBREVIATIONS = {\n  'ctrl': 'Control',\n  'alt': 'Alt',\n  'esc': 'Escape',\n  'del': 'Delete',\n  'ins': 'Insert',\n  'pgup': 'Page Up',\n  'pgdn': 'Page Down',\n  'num': 'Number',\n  'caps': 'Caps Lock',\n};\n\n/**\n * This component displays a visual representation of a keyboard shortcut to the user.\n * @see https://dialtone.dialpad.com/components/keyboard_shortcut.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtKeyboardShortcut',\n\n  components: {\n    DtIconLayoutGrid,\n    DtIconArrowRight,\n    DtIconArrowLeft,\n    DtIconArrowUp,\n    DtIconArrowDown,\n    DtIconCommand,\n    DtIconOption,\n    DtIconPlus,\n  },\n\n  props: {\n    /**\n     * If true, applies inverted styles.\n     * @values true, false\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Include any of these tokens in your string to render the corresponding symbol:\n     * {cmd} {opt} {win} {arrow-right} {arrow-left} {arrow-up} {arrow-down}\n     */\n    shortcut: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Optional text to override the auto-generated accessible text for assistive technology.\n     * If not provided, accessible text will be automatically generated from the shortcut.\n     */\n    screenReaderText: {\n      type: String,\n      default: null,\n    },\n  },\n\n  data () {\n    return {\n      separator: /\\+/gi,\n    };\n  },\n\n  computed: {\n    icons () {\n      return {\n        ...SHORTCUTS_ICON_ALIASES,\n        '{plus}': DtIconPlus,\n      };\n    },\n\n    shortcutWithSeparator () {\n      return this.shortcut.replace(this.separator, '{plus}');\n    },\n\n    formattedShortcut () {\n      return Object.keys(SHORTCUTS_ICON_ALIASES).reduce((result, key) => {\n        return result.replace(new RegExp('{' + key + '}', 'gi'), SHORTCUTS_ICON_ALIASES[key]);\n      }, this.shortcutWithSeparator);\n    },\n\n    // Splits any icon based aliases into their own array items.\n    formattedShortcutSplit () {\n      const iconAliasString = Object.keys(this.icons).join('|');\n\n      /*\n         The regexp splits a given string with icon alias and is filtered by empty strings after:\n         if {win} is our delimiter AKA shortcut icon alias\n         '{win} + D K + {win}' returned value will be [{win}, ' ', '{plus}', ' D K ', '{plus}', ' ', {win}]\n      */\n      const regex = new RegExp(`(${iconAliasString})`, 'gi');\n      return this.formattedShortcut.split(regex).filter(Boolean);\n    },\n\n    // Generates accessible text for the keyboard shortcut\n    generatedScreenReaderText () {\n      return this.formattedShortcutSplit\n        .map(item => {\n          const trimmedItem = item.trim();\n\n          // Convert icon aliases to readable text\n          if (ICON_ALIAS_TO_TEXT[trimmedItem]) {\n            return ICON_ALIAS_TO_TEXT[trimmedItem];\n          }\n\n          // Convert key abbreviations to full names (case-insensitive)\n          const lowerItem = trimmedItem.toLowerCase();\n          if (KEY_ABBREVIATIONS[lowerItem]) {\n            return KEY_ABBREVIATIONS[lowerItem];\n          }\n\n          // Return the key as-is if it's not an alias or abbreviation\n          return trimmedItem;\n        })\n        .filter(item => item) // Remove empty strings\n        .join(' ');\n    },\n  },\n};\n</script>\n"],"mappings":";;;;AAmDA,IAAM,IAAyB;CAC7B,SAAS;CACT,iBAAiB;CACjB,gBAAgB;CAChB,cAAc;CACd,gBAAgB;CAChB,SAAS;CACT,SAAS;CACV,EAGK,IAAqB;CACzB,SAAS;CACT,SAAS;CACT,SAAS;CACT,iBAAiB;CACjB,gBAAgB;CAChB,cAAc;CACd,gBAAgB;CAChB,UAAU;CACX,EAGK,IAAoB;CACxB,MAAQ;CACR,KAAO;CACP,KAAO;CACP,KAAO;CACP,KAAO;CACP,MAAQ;CACR,MAAQ;CACR,KAAO;CACP,MAAQ;CACT,EAMI,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,YAAY;EACV;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CAED,OAAO;EAKL,UAAU;GACR,MAAM;GACN,SAAS;GACV;EAMD,UAAU;GACR,MAAM;GACN,UAAU;GACX;EAMD,kBAAkB;GAChB,MAAM;GACN,SAAS;GACV;EACF;CAED,OAAQ;AACN,SAAO,EACL,WAAW,QACZ;;CAGH,UAAU;EACR,QAAS;AACP,UAAO;IACL,GAAG;IACH,UAAU;IACX;;EAGH,wBAAyB;AACvB,UAAO,KAAK,SAAS,QAAQ,KAAK,WAAW,SAAS;;EAGxD,oBAAqB;AACnB,UAAO,OAAO,KAAK,EAAuB,CAAC,QAAQ,GAAQ,MAClD,EAAO,QAAY,OAAO,MAAM,IAAM,KAAK,KAAK,EAAE,EAAuB,GAAK,EACpF,KAAK,sBAAsB;;EAIhC,yBAA0B;GACxB,IAAM,IAAkB,OAAO,KAAK,KAAK,MAAM,CAAC,KAAK,IAAI,EAOnD,IAAY,OAAO,IAAI,EAAgB,IAAI,KAAK;AACtD,UAAO,KAAK,kBAAkB,MAAM,EAAM,CAAC,OAAO,QAAQ;;EAI5D,4BAA6B;AAC3B,UAAO,KAAK,uBACT,KAAI,MAAQ;IACX,IAAM,IAAc,EAAK,MAAM;AAG/B,QAAI,EAAmB,GACrB,QAAO,EAAmB;IAI5B,IAAM,IAAY,EAAY,aAAa;AAM3C,WALI,EAAkB,KACb,EAAkB,KAIpB;KACR,CACA,QAAO,MAAQ,EAAI,CACnB,KAAK,IAAI;;EAEf;CACF,QA3LS,OAAM,gCAA8B;;aAN5C,EAkCM,OAAA,EAjCH,OAAK,EAAA,CAAA,uBAAA,EAAA,iCAA0E,EAAA,UAAQ,CAAA,CAAA,EAAA,EAAA,CAKxF,EAEO,QAFP,GAEO,EADF,EAAA,oBAAoB,EAAA,0BAAyB,EAAA,EAAA,GAAA,EAAA,GAAA,EAElD,EAwBW,GAAA,MAAA,EAvBW,EAAA,yBAAZ,GAAM,wBAIN,EAAA,MAAM,MAAA,GAAA,EAFd,EAUE,EATK,EAAA,MAAM,GAAI,EAAA;EAEd,KAAG,QAAU,EAAC,GAAI;EACnB,MAAK;EACL,eAAY;EACX,OAAK,EAAA,CAAA,6BAAA,EAAA,uCAA8F,EAAA,UAAQ,CAAA,CAAA;2BAMjG,EAAK,MAAI,IAAA,GAAA,EADtB,EASE,QAAA;EAPC,KAAG,QAAU,EAAC,GAAI;EACnB,eAAY;EACX,OAAK,EAAA,CAAA,6BAAA,EAAA,uCAA8F,EAAA,UAAQ,CAAA,CAAA;EAI5G,WAAQ"}

package/dist/lib/link/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./link-constants.cjs`),t=require(`./link.cjs`);exports.CRITICAL=e.CRITICAL,exports.DtLink=t.default,exports.LINK_KIND_MODIFIERS=e.LINK_KIND_MODIFIERS,exports.LINK_VARIANTS=e.LINK_VARIANTS,exports.MENTION=e.MENTION,exports.MUTED=e.MUTED,exports.POSITIVE=e.POSITIVE,exports.WARNING=e.WARNING,exports.getLinkKindModifier=e.getLinkKindModifier;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./link-constants.cjs`),t=require(`./link.cjs`);exports.DANGER=e.DANGER,exports.DtLink=t.default,exports.LINK_KIND_MODIFIERS=e.LINK_KIND_MODIFIERS,exports.LINK_VARIANTS=e.LINK_VARIANTS,exports.MENTION=e.MENTION,exports.MUTED=e.MUTED,exports.SUCCESS=e.SUCCESS,exports.WARNING=e.WARNING,exports.getLinkKindModifier=e.getLinkKindModifier;

package/dist/lib/link/index.js

@@ -1,3 +1,3 @@
-import { CRITICAL as e, LINK_KIND_MODIFIERS as t, LINK_VARIANTS as n, MENTION as r, MUTED as i, POSITIVE as a, WARNING as o, getLinkKindModifier as s } from "./link-constants.js";
+import { DANGER as e, LINK_KIND_MODIFIERS as t, LINK_VARIANTS as n, MENTION as r, MUTED as i, SUCCESS as a, WARNING as o, getLinkKindModifier as s } from "./link-constants.js";
 import c from "./link.js";
-export { e as CRITICAL, c as DtLink, t as LINK_KIND_MODIFIERS, n as LINK_VARIANTS, r as MENTION, i as MUTED, a as POSITIVE, o as WARNING, s as getLinkKindModifier };
+export { e as DANGER, c as DtLink, t as LINK_KIND_MODIFIERS, n as LINK_VARIANTS, r as MENTION, i as MUTED, a as SUCCESS, o as WARNING, s as getLinkKindModifier };

package/dist/lib/link/link-constants.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e=`critical`,t=`positive`,n=`warning`,r=`info`,i=`muted`,a=`mention`,o=[``,e,n,t,r,i,a],s={default:``,critical:`d-link--critical`,warning:`d-link--warning`,positive:`d-link--positive`,info:`d-link--info`,muted:`d-link--muted`,mention:`d-link--mention`},c={default:`d-link--inverted`,critical:`d-link--inverted-critical`,warning:`d-link--inverted-warning`,positive:`d-link--inverted-positive`,info:`d-link--inverted-info`,muted:`d-link--inverted-muted`,mention:`d-link--inverted-mention`},l=(e,t)=>t?c[e||`default`]:s[e],u={LINK_VARIANTS:o,LINK_KIND_MODIFIERS:s,getLinkKindModifier:l};exports.CRITICAL=e,exports.INFO=r,exports.LINK_KIND_MODIFIERS=s,exports.LINK_VARIANTS=o,exports.MENTION=a,exports.MUTED=i,exports.POSITIVE=t,exports.WARNING=n,exports.default=u,exports.getLinkKindModifier=l;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e=`danger`,t=`warning`,n=`success`,r=`muted`,i=`mention`,a=[``,e,t,n,r,i],o={default:``,warning:`d-link--warning`,danger:`d-link--danger`,success:`d-link--success`,muted:`d-link--muted`,mention:`d-link--mention`},s={default:`d-link--inverted`,warning:`d-link--inverted-warning`,danger:`d-link--inverted-danger`,success:`d-link--inverted-success`,muted:`d-link--inverted-muted`,mention:`d-link--inverted-mention`},c=(e,t)=>t?s[e||`default`]:o[e],l={LINK_VARIANTS:a,LINK_KIND_MODIFIERS:o,getLinkKindModifier:c};exports.DANGER=e,exports.LINK_KIND_MODIFIERS=o,exports.LINK_VARIANTS=a,exports.MENTION=i,exports.MUTED=r,exports.SUCCESS=n,exports.WARNING=t,exports.default=l,exports.getLinkKindModifier=c;
 //# sourceMappingURL=link-constants.cjs.map

package/dist/lib/link/link-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"link-constants.cjs","names":[],"sources":["../../../components/link/link_constants.js"],"sourcesContent":["export const CRITICAL = 'critical';\nexport const POSITIVE = 'positive';\nexport const WARNING = 'warning';\nexport const INFO = 'info';\nexport const MUTED = 'muted';\nexport const MENTION = 'mention';\nexport const LINK_VARIANTS = ['', CRITICAL, WARNING, POSITIVE, INFO, MUTED, MENTION];\n\nexport const LINK_KIND_MODIFIERS = {\n  default: '',\n  critical: 'd-link--critical',\n  warning: 'd-link--warning',\n  positive: 'd-link--positive',\n  info: 'd-link--info',\n  muted: 'd-link--muted',\n  mention: 'd-link--mention',\n};\n\nconst LINK_KIND_MODIFIERS_INVERTED = {\n  default: 'd-link--inverted',\n  critical: 'd-link--inverted-critical',\n  warning: 'd-link--inverted-warning',\n  positive: 'd-link--inverted-positive',\n  info: 'd-link--inverted-info',\n  muted: 'd-link--inverted-muted',\n  mention: 'd-link--inverted-mention',\n};\n\nexport const getLinkKindModifier = (kind, inverted) => {\n  if (inverted) {\n    return LINK_KIND_MODIFIERS_INVERTED[kind || 'default'];\n  }\n  return LINK_KIND_MODIFIERS[kind];\n};\n\nexport default {\n  LINK_VARIANTS,\n  LINK_KIND_MODIFIERS,\n  getLinkKindModifier,\n};\n"],"mappings":"+FAAA,IAAa,EAAW,WACX,EAAW,WACX,EAAU,UACV,EAAO,OACP,EAAQ,QACR,EAAU,UACV,EAAgB,CAAC,GAAI,EAAU,EAAS,EAAU,EAAM,EAAO,EAAQ,CAEvE,EAAsB,CACjC,QAAS,GACT,SAAU,mBACV,QAAS,kBACT,SAAU,mBACV,KAAM,eACN,MAAO,gBACP,QAAS,kBACV,CAEK,EAA+B,CACnC,QAAS,mBACT,SAAU,4BACV,QAAS,2BACT,SAAU,4BACV,KAAM,wBACN,MAAO,yBACP,QAAS,2BACV,CAEY,GAAuB,EAAM,IACpC,EACK,EAA6B,GAAQ,WAEvC,EAAoB,GAG7B,EAAe,CACb,gBACA,sBACA,sBACD"}
+{"version":3,"file":"link-constants.cjs","names":[],"sources":["../../../components/link/link_constants.js"],"sourcesContent":["export const DANGER = 'danger';\nexport const WARNING = 'warning';\nexport const SUCCESS = 'success';\nexport const MUTED = 'muted';\nexport const MENTION = 'mention';\nexport const LINK_VARIANTS = ['', DANGER, WARNING, SUCCESS, MUTED, MENTION];\n\nexport const LINK_KIND_MODIFIERS = {\n  default: '',\n  warning: 'd-link--warning',\n  danger: 'd-link--danger',\n  success: 'd-link--success',\n  muted: 'd-link--muted',\n  mention: 'd-link--mention',\n};\n\nconst LINK_KIND_MODIFIERS_INVERTED = {\n  default: 'd-link--inverted',\n  warning: 'd-link--inverted-warning',\n  danger: 'd-link--inverted-danger',\n  success: 'd-link--inverted-success',\n  muted: 'd-link--inverted-muted',\n  mention: 'd-link--inverted-mention',\n};\n\nexport const getLinkKindModifier = (kind, inverted) => {\n  if (inverted) {\n    return LINK_KIND_MODIFIERS_INVERTED[kind || 'default'];\n  }\n  return LINK_KIND_MODIFIERS[kind];\n};\n\nexport default {\n  LINK_VARIANTS,\n  LINK_KIND_MODIFIERS,\n  getLinkKindModifier,\n};\n"],"mappings":"+FAAA,IAAa,EAAS,SACT,EAAU,UACV,EAAU,UACV,EAAQ,QACR,EAAU,UACV,EAAgB,CAAC,GAAI,EAAQ,EAAS,EAAS,EAAO,EAAQ,CAE9D,EAAsB,CACjC,QAAS,GACT,QAAS,kBACT,OAAQ,iBACR,QAAS,kBACT,MAAO,gBACP,QAAS,kBACV,CAEK,EAA+B,CACnC,QAAS,mBACT,QAAS,2BACT,OAAQ,0BACR,QAAS,2BACT,MAAO,yBACP,QAAS,2BACV,CAEY,GAAuB,EAAM,IACpC,EACK,EAA6B,GAAQ,WAEvC,EAAoB,GAG7B,EAAe,CACb,gBACA,sBACA,sBACD"}

package/dist/lib/link/link-constants.js

@@ -1,34 +1,31 @@
 //#region components/link/link_constants.js
-var e = "critical", t = "positive", n = "warning", r = "info", i = "muted", a = "mention", o = [
+var e = "danger", t = "warning", n = "success", r = "muted", i = "mention", a = [
 	"",
 	e,
-	n,
 	t,
+	n,
 	r,
-	i,
-	a
-], s = {
+	i
+], o = {
 	default: "",
-	critical: "d-link--critical",
 	warning: "d-link--warning",
-	positive: "d-link--positive",
-	info: "d-link--info",
+	danger: "d-link--danger",
+	success: "d-link--success",
 	muted: "d-link--muted",
 	mention: "d-link--mention"
-}, c = {
+}, s = {
 	default: "d-link--inverted",
-	critical: "d-link--inverted-critical",
 	warning: "d-link--inverted-warning",
-	positive: "d-link--inverted-positive",
-	info: "d-link--inverted-info",
+	danger: "d-link--inverted-danger",
+	success: "d-link--inverted-success",
 	muted: "d-link--inverted-muted",
 	mention: "d-link--inverted-mention"
-}, l = (e, t) => t ? c[e || "default"] : s[e], u = {
-	LINK_VARIANTS: o,
-	LINK_KIND_MODIFIERS: s,
-	getLinkKindModifier: l
+}, c = (e, t) => t ? s[e || "default"] : o[e], l = {
+	LINK_VARIANTS: a,
+	LINK_KIND_MODIFIERS: o,
+	getLinkKindModifier: c
 };
 //#endregion
-export { e as CRITICAL, r as INFO, s as LINK_KIND_MODIFIERS, o as LINK_VARIANTS, a as MENTION, i as MUTED, t as POSITIVE, n as WARNING, u as default, l as getLinkKindModifier };
+export { e as DANGER, o as LINK_KIND_MODIFIERS, a as LINK_VARIANTS, i as MENTION, r as MUTED, n as SUCCESS, t as WARNING, l as default, c as getLinkKindModifier };
 
 //# sourceMappingURL=link-constants.js.map

package/dist/lib/link/link-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"link-constants.js","names":[],"sources":["../../../components/link/link_constants.js"],"sourcesContent":["export const CRITICAL = 'critical';\nexport const POSITIVE = 'positive';\nexport const WARNING = 'warning';\nexport const INFO = 'info';\nexport const MUTED = 'muted';\nexport const MENTION = 'mention';\nexport const LINK_VARIANTS = ['', CRITICAL, WARNING, POSITIVE, INFO, MUTED, MENTION];\n\nexport const LINK_KIND_MODIFIERS = {\n  default: '',\n  critical: 'd-link--critical',\n  warning: 'd-link--warning',\n  positive: 'd-link--positive',\n  info: 'd-link--info',\n  muted: 'd-link--muted',\n  mention: 'd-link--mention',\n};\n\nconst LINK_KIND_MODIFIERS_INVERTED = {\n  default: 'd-link--inverted',\n  critical: 'd-link--inverted-critical',\n  warning: 'd-link--inverted-warning',\n  positive: 'd-link--inverted-positive',\n  info: 'd-link--inverted-info',\n  muted: 'd-link--inverted-muted',\n  mention: 'd-link--inverted-mention',\n};\n\nexport const getLinkKindModifier = (kind, inverted) => {\n  if (inverted) {\n    return LINK_KIND_MODIFIERS_INVERTED[kind || 'default'];\n  }\n  return LINK_KIND_MODIFIERS[kind];\n};\n\nexport default {\n  LINK_VARIANTS,\n  LINK_KIND_MODIFIERS,\n  getLinkKindModifier,\n};\n"],"mappings":";AAAA,IAAa,IAAW,YACX,IAAW,YACX,IAAU,WACV,IAAO,QACP,IAAQ,SACR,IAAU,WACV,IAAgB;CAAC;CAAI;CAAU;CAAS;CAAU;CAAM;CAAO;CAAQ,EAEvE,IAAsB;CACjC,SAAS;CACT,UAAU;CACV,SAAS;CACT,UAAU;CACV,MAAM;CACN,OAAO;CACP,SAAS;CACV,EAEK,IAA+B;CACnC,SAAS;CACT,UAAU;CACV,SAAS;CACT,UAAU;CACV,MAAM;CACN,OAAO;CACP,SAAS;CACV,EAEY,KAAuB,GAAM,MACpC,IACK,EAA6B,KAAQ,aAEvC,EAAoB,IAG7B,IAAe;CACb;CACA;CACA;CACD"}
+{"version":3,"file":"link-constants.js","names":[],"sources":["../../../components/link/link_constants.js"],"sourcesContent":["export const DANGER = 'danger';\nexport const WARNING = 'warning';\nexport const SUCCESS = 'success';\nexport const MUTED = 'muted';\nexport const MENTION = 'mention';\nexport const LINK_VARIANTS = ['', DANGER, WARNING, SUCCESS, MUTED, MENTION];\n\nexport const LINK_KIND_MODIFIERS = {\n  default: '',\n  warning: 'd-link--warning',\n  danger: 'd-link--danger',\n  success: 'd-link--success',\n  muted: 'd-link--muted',\n  mention: 'd-link--mention',\n};\n\nconst LINK_KIND_MODIFIERS_INVERTED = {\n  default: 'd-link--inverted',\n  warning: 'd-link--inverted-warning',\n  danger: 'd-link--inverted-danger',\n  success: 'd-link--inverted-success',\n  muted: 'd-link--inverted-muted',\n  mention: 'd-link--inverted-mention',\n};\n\nexport const getLinkKindModifier = (kind, inverted) => {\n  if (inverted) {\n    return LINK_KIND_MODIFIERS_INVERTED[kind || 'default'];\n  }\n  return LINK_KIND_MODIFIERS[kind];\n};\n\nexport default {\n  LINK_VARIANTS,\n  LINK_KIND_MODIFIERS,\n  getLinkKindModifier,\n};\n"],"mappings":";AAAA,IAAa,IAAS,UACT,IAAU,WACV,IAAU,WACV,IAAQ,SACR,IAAU,WACV,IAAgB;CAAC;CAAI;CAAQ;CAAS;CAAS;CAAO;CAAQ,EAE9D,IAAsB;CACjC,SAAS;CACT,SAAS;CACT,QAAQ;CACR,SAAS;CACT,OAAO;CACP,SAAS;CACV,EAEK,IAA+B;CACnC,SAAS;CACT,SAAS;CACT,QAAQ;CACR,SAAS;CACT,OAAO;CACP,SAAS;CACV,EAEY,KAAuB,GAAM,MACpC,IACK,EAA6B,KAAQ,aAEvC,EAAoB,IAG7B,IAAe;CACb;CACA;CACA;CACD"}

package/dist/lib/link/link.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),t=require(`./link-constants.cjs`);let n=require(`vue`);var r={compatConfig:{MODE:3},name:`DtLink`,props:{tone:{type:String,default:``,validator(e){return t.LINK_VARIANTS.includes(e)}},kind:{type:String,default:void 0},inverted:{type:Boolean,default:!1},href:{type:String,default:null},to:{type:[String,Object],default:null},replace:{type:Boolean,default:!1},underline:{type:Boolean,default:!0}},data(){return{LINK_KIND_MODIFIERS:t.LINK_KIND_MODIFIERS}},computed:{resolvedTone(){return this.kind??this.tone},computedTag(){return this.to?(0,n.resolveComponent)(`RouterLink`):`a`},computedAttrs(){return this.to?{to:this.to,replace:this.replace}:{href:this.href||`javascript:void(0)`}}},methods:{getLinkClasses(){return[`d-link`,t.getLinkKindModifier(this.resolvedTone,this.inverted),{"d-link--no-underline":!this.underline}]}}};function i(e,t,r,i,a,o){return(0,n.openBlock)(),(0,n.createBlock)((0,n.resolveDynamicComponent)(o.computedTag),(0,n.mergeProps)({class:o.getLinkClasses(),"data-qa":`dt-link`},o.computedAttrs),{default:(0,n.withCtx)(()=>[(0,n.renderSlot)(e.$slots,`default`)]),_:3},16,[`class`])}var a=e.t(r,[[`render`,i]]);exports.default=a;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),t=require(`./link-constants.cjs`);let n=require(`vue`);var r={compatConfig:{MODE:3},name:`DtLink`,props:{kind:{type:String,default:``,validator(e){return t.LINK_VARIANTS.includes(e)}},inverted:{type:Boolean,default:!1},href:{type:String,default:null},to:{type:[String,Object],default:null},replace:{type:Boolean,default:!1}},data(){return{LINK_KIND_MODIFIERS:t.LINK_KIND_MODIFIERS}},computed:{computedTag(){return this.to?(0,n.resolveComponent)(`RouterLink`):`a`},computedAttrs(){return this.to?{to:this.to,replace:this.replace}:{href:this.href||`javascript:void(0)`}}},methods:{getLinkClasses(){return[`d-link`,t.getLinkKindModifier(this.kind,this.inverted)]}}};function i(e,t,r,i,a,o){return(0,n.openBlock)(),(0,n.createBlock)((0,n.resolveDynamicComponent)(o.computedTag),(0,n.mergeProps)({class:o.getLinkClasses(),"data-qa":`dt-link`},o.computedAttrs),{default:(0,n.withCtx)(()=>[(0,n.renderSlot)(e.$slots,`default`)]),_:3},16,[`class`])}var a=e.t(r,[[`render`,i]]);exports.default=a;
 //# sourceMappingURL=link.cjs.map

package/dist/lib/link/link.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"link.cjs","names":[],"sources":["../../../components/link/link.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"computedTag\"\n    :class=\"getLinkClasses()\"\n    data-qa=\"dt-link\"\n    v-bind=\"computedAttrs\"\n  >\n    <!-- @slot Slot for main content -->\n    <slot />\n  </component>\n</template>\n\n<script>\nimport { resolveComponent } from 'vue';\nimport { LINK_VARIANTS, LINK_KIND_MODIFIERS, getLinkKindModifier } from './link_constants';\n\n/**\n * A link is a navigational element that can be found on its own, within other text, or directly following content.\n * @property {String} rel attribute\n * @see https://dialtone.dialpad.com/components/link.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtLink',\n\n  props: {\n    /**\n     * Applies the link variant styles\n     * @values null, critical, warning, positive, info, muted, mention\n     */\n    tone: {\n      type: String,\n      default: '',\n      validator (tone) {\n        return LINK_VARIANTS.includes(tone);\n      },\n    },\n\n    /**\n     * @deprecated Use tone\n     */\n    kind: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Determines whether the link should have inverted styling\n     * default is false.\n     * @values true, false\n     * @deprecated Use v-dt-mode directive instead.\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * URL for anchor link navigation. Renders as a native <a> element.\n     */\n    href: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Vue Router destination. Renders as a <router-link>.\n     * Takes precedence over href when both are provided.\n     * @see https://router.vuejs.org/api/interfaces/RouterLinkProps.html#to\n     */\n    to: {\n      type: [String, Object],\n      default: null,\n    },\n\n    /**\n     * When true, navigation replaces the current history entry instead of pushing.\n     * Only applies when `to` is provided.\n     * @values true, false\n     */\n    replace: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines whether the link should display an underline.\n     * @values true, false\n     */\n    underline: {\n      type: Boolean,\n      default: true,\n    },\n  },\n\n  data () {\n    return {\n      LINK_KIND_MODIFIERS,\n    };\n  },\n\n  computed: {\n    resolvedTone () {\n      return this.kind ?? this.tone;\n    },\n\n    computedTag () {\n      if (this.to) {\n        return resolveComponent('RouterLink');\n      }\n      return 'a';\n    },\n\n    computedAttrs () {\n      if (this.to) {\n        return {\n          to: this.to,\n          replace: this.replace,\n        };\n      }\n      return {\n        href: this.href || 'javascript:void(0)',\n      };\n    },\n  },\n\n  methods: {\n    getLinkClasses () {\n      return [\n        'd-link',\n        getLinkKindModifier(this.resolvedTone, this.inverted),\n        { 'd-link--no-underline': !this.underline },\n      ];\n    },\n  },\n};\n</script>\n"],"mappings":"0PAqBA,IAAK,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,SAEN,MAAO,CAKL,KAAM,CACJ,KAAM,OACN,QAAS,GACT,UAAW,EAAM,CACf,OAAO,EAAA,cAAc,SAAS,EAAK,EAEtC,CAKD,KAAM,CACJ,KAAM,OACN,QAAS,IAAA,GACV,CAQD,SAAU,CACR,KAAM,QACN,QAAS,GACV,CAKD,KAAM,CACJ,KAAM,OACN,QAAS,KACV,CAOD,GAAI,CACF,KAAM,CAAC,OAAQ,OAAO,CACtB,QAAS,KACV,CAOD,QAAS,CACP,KAAM,QACN,QAAS,GACV,CAMD,UAAW,CACT,KAAM,QACN,QAAS,GACV,CACF,CAED,MAAQ,CACN,MAAO,CACL,oBAAA,EAAA,oBACD,EAGH,SAAU,CACR,cAAgB,CACd,OAAO,KAAK,MAAQ,KAAK,MAG3B,aAAe,CAIb,OAHI,KAAK,IACP,EAAA,EAAA,kBAAwB,aAAa,CAEhC,KAGT,eAAiB,CAOf,OANI,KAAK,GACA,CACL,GAAI,KAAK,GACT,QAAS,KAAK,QACf,CAEI,CACL,KAAM,KAAK,MAAQ,qBACpB,EAEJ,CAED,QAAS,CACP,gBAAkB,CAChB,MAAO,CACL,SACA,EAAA,oBAAoB,KAAK,aAAc,KAAK,SAAS,CACrD,CAAE,uBAAwB,CAAC,KAAK,UAAW,CAC5C,EAEJ,CACF,iGArIQ,EAAA,YAAW,EAAA,EAAA,EAAA,YAON,CANT,MAAO,EAAA,gBAAc,CACtB,UAAQ,WACA,EAAA,cAAa,CAAA,2BAGb,EAAA,EAAA,EAAA,YAAA,EAAA,OAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"link.cjs","names":[],"sources":["../../../components/link/link.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"computedTag\"\n    :class=\"getLinkClasses()\"\n    data-qa=\"dt-link\"\n    v-bind=\"computedAttrs\"\n  >\n    <!-- @slot Slot for main content -->\n    <slot />\n  </component>\n</template>\n\n<script>\nimport { resolveComponent } from 'vue';\nimport { LINK_VARIANTS, LINK_KIND_MODIFIERS, getLinkKindModifier } from './link_constants';\n\n/**\n * A link is a navigational element that can be found on its own, within other text, or directly following content.\n * @property {String} rel attribute\n * @see https://dialtone.dialpad.com/components/link.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtLink',\n\n  props: {\n    /**\n     * Applies the link variant styles\n     * @values null, danger, warning, success, muted, mention\n     */\n    kind: {\n      type: String,\n      default: '',\n      validator (kind) {\n        return LINK_VARIANTS.includes(kind);\n      },\n    },\n\n    /**\n     * Determines whether the link should have inverted styling\n     * default is false.\n     * @values true, false\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * URL for anchor link navigation. Renders as a native <a> element.\n     */\n    href: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Vue Router destination. Renders as a <router-link>.\n     * Takes precedence over href when both are provided.\n     * @see https://router.vuejs.org/api/interfaces/RouterLinkProps.html#to\n     */\n    to: {\n      type: [String, Object],\n      default: null,\n    },\n\n    /**\n     * When true, navigation replaces the current history entry instead of pushing.\n     * Only applies when `to` is provided.\n     * @values true, false\n     */\n    replace: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  data () {\n    return {\n      LINK_KIND_MODIFIERS,\n    };\n  },\n\n  computed: {\n    computedTag () {\n      if (this.to) {\n        return resolveComponent('RouterLink');\n      }\n      return 'a';\n    },\n\n    computedAttrs () {\n      if (this.to) {\n        return {\n          to: this.to,\n          replace: this.replace,\n        };\n      }\n      return {\n        href: this.href || 'javascript:void(0)',\n      };\n    },\n  },\n\n  methods: {\n    getLinkClasses () {\n      return [\n        'd-link',\n        getLinkKindModifier(this.kind, this.inverted),\n      ];\n    },\n  },\n};\n</script>\n"],"mappings":"0PAqBA,IAAK,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,SAEN,MAAO,CAKL,KAAM,CACJ,KAAM,OACN,QAAS,GACT,UAAW,EAAM,CACf,OAAO,EAAA,cAAc,SAAS,EAAK,EAEtC,CAOD,SAAU,CACR,KAAM,QACN,QAAS,GACV,CAKD,KAAM,CACJ,KAAM,OACN,QAAS,KACV,CAOD,GAAI,CACF,KAAM,CAAC,OAAQ,OAAO,CACtB,QAAS,KACV,CAOD,QAAS,CACP,KAAM,QACN,QAAS,GACV,CACF,CAED,MAAQ,CACN,MAAO,CACL,oBAAA,EAAA,oBACD,EAGH,SAAU,CACR,aAAe,CAIb,OAHI,KAAK,IACP,EAAA,EAAA,kBAAwB,aAAa,CAEhC,KAGT,eAAiB,CAOf,OANI,KAAK,GACA,CACL,GAAI,KAAK,GACT,QAAS,KAAK,QACf,CAEI,CACL,KAAM,KAAK,MAAQ,qBACpB,EAEJ,CAED,QAAS,CACP,gBAAkB,CAChB,MAAO,CACL,SACA,EAAA,oBAAoB,KAAK,KAAM,KAAK,SAAS,CAC9C,EAEJ,CACF,iGA9GQ,EAAA,YAAW,EAAA,EAAA,EAAA,YAON,CANT,MAAO,EAAA,gBAAc,CACtB,UAAQ,WACA,EAAA,cAAa,CAAA,2BAGb,EAAA,EAAA,EAAA,YAAA,EAAA,OAAA,UAAA,CAAA,CAAA"}

package/dist/lib/link/link.js

@@ -6,17 +6,13 @@ var d = {
 	compatConfig: { MODE: 3 },
 	name: "DtLink",
 	props: {
-		tone: {
+		kind: {
 			type: String,
 			default: "",
 			validator(e) {
 				return n.includes(e);
 			}
 		},
-		kind: {
-			type: String,
-			default: void 0
-		},
 		inverted: {
 			type: Boolean,
 			default: !1
@@ -32,19 +28,12 @@ var d = {
 		replace: {
 			type: Boolean,
 			default: !1
-		},
-		underline: {
-			type: Boolean,
-			default: !0
 		}
 	},
 	data() {
 		return { LINK_KIND_MODIFIERS: t };
 	},
 	computed: {
-		resolvedTone() {
-			return this.kind ?? this.tone;
-		},
 		computedTag() {
 			return this.to ? c("RouterLink") : "a";
 		},
@@ -56,11 +45,7 @@ var d = {
 		}
 	},
 	methods: { getLinkClasses() {
-		return [
-			"d-link",
-			r(this.resolvedTone, this.inverted),
-			{ "d-link--no-underline": !this.underline }
-		];
+		return ["d-link", r(this.kind, this.inverted)];
 	} }
 };
 function f(e, t, n, r, c, d) {

package/dist/lib/link/link.js.map

@@ -1 +1 @@
-{"version":3,"file":"link.js","names":[],"sources":["../../../components/link/link.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"computedTag\"\n    :class=\"getLinkClasses()\"\n    data-qa=\"dt-link\"\n    v-bind=\"computedAttrs\"\n  >\n    <!-- @slot Slot for main content -->\n    <slot />\n  </component>\n</template>\n\n<script>\nimport { resolveComponent } from 'vue';\nimport { LINK_VARIANTS, LINK_KIND_MODIFIERS, getLinkKindModifier } from './link_constants';\n\n/**\n * A link is a navigational element that can be found on its own, within other text, or directly following content.\n * @property {String} rel attribute\n * @see https://dialtone.dialpad.com/components/link.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtLink',\n\n  props: {\n    /**\n     * Applies the link variant styles\n     * @values null, critical, warning, positive, info, muted, mention\n     */\n    tone: {\n      type: String,\n      default: '',\n      validator (tone) {\n        return LINK_VARIANTS.includes(tone);\n      },\n    },\n\n    /**\n     * @deprecated Use tone\n     */\n    kind: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Determines whether the link should have inverted styling\n     * default is false.\n     * @values true, false\n     * @deprecated Use v-dt-mode directive instead.\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * URL for anchor link navigation. Renders as a native <a> element.\n     */\n    href: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Vue Router destination. Renders as a <router-link>.\n     * Takes precedence over href when both are provided.\n     * @see https://router.vuejs.org/api/interfaces/RouterLinkProps.html#to\n     */\n    to: {\n      type: [String, Object],\n      default: null,\n    },\n\n    /**\n     * When true, navigation replaces the current history entry instead of pushing.\n     * Only applies when `to` is provided.\n     * @values true, false\n     */\n    replace: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Determines whether the link should display an underline.\n     * @values true, false\n     */\n    underline: {\n      type: Boolean,\n      default: true,\n    },\n  },\n\n  data () {\n    return {\n      LINK_KIND_MODIFIERS,\n    };\n  },\n\n  computed: {\n    resolvedTone () {\n      return this.kind ?? this.tone;\n    },\n\n    computedTag () {\n      if (this.to) {\n        return resolveComponent('RouterLink');\n      }\n      return 'a';\n    },\n\n    computedAttrs () {\n      if (this.to) {\n        return {\n          to: this.to,\n          replace: this.replace,\n        };\n      }\n      return {\n        href: this.href || 'javascript:void(0)',\n      };\n    },\n  },\n\n  methods: {\n    getLinkClasses () {\n      return [\n        'd-link',\n        getLinkKindModifier(this.resolvedTone, this.inverted),\n        { 'd-link--no-underline': !this.underline },\n      ];\n    },\n  },\n};\n</script>\n"],"mappings":";;;;AAqBA,IAAK,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,OAAO;EAKL,MAAM;GACJ,MAAM;GACN,SAAS;GACT,UAAW,GAAM;AACf,WAAO,EAAc,SAAS,EAAK;;GAEtC;EAKD,MAAM;GACJ,MAAM;GACN,SAAS,KAAA;GACV;EAQD,UAAU;GACR,MAAM;GACN,SAAS;GACV;EAKD,MAAM;GACJ,MAAM;GACN,SAAS;GACV;EAOD,IAAI;GACF,MAAM,CAAC,QAAQ,OAAO;GACtB,SAAS;GACV;EAOD,SAAS;GACP,MAAM;GACN,SAAS;GACV;EAMD,WAAW;GACT,MAAM;GACN,SAAS;GACV;EACF;CAED,OAAQ;AACN,SAAO,EACL,wBACD;;CAGH,UAAU;EACR,eAAgB;AACd,UAAO,KAAK,QAAQ,KAAK;;EAG3B,cAAe;AAIb,UAHI,KAAK,KACA,EAAiB,aAAa,GAEhC;;EAGT,gBAAiB;AAOf,UANI,KAAK,KACA;IACL,IAAI,KAAK;IACT,SAAS,KAAK;IACf,GAEI,EACL,MAAM,KAAK,QAAQ,sBACpB;;EAEJ;CAED,SAAS,EACP,iBAAkB;AAChB,SAAO;GACL;GACA,EAAoB,KAAK,cAAc,KAAK,SAAS;GACrD,EAAE,wBAAwB,CAAC,KAAK,WAAW;GAC5C;IAEJ;CACF;;aAtIC,EAQY,EAPL,EAAA,YAAW,EADlB,EAQY;EANT,OAAO,EAAA,gBAAc;EACtB,WAAQ;IACA,EAAA,cAAa,EAAA;mBAGb,CAAR,EAAQ,EAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"link.js","names":[],"sources":["../../../components/link/link.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"computedTag\"\n    :class=\"getLinkClasses()\"\n    data-qa=\"dt-link\"\n    v-bind=\"computedAttrs\"\n  >\n    <!-- @slot Slot for main content -->\n    <slot />\n  </component>\n</template>\n\n<script>\nimport { resolveComponent } from 'vue';\nimport { LINK_VARIANTS, LINK_KIND_MODIFIERS, getLinkKindModifier } from './link_constants';\n\n/**\n * A link is a navigational element that can be found on its own, within other text, or directly following content.\n * @property {String} rel attribute\n * @see https://dialtone.dialpad.com/components/link.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtLink',\n\n  props: {\n    /**\n     * Applies the link variant styles\n     * @values null, danger, warning, success, muted, mention\n     */\n    kind: {\n      type: String,\n      default: '',\n      validator (kind) {\n        return LINK_VARIANTS.includes(kind);\n      },\n    },\n\n    /**\n     * Determines whether the link should have inverted styling\n     * default is false.\n     * @values true, false\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * URL for anchor link navigation. Renders as a native <a> element.\n     */\n    href: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Vue Router destination. Renders as a <router-link>.\n     * Takes precedence over href when both are provided.\n     * @see https://router.vuejs.org/api/interfaces/RouterLinkProps.html#to\n     */\n    to: {\n      type: [String, Object],\n      default: null,\n    },\n\n    /**\n     * When true, navigation replaces the current history entry instead of pushing.\n     * Only applies when `to` is provided.\n     * @values true, false\n     */\n    replace: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  data () {\n    return {\n      LINK_KIND_MODIFIERS,\n    };\n  },\n\n  computed: {\n    computedTag () {\n      if (this.to) {\n        return resolveComponent('RouterLink');\n      }\n      return 'a';\n    },\n\n    computedAttrs () {\n      if (this.to) {\n        return {\n          to: this.to,\n          replace: this.replace,\n        };\n      }\n      return {\n        href: this.href || 'javascript:void(0)',\n      };\n    },\n  },\n\n  methods: {\n    getLinkClasses () {\n      return [\n        'd-link',\n        getLinkKindModifier(this.kind, this.inverted),\n      ];\n    },\n  },\n};\n</script>\n"],"mappings":";;;;AAqBA,IAAK,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,OAAO;EAKL,MAAM;GACJ,MAAM;GACN,SAAS;GACT,UAAW,GAAM;AACf,WAAO,EAAc,SAAS,EAAK;;GAEtC;EAOD,UAAU;GACR,MAAM;GACN,SAAS;GACV;EAKD,MAAM;GACJ,MAAM;GACN,SAAS;GACV;EAOD,IAAI;GACF,MAAM,CAAC,QAAQ,OAAO;GACtB,SAAS;GACV;EAOD,SAAS;GACP,MAAM;GACN,SAAS;GACV;EACF;CAED,OAAQ;AACN,SAAO,EACL,wBACD;;CAGH,UAAU;EACR,cAAe;AAIb,UAHI,KAAK,KACA,EAAiB,aAAa,GAEhC;;EAGT,gBAAiB;AAOf,UANI,KAAK,KACA;IACL,IAAI,KAAK;IACT,SAAS,KAAK;IACf,GAEI,EACL,MAAM,KAAK,QAAQ,sBACpB;;EAEJ;CAED,SAAS,EACP,iBAAkB;AAChB,SAAO,CACL,UACA,EAAoB,KAAK,MAAM,KAAK,SAAS,CAC9C;IAEJ;CACF;;aA/GC,EAQY,EAPL,EAAA,YAAW,EADlB,EAQY;EANT,OAAO,EAAA,gBAAc;EACtB,WAAQ;IACA,EAAA,cAAa,EAAA;mBAGb,CAAR,EAAQ,EAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/lib/list-item/list-item.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/utils/index.cjs`),t=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),n=require(`./list-item-constants.cjs`),r=require(`../item-layout/item-layout.cjs`);let i=require(`vue`),a=require(`@dialpad/dialtone-icons/vue`);var o=[`listitem`,`menuitem`,`option`],s={compatConfig:{MODE:3},name:`DtListItem`,components:{DtItemLayout:r.default,DtIconCheck:a.DtIconCheck},inject:{highlightId:{default:null}},props:{id:{type:String,default(){return e.default.getUniqueString()}},role:{type:String,default:`listitem`,validator:e=>o.includes(e)},elementType:{type:String,default:`li`},type:{type:String,default:n.LIST_ITEM_TYPES.DEFAULT,validator:e=>Object.values(n.LIST_ITEM_TYPES).includes(e)},navigationType:{type:String,default:n.LIST_ITEM_NAVIGATION_TYPES.NONE,validator:e=>Object.values(n.LIST_ITEM_NAVIGATION_TYPES).includes(e)},selected:{type:Boolean,default:!1},wrapperClass:{type:[String,Object,Array],default:``}},emits:[`click`,`keydown`,`mousemove`,`mouseleave`],data(){return{injected:!1,mouseHighlighted:!1}},computed:{isDefaultType(){return this.type===n.LIST_ITEM_TYPES.DEFAULT},listItemListeners(){return{click:e=>{this.onClick(e)},keydown:e=>{[`enter`,`space`].includes(e.code.toLowerCase())&&this.onClick(e),this.$emit(`keydown`,e)},mousemove:e=>{this.onMouseHover(e),this.$emit(`mousemove`,e)},mouseleave:e=>{this.onMouseLeave(e),this.$emit(`mouseleave`,e)}}},isHighlighted(){return this.isHoverable?this.highlightId&&this.highlightId()?this.id===this.highlightId():this.mouseHighlighted:!1},isFocusable(){return this.navigationType===n.LIST_ITEM_NAVIGATION_TYPES.TAB},isHoverable(){return this.navigationType!==n.LIST_ITEM_NAVIGATION_TYPES.NONE}},methods:{onClick(e){this.$emit(`click`,e)},onMouseHover(){this.mouseHighlighted=!0},onMouseLeave(){this.mouseHighlighted=!1}}};function c(e,t,n,r,a,o){let s=(0,i.resolveComponent)(`dt-icon-check`),c=(0,i.resolveComponent)(`dt-item-layout`);return(0,i.openBlock)(),(0,i.createBlock)((0,i.resolveDynamicComponent)(n.elementType),(0,i.mergeProps)({id:n.id,class:[`d-list-item`,{"d-list-item--focusable":o.isFocusable,"d-list-item--highlighted":o.isHighlighted,"d-list-item--static":!o.isHoverable}],tabindex:o.isFocusable?0:-1,role:n.role,"aria-selected":n.role===`listitem`?void 0:o.isHighlighted},(0,i.toHandlers)(o.listItemListeners)),{default:(0,i.withCtx)(()=>[o.isDefaultType?((0,i.openBlock)(),(0,i.createBlock)(c,{key:0,unstyled:``,class:(0,i.normalizeClass)([`d-list-item__wrapper`,n.wrapperClass]),"start-class":`d-list-item__left`,"content-class":`d-list-item__content`,"title-class":`d-list-item__title`,"subtitle-class":`d-list-item__subtitle`,"block-end-class":`d-list-item__bottom`,"end-class":`d-list-item__right`,"selected-class":`d-list-item__selected`,"data-qa":`dt-list-item-wrapper`},(0,i.createSlots)({_:2},[(0,i.renderList)(e.$slots,(t,n)=>({name:n,fn:(0,i.withCtx)(()=>[(0,i.renderSlot)(e.$slots,n)])})),n.selected?{name:`selected`,fn:(0,i.withCtx)(()=>[(0,i.createVNode)(s,{size:`200`})]),key:`0`}:void 0]),1032,[`class`])):(0,i.renderSlot)(e.$slots,`default`,{key:1})]),_:3},16,[`id`,`class`,`tabindex`,`role`,`aria-selected`])}var l=t.t(s,[[`render`,c]]);exports.default=l;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/utils/index.cjs`),t=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),n=require(`./list-item-constants.cjs`),r=require(`../item-layout/item-layout.cjs`);let i=require(`vue`),a=require(`@dialpad/dialtone-icons/vue3`);var o=[`listitem`,`menuitem`,`option`],s={compatConfig:{MODE:3},name:`DtListItem`,components:{DtItemLayout:r.default,DtIconCheck:a.DtIconCheck},inject:{highlightId:{default:null}},props:{id:{type:String,default(){return e.default.getUniqueString()}},role:{type:String,default:`listitem`,validator:e=>o.includes(e)},elementType:{type:String,default:`li`},type:{type:String,default:n.LIST_ITEM_TYPES.DEFAULT,validator:e=>Object.values(n.LIST_ITEM_TYPES).includes(e)},navigationType:{type:String,default:n.LIST_ITEM_NAVIGATION_TYPES.NONE,validator:e=>Object.values(n.LIST_ITEM_NAVIGATION_TYPES).includes(e)},selected:{type:Boolean,default:!1},wrapperClass:{type:[String,Object,Array],default:``}},emits:[`keydown`,`mousemove`,`mouseleave`],data(){return{injected:!1,mouseHighlighted:!1}},computed:{isDefaultType(){return this.type===n.LIST_ITEM_TYPES.DEFAULT},listItemListeners(){return{keydown:e=>{[`enter`,`space`].includes(e.code.toLowerCase())&&this.onClick(e),this.$emit(`keydown`,e)},mousemove:e=>{this.onMouseHover(e),this.$emit(`mousemove`,e)},mouseleave:e=>{this.onMouseLeave(e),this.$emit(`mouseleave`,e)}}},isHighlighted(){return this.isHoverable?this.highlightId&&this.highlightId()?this.id===this.highlightId():this.mouseHighlighted:!1},isFocusable(){return this.navigationType===n.LIST_ITEM_NAVIGATION_TYPES.TAB},isHoverable(){return this.navigationType!==n.LIST_ITEM_NAVIGATION_TYPES.NONE}},methods:{onClick(e){this.$emit(`click`,e)},onMouseHover(){this.mouseHighlighted=!0},onMouseLeave(){this.mouseHighlighted=!1}}};function c(e,t,n,r,a,o){let s=(0,i.resolveComponent)(`dt-icon-check`),c=(0,i.resolveComponent)(`dt-item-layout`);return(0,i.openBlock)(),(0,i.createBlock)((0,i.resolveDynamicComponent)(n.elementType),(0,i.mergeProps)({id:n.id,class:[`d-list-item`,{"d-list-item--focusable":o.isFocusable,"d-list-item--highlighted":o.isHighlighted,"d-list-item--static":!o.isHoverable}],tabindex:o.isFocusable?0:-1,role:n.role,"aria-selected":n.role===`listitem`?void 0:o.isHighlighted},(0,i.toHandlers)(o.listItemListeners)),{default:(0,i.withCtx)(()=>[o.isDefaultType?((0,i.openBlock)(),(0,i.createBlock)(c,{key:0,unstyled:``,class:(0,i.normalizeClass)([`d-list-item__wrapper`,n.wrapperClass]),"left-class":`d-list-item__left`,"content-class":`d-list-item__content`,"title-class":`d-list-item__title`,"subtitle-class":`d-list-item__subtitle`,"bottom-class":`d-list-item__bottom`,"right-class":`d-list-item__right`,"selected-class":`d-list-item__selected`,"data-qa":`dt-list-item-wrapper`},(0,i.createSlots)({_:2},[(0,i.renderList)(e.$slots,(t,n)=>({name:n,fn:(0,i.withCtx)(()=>[(0,i.renderSlot)(e.$slots,n)])})),n.selected?{name:`selected`,fn:(0,i.withCtx)(()=>[(0,i.createVNode)(s,{size:`400`})]),key:`0`}:void 0]),1032,[`class`])):(0,i.renderSlot)(e.$slots,`default`,{key:1})]),_:3},16,[`id`,`class`,`tabindex`,`role`,`aria-selected`])}var l=t.t(s,[[`render`,c]]);exports.default=l;
 //# sourceMappingURL=list-item.cjs.map

package/dist/lib/list-item/list-item.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"list-item.cjs","names":[],"sources":["../../../components/list_item/list_item.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"elementType\"\n    :id=\"id\"\n    :class=\"[\n      'd-list-item',\n      {\n        'd-list-item--focusable': isFocusable,\n        'd-list-item--highlighted': isHighlighted,\n        'd-list-item--static': !isHoverable,\n      }]\"\n    :tabindex=\"isFocusable ? 0 : -1\"\n    :role=\"role\"\n    :aria-selected=\"role === 'listitem' ? undefined : isHighlighted\"\n    v-on=\"listItemListeners\"\n  >\n    <dt-item-layout\n      v-if=\"isDefaultType\"\n      unstyled\n      :class=\"['d-list-item__wrapper', wrapperClass]\"\n      start-class=\"d-list-item__left\"\n      content-class=\"d-list-item__content\"\n      title-class=\"d-list-item__title\"\n      subtitle-class=\"d-list-item__subtitle\"\n      block-end-class=\"d-list-item__bottom\"\n      end-class=\"d-list-item__right\"\n      selected-class=\"d-list-item__selected\"\n      data-qa=\"dt-list-item-wrapper\"\n    >\n      <template\n        v-for=\"(_, slotName) in $slots\"\n        #[slotName]\n      >\n        <!-- @slot named slots for custom list items -->\n        <slot :name=\"slotName\" />\n      </template>\n      <template\n        v-if=\"selected\"\n        #selected\n      >\n        <dt-icon-check size=\"200\" />\n      </template>\n    </dt-item-layout>\n    <!-- @slot slot for the main content -->\n    <slot v-else />\n  </component>\n</template>\n\n<script>\nimport {\n  LIST_ITEM_TYPES,\n  LIST_ITEM_NAVIGATION_TYPES,\n} from './list_item_constants';\nimport utils from '@/common/utils';\nimport { DtIconCheck } from '@dialpad/dialtone-icons/vue';\nimport { DtItemLayout } from '@/components/item_layout';\n\nconst ROLES = ['listitem', 'menuitem', 'option'];\n\n/**\n * A list item is an element that can be used to represent individual items in a list.\n * @see https://dialtone.dialpad.com/components/list_item.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtListItem',\n\n  components: {\n    DtItemLayout,\n    DtIconCheck,\n  },\n\n  /**\n   * Value provided from keyboard_list_navigation.js using id prop.\n   */\n  inject: {\n    highlightId: { default: null },\n  },\n\n  props: {\n    /**\n     * Id for the item.\n     */\n    id: {\n      type: String,\n      default () { return utils.getUniqueString(); },\n    },\n\n    /**\n     * String to use for the item's role.\n     * @values listitem, menuitem, option\n     */\n    role: {\n      type: String,\n      default: 'listitem',\n      validator: (role) => (ROLES).includes(role),\n    },\n\n    /**\n     * HTML element type (tag name) of the content wrapper element.\n     */\n    elementType: {\n      type: String,\n      default: 'li',\n    },\n\n    /**\n     * The type of child list item to use.\n     * @values default, custom\n     */\n    type: {\n      type: String,\n      default: LIST_ITEM_TYPES.DEFAULT,\n      validator: (t) => Object.values(LIST_ITEM_TYPES).includes(t),\n    },\n\n    /**\n     * The type of navigation that this component should support.\n     * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n     * - \"tab\" for items that are navigated using the TAB key.\n     * - \"none\" for static items that are not interactive.\n     * @values arrow-keys, tab, none\n     */\n    navigationType: {\n      type: String,\n      default: LIST_ITEM_NAVIGATION_TYPES.NONE,\n      validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n    },\n\n    /**\n     * Applies selected styles to the list item\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional Classes to apply to the wrapper element,\n     * note: it only applies on \"default\" type\n     * Can accept all of: String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    wrapperClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n\n    /**\n     * Key down event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Native mouse move event\n     *\n     * @event mousemove\n     * @type {MouseEvent}\n     */\n    'mousemove',\n\n    /**\n     * Native mouse leave event\n     *\n     * @event mouseleave\n     * @type {MouseEvent}\n     */\n    'mouseleave',\n  ],\n\n  data () {\n    return {\n      injected: false,\n      mouseHighlighted: false,\n    };\n  },\n\n  computed: {\n    isDefaultType () {\n      return this.type === LIST_ITEM_TYPES.DEFAULT;\n    },\n\n    listItemListeners () {\n      return {\n        click: event => {\n          this.onClick(event);\n        },\n\n        keydown: event => {\n          if (['enter', 'space'].includes(event.code.toLowerCase())) {\n            this.onClick(event);\n          }\n          this.$emit('keydown', event);\n        },\n\n        mousemove: event => {\n          this.onMouseHover(event);\n          this.$emit('mousemove', event);\n        },\n\n        mouseleave: event => {\n          this.onMouseLeave(event);\n          this.$emit('mouseleave', event);\n        },\n      };\n    },\n\n    /**\n     * For keyboard navigation, whether this item is currently highlighted.\n     * An injected highlightId will override the default mouseover highlight.\n     */\n    isHighlighted () {\n      if (this.isHoverable) {\n        return this.highlightId && this.highlightId() ? this.id === this.highlightId() : this.mouseHighlighted;\n      }\n      return false;\n    },\n\n    isFocusable () {\n      // Navigation type has to be set to \"tab\".\n      return this.navigationType === LIST_ITEM_NAVIGATION_TYPES.TAB;\n    },\n\n    /**\n     * Whether to apply hover styles.\n     */\n    isHoverable () {\n      return this.navigationType !== LIST_ITEM_NAVIGATION_TYPES.NONE;\n    },\n  },\n\n  methods: {\n    onClick (e) {\n      // disabled as we do not want to override native click\n      this.$emit('click', e);\n    },\n\n    onMouseHover () {\n      this.mouseHighlighted = true;\n    },\n\n    onMouseLeave () {\n      this.mouseHighlighted = false;\n    },\n  },\n};\n</script>\n"],"mappings":"8XAyDA,IAAM,EAAQ,CAAC,WAAY,WAAY,SAAS,CAM3C,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,aAEN,WAAY,CACV,aAAA,EAAA,QACA,YAAA,EAAA,YACD,CAKD,OAAQ,CACN,YAAa,CAAE,QAAS,KAAM,CAC/B,CAED,MAAO,CAIL,GAAI,CACF,KAAM,OACN,SAAW,CAAE,OAAO,EAAA,QAAM,iBAAiB,EAC5C,CAMD,KAAM,CACJ,KAAM,OACN,QAAS,WACT,UAAY,GAAU,EAAO,SAAS,EAAK,CAC5C,CAKD,YAAa,CACX,KAAM,OACN,QAAS,KACV,CAMD,KAAM,CACJ,KAAM,OACN,QAAS,EAAA,gBAAgB,QACzB,UAAY,GAAM,OAAO,OAAO,EAAA,gBAAgB,CAAC,SAAS,EAAE,CAC7D,CASD,eAAgB,CACd,KAAM,OACN,QAAS,EAAA,2BAA2B,KACpC,UAAY,GAAM,OAAO,OAAO,EAAA,2BAA2B,CAAC,SAAS,EAAE,CACxE,CAKD,SAAU,CACR,KAAM,QACN,QAAS,GACV,CAQD,aAAc,CACZ,KAAM,CAAC,OAAQ,OAAQ,MAAM,CAC7B,QAAS,GACV,CACF,CAED,MAAO,CAOL,QAQA,UAQA,YAQA,aACD,CAED,MAAQ,CACN,MAAO,CACL,SAAU,GACV,iBAAkB,GACnB,EAGH,SAAU,CACR,eAAiB,CACf,OAAO,KAAK,OAAS,EAAA,gBAAgB,SAGvC,mBAAqB,CACnB,MAAO,CACL,MAAO,GAAS,CACd,KAAK,QAAQ,EAAM,EAGrB,QAAS,GAAS,CACZ,CAAC,QAAS,QAAQ,CAAC,SAAS,EAAM,KAAK,aAAa,CAAC,EACvD,KAAK,QAAQ,EAAM,CAErB,KAAK,MAAM,UAAW,EAAM,EAG9B,UAAW,GAAS,CAClB,KAAK,aAAa,EAAM,CACxB,KAAK,MAAM,YAAa,EAAM,EAGhC,WAAY,GAAS,CACnB,KAAK,aAAa,EAAM,CACxB,KAAK,MAAM,aAAc,EAAM,EAElC,EAOH,eAAiB,CAIf,OAHI,KAAK,YACA,KAAK,aAAe,KAAK,aAAY,CAAI,KAAK,KAAO,KAAK,aAAY,CAAI,KAAK,iBAEjF,IAGT,aAAe,CAEb,OAAO,KAAK,iBAAmB,EAAA,2BAA2B,KAM5D,aAAe,CACb,OAAO,KAAK,iBAAmB,EAAA,2BAA2B,MAE7D,CAED,QAAS,CACP,QAAS,EAAG,CAEV,KAAK,MAAM,QAAS,EAAE,EAGxB,cAAgB,CACd,KAAK,iBAAmB,IAG1B,cAAgB,CACd,KAAK,iBAAmB,IAE3B,CACF,0LAhQQ,EAAA,YAAW,EAAA,EAAA,EAAA,YA2CN,CA1CT,GAAI,EAAA,GACJ,MAAK,CAAA,cAAA,0BAAmE,EAAA,uCAAiD,EAAA,qCAA+C,EAAA,cAOxK,SAAU,EAAA,YAAW,EAAA,GACrB,KAAM,EAAA,KACN,gBAAe,EAAA,OAAI,WAAkB,IAAA,GAAY,EAAA,gCAC1B,EAAlB,kBAAiB,CAAA,CAAA,2BA4BN,CAzBT,EAAA,gBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,aAyBS,EAAA,OAxBf,SAAA,GACC,OAAA,EAAA,EAAA,gBAAK,CAAA,uBAA2B,EAAA,aAAY,CAAA,CAC7C,cAAY,oBACZ,gBAAc,uBACd,cAAY,qBACZ,iBAAe,wBACf,kBAAgB,sBAChB,YAAU,qBACV,iBAAe,wBACf,UAAQ,kEAGkB,EAAA,QAAhB,EAAG,WACV,uBAGwB,EAAA,EAAA,EAAA,YAAA,EAAA,OAAZ,EAAQ,CAAA,CAAA,IAGf,EAAA,SAAA,MACL,gCAE2B,EAAA,EAAA,EAAA,aAAA,EAAA,CAAb,KAAK,MAAK,CAAA,CAAA,CAAA,qDAId,EAAA,OAAA,UAAA,CAAA,IAAA,EAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"list-item.cjs","names":[],"sources":["../../../components/list_item/list_item.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"elementType\"\n    :id=\"id\"\n    :class=\"[\n      'd-list-item',\n      {\n        'd-list-item--focusable': isFocusable,\n        'd-list-item--highlighted': isHighlighted,\n        'd-list-item--static': !isHoverable,\n      }]\"\n    :tabindex=\"isFocusable ? 0 : -1\"\n    :role=\"role\"\n    :aria-selected=\"role === 'listitem' ? undefined : isHighlighted\"\n    v-on=\"listItemListeners\"\n  >\n    <dt-item-layout\n      v-if=\"isDefaultType\"\n      unstyled\n      :class=\"['d-list-item__wrapper', wrapperClass]\"\n      left-class=\"d-list-item__left\"\n      content-class=\"d-list-item__content\"\n      title-class=\"d-list-item__title\"\n      subtitle-class=\"d-list-item__subtitle\"\n      bottom-class=\"d-list-item__bottom\"\n      right-class=\"d-list-item__right\"\n      selected-class=\"d-list-item__selected\"\n      data-qa=\"dt-list-item-wrapper\"\n    >\n      <template\n        v-for=\"(_, slotName) in $slots\"\n        #[slotName]\n      >\n        <!-- @slot named slots for custom list items -->\n        <slot :name=\"slotName\" />\n      </template>\n      <template\n        v-if=\"selected\"\n        #selected\n      >\n        <dt-icon-check size=\"400\" />\n      </template>\n    </dt-item-layout>\n    <!-- @slot slot for the main content -->\n    <slot v-else />\n  </component>\n</template>\n\n<script>\nimport {\n  LIST_ITEM_TYPES,\n  LIST_ITEM_NAVIGATION_TYPES,\n} from './list_item_constants';\nimport utils from '@/common/utils';\nimport { DtIconCheck } from '@dialpad/dialtone-icons/vue3';\nimport { DtItemLayout } from '@/components/item_layout';\n\nconst ROLES = ['listitem', 'menuitem', 'option'];\n\n/**\n * A list item is an element that can be used to represent individual items in a list.\n * @see https://dialtone.dialpad.com/components/list_item.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtListItem',\n\n  components: {\n    DtItemLayout,\n    DtIconCheck,\n  },\n\n  /**\n   * Value provided from keyboard_list_navigation.js using id prop.\n   */\n  inject: {\n    highlightId: { default: null },\n  },\n\n  props: {\n    /**\n     * Id for the item.\n     */\n    id: {\n      type: String,\n      default () { return utils.getUniqueString(); },\n    },\n\n    /**\n     * String to use for the item's role.\n     */\n    role: {\n      type: String,\n      default: 'listitem',\n      validator: (role) => (ROLES).includes(role),\n    },\n\n    /**\n     * HTML element type (tag name) of the content wrapper element.\n     */\n    elementType: {\n      type: String,\n      default: 'li',\n    },\n\n    /**\n     * The type of child list item to use.\n     * @values default, custom\n     */\n    type: {\n      type: String,\n      default: LIST_ITEM_TYPES.DEFAULT,\n      validator: (t) => Object.values(LIST_ITEM_TYPES).includes(t),\n    },\n\n    /**\n     * The type of navigation that this component should support.\n     * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n     * - \"tab\" for items that are navigated using the TAB key.\n     * - \"none\" for static items that are not interactive.\n     * @values arrow-keys, tab, none\n     */\n    navigationType: {\n      type: String,\n      default: LIST_ITEM_NAVIGATION_TYPES.NONE,\n      validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n    },\n\n    /**\n     * Applies selected styles to the list item\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional Classes to apply to the wrapper element,\n     * note: it only applies on \"default\" type\n     * Can accept all of: String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    wrapperClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Key down event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Native mouse move event\n     *\n     * @event mousemove\n     * @type {MouseEvent}\n     */\n    'mousemove',\n\n    /**\n     * Native mouse leave event\n     *\n     * @event mouseleave\n     * @type {MouseEvent}\n     */\n    'mouseleave',\n  ],\n\n  data () {\n    return {\n      injected: false,\n      mouseHighlighted: false,\n    };\n  },\n\n  computed: {\n    isDefaultType () {\n      return this.type === LIST_ITEM_TYPES.DEFAULT;\n    },\n\n    listItemListeners () {\n      return {\n        keydown: event => {\n          if (['enter', 'space'].includes(event.code.toLowerCase())) {\n            this.onClick(event);\n          }\n          this.$emit('keydown', event);\n        },\n\n        mousemove: event => {\n          this.onMouseHover(event);\n          this.$emit('mousemove', event);\n        },\n\n        mouseleave: event => {\n          this.onMouseLeave(event);\n          this.$emit('mouseleave', event);\n        },\n      };\n    },\n\n    /**\n     * For keyboard navigation, whether this item is currently highlighted.\n     * An injected highlightId will override the default mouseover highlight.\n     */\n    isHighlighted () {\n      if (this.isHoverable) {\n        return this.highlightId && this.highlightId() ? this.id === this.highlightId() : this.mouseHighlighted;\n      }\n      return false;\n    },\n\n    isFocusable () {\n      // Navigation type has to be set to \"tab\".\n      return this.navigationType === LIST_ITEM_NAVIGATION_TYPES.TAB;\n    },\n\n    /**\n     * Whether to apply hover styles.\n     */\n    isHoverable () {\n      return this.navigationType !== LIST_ITEM_NAVIGATION_TYPES.NONE;\n    },\n  },\n\n  methods: {\n    onClick (e) {\n      // disabled as we do not want to override native click\n      // eslint-disable-next-line vue/require-explicit-emits\n      this.$emit('click', e);\n    },\n\n    onMouseHover () {\n      this.mouseHighlighted = true;\n    },\n\n    onMouseLeave () {\n      this.mouseHighlighted = false;\n    },\n  },\n};\n</script>\n"],"mappings":"+XAyDA,IAAM,EAAQ,CAAC,WAAY,WAAY,SAAS,CAM3C,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,aAEN,WAAY,CACV,aAAA,EAAA,QACA,YAAA,EAAA,YACD,CAKD,OAAQ,CACN,YAAa,CAAE,QAAS,KAAM,CAC/B,CAED,MAAO,CAIL,GAAI,CACF,KAAM,OACN,SAAW,CAAE,OAAO,EAAA,QAAM,iBAAiB,EAC5C,CAKD,KAAM,CACJ,KAAM,OACN,QAAS,WACT,UAAY,GAAU,EAAO,SAAS,EAAK,CAC5C,CAKD,YAAa,CACX,KAAM,OACN,QAAS,KACV,CAMD,KAAM,CACJ,KAAM,OACN,QAAS,EAAA,gBAAgB,QACzB,UAAY,GAAM,OAAO,OAAO,EAAA,gBAAgB,CAAC,SAAS,EAAE,CAC7D,CASD,eAAgB,CACd,KAAM,OACN,QAAS,EAAA,2BAA2B,KACpC,UAAY,GAAM,OAAO,OAAO,EAAA,2BAA2B,CAAC,SAAS,EAAE,CACxE,CAKD,SAAU,CACR,KAAM,QACN,QAAS,GACV,CAQD,aAAc,CACZ,KAAM,CAAC,OAAQ,OAAQ,MAAM,CAC7B,QAAS,GACV,CACF,CAED,MAAO,CAOL,UAQA,YAQA,aACD,CAED,MAAQ,CACN,MAAO,CACL,SAAU,GACV,iBAAkB,GACnB,EAGH,SAAU,CACR,eAAiB,CACf,OAAO,KAAK,OAAS,EAAA,gBAAgB,SAGvC,mBAAqB,CACnB,MAAO,CACL,QAAS,GAAS,CACZ,CAAC,QAAS,QAAQ,CAAC,SAAS,EAAM,KAAK,aAAa,CAAC,EACvD,KAAK,QAAQ,EAAM,CAErB,KAAK,MAAM,UAAW,EAAM,EAG9B,UAAW,GAAS,CAClB,KAAK,aAAa,EAAM,CACxB,KAAK,MAAM,YAAa,EAAM,EAGhC,WAAY,GAAS,CACnB,KAAK,aAAa,EAAM,CACxB,KAAK,MAAM,aAAc,EAAM,EAElC,EAOH,eAAiB,CAIf,OAHI,KAAK,YACA,KAAK,aAAe,KAAK,aAAY,CAAI,KAAK,KAAO,KAAK,aAAY,CAAI,KAAK,iBAEjF,IAGT,aAAe,CAEb,OAAO,KAAK,iBAAmB,EAAA,2BAA2B,KAM5D,aAAe,CACb,OAAO,KAAK,iBAAmB,EAAA,2BAA2B,MAE7D,CAED,QAAS,CACP,QAAS,EAAG,CAGV,KAAK,MAAM,QAAS,EAAE,EAGxB,cAAgB,CACd,KAAK,iBAAmB,IAG1B,cAAgB,CACd,KAAK,iBAAmB,IAE3B,CACF,0LApPQ,EAAA,YAAW,EAAA,EAAA,EAAA,YA2CN,CA1CT,GAAI,EAAA,GACJ,MAAK,CAAA,cAAA,0BAAmE,EAAA,uCAAiD,EAAA,qCAA+C,EAAA,cAOxK,SAAU,EAAA,YAAW,EAAA,GACrB,KAAM,EAAA,KACN,gBAAe,EAAA,OAAI,WAAkB,IAAA,GAAY,EAAA,gCAC1B,EAAlB,kBAAiB,CAAA,CAAA,2BA4BN,CAzBT,EAAA,gBAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,aAyBS,EAAA,OAxBf,SAAA,GACC,OAAA,EAAA,EAAA,gBAAK,CAAA,uBAA2B,EAAA,aAAY,CAAA,CAC7C,aAAW,oBACX,gBAAc,uBACd,cAAY,qBACZ,iBAAe,wBACf,eAAa,sBACb,cAAY,qBACZ,iBAAe,wBACf,UAAQ,kEAGkB,EAAA,QAAhB,EAAG,WACV,uBAGwB,EAAA,EAAA,EAAA,YAAA,EAAA,OAAZ,EAAQ,CAAA,CAAA,IAGf,EAAA,SAAA,MACL,gCAE2B,EAAA,EAAA,EAAA,aAAA,EAAA,CAAb,KAAK,MAAK,CAAA,CAAA,CAAA,qDAId,EAAA,OAAA,UAAA,CAAA,IAAA,EAAA,CAAA,CAAA,CAAA"}

package/dist/lib/list-item/list-item.js

@@ -3,7 +3,7 @@ import { t } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
 import { LIST_ITEM_NAVIGATION_TYPES as n, LIST_ITEM_TYPES as r } from "./list-item-constants.js";
 import i from "../item-layout/item-layout.js";
 import { createBlock as a, createSlots as o, createVNode as s, mergeProps as c, normalizeClass as l, openBlock as u, renderList as d, renderSlot as f, resolveComponent as p, resolveDynamicComponent as m, toHandlers as h, withCtx as g } from "vue";
-import { DtIconCheck as _ } from "@dialpad/dialtone-icons/vue";
+import { DtIconCheck as _ } from "@dialpad/dialtone-icons/vue3";
 //#region components/list_item/list_item.vue
 var v = [
 	"listitem",
@@ -57,7 +57,6 @@ var v = [
 		}
 	},
 	emits: [
-		"click",
 		"keydown",
 		"mousemove",
 		"mouseleave"
@@ -74,9 +73,6 @@ var v = [
 		},
 		listItemListeners() {
 			return {
-				click: (e) => {
-					this.onClick(e);
-				},
 				keydown: (e) => {
 					["enter", "space"].includes(e.code.toLowerCase()) && this.onClick(e), this.$emit("keydown", e);
 				},
@@ -127,12 +123,12 @@ function b(e, t, n, r, i, _) {
 			key: 0,
 			unstyled: "",
 			class: l(["d-list-item__wrapper", n.wrapperClass]),
-			"start-class": "d-list-item__left",
+			"left-class": "d-list-item__left",
 			"content-class": "d-list-item__content",
 			"title-class": "d-list-item__title",
 			"subtitle-class": "d-list-item__subtitle",
-			"block-end-class": "d-list-item__bottom",
-			"end-class": "d-list-item__right",
+			"bottom-class": "d-list-item__bottom",
+			"right-class": "d-list-item__right",
 			"selected-class": "d-list-item__selected",
 			"data-qa": "dt-list-item-wrapper"
 		}, o({ _: 2 }, [d(e.$slots, (t, n) => ({
@@ -140,7 +136,7 @@ function b(e, t, n, r, i, _) {
 			fn: g(() => [f(e.$slots, n)])
 		})), n.selected ? {
 			name: "selected",
-			fn: g(() => [s(v, { size: "200" })]),
+			fn: g(() => [s(v, { size: "400" })]),
 			key: "0"
 		} : void 0]), 1032, ["class"])) : f(e.$slots, "default", { key: 1 })]),
 		_: 3

package/dist/lib/list-item/list-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"list-item.js","names":[],"sources":["../../../components/list_item/list_item.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"elementType\"\n    :id=\"id\"\n    :class=\"[\n      'd-list-item',\n      {\n        'd-list-item--focusable': isFocusable,\n        'd-list-item--highlighted': isHighlighted,\n        'd-list-item--static': !isHoverable,\n      }]\"\n    :tabindex=\"isFocusable ? 0 : -1\"\n    :role=\"role\"\n    :aria-selected=\"role === 'listitem' ? undefined : isHighlighted\"\n    v-on=\"listItemListeners\"\n  >\n    <dt-item-layout\n      v-if=\"isDefaultType\"\n      unstyled\n      :class=\"['d-list-item__wrapper', wrapperClass]\"\n      start-class=\"d-list-item__left\"\n      content-class=\"d-list-item__content\"\n      title-class=\"d-list-item__title\"\n      subtitle-class=\"d-list-item__subtitle\"\n      block-end-class=\"d-list-item__bottom\"\n      end-class=\"d-list-item__right\"\n      selected-class=\"d-list-item__selected\"\n      data-qa=\"dt-list-item-wrapper\"\n    >\n      <template\n        v-for=\"(_, slotName) in $slots\"\n        #[slotName]\n      >\n        <!-- @slot named slots for custom list items -->\n        <slot :name=\"slotName\" />\n      </template>\n      <template\n        v-if=\"selected\"\n        #selected\n      >\n        <dt-icon-check size=\"200\" />\n      </template>\n    </dt-item-layout>\n    <!-- @slot slot for the main content -->\n    <slot v-else />\n  </component>\n</template>\n\n<script>\nimport {\n  LIST_ITEM_TYPES,\n  LIST_ITEM_NAVIGATION_TYPES,\n} from './list_item_constants';\nimport utils from '@/common/utils';\nimport { DtIconCheck } from '@dialpad/dialtone-icons/vue';\nimport { DtItemLayout } from '@/components/item_layout';\n\nconst ROLES = ['listitem', 'menuitem', 'option'];\n\n/**\n * A list item is an element that can be used to represent individual items in a list.\n * @see https://dialtone.dialpad.com/components/list_item.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtListItem',\n\n  components: {\n    DtItemLayout,\n    DtIconCheck,\n  },\n\n  /**\n   * Value provided from keyboard_list_navigation.js using id prop.\n   */\n  inject: {\n    highlightId: { default: null },\n  },\n\n  props: {\n    /**\n     * Id for the item.\n     */\n    id: {\n      type: String,\n      default () { return utils.getUniqueString(); },\n    },\n\n    /**\n     * String to use for the item's role.\n     * @values listitem, menuitem, option\n     */\n    role: {\n      type: String,\n      default: 'listitem',\n      validator: (role) => (ROLES).includes(role),\n    },\n\n    /**\n     * HTML element type (tag name) of the content wrapper element.\n     */\n    elementType: {\n      type: String,\n      default: 'li',\n    },\n\n    /**\n     * The type of child list item to use.\n     * @values default, custom\n     */\n    type: {\n      type: String,\n      default: LIST_ITEM_TYPES.DEFAULT,\n      validator: (t) => Object.values(LIST_ITEM_TYPES).includes(t),\n    },\n\n    /**\n     * The type of navigation that this component should support.\n     * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n     * - \"tab\" for items that are navigated using the TAB key.\n     * - \"none\" for static items that are not interactive.\n     * @values arrow-keys, tab, none\n     */\n    navigationType: {\n      type: String,\n      default: LIST_ITEM_NAVIGATION_TYPES.NONE,\n      validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n    },\n\n    /**\n     * Applies selected styles to the list item\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional Classes to apply to the wrapper element,\n     * note: it only applies on \"default\" type\n     * Can accept all of: String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    wrapperClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n\n    /**\n     * Key down event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Native mouse move event\n     *\n     * @event mousemove\n     * @type {MouseEvent}\n     */\n    'mousemove',\n\n    /**\n     * Native mouse leave event\n     *\n     * @event mouseleave\n     * @type {MouseEvent}\n     */\n    'mouseleave',\n  ],\n\n  data () {\n    return {\n      injected: false,\n      mouseHighlighted: false,\n    };\n  },\n\n  computed: {\n    isDefaultType () {\n      return this.type === LIST_ITEM_TYPES.DEFAULT;\n    },\n\n    listItemListeners () {\n      return {\n        click: event => {\n          this.onClick(event);\n        },\n\n        keydown: event => {\n          if (['enter', 'space'].includes(event.code.toLowerCase())) {\n            this.onClick(event);\n          }\n          this.$emit('keydown', event);\n        },\n\n        mousemove: event => {\n          this.onMouseHover(event);\n          this.$emit('mousemove', event);\n        },\n\n        mouseleave: event => {\n          this.onMouseLeave(event);\n          this.$emit('mouseleave', event);\n        },\n      };\n    },\n\n    /**\n     * For keyboard navigation, whether this item is currently highlighted.\n     * An injected highlightId will override the default mouseover highlight.\n     */\n    isHighlighted () {\n      if (this.isHoverable) {\n        return this.highlightId && this.highlightId() ? this.id === this.highlightId() : this.mouseHighlighted;\n      }\n      return false;\n    },\n\n    isFocusable () {\n      // Navigation type has to be set to \"tab\".\n      return this.navigationType === LIST_ITEM_NAVIGATION_TYPES.TAB;\n    },\n\n    /**\n     * Whether to apply hover styles.\n     */\n    isHoverable () {\n      return this.navigationType !== LIST_ITEM_NAVIGATION_TYPES.NONE;\n    },\n  },\n\n  methods: {\n    onClick (e) {\n      // disabled as we do not want to override native click\n      this.$emit('click', e);\n    },\n\n    onMouseHover () {\n      this.mouseHighlighted = true;\n    },\n\n    onMouseLeave () {\n      this.mouseHighlighted = false;\n    },\n  },\n};\n</script>\n"],"mappings":";;;;;;;AAyDA,IAAM,IAAQ;CAAC;CAAY;CAAY;CAAS,EAM3C,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,YAAY;EACV,cAAA;EACA;EACD;CAKD,QAAQ,EACN,aAAa,EAAE,SAAS,MAAM,EAC/B;CAED,OAAO;EAIL,IAAI;GACF,MAAM;GACN,UAAW;AAAE,WAAO,EAAM,iBAAiB;;GAC5C;EAMD,MAAM;GACJ,MAAM;GACN,SAAS;GACT,YAAY,MAAU,EAAO,SAAS,EAAK;GAC5C;EAKD,aAAa;GACX,MAAM;GACN,SAAS;GACV;EAMD,MAAM;GACJ,MAAM;GACN,SAAS,EAAgB;GACzB,YAAY,MAAM,OAAO,OAAO,EAAgB,CAAC,SAAS,EAAE;GAC7D;EASD,gBAAgB;GACd,MAAM;GACN,SAAS,EAA2B;GACpC,YAAY,MAAM,OAAO,OAAO,EAA2B,CAAC,SAAS,EAAE;GACxE;EAKD,UAAU;GACR,MAAM;GACN,SAAS;GACV;EAQD,cAAc;GACZ,MAAM;IAAC;IAAQ;IAAQ;IAAM;GAC7B,SAAS;GACV;EACF;CAED,OAAO;EAOL;EAQA;EAQA;EAQA;EACD;CAED,OAAQ;AACN,SAAO;GACL,UAAU;GACV,kBAAkB;GACnB;;CAGH,UAAU;EACR,gBAAiB;AACf,UAAO,KAAK,SAAS,EAAgB;;EAGvC,oBAAqB;AACnB,UAAO;IACL,QAAO,MAAS;AACd,UAAK,QAAQ,EAAM;;IAGrB,UAAS,MAAS;AAIhB,KAHI,CAAC,SAAS,QAAQ,CAAC,SAAS,EAAM,KAAK,aAAa,CAAC,IACvD,KAAK,QAAQ,EAAM,EAErB,KAAK,MAAM,WAAW,EAAM;;IAG9B,YAAW,MAAS;AAElB,KADA,KAAK,aAAa,EAAM,EACxB,KAAK,MAAM,aAAa,EAAM;;IAGhC,aAAY,MAAS;AAEnB,KADA,KAAK,aAAa,EAAM,EACxB,KAAK,MAAM,cAAc,EAAM;;IAElC;;EAOH,gBAAiB;AAIf,UAHI,KAAK,cACA,KAAK,eAAe,KAAK,aAAY,GAAI,KAAK,OAAO,KAAK,aAAY,GAAI,KAAK,mBAEjF;;EAGT,cAAe;AAEb,UAAO,KAAK,mBAAmB,EAA2B;;EAM5D,cAAe;AACb,UAAO,KAAK,mBAAmB,EAA2B;;EAE7D;CAED,SAAS;EACP,QAAS,GAAG;AAEV,QAAK,MAAM,SAAS,EAAE;;EAGxB,eAAgB;AACd,QAAK,mBAAmB;;EAG1B,eAAgB;AACd,QAAK,mBAAmB;;EAE3B;CACF;;;aAjQC,EA4CY,EA3CL,EAAA,YAAW,EADlB,EA4CY;EA1CT,IAAI,EAAA;EACJ,OAAK,CAAA,eAAA;6BAAmE,EAAA;+BAAiD,EAAA;2BAA+C,EAAA;;EAOxK,UAAU,EAAA,cAAW,IAAA;EACrB,MAAM,EAAA;EACN,iBAAe,EAAA,SAAI,aAAkB,KAAA,IAAY,EAAA;IAClD,EAAwB,EAAlB,kBAAiB,CAAA,EAAA;mBA4BN,CAzBT,EAAA,iBAAA,GAAA,EADR,EA0BiB,GAAA;;GAxBf,UAAA;GACC,OAAK,EAAA,CAAA,wBAA2B,EAAA,aAAY,CAAA;GAC7C,eAAY;GACZ,iBAAc;GACd,eAAY;GACZ,kBAAe;GACf,mBAAgB;GAChB,aAAU;GACV,kBAAe;GACf,WAAQ;oBAGkB,EAAA,SAAhB,GAAG;SACV;eAGwB,CAAzB,EAAyB,EAAA,QAAZ,EAAQ,CAAA,CAAA;OAGf,EAAA,WAAA;SACL;eAE2B,CAA5B,EAA4B,GAAA,EAAb,MAAK,OAAK,CAAA,CAAA,CAAA;;oCAI7B,EAAe,EAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"list-item.js","names":[],"sources":["../../../components/list_item/list_item.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"elementType\"\n    :id=\"id\"\n    :class=\"[\n      'd-list-item',\n      {\n        'd-list-item--focusable': isFocusable,\n        'd-list-item--highlighted': isHighlighted,\n        'd-list-item--static': !isHoverable,\n      }]\"\n    :tabindex=\"isFocusable ? 0 : -1\"\n    :role=\"role\"\n    :aria-selected=\"role === 'listitem' ? undefined : isHighlighted\"\n    v-on=\"listItemListeners\"\n  >\n    <dt-item-layout\n      v-if=\"isDefaultType\"\n      unstyled\n      :class=\"['d-list-item__wrapper', wrapperClass]\"\n      left-class=\"d-list-item__left\"\n      content-class=\"d-list-item__content\"\n      title-class=\"d-list-item__title\"\n      subtitle-class=\"d-list-item__subtitle\"\n      bottom-class=\"d-list-item__bottom\"\n      right-class=\"d-list-item__right\"\n      selected-class=\"d-list-item__selected\"\n      data-qa=\"dt-list-item-wrapper\"\n    >\n      <template\n        v-for=\"(_, slotName) in $slots\"\n        #[slotName]\n      >\n        <!-- @slot named slots for custom list items -->\n        <slot :name=\"slotName\" />\n      </template>\n      <template\n        v-if=\"selected\"\n        #selected\n      >\n        <dt-icon-check size=\"400\" />\n      </template>\n    </dt-item-layout>\n    <!-- @slot slot for the main content -->\n    <slot v-else />\n  </component>\n</template>\n\n<script>\nimport {\n  LIST_ITEM_TYPES,\n  LIST_ITEM_NAVIGATION_TYPES,\n} from './list_item_constants';\nimport utils from '@/common/utils';\nimport { DtIconCheck } from '@dialpad/dialtone-icons/vue3';\nimport { DtItemLayout } from '@/components/item_layout';\n\nconst ROLES = ['listitem', 'menuitem', 'option'];\n\n/**\n * A list item is an element that can be used to represent individual items in a list.\n * @see https://dialtone.dialpad.com/components/list_item.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtListItem',\n\n  components: {\n    DtItemLayout,\n    DtIconCheck,\n  },\n\n  /**\n   * Value provided from keyboard_list_navigation.js using id prop.\n   */\n  inject: {\n    highlightId: { default: null },\n  },\n\n  props: {\n    /**\n     * Id for the item.\n     */\n    id: {\n      type: String,\n      default () { return utils.getUniqueString(); },\n    },\n\n    /**\n     * String to use for the item's role.\n     */\n    role: {\n      type: String,\n      default: 'listitem',\n      validator: (role) => (ROLES).includes(role),\n    },\n\n    /**\n     * HTML element type (tag name) of the content wrapper element.\n     */\n    elementType: {\n      type: String,\n      default: 'li',\n    },\n\n    /**\n     * The type of child list item to use.\n     * @values default, custom\n     */\n    type: {\n      type: String,\n      default: LIST_ITEM_TYPES.DEFAULT,\n      validator: (t) => Object.values(LIST_ITEM_TYPES).includes(t),\n    },\n\n    /**\n     * The type of navigation that this component should support.\n     * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n     * - \"tab\" for items that are navigated using the TAB key.\n     * - \"none\" for static items that are not interactive.\n     * @values arrow-keys, tab, none\n     */\n    navigationType: {\n      type: String,\n      default: LIST_ITEM_NAVIGATION_TYPES.NONE,\n      validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n    },\n\n    /**\n     * Applies selected styles to the list item\n     */\n    selected: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional Classes to apply to the wrapper element,\n     * note: it only applies on \"default\" type\n     * Can accept all of: String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    wrapperClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Key down event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Native mouse move event\n     *\n     * @event mousemove\n     * @type {MouseEvent}\n     */\n    'mousemove',\n\n    /**\n     * Native mouse leave event\n     *\n     * @event mouseleave\n     * @type {MouseEvent}\n     */\n    'mouseleave',\n  ],\n\n  data () {\n    return {\n      injected: false,\n      mouseHighlighted: false,\n    };\n  },\n\n  computed: {\n    isDefaultType () {\n      return this.type === LIST_ITEM_TYPES.DEFAULT;\n    },\n\n    listItemListeners () {\n      return {\n        keydown: event => {\n          if (['enter', 'space'].includes(event.code.toLowerCase())) {\n            this.onClick(event);\n          }\n          this.$emit('keydown', event);\n        },\n\n        mousemove: event => {\n          this.onMouseHover(event);\n          this.$emit('mousemove', event);\n        },\n\n        mouseleave: event => {\n          this.onMouseLeave(event);\n          this.$emit('mouseleave', event);\n        },\n      };\n    },\n\n    /**\n     * For keyboard navigation, whether this item is currently highlighted.\n     * An injected highlightId will override the default mouseover highlight.\n     */\n    isHighlighted () {\n      if (this.isHoverable) {\n        return this.highlightId && this.highlightId() ? this.id === this.highlightId() : this.mouseHighlighted;\n      }\n      return false;\n    },\n\n    isFocusable () {\n      // Navigation type has to be set to \"tab\".\n      return this.navigationType === LIST_ITEM_NAVIGATION_TYPES.TAB;\n    },\n\n    /**\n     * Whether to apply hover styles.\n     */\n    isHoverable () {\n      return this.navigationType !== LIST_ITEM_NAVIGATION_TYPES.NONE;\n    },\n  },\n\n  methods: {\n    onClick (e) {\n      // disabled as we do not want to override native click\n      // eslint-disable-next-line vue/require-explicit-emits\n      this.$emit('click', e);\n    },\n\n    onMouseHover () {\n      this.mouseHighlighted = true;\n    },\n\n    onMouseLeave () {\n      this.mouseHighlighted = false;\n    },\n  },\n};\n</script>\n"],"mappings":";;;;;;;AAyDA,IAAM,IAAQ;CAAC;CAAY;CAAY;CAAS,EAM3C,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,YAAY;EACV,cAAA;EACA;EACD;CAKD,QAAQ,EACN,aAAa,EAAE,SAAS,MAAM,EAC/B;CAED,OAAO;EAIL,IAAI;GACF,MAAM;GACN,UAAW;AAAE,WAAO,EAAM,iBAAiB;;GAC5C;EAKD,MAAM;GACJ,MAAM;GACN,SAAS;GACT,YAAY,MAAU,EAAO,SAAS,EAAK;GAC5C;EAKD,aAAa;GACX,MAAM;GACN,SAAS;GACV;EAMD,MAAM;GACJ,MAAM;GACN,SAAS,EAAgB;GACzB,YAAY,MAAM,OAAO,OAAO,EAAgB,CAAC,SAAS,EAAE;GAC7D;EASD,gBAAgB;GACd,MAAM;GACN,SAAS,EAA2B;GACpC,YAAY,MAAM,OAAO,OAAO,EAA2B,CAAC,SAAS,EAAE;GACxE;EAKD,UAAU;GACR,MAAM;GACN,SAAS;GACV;EAQD,cAAc;GACZ,MAAM;IAAC;IAAQ;IAAQ;IAAM;GAC7B,SAAS;GACV;EACF;CAED,OAAO;EAOL;EAQA;EAQA;EACD;CAED,OAAQ;AACN,SAAO;GACL,UAAU;GACV,kBAAkB;GACnB;;CAGH,UAAU;EACR,gBAAiB;AACf,UAAO,KAAK,SAAS,EAAgB;;EAGvC,oBAAqB;AACnB,UAAO;IACL,UAAS,MAAS;AAIhB,KAHI,CAAC,SAAS,QAAQ,CAAC,SAAS,EAAM,KAAK,aAAa,CAAC,IACvD,KAAK,QAAQ,EAAM,EAErB,KAAK,MAAM,WAAW,EAAM;;IAG9B,YAAW,MAAS;AAElB,KADA,KAAK,aAAa,EAAM,EACxB,KAAK,MAAM,aAAa,EAAM;;IAGhC,aAAY,MAAS;AAEnB,KADA,KAAK,aAAa,EAAM,EACxB,KAAK,MAAM,cAAc,EAAM;;IAElC;;EAOH,gBAAiB;AAIf,UAHI,KAAK,cACA,KAAK,eAAe,KAAK,aAAY,GAAI,KAAK,OAAO,KAAK,aAAY,GAAI,KAAK,mBAEjF;;EAGT,cAAe;AAEb,UAAO,KAAK,mBAAmB,EAA2B;;EAM5D,cAAe;AACb,UAAO,KAAK,mBAAmB,EAA2B;;EAE7D;CAED,SAAS;EACP,QAAS,GAAG;AAGV,QAAK,MAAM,SAAS,EAAE;;EAGxB,eAAgB;AACd,QAAK,mBAAmB;;EAG1B,eAAgB;AACd,QAAK,mBAAmB;;EAE3B;CACF;;;aArPC,EA4CY,EA3CL,EAAA,YAAW,EADlB,EA4CY;EA1CT,IAAI,EAAA;EACJ,OAAK,CAAA,eAAA;6BAAmE,EAAA;+BAAiD,EAAA;2BAA+C,EAAA;;EAOxK,UAAU,EAAA,cAAW,IAAA;EACrB,MAAM,EAAA;EACN,iBAAe,EAAA,SAAI,aAAkB,KAAA,IAAY,EAAA;IAClD,EAAwB,EAAlB,kBAAiB,CAAA,EAAA;mBA4BN,CAzBT,EAAA,iBAAA,GAAA,EADR,EA0BiB,GAAA;;GAxBf,UAAA;GACC,OAAK,EAAA,CAAA,wBAA2B,EAAA,aAAY,CAAA;GAC7C,cAAW;GACX,iBAAc;GACd,eAAY;GACZ,kBAAe;GACf,gBAAa;GACb,eAAY;GACZ,kBAAe;GACf,WAAQ;oBAGkB,EAAA,SAAhB,GAAG;SACV;eAGwB,CAAzB,EAAyB,EAAA,QAAZ,EAAQ,CAAA,CAAA;OAGf,EAAA,WAAA;SACL;eAE2B,CAA5B,EAA4B,GAAA,EAAb,MAAK,OAAK,CAAA,CAAA,CAAA;;oCAI7B,EAAe,EAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/lib/list-item-group/list-item-group.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/utils/index.cjs`),t=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`);let n=require(`vue`);var r={compatConfig:{MODE:3},name:`DtListItemGroup`,props:{id:{type:String,default(){return e.getUniqueString()}},heading:{type:String,default:``},headingClass:{type:[String,Array,Object],default:``},listClass:{type:[String,Array,Object],default:``}}},i=[`id`,`aria-labelledby`],a=[`id`];function o(e,t,r,o,s,c){return(0,n.openBlock)(),(0,n.createElementBlock)(`ul`,{id:r.id,class:(0,n.normalizeClass)([`d-list-item-group`,r.listClass]),role:`group`,"data-qa":`dt-dropdown-list-wrapper`,"aria-labelledby":`${r.id}-heading`},[r.heading?((0,n.openBlock)(),(0,n.createElementBlock)(`li`,{key:0,id:`${r.id}-heading`,role:`presentation`,"data-qa":`dt-dropdown-list-heading`,class:(0,n.normalizeClass)([`dt-dropdown-list--header`,r.headingClass])},[(0,n.renderSlot)(e.$slots,`heading`,{},()=>[(0,n.createTextVNode)((0,n.toDisplayString)(r.heading),1)])],10,a)):(0,n.createCommentVNode)(``,!0),(0,n.renderSlot)(e.$slots,`default`)],10,i)}var s=t.t(r,[[`render`,o]]);exports.default=s;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/utils/index.cjs`),t=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`);let n=require(`vue`);var r={compatConfig:{MODE:3},name:`DtListItemGroup`,props:{id:{type:String,default(){return e.getUniqueString()}},heading:{type:String,default:``},headingClass:{type:[String,Array,Object],default:``},listClass:{type:[String,Array,Object],default:``}}},i=[`id`,`aria-labelledby`],a=[`id`];function o(e,t,r,o,s,c){return(0,n.openBlock)(),(0,n.createElementBlock)(`ul`,{id:r.id,class:(0,n.normalizeClass)([`d-list-item-group`,r.listClass]),role:`group`,"data-qa":`dt-dropdown-list-wrapper`,"aria-labelledby":`${r.id}-heading`},[r.heading?((0,n.openBlock)(),(0,n.createElementBlock)(`li`,{key:0,id:`${r.id}-heading`,role:`presentation`,"data-qa":`dt-dropdown-list-heading`,class:(0,n.normalizeClass)([`dt-dropdown-list--header`,r.headingClass])},[(0,n.renderSlot)(e.$slots,`headingSlot`,{},()=>[(0,n.createTextVNode)((0,n.toDisplayString)(r.heading),1)])],10,a)):(0,n.createCommentVNode)(``,!0),(0,n.renderSlot)(e.$slots,`default`)],10,i)}var s=t.t(r,[[`render`,o]]);exports.default=s;
 //# sourceMappingURL=list-item-group.cjs.map

package/dist/lib/list-item-group/list-item-group.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"list-item-group.cjs","names":[],"sources":["../../../components/list_item_group/list_item_group.vue"],"sourcesContent":["<template>\n  <ul\n    :id=\"id\"\n    :class=\"['d-list-item-group', listClass]\"\n    role=\"group\"\n    data-qa=\"dt-dropdown-list-wrapper\"\n    :aria-labelledby=\"`${id}-heading`\"\n  >\n    <li\n      v-if=\"heading\"\n      :id=\"`${id}-heading`\"\n      role=\"presentation\"\n      data-qa=\"dt-dropdown-list-heading\"\n      :class=\"['dt-dropdown-list--header', headingClass]\"\n    >\n      <!-- @slot Slot for heading, will override heading prop -->\n      <slot name=\"heading\">\n        {{ heading }}\n      </slot>\n    </li>\n    <!-- @slot Slot for the list component -->\n    <slot />\n  </ul>\n</template>\n\n<script>\nimport {} from './list_item_group_constants';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtListItemGroup',\n\n  props: {\n    /**\n     * Id of the List Item Group\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * List's heading.\n     * Can also be overridden with a slot of the same name.\n     */\n    heading: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class to style the heading\n     */\n    headingClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class for the wrapper list element.\n     */\n    listClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n};\n</script>\n"],"mappings":"kQA6BA,IAAK,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,kBAEN,MAAO,CAIL,GAAI,CACF,KAAM,OACN,SAAW,CAAE,OAAO,EAAA,iBAAiB,EACtC,CAMD,QAAS,CACP,KAAM,OACN,QAAS,GACV,CAKD,aAAc,CACZ,KAAM,CAAC,OAAQ,MAAO,OAAO,CAC7B,QAAS,GACV,CAKD,UAAW,CACT,KAAM,CAAC,OAAQ,MAAO,OAAO,CAC7B,QAAS,GACV,CACF,CACF,8GA7CM,KAAA,CApBF,GAAI,EAAA,GACJ,OAAA,EAAA,EAAA,gBAAK,CAAA,oBAAwB,EAAA,UAAS,CAAA,CACvC,KAAK,QACL,UAAQ,2BACP,kBAAe,GAAK,EAAA,GAAE,YAGf,EAAA,UAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAUH,KAAA,OATF,GAAE,GAAK,EAAA,GAAE,UACV,KAAK,eACL,UAAQ,2BACP,OAAA,EAAA,EAAA,gBAAK,CAAA,2BAA+B,EAAA,aAAY,CAAA,oBAK1C,EAAA,OAAA,UAAA,EAAA,KAAA,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBADF,EAAA,QAAO,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,GAAA,EAAA,EAAA,oBAAA,GAAA,GAAA,EAAA,EAAA,EAAA,YAIN,EAAA,OAAA,UAAA,CAAA,CAAA,GAAA,EAAA"}
+{"version":3,"file":"list-item-group.cjs","names":[],"sources":["../../../components/list_item_group/list_item_group.vue"],"sourcesContent":["<template>\n  <ul\n    :id=\"id\"\n    :class=\"['d-list-item-group', listClass]\"\n    role=\"group\"\n    data-qa=\"dt-dropdown-list-wrapper\"\n    :aria-labelledby=\"`${id}-heading`\"\n  >\n    <li\n      v-if=\"heading\"\n      :id=\"`${id}-heading`\"\n      role=\"presentation\"\n      data-qa=\"dt-dropdown-list-heading\"\n      :class=\"['dt-dropdown-list--header', headingClass]\"\n    >\n      <!-- @slot Slot for heading, will override heading prop. -->\n      <slot name=\"headingSlot\">\n        {{ heading }}\n      </slot>\n    </li>\n    <!-- @slot Slot for the list component -->\n    <slot />\n  </ul>\n</template>\n\n<script>\nimport {} from './list_item_group_constants';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtListItemGroup',\n\n  props: {\n    /**\n     * Id of the List Item Group\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * List's heading.\n     */\n    heading: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class to style the heading\n     */\n    headingClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class for the wrapper list element.\n     */\n    listClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n};\n</script>\n"],"mappings":"kQA6BA,IAAK,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,kBAEN,MAAO,CAIL,GAAI,CACF,KAAM,OACN,SAAW,CAAE,OAAO,EAAA,iBAAiB,EACtC,CAKD,QAAS,CACP,KAAM,OACN,QAAS,GACV,CAKD,aAAc,CACZ,KAAM,CAAC,OAAQ,MAAO,OAAO,CAC7B,QAAS,GACV,CAKD,UAAW,CACT,KAAM,CAAC,OAAQ,MAAO,OAAO,CAC7B,QAAS,GACV,CACF,CACF,8GA5CM,KAAA,CApBF,GAAI,EAAA,GACJ,OAAA,EAAA,EAAA,gBAAK,CAAA,oBAAwB,EAAA,UAAS,CAAA,CACvC,KAAK,QACL,UAAQ,2BACP,kBAAe,GAAK,EAAA,GAAE,YAGf,EAAA,UAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAUH,KAAA,OATF,GAAE,GAAK,EAAA,GAAE,UACV,KAAK,eACL,UAAQ,2BACP,OAAA,EAAA,EAAA,gBAAK,CAAA,2BAA+B,EAAA,aAAY,CAAA,oBAK1C,EAAA,OAAA,cAAA,EAAA,KAAA,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBADF,EAAA,QAAO,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,GAAA,EAAA,GAAA,EAAA,EAAA,oBAAA,GAAA,GAAA,EAAA,EAAA,EAAA,YAIN,EAAA,OAAA,UAAA,CAAA,CAAA,GAAA,EAAA"}

package/dist/lib/list-item-group/list-item-group.js

@@ -47,7 +47,7 @@ function f(e, t, l, f, p, m) {
 		role: "presentation",
 		"data-qa": "dt-dropdown-list-heading",
 		class: a(["dt-dropdown-list--header", l.headingClass])
-	}, [s(e.$slots, "heading", {}, () => [i(c(l.heading), 1)])], 10, d)) : n("", !0), s(e.$slots, "default")], 10, u);
+	}, [s(e.$slots, "headingSlot", {}, () => [i(c(l.heading), 1)])], 10, d)) : n("", !0), s(e.$slots, "default")], 10, u);
 }
 var p = /* @__PURE__ */ t(l, [["render", f]]);
 //#endregion

package/dist/lib/list-item-group/list-item-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"list-item-group.js","names":[],"sources":["../../../components/list_item_group/list_item_group.vue"],"sourcesContent":["<template>\n  <ul\n    :id=\"id\"\n    :class=\"['d-list-item-group', listClass]\"\n    role=\"group\"\n    data-qa=\"dt-dropdown-list-wrapper\"\n    :aria-labelledby=\"`${id}-heading`\"\n  >\n    <li\n      v-if=\"heading\"\n      :id=\"`${id}-heading`\"\n      role=\"presentation\"\n      data-qa=\"dt-dropdown-list-heading\"\n      :class=\"['dt-dropdown-list--header', headingClass]\"\n    >\n      <!-- @slot Slot for heading, will override heading prop -->\n      <slot name=\"heading\">\n        {{ heading }}\n      </slot>\n    </li>\n    <!-- @slot Slot for the list component -->\n    <slot />\n  </ul>\n</template>\n\n<script>\nimport {} from './list_item_group_constants';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtListItemGroup',\n\n  props: {\n    /**\n     * Id of the List Item Group\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * List's heading.\n     * Can also be overridden with a slot of the same name.\n     */\n    heading: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class to style the heading\n     */\n    headingClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class for the wrapper list element.\n     */\n    listClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n};\n</script>\n"],"mappings":";;;;AA6BA,IAAK,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,OAAO;EAIL,IAAI;GACF,MAAM;GACN,UAAW;AAAE,WAAO,GAAiB;;GACtC;EAMD,SAAS;GACP,MAAM;GACN,SAAS;GACV;EAKD,cAAc;GACZ,MAAM;IAAC;IAAQ;IAAO;IAAO;GAC7B,SAAS;GACV;EAKD,WAAW;GACT,MAAM;IAAC;IAAQ;IAAO;IAAO;GAC7B,SAAS;GACV;EACF;CACF;;aAlEC,EAqBK,MAAA;EApBF,IAAI,EAAA;EACJ,OAAK,EAAA,CAAA,qBAAwB,EAAA,UAAS,CAAA;EACvC,MAAK;EACL,WAAQ;EACP,mBAAe,GAAK,EAAA,GAAE;KAGf,EAAA,WAAA,GAAA,EADR,EAWK,MAAA;;EATF,IAAE,GAAK,EAAA,GAAE;EACV,MAAK;EACL,WAAQ;EACP,OAAK,EAAA,CAAA,4BAA+B,EAAA,aAAY,CAAA;KAGjD,EAEO,EAAA,QAAA,WAAA,EAAA,QAAA,CAAA,EAAA,EADF,EAAA,QAAO,EAAA,EAAA,CAAA,CAAA,CAAA,EAAA,IAAA,EAAA,IAAA,EAAA,IAAA,GAAA,EAId,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,IAAA,EAAA"}
+{"version":3,"file":"list-item-group.js","names":[],"sources":["../../../components/list_item_group/list_item_group.vue"],"sourcesContent":["<template>\n  <ul\n    :id=\"id\"\n    :class=\"['d-list-item-group', listClass]\"\n    role=\"group\"\n    data-qa=\"dt-dropdown-list-wrapper\"\n    :aria-labelledby=\"`${id}-heading`\"\n  >\n    <li\n      v-if=\"heading\"\n      :id=\"`${id}-heading`\"\n      role=\"presentation\"\n      data-qa=\"dt-dropdown-list-heading\"\n      :class=\"['dt-dropdown-list--header', headingClass]\"\n    >\n      <!-- @slot Slot for heading, will override heading prop. -->\n      <slot name=\"headingSlot\">\n        {{ heading }}\n      </slot>\n    </li>\n    <!-- @slot Slot for the list component -->\n    <slot />\n  </ul>\n</template>\n\n<script>\nimport {} from './list_item_group_constants';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtListItemGroup',\n\n  props: {\n    /**\n     * Id of the List Item Group\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * List's heading.\n     */\n    heading: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class to style the heading\n     */\n    headingClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class for the wrapper list element.\n     */\n    listClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n  },\n};\n</script>\n"],"mappings":";;;;AA6BA,IAAK,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,OAAO;EAIL,IAAI;GACF,MAAM;GACN,UAAW;AAAE,WAAO,GAAiB;;GACtC;EAKD,SAAS;GACP,MAAM;GACN,SAAS;GACV;EAKD,cAAc;GACZ,MAAM;IAAC;IAAQ;IAAO;IAAO;GAC7B,SAAS;GACV;EAKD,WAAW;GACT,MAAM;IAAC;IAAQ;IAAO;IAAO;GAC7B,SAAS;GACV;EACF;CACF;;aAjEC,EAqBK,MAAA;EApBF,IAAI,EAAA;EACJ,OAAK,EAAA,CAAA,qBAAwB,EAAA,UAAS,CAAA;EACvC,MAAK;EACL,WAAQ;EACP,mBAAe,GAAK,EAAA,GAAE;KAGf,EAAA,WAAA,GAAA,EADR,EAWK,MAAA;;EATF,IAAE,GAAK,EAAA,GAAE;EACV,MAAK;EACL,WAAQ;EACP,OAAK,EAAA,CAAA,4BAA+B,EAAA,aAAY,CAAA;KAGjD,EAEO,EAAA,QAAA,eAAA,EAAA,QAAA,CAAA,EAAA,EADF,EAAA,QAAO,EAAA,EAAA,CAAA,CAAA,CAAA,EAAA,IAAA,EAAA,IAAA,EAAA,IAAA,GAAA,EAId,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,IAAA,EAAA"}

package/dist/lib/message-input/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../message_input-DktL-f28.cjs`);exports.DtRecipeMessageInput=e.t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../message_input-BiCHkV9g.cjs`);exports.DtRecipeMessageInput=e.t;