@dialpad/dialtone-vue 3.219.0 → 3.220.0-next.2

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

@@ -1,16 +1,17 @@
 import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
-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";
+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";
 //#region components/keyboard_shortcut/keyboard_shortcut.vue
-var y = {
-	"{win}": g,
-	"{arrow-right}": p,
-	"{arrow-left}": f,
-	"{arrow-up}": m,
-	"{arrow-down}": d,
-	"{cmd}": h,
-	"{opt}": _
-}, b = {
+var S = {
+	"{win}": y,
+	"{arrow-right}": g,
+	"{arrow-left}": h,
+	"{arrow-up}": _,
+	"{arrow-down}": m,
+	"{cmd}": v,
+	"{opt}": b
+}, C = {
 	"{cmd}": "Command",
 	"{opt}": "Option",
 	"{win}": "Windows",
@@ -19,7 +20,7 @@ var y = {
 	"{arrow-up}": "Up Arrow",
 	"{arrow-down}": "Down Arrow",
 	"{plus}": "plus"
-}, x = {
+}, w = {
 	ctrl: "Control",
 	alt: "Alt",
 	esc: "Escape",
@@ -29,18 +30,19 @@ var y = {
 	pgdn: "Page Down",
 	num: "Number",
 	caps: "Caps Lock"
-}, S = {
+}, T = {
 	compatConfig: { MODE: 3 },
 	name: "DtKeyboardShortcut",
 	components: {
-		DtIconLayoutGrid: g,
-		DtIconArrowRight: p,
-		DtIconArrowLeft: f,
-		DtIconArrowUp: m,
-		DtIconArrowDown: d,
-		DtIconCommand: h,
-		DtIconOption: _,
-		DtIconPlus: v
+		DtIconLayoutGrid: y,
+		DtIconArrowRight: g,
+		DtIconArrowLeft: h,
+		DtIconArrowUp: _,
+		DtIconArrowDown: m,
+		DtIconCommand: v,
+		DtIconOption: b,
+		DtIconPlus: x,
+		DtText: t
 	},
 	props: {
 		inverted: {
@@ -62,15 +64,15 @@ var y = {
 	computed: {
 		icons() {
 			return {
-				...y,
-				"{plus}": v
+				...S,
+				"{plus}": x
 			};
 		},
 		shortcutWithSeparator() {
 			return this.shortcut.replace(this.separator, "{plus}");
 		},
 		formattedShortcut() {
-			return Object.keys(y).reduce((e, t) => e.replace(RegExp("{" + t + "}", "gi"), y[t]), this.shortcutWithSeparator);
+			return Object.keys(S).reduce((e, t) => e.replace(RegExp("{" + t + "}", "gi"), S[t]), this.shortcutWithSeparator);
 		},
 		formattedShortcutSplit() {
 			let e = Object.keys(this.icons).join("|"), t = RegExp(`(${e})`, "gi");
@@ -79,28 +81,36 @@ var y = {
 		generatedScreenReaderText() {
 			return this.formattedShortcutSplit.map((e) => {
 				let t = e.trim();
-				if (b[t]) return b[t];
+				if (C[t]) return C[t];
 				let n = t.toLowerCase();
-				return x[n] ? x[n] : t;
+				return w[n] ? w[n] : t;
 			}).filter((e) => e).join(" ");
 		}
 	}
-}, 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}`,
+}, 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}`,
 		size: "100",
 		"aria-hidden": "true",
-		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}`,
+		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",
 		"aria-hidden": "true",
-		class: o(["d-keyboard-shortcut__item", { "d-keyboard-shortcut__item--inverted": f.inverted }]),
-		innerHTML: e
-	}, null, 10, w)) : r("", !0)], 64))), 256))], 2);
+		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);
 }
-var E = /* @__PURE__ */ e(S, [["render", T]]);
+var k = /* @__PURE__ */ e(T, [["render", O]]);
 //#endregion
-export { E as default };
+export { k 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":["<!-- 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"}
+{"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"}

package/dist/lib/kitchen-sink/kitchen-sink-view.cjs

@@ -0,0 +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(`../text/text.cjs`),n=require(`../link/link.cjs`),r=require(`../stack/stack.cjs`);let i=require(`vue`),a=require(`@dialpad/dialtone-icons/vue`);var o={key:0,class:`d-d-flex d-ai-center d-jc-center d-h164`},s={__name:`kitchen_sink_view`,props:{title:{type:String,required:!0},itemLabel:{type:String,required:!0},iframeUrl:{type:String,required:!0},loaders:{type:Object,required:!0}},setup(e){let s=e,c=(0,i.ref)([]),l=(0,i.ref)(!0);function u(e){return e.toLowerCase().replace(/[\s/_]+/g,`-`)}function d(e){document.getElementById(`ks-${e}`)?.scrollIntoView({behavior:`smooth`})}function f(e){return(0,i.markRaw)((0,i.defineComponent)({name:`ErrorBoundary-${e}`,setup(t,{slots:n}){let r=(0,i.ref)(null);return(0,i.onErrorCaptured)(e=>(r.value=e.message||String(e),!1)),()=>r.value?(0,i.h)(`div`,{class:`d-fc-critical d-fs-200 d-p-100 d-px-150 d-bgc-critical d-bar4`},`Failed to render ${e}: ${r.value}`):n.default?.()}}))}function p(e,t,n){let r=[];for(let[a,o]of Object.entries(e)){if(a===`default`||!o?.render||typeof o.render!=`function`)continue;let e={...t.args,...o.args};try{let s=o.render(e,{argTypes:t.argTypes||{}});r.push({name:a,component:(0,i.markRaw)(s),errorBoundary:f(`${n} / ${a}`)})}catch(e){console.error(`Kitchen Sink: Failed to initialize ${n}/${a}:`,e)}}return r}return(0,i.onMounted)(async()=>{let e=await Promise.allSettled(Object.values(s.loaders).map(async e=>e())),t=[];for(let n of e){if(n.status!==`fulfilled`)continue;let e=n.value,r=e.default;if(!r?.title)continue;let i=r.title.split(`/`).pop(),a=u(i),o=u(r.title),s=p(e,r,i);s.length!==0&&t.push({id:a,name:i,storyId:o,variants:s})}c.value=t.sort((e,t)=>e.name.localeCompare(t.name)),l.value=!1}),(s,u)=>{let f=(0,i.resolveDirective)(`dt-scrollbar`);return(0,i.openBlock)(),(0,i.createElementBlock)(`div`,null,[l.value?((0,i.openBlock)(),(0,i.createElementBlock)(`div`,o,[(0,i.createVNode)((0,i.unref)(t.default),{tone:`muted`},{default:(0,i.withCtx)(()=>[(0,i.createTextVNode)(` Loading `+(0,i.toDisplayString)(e.itemLabel)+`... `,1)]),_:1})])):((0,i.openBlock)(),(0,i.createElementBlock)(i.Fragment,{key:1},[(0,i.createVNode)((0,i.unref)(r.default),{class:`d-p-400 d-py-200 d-pbe-100 d-bgc-secondary d-bb d-ps-sticky d-t-0 d-zi-base1 d-mbs-n125 d-mx-n125 d-bs-card`,gap:`100`},{default:(0,i.withCtx)(()=>[(0,i.createVNode)((0,i.unref)(r.default),{class:`d-px-100`,gap:`100`,direction:`row`,justify:`between`,align:`baseline`},{default:(0,i.withCtx)(()=>[(0,i.createVNode)((0,i.unref)(t.default),{as:`h1`,kind:`headline`,size:700},{default:(0,i.withCtx)(()=>[(0,i.createTextVNode)((0,i.toDisplayString)(e.title),1)]),_:1}),(0,i.createVNode)((0,i.unref)(t.default),{kind:`body`,size:200},{default:(0,i.withCtx)(()=>[(0,i.createVNode)((0,i.unref)(n.default),{href:e.iframeUrl,target:`_blank`,rel:`noopener noreferrer`},{default:(0,i.withCtx)(()=>[(0,i.createVNode)((0,i.unref)(r.default),{gap:`50`,direction:`row`},{default:(0,i.withCtx)(()=>[u[0]||(u[0]=(0,i.createTextVNode)(` Open in new window `,-1)),(0,i.createVNode)((0,i.unref)(a.DtIconExternalLink),{size:`200`})]),_:1})]),_:1},8,[`href`])]),_:1})]),_:1}),(0,i.withDirectives)(((0,i.openBlock)(),(0,i.createElementBlock)(`div`,null,[(0,i.createVNode)((0,i.unref)(r.default),{direction:`row`,gap:`100`,class:`d-pbe-100 d-px-100`},{default:(0,i.withCtx)(()=>[((0,i.openBlock)(!0),(0,i.createElementBlock)(i.Fragment,null,(0,i.renderList)(c.value,e=>((0,i.openBlock)(),(0,i.createBlock)((0,i.unref)(n.default),{key:e.id,href:`#ks-${e.id}`,onClick:(0,i.withModifiers)(t=>d(e.id),[`prevent`])},{default:(0,i.withCtx)(()=>[(0,i.createVNode)((0,i.unref)(t.default),{kind:`body`,size:200,class:`d-ws-nowrap`},{default:(0,i.withCtx)(()=>[(0,i.createTextVNode)((0,i.toDisplayString)(e.name),1)]),_:2},1024)]),_:2},1032,[`href`,`onClick`]))),128))]),_:1})])),[[f]])]),_:1}),(0,i.createVNode)((0,i.unref)(r.default),{class:`d-px-400`},{default:(0,i.withCtx)(()=>[((0,i.openBlock)(!0),(0,i.createElementBlock)(i.Fragment,null,(0,i.renderList)(c.value,e=>((0,i.openBlock)(),(0,i.createBlock)((0,i.unref)(r.default),{id:`ks-${e.id}`,key:e.id,as:`section`,gap:`200`,class:`d-py-400 kitchen-sink__section`},{default:(0,i.withCtx)(()=>[(0,i.createVNode)((0,i.unref)(r.default),{gap:`100`,direction:`row`,justify:`between`,align:`baseline`},{default:(0,i.withCtx)(()=>[(0,i.createVNode)((0,i.unref)(t.default),{as:`h2`,kind:`headline`,size:600},{default:(0,i.withCtx)(()=>[(0,i.createTextVNode)((0,i.toDisplayString)(e.name),1)]),_:2},1024),(0,i.createVNode)((0,i.unref)(n.default),{href:`/?path=/story/${e.storyId}--default`},{default:(0,i.withCtx)(()=>[...u[1]||(u[1]=[(0,i.createTextVNode)(` View Story `,-1)])]),_:1},8,[`href`])]),_:2},1024),((0,i.openBlock)(!0),(0,i.createElementBlock)(i.Fragment,null,(0,i.renderList)(e.variants,e=>((0,i.openBlock)(),(0,i.createBlock)((0,i.unref)(r.default),{key:e.name,class:`d-ba d-bc-subtle d-p-200`,gap:`100`},{default:(0,i.withCtx)(()=>[(0,i.createVNode)((0,i.unref)(t.default),{size:100,tone:`muted`,kind:`code`},{default:(0,i.withCtx)(()=>[(0,i.createTextVNode)((0,i.toDisplayString)(e.name),1)]),_:2},1024),(0,i.createElementVNode)(`div`,null,[((0,i.openBlock)(),(0,i.createBlock)((0,i.resolveDynamicComponent)(e.errorBoundary),null,{default:(0,i.withCtx)(()=>[((0,i.openBlock)(),(0,i.createBlock)((0,i.resolveDynamicComponent)(e.component)))]),_:2},1024))])]),_:2},1024))),128))]),_:2},1032,[`id`]))),128))]),_:1})],64))])}}},c=e.t(s,[[`__scopeId`,`data-v-7354f228`]]);exports.default=c;
+//# sourceMappingURL=kitchen-sink-view.cjs.map

package/dist/lib/kitchen-sink/kitchen-sink-view.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"kitchen-sink-view.cjs","names":[],"sources":["../../../components/kitchen_sink/kitchen_sink_view.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class, vue/no-bare-strings-in-template -->\n<template>\n  <div>\n    <div\n      v-if=\"loading\"\n      class=\"d-d-flex d-ai-center d-jc-center d-h164\"\n    >\n      <dt-text\n        tone=\"muted\"\n      >\n        Loading {{ itemLabel }}...\n      </dt-text>\n    </div>\n    <template v-else>\n      <dt-stack\n        class=\"\n          d-p-400\n          d-py-200\n          d-pbe-100\n          d-bgc-secondary\n          d-bb\n          d-ps-sticky\n          d-t-0\n          d-zi-base1\n          d-mbs-n125\n          d-mx-n125\n          d-bs-card\n        \"\n        gap=\"100\"\n      >\n        <dt-stack\n          class=\"d-px-100\"\n          gap=\"100\"\n          direction=\"row\"\n          justify=\"between\"\n          align=\"baseline\"\n        >\n          <dt-text\n            as=\"h1\"\n            kind=\"headline\"\n            :size=\"700\"\n          >\n            {{ title }}\n          </dt-text>\n          <dt-text\n            kind=\"body\"\n            :size=\"200\"\n          >\n            <dt-link\n              :href=\"iframeUrl\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n            >\n              <dt-stack\n                gap=\"50\"\n                direction=\"row\"\n              >\n                Open in new window\n                <dt-icon-external-link size=\"200\" />\n              </dt-stack>\n            </dt-link>\n          </dt-text>\n        </dt-stack>\n        <div\n          v-dt-scrollbar\n        >\n          <dt-stack\n            direction=\"row\"\n            gap=\"100\"\n            class=\"d-pbe-100 d-px-100\"\n          >\n            <dt-link\n              v-for=\"section in sections\"\n              :key=\"section.id\"\n              :href=\"`#ks-${section.id}`\"\n              @click.prevent=\"scrollTo(section.id)\"\n            >\n              <dt-text\n                kind=\"body\"\n                :size=\"200\"\n                class=\"d-ws-nowrap\"\n              >\n                {{ section.name }}\n              </dt-text>\n            </dt-link>\n          </dt-stack>\n        </div>\n      </dt-stack>\n      <dt-stack class=\"d-px-400\">\n        <dt-stack\n          v-for=\"section in sections\"\n          :id=\"`ks-${section.id}`\"\n          :key=\"section.id\"\n          as=\"section\"\n          gap=\"200\"\n          class=\"d-py-400 kitchen-sink__section\"\n        >\n          <dt-stack\n            gap=\"100\"\n            direction=\"row\"\n            justify=\"between\"\n            align=\"baseline\"\n          >\n            <dt-text\n              as=\"h2\"\n              kind=\"headline\"\n              :size=\"600\"\n            >\n              {{ section.name }}\n            </dt-text>\n            <dt-link\n              :href=\"`/?path=/story/${section.storyId}--default`\"\n            >\n              View Story\n            </dt-link>\n          </dt-stack>\n          <dt-stack\n            v-for=\"variant in section.variants\"\n            :key=\"variant.name\"\n            class=\"d-ba d-bc-subtle d-p-200\"\n            gap=\"100\"\n          >\n            <dt-text\n              :size=\"100\"\n              tone=\"muted\"\n              kind=\"code\"\n            >\n              {{ variant.name }}\n            </dt-text>\n            <div>\n              <component :is=\"variant.errorBoundary\">\n                <component :is=\"variant.component\" />\n              </component>\n            </div>\n          </dt-stack>\n        </dt-stack>\n      </dt-stack>\n    </template>\n  </div>\n</template>\n\n<script setup>\nimport { ref, h, onErrorCaptured, onMounted, defineComponent, markRaw } from 'vue';\nimport { DtLink } from '@/components/link';\nimport { DtStack } from '@/components/stack';\nimport { DtText } from '@/components/text';\nimport { DtIconExternalLink } from '@dialpad/dialtone-icons/vue';\n\nconst props = defineProps({\n  title: {\n    type: String,\n    required: true,\n  },\n  itemLabel: {\n    type: String,\n    required: true,\n  },\n  iframeUrl: {\n    type: String,\n    required: true,\n  },\n  loaders: {\n    type: Object,\n    required: true,\n  },\n});\n\nconst sections = ref([]);\nconst loading = ref(true);\n\nfunction sanitizeId (str) {\n  return str.toLowerCase().replace(/[\\s/_]+/g, '-');\n}\n\nfunction scrollTo (id) {\n  document.getElementById(`ks-${id}`)?.scrollIntoView({ behavior: 'smooth' });\n}\n\nfunction createErrorBoundary (name) {\n  return markRaw(defineComponent({\n    name: `ErrorBoundary-${name}`,\n    setup (_, { slots }) {\n      const error = ref(null);\n      onErrorCaptured((err) => {\n        error.value = err.message || String(err);\n        return false;\n      });\n      return () => {\n        if (error.value) {\n          return h('div', {\n            class: 'd-fc-critical d-fs-200 d-p-100 d-px-150 d-bgc-critical d-bar4',\n          }, `Failed to render ${name}: ${error.value}`);\n        }\n        return slots.default?.();\n      };\n    },\n  }));\n}\n\nfunction extractVariants (module, meta, name) {\n  const variants = [];\n\n  for (const [exportName, exportValue] of Object.entries(module)) {\n    if (exportName === 'default') continue;\n    if (!exportValue?.render || typeof exportValue.render !== 'function') continue;\n\n    const mergedArgs = { ...meta.args, ...exportValue.args };\n\n    try {\n      const componentOptions = exportValue.render(mergedArgs, {\n        argTypes: meta.argTypes || {},\n      });\n      variants.push({\n        name: exportName,\n        component: markRaw(componentOptions),\n        errorBoundary: createErrorBoundary(`${name} / ${exportName}`),\n      });\n    } catch (e) {\n      console.error(`Kitchen Sink: Failed to initialize ${name}/${exportName}:`, e);\n    }\n  }\n\n  return variants;\n}\n\nonMounted(async () => {\n  const results = await Promise.allSettled(\n    Object.values(props.loaders).map(async (loader) => loader()),\n  );\n\n  const loaded = [];\n\n  for (const result of results) {\n    if (result.status !== 'fulfilled') continue;\n\n    const module = result.value;\n    const meta = module.default;\n    if (!meta?.title) continue;\n\n    const name = meta.title.split('/').pop();\n    const id = sanitizeId(name);\n    const storyId = sanitizeId(meta.title);\n    const variants = extractVariants(module, meta, name);\n\n    if (variants.length === 0) continue;\n\n    loaded.push({ id, name, storyId, variants });\n  }\n\n  sections.value = loaded.sort((a, b) => a.name.localeCompare(b.name));\n  loading.value = false;\n});\n</script>\n\n<style scoped>\n.kitchen-sink__section {\n  scroll-margin-block-start: var(--dt-layout-150);\n}\n[outline] {\n  outline: 2px solid orangered;\n}\n</style>\n"],"mappings":"olBAoJA,IAAM,EAAQ,EAmBR,GAAA,EAAA,EAAA,KAAe,EAAE,CAAC,CAClB,GAAA,EAAA,EAAA,KAAc,GAAK,CAEzB,SAAS,EAAY,EAAK,CACxB,OAAO,EAAI,aAAa,CAAC,QAAQ,WAAY,IAAI,CAGnD,SAAS,EAAU,EAAI,CACrB,SAAS,eAAe,MAAM,IAAK,EAAE,eAAe,CAAE,SAAU,SAAU,CAAC,CAG7E,SAAS,EAAqB,EAAM,CAClC,OAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAA+B,CAC7B,KAAM,iBAAiB,IACvB,MAAO,EAAG,CAAE,SAAS,CACnB,IAAM,GAAA,EAAA,EAAA,KAAY,KAAK,CAKvB,OAJA,EAAA,EAAA,iBAAiB,IACf,EAAM,MAAQ,EAAI,SAAW,OAAO,EAAI,CACjC,IACP,KAEI,EAAM,OACR,EAAA,EAAA,GAAS,MAAO,CACd,MAAO,gEACR,CAAE,oBAAoB,EAAK,IAAI,EAAM,QAAQ,CAEzC,EAAM,WAAW,EAG7B,CAAC,CAAC,CAGL,SAAS,EAAiB,EAAQ,EAAM,EAAM,CAC5C,IAAM,EAAW,EAAE,CAEnB,IAAK,GAAM,CAAC,EAAY,KAAgB,OAAO,QAAQ,EAAO,CAAE,CAE9D,GADI,IAAe,WACf,CAAC,GAAa,QAAU,OAAO,EAAY,QAAW,WAAY,SAEtE,IAAM,EAAa,CAAE,GAAG,EAAK,KAAM,GAAG,EAAY,KAAM,CAExD,GAAI,CACF,IAAM,EAAmB,EAAY,OAAO,EAAY,CACtD,SAAU,EAAK,UAAY,EAAE,CAC9B,CAAC,CACF,EAAS,KAAK,CACZ,KAAM,EACN,WAAA,EAAA,EAAA,SAAmB,EAAiB,CACpC,cAAe,EAAoB,GAAG,EAAK,KAAK,IAAa,CAC9D,CAAC,OACK,EAAG,CACV,QAAQ,MAAM,sCAAsC,EAAK,GAAG,EAAW,GAAI,EAAE,EAIjF,OAAO,SAGT,EAAA,EAAA,WAAU,SAAY,CACpB,IAAM,EAAU,MAAM,QAAQ,WAC5B,OAAO,OAAO,EAAM,QAAQ,CAAC,IAAI,KAAO,IAAW,GAAQ,CAAC,CAC7D,CAEK,EAAS,EAAE,CAEjB,IAAK,IAAM,KAAU,EAAS,CAC5B,GAAI,EAAO,SAAW,YAAa,SAEnC,IAAM,EAAS,EAAO,MAChB,EAAO,EAAO,QACpB,GAAI,CAAC,GAAM,MAAO,SAElB,IAAM,EAAO,EAAK,MAAM,MAAM,IAAI,CAAC,KAAK,CAClC,EAAK,EAAW,EAAK,CACrB,EAAU,EAAW,EAAK,MAAM,CAChC,EAAW,EAAgB,EAAQ,EAAM,EAAK,CAEhD,EAAS,SAAW,GAExB,EAAO,KAAK,CAAE,KAAI,OAAM,UAAS,WAAU,CAAC,CAG9C,EAAS,MAAQ,EAAO,MAAM,EAAG,IAAM,EAAE,KAAK,cAAc,EAAE,KAAK,CAAC,CACpE,EAAQ,MAAQ,IAChB,uGAjHM,MAAA,KAAA,CAtII,EAAA,QAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAQF,MATN,EASM,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OADM,EAAA,QAAA,CAAA,CAHR,KAAK,QAAO,CAAA,2BAEJ,EAAA,EAAA,EAAA,iBADT,aAAA,EAAA,EAAA,iBACY,EAAA,UAAS,CAAG,OACzB,EAAA,CAAA,CAAA,sDA8HS,EAAA,SAAA,CAAA,IAAA,EAAA,CAAA,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAlDE,EAAA,QAAA,CAAA,CAxET,MAAM,8GAaN,IAAI,kCAkCO,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,QAAA,CAAA,CA/BT,MAAM,WACN,IAAI,MACJ,UAAU,MACV,QAAQ,UACR,MAAM,uCAQI,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,QAAA,CAAA,CALR,GAAG,KACH,KAAK,WACJ,KAAM,gCAEI,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAR,EAAA,MAAK,CAAA,EAAA,CAAA,CAAA,qCAmBA,EAAA,QAAA,CAAA,CAhBR,KAAK,OACJ,KAAM,gCAcG,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,QAAA,CAAA,CAXP,KAAM,EAAA,UACP,OAAO,SACP,IAAI,kDAQO,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,QAAA,CAAA,CALT,IAAI,KACJ,UAAU,kCAGV,CAAA,EAAA,KAAA,EAAA,IAAA,EAAA,EAAA,iBAFD,uBAEC,GAAA,GAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAoC,EAAA,mBAAA,CAAA,CAAb,KAAK,MAAK,CAAA,CAAA,CAAA,2GA4BnC,MAAA,KAAA,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OADO,EAAA,QAAA,CAAA,CAlBT,UAAU,MACV,IAAI,MACJ,MAAM,iDAGuB,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBAYnB,EAAA,SAAA,MAAA,EAAA,EAAA,YAZU,EAAA,MAAX,oDAYC,EAAA,QAAA,CAAA,CAXP,IAAK,EAAQ,GACb,KAAI,OAAS,EAAQ,KACrB,SAAA,EAAA,EAAA,eAAK,GAAU,EAAS,EAAQ,GAAE,CAAA,CAAA,UAAA,CAAA,6BAQzB,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,QAAA,CAAA,CALR,KAAK,OACJ,KAAM,IACP,MAAM,0CAEY,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAf,EAAQ,KAAI,CAAA,EAAA,CAAA,CAAA,4GAsDd,EAAA,QAAA,CAAA,CAhDD,MAAM,WAAU,CAAA,2BAEK,GAAA,EAAA,EAAA,WAAA,GAAA,EAAA,EAAA,EAAA,oBA6ClB,EAAA,SAAA,MAAA,EAAA,EAAA,YA7CS,EAAA,MAAX,oDA6CE,EAAA,QAAA,CAAA,CA5CR,GAAE,MAAQ,EAAQ,KAClB,IAAK,EAAQ,GACd,GAAG,UACH,IAAI,MACJ,MAAM,6DAoBK,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,QAAA,CAAA,CAjBT,IAAI,MACJ,UAAU,MACV,QAAQ,UACR,MAAM,uCAQI,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,QAAA,CAAA,CALR,GAAG,KACH,KAAK,WACJ,KAAM,gCAEW,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAf,EAAQ,KAAI,CAAA,EAAA,CAAA,CAAA,0CAMP,EAAA,QAAA,CAAA,CAHP,KAAI,iBAAmB,EAAQ,QAAO,WAAA,CAAA,2BAGzC,CAAA,GAAA,EAAA,KAAA,EAAA,GAAA,EAAA,EAAA,EAAA,iBAFC,eAED,GAAA,CAAA,EAAA,CAAA,6EAoBS,EAAA,SAAA,MAAA,EAAA,EAAA,YAjBS,EAAQ,SAAnB,oDAiBE,EAAA,QAAA,CAAA,CAhBR,IAAK,EAAQ,KACd,MAAM,2BACN,IAAI,kCAQM,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,OAAA,EAAA,QAAA,CAAA,CALP,KAAM,IACP,KAAK,QACL,KAAK,mCAEa,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAf,EAAQ,KAAI,CAAA,EAAA,CAAA,CAAA,qCAMX,MAAA,KAAA,GAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,yBAHY,EAAQ,cAAa,CAAA,KAAA,2BACE,GAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,cAAA,EAAA,EAAA,yBAArB,EAAQ,UAAS,CAAA,EAAA,CAAA"}

package/dist/lib/kitchen-sink/kitchen-sink-view.js

@@ -0,0 +1,205 @@
+import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
+import t from "../text/text.js";
+import n from "../link/link.js";
+import r from "../stack/stack.js";
+import { Fragment as i, createBlock as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, h as d, markRaw as f, onErrorCaptured as p, onMounted as m, openBlock as h, ref as g, renderList as _, resolveDirective as v, resolveDynamicComponent as y, toDisplayString as b, unref as x, withCtx as S, withDirectives as C, withModifiers as w } from "vue";
+import { DtIconExternalLink as T } from "@dialpad/dialtone-icons/vue";
+//#region components/kitchen_sink/kitchen_sink_view.vue
+var E = {
+	key: 0,
+	class: "d-d-flex d-ai-center d-jc-center d-h164"
+}, D = /* @__PURE__ */ e({
+	__name: "kitchen_sink_view",
+	props: {
+		title: {
+			type: String,
+			required: !0
+		},
+		itemLabel: {
+			type: String,
+			required: !0
+		},
+		iframeUrl: {
+			type: String,
+			required: !0
+		},
+		loaders: {
+			type: Object,
+			required: !0
+		}
+	},
+	setup(e) {
+		let D = e, O = g([]), k = g(!0);
+		function A(e) {
+			return e.toLowerCase().replace(/[\s/_]+/g, "-");
+		}
+		function j(e) {
+			document.getElementById(`ks-${e}`)?.scrollIntoView({ behavior: "smooth" });
+		}
+		function M(e) {
+			return f(u({
+				name: `ErrorBoundary-${e}`,
+				setup(t, { slots: n }) {
+					let r = g(null);
+					return p((e) => (r.value = e.message || String(e), !1)), () => r.value ? d("div", { class: "d-fc-critical d-fs-200 d-p-100 d-px-150 d-bgc-critical d-bar4" }, `Failed to render ${e}: ${r.value}`) : n.default?.();
+				}
+			}));
+		}
+		function N(e, t, n) {
+			let r = [];
+			for (let [i, a] of Object.entries(e)) {
+				if (i === "default" || !a?.render || typeof a.render != "function") continue;
+				let e = {
+					...t.args,
+					...a.args
+				};
+				try {
+					let o = a.render(e, { argTypes: t.argTypes || {} });
+					r.push({
+						name: i,
+						component: f(o),
+						errorBoundary: M(`${n} / ${i}`)
+					});
+				} catch (e) {
+					console.error(`Kitchen Sink: Failed to initialize ${n}/${i}:`, e);
+				}
+			}
+			return r;
+		}
+		return m(async () => {
+			let e = await Promise.allSettled(Object.values(D.loaders).map(async (e) => e())), t = [];
+			for (let n of e) {
+				if (n.status !== "fulfilled") continue;
+				let e = n.value, r = e.default;
+				if (!r?.title) continue;
+				let i = r.title.split("/").pop(), a = A(i), o = A(r.title), s = N(e, r, i);
+				s.length !== 0 && t.push({
+					id: a,
+					name: i,
+					storyId: o,
+					variants: s
+				});
+			}
+			O.value = t.sort((e, t) => e.name.localeCompare(t.name)), k.value = !1;
+		}), (u, d) => {
+			let f = v("dt-scrollbar");
+			return h(), o("div", null, [k.value ? (h(), o("div", E, [l(x(t), { tone: "muted" }, {
+				default: S(() => [c(" Loading " + b(e.itemLabel) + "... ", 1)]),
+				_: 1
+			})])) : (h(), o(i, { key: 1 }, [l(x(r), {
+				class: "d-p-400 d-py-200 d-pbe-100 d-bgc-secondary d-bb d-ps-sticky d-t-0 d-zi-base1 d-mbs-n125 d-mx-n125 d-bs-card",
+				gap: "100"
+			}, {
+				default: S(() => [l(x(r), {
+					class: "d-px-100",
+					gap: "100",
+					direction: "row",
+					justify: "between",
+					align: "baseline"
+				}, {
+					default: S(() => [l(x(t), {
+						as: "h1",
+						kind: "headline",
+						size: 700
+					}, {
+						default: S(() => [c(b(e.title), 1)]),
+						_: 1
+					}), l(x(t), {
+						kind: "body",
+						size: 200
+					}, {
+						default: S(() => [l(x(n), {
+							href: e.iframeUrl,
+							target: "_blank",
+							rel: "noopener noreferrer"
+						}, {
+							default: S(() => [l(x(r), {
+								gap: "50",
+								direction: "row"
+							}, {
+								default: S(() => [d[0] || (d[0] = c(" Open in new window ", -1)), l(x(T), { size: "200" })]),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["href"])]),
+						_: 1
+					})]),
+					_: 1
+				}), C((h(), o("div", null, [l(x(r), {
+					direction: "row",
+					gap: "100",
+					class: "d-pbe-100 d-px-100"
+				}, {
+					default: S(() => [(h(!0), o(i, null, _(O.value, (e) => (h(), a(x(n), {
+						key: e.id,
+						href: `#ks-${e.id}`,
+						onClick: w((t) => j(e.id), ["prevent"])
+					}, {
+						default: S(() => [l(x(t), {
+							kind: "body",
+							size: 200,
+							class: "d-ws-nowrap"
+						}, {
+							default: S(() => [c(b(e.name), 1)]),
+							_: 2
+						}, 1024)]),
+						_: 2
+					}, 1032, ["href", "onClick"]))), 128))]),
+					_: 1
+				})])), [[f]])]),
+				_: 1
+			}), l(x(r), { class: "d-px-400" }, {
+				default: S(() => [(h(!0), o(i, null, _(O.value, (e) => (h(), a(x(r), {
+					id: `ks-${e.id}`,
+					key: e.id,
+					as: "section",
+					gap: "200",
+					class: "d-py-400 kitchen-sink__section"
+				}, {
+					default: S(() => [l(x(r), {
+						gap: "100",
+						direction: "row",
+						justify: "between",
+						align: "baseline"
+					}, {
+						default: S(() => [l(x(t), {
+							as: "h2",
+							kind: "headline",
+							size: 600
+						}, {
+							default: S(() => [c(b(e.name), 1)]),
+							_: 2
+						}, 1024), l(x(n), { href: `/?path=/story/${e.storyId}--default` }, {
+							default: S(() => [...d[1] || (d[1] = [c(" View Story ", -1)])]),
+							_: 1
+						}, 8, ["href"])]),
+						_: 2
+					}, 1024), (h(!0), o(i, null, _(e.variants, (e) => (h(), a(x(r), {
+						key: e.name,
+						class: "d-ba d-bc-subtle d-p-200",
+						gap: "100"
+					}, {
+						default: S(() => [l(x(t), {
+							size: 100,
+							tone: "muted",
+							kind: "code"
+						}, {
+							default: S(() => [c(b(e.name), 1)]),
+							_: 2
+						}, 1024), s("div", null, [(h(), a(y(e.errorBoundary), null, {
+							default: S(() => [(h(), a(y(e.component)))]),
+							_: 2
+						}, 1024))])]),
+						_: 2
+					}, 1024))), 128))]),
+					_: 2
+				}, 1032, ["id"]))), 128))]),
+				_: 1
+			})], 64))]);
+		};
+	}
+}, [["__scopeId", "data-v-7354f228"]]);
+//#endregion
+export { D as default };
+
+//# sourceMappingURL=kitchen-sink-view.js.map

package/dist/lib/kitchen-sink/kitchen-sink-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kitchen-sink-view.js","names":[],"sources":["../../../components/kitchen_sink/kitchen_sink_view.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class, vue/no-bare-strings-in-template -->\n<template>\n  <div>\n    <div\n      v-if=\"loading\"\n      class=\"d-d-flex d-ai-center d-jc-center d-h164\"\n    >\n      <dt-text\n        tone=\"muted\"\n      >\n        Loading {{ itemLabel }}...\n      </dt-text>\n    </div>\n    <template v-else>\n      <dt-stack\n        class=\"\n          d-p-400\n          d-py-200\n          d-pbe-100\n          d-bgc-secondary\n          d-bb\n          d-ps-sticky\n          d-t-0\n          d-zi-base1\n          d-mbs-n125\n          d-mx-n125\n          d-bs-card\n        \"\n        gap=\"100\"\n      >\n        <dt-stack\n          class=\"d-px-100\"\n          gap=\"100\"\n          direction=\"row\"\n          justify=\"between\"\n          align=\"baseline\"\n        >\n          <dt-text\n            as=\"h1\"\n            kind=\"headline\"\n            :size=\"700\"\n          >\n            {{ title }}\n          </dt-text>\n          <dt-text\n            kind=\"body\"\n            :size=\"200\"\n          >\n            <dt-link\n              :href=\"iframeUrl\"\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n            >\n              <dt-stack\n                gap=\"50\"\n                direction=\"row\"\n              >\n                Open in new window\n                <dt-icon-external-link size=\"200\" />\n              </dt-stack>\n            </dt-link>\n          </dt-text>\n        </dt-stack>\n        <div\n          v-dt-scrollbar\n        >\n          <dt-stack\n            direction=\"row\"\n            gap=\"100\"\n            class=\"d-pbe-100 d-px-100\"\n          >\n            <dt-link\n              v-for=\"section in sections\"\n              :key=\"section.id\"\n              :href=\"`#ks-${section.id}`\"\n              @click.prevent=\"scrollTo(section.id)\"\n            >\n              <dt-text\n                kind=\"body\"\n                :size=\"200\"\n                class=\"d-ws-nowrap\"\n              >\n                {{ section.name }}\n              </dt-text>\n            </dt-link>\n          </dt-stack>\n        </div>\n      </dt-stack>\n      <dt-stack class=\"d-px-400\">\n        <dt-stack\n          v-for=\"section in sections\"\n          :id=\"`ks-${section.id}`\"\n          :key=\"section.id\"\n          as=\"section\"\n          gap=\"200\"\n          class=\"d-py-400 kitchen-sink__section\"\n        >\n          <dt-stack\n            gap=\"100\"\n            direction=\"row\"\n            justify=\"between\"\n            align=\"baseline\"\n          >\n            <dt-text\n              as=\"h2\"\n              kind=\"headline\"\n              :size=\"600\"\n            >\n              {{ section.name }}\n            </dt-text>\n            <dt-link\n              :href=\"`/?path=/story/${section.storyId}--default`\"\n            >\n              View Story\n            </dt-link>\n          </dt-stack>\n          <dt-stack\n            v-for=\"variant in section.variants\"\n            :key=\"variant.name\"\n            class=\"d-ba d-bc-subtle d-p-200\"\n            gap=\"100\"\n          >\n            <dt-text\n              :size=\"100\"\n              tone=\"muted\"\n              kind=\"code\"\n            >\n              {{ variant.name }}\n            </dt-text>\n            <div>\n              <component :is=\"variant.errorBoundary\">\n                <component :is=\"variant.component\" />\n              </component>\n            </div>\n          </dt-stack>\n        </dt-stack>\n      </dt-stack>\n    </template>\n  </div>\n</template>\n\n<script setup>\nimport { ref, h, onErrorCaptured, onMounted, defineComponent, markRaw } from 'vue';\nimport { DtLink } from '@/components/link';\nimport { DtStack } from '@/components/stack';\nimport { DtText } from '@/components/text';\nimport { DtIconExternalLink } from '@dialpad/dialtone-icons/vue';\n\nconst props = defineProps({\n  title: {\n    type: String,\n    required: true,\n  },\n  itemLabel: {\n    type: String,\n    required: true,\n  },\n  iframeUrl: {\n    type: String,\n    required: true,\n  },\n  loaders: {\n    type: Object,\n    required: true,\n  },\n});\n\nconst sections = ref([]);\nconst loading = ref(true);\n\nfunction sanitizeId (str) {\n  return str.toLowerCase().replace(/[\\s/_]+/g, '-');\n}\n\nfunction scrollTo (id) {\n  document.getElementById(`ks-${id}`)?.scrollIntoView({ behavior: 'smooth' });\n}\n\nfunction createErrorBoundary (name) {\n  return markRaw(defineComponent({\n    name: `ErrorBoundary-${name}`,\n    setup (_, { slots }) {\n      const error = ref(null);\n      onErrorCaptured((err) => {\n        error.value = err.message || String(err);\n        return false;\n      });\n      return () => {\n        if (error.value) {\n          return h('div', {\n            class: 'd-fc-critical d-fs-200 d-p-100 d-px-150 d-bgc-critical d-bar4',\n          }, `Failed to render ${name}: ${error.value}`);\n        }\n        return slots.default?.();\n      };\n    },\n  }));\n}\n\nfunction extractVariants (module, meta, name) {\n  const variants = [];\n\n  for (const [exportName, exportValue] of Object.entries(module)) {\n    if (exportName === 'default') continue;\n    if (!exportValue?.render || typeof exportValue.render !== 'function') continue;\n\n    const mergedArgs = { ...meta.args, ...exportValue.args };\n\n    try {\n      const componentOptions = exportValue.render(mergedArgs, {\n        argTypes: meta.argTypes || {},\n      });\n      variants.push({\n        name: exportName,\n        component: markRaw(componentOptions),\n        errorBoundary: createErrorBoundary(`${name} / ${exportName}`),\n      });\n    } catch (e) {\n      console.error(`Kitchen Sink: Failed to initialize ${name}/${exportName}:`, e);\n    }\n  }\n\n  return variants;\n}\n\nonMounted(async () => {\n  const results = await Promise.allSettled(\n    Object.values(props.loaders).map(async (loader) => loader()),\n  );\n\n  const loaded = [];\n\n  for (const result of results) {\n    if (result.status !== 'fulfilled') continue;\n\n    const module = result.value;\n    const meta = module.default;\n    if (!meta?.title) continue;\n\n    const name = meta.title.split('/').pop();\n    const id = sanitizeId(name);\n    const storyId = sanitizeId(meta.title);\n    const variants = extractVariants(module, meta, name);\n\n    if (variants.length === 0) continue;\n\n    loaded.push({ id, name, storyId, variants });\n  }\n\n  sections.value = loaded.sort((a, b) => a.name.localeCompare(b.name));\n  loading.value = false;\n});\n</script>\n\n<style scoped>\n.kitchen-sink__section {\n  scroll-margin-block-start: var(--dt-layout-150);\n}\n[outline] {\n  outline: 2px solid orangered;\n}\n</style>\n"],"mappings":"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"}

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.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;
+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;

package/dist/lib/link/index.js

@@ -1,3 +1,3 @@
-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 { 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 c from "./link.js";
-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 };
+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 };

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

@@ -1,2 +1,2 @@
-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;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e=`critical`,t=`positive`,n=`warning`,r=`muted`,i=`mention`,a=[``,e,n,t,r,i],o={default:``,critical:`d-link--critical`,warning:`d-link--warning`,positive:`d-link--positive`,muted:`d-link--muted`,mention:`d-link--mention`},s={default:`d-link--inverted`,critical:`d-link--inverted-critical`,warning:`d-link--inverted-warning`,positive:`d-link--inverted-positive`,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.CRITICAL=e,exports.LINK_KIND_MODIFIERS=o,exports.LINK_VARIANTS=a,exports.MENTION=i,exports.MUTED=r,exports.POSITIVE=t,exports.WARNING=n,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 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"}
+{"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 MUTED = 'muted';\nexport const MENTION = 'mention';\nexport const LINK_VARIANTS = ['', CRITICAL, WARNING, POSITIVE, 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  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  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,EAAQ,QACR,EAAU,UACV,EAAgB,CAAC,GAAI,EAAU,EAAS,EAAU,EAAO,EAAQ,CAEjE,EAAsB,CACjC,QAAS,GACT,SAAU,mBACV,QAAS,kBACT,SAAU,mBACV,MAAO,gBACP,QAAS,kBACV,CAEK,EAA+B,CACnC,QAAS,mBACT,SAAU,4BACV,QAAS,2BACT,SAAU,4BACV,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,23 +1,23 @@
 //#region components/link/link_constants.js
-var e = "danger", t = "warning", n = "success", r = "muted", i = "mention", a = [
+var e = "critical", t = "positive", n = "warning", r = "muted", i = "mention", a = [
 	"",
 	e,
-	t,
 	n,
+	t,
 	r,
 	i
 ], o = {
 	default: "",
+	critical: "d-link--critical",
 	warning: "d-link--warning",
-	danger: "d-link--danger",
-	success: "d-link--success",
+	positive: "d-link--positive",
 	muted: "d-link--muted",
 	mention: "d-link--mention"
 }, s = {
 	default: "d-link--inverted",
+	critical: "d-link--inverted-critical",
 	warning: "d-link--inverted-warning",
-	danger: "d-link--inverted-danger",
-	success: "d-link--inverted-success",
+	positive: "d-link--inverted-positive",
 	muted: "d-link--inverted-muted",
 	mention: "d-link--inverted-mention"
 }, c = (e, t) => t ? s[e || "default"] : o[e], l = {
@@ -26,6 +26,6 @@ var e = "danger", t = "warning", n = "success", r = "muted", i = "mention", a =
 	getLinkKindModifier: c
 };
 //#endregion
-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 };
+export { e as CRITICAL, o as LINK_KIND_MODIFIERS, a as LINK_VARIANTS, i as MENTION, r as MUTED, t as POSITIVE, n 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 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"}
+{"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 MUTED = 'muted';\nexport const MENTION = 'mention';\nexport const LINK_VARIANTS = ['', CRITICAL, WARNING, POSITIVE, 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  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  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,IAAQ,SACR,IAAU,WACV,IAAgB;CAAC;CAAI;CAAU;CAAS;CAAU;CAAO;CAAQ,EAEjE,IAAsB;CACjC,SAAS;CACT,UAAU;CACV,SAAS;CACT,UAAU;CACV,OAAO;CACP,SAAS;CACV,EAEK,IAA+B;CACnC,SAAS;CACT,UAAU;CACV,SAAS;CACT,UAAU;CACV,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:{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;
+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;
 //# 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, 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"}
+{"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, 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"}

package/dist/lib/link/link.js

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