@dialpad/dialtone 9.147.0 → 9.149.0

package/dist/vue3/lib/keyboard-shortcut/keyboard-shortcut-constants.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=["{win}","{arrow-right}","{arrow-left}","{arrow-up}","{arrow-down}","{cmd}"];exports.SHORTCUTS_ALIASES_LIST=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=["{win}","{arrow-right}","{arrow-left}","{arrow-up}","{arrow-down}","{cmd}","{opt}"];exports.SHORTCUTS_ALIASES_LIST=r;
 //# sourceMappingURL=keyboard-shortcut-constants.cjs.map

package/dist/vue3/lib/keyboard-shortcut/keyboard-shortcut-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut-constants.cjs","sources":["../../../components/keyboard_shortcut/keyboard_shortcut_constants.js"],"sourcesContent":["export const SHORTCUTS_ALIASES_LIST = [\n  '{win}',\n  '{arrow-right}',\n  '{arrow-left}',\n  '{arrow-up}',\n  '{arrow-down}',\n  '{cmd}',\n];\n"],"names":["SHORTCUTS_ALIASES_LIST"],"mappings":"gFAAY,MAACA,EAAyB,CACpC,QACA,gBACA,eACA,aACA,eACA,OACF"}
+{"version":3,"file":"keyboard-shortcut-constants.cjs","sources":["../../../components/keyboard_shortcut/keyboard_shortcut_constants.js"],"sourcesContent":["export const SHORTCUTS_ALIASES_LIST = [\n  '{win}',\n  '{arrow-right}',\n  '{arrow-left}',\n  '{arrow-up}',\n  '{arrow-down}',\n  '{cmd}',\n  '{opt}',\n];\n"],"names":["SHORTCUTS_ALIASES_LIST"],"mappings":"gFAAY,MAACA,EAAyB,CACpC,QACA,gBACA,eACA,aACA,eACA,QACA,OACF"}

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

@@ -4,7 +4,8 @@ const r = [
   "{arrow-left}",
   "{arrow-up}",
   "{arrow-down}",
-  "{cmd}"
+  "{cmd}",
+  "{opt}"
 ];
 export {
   r as SHORTCUTS_ALIASES_LIST

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

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut-constants.js","sources":["../../../components/keyboard_shortcut/keyboard_shortcut_constants.js"],"sourcesContent":["export const SHORTCUTS_ALIASES_LIST = [\n  '{win}',\n  '{arrow-right}',\n  '{arrow-left}',\n  '{arrow-up}',\n  '{arrow-down}',\n  '{cmd}',\n];\n"],"names":["SHORTCUTS_ALIASES_LIST"],"mappings":"AAAY,MAACA,IAAyB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}
+{"version":3,"file":"keyboard-shortcut-constants.js","sources":["../../../components/keyboard_shortcut/keyboard_shortcut_constants.js"],"sourcesContent":["export const SHORTCUTS_ALIASES_LIST = [\n  '{win}',\n  '{arrow-right}',\n  '{arrow-left}',\n  '{arrow-up}',\n  '{arrow-down}',\n  '{cmd}',\n  '{opt}',\n];\n"],"names":["SHORTCUTS_ALIASES_LIST"],"mappings":"AAAY,MAACA,IAAyB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}

package/dist/vue3/lib/keyboard-shortcut/keyboard-shortcut.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("@dialpad/dialtone-icons/vue3"),e=require("vue"),u=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),s={"{win}":t.DtIconLayoutGrid,"{arrow-right}":t.DtIconArrowRight,"{arrow-left}":t.DtIconArrowLeft,"{arrow-up}":t.DtIconArrowUp,"{arrow-down}":t.DtIconArrowDown,"{cmd}":t.DtIconCommand},i={compatConfig:{MODE:3},name:"DtKeyboardShortcut",components:{DtIconLayoutGrid:t.DtIconLayoutGrid,DtIconArrowRight:t.DtIconArrowRight,DtIconArrowLeft:t.DtIconArrowLeft,DtIconArrowUp:t.DtIconArrowUp,DtIconArrowDown:t.DtIconArrowDown,DtIconCommand:t.DtIconCommand,DtIconPlus:t.DtIconPlus},props:{inverted:{type:Boolean,default:!1},shortcut:{type:String,required:!0},screenReaderText:{type:String,default:null}},data(){return{separator:/\+/gi}},computed:{icons(){return{...s,"{plus}":t.DtIconPlus}},shortcutWithSeparator(){return this.shortcut.replace(this.separator,"{plus}")},formattedShortcut(){return Object.keys(s).reduce((c,r)=>c.replace(new RegExp("{"+r+"}","gi"),s[r]),this.shortcutWithSeparator)},formattedShortcutSplit(){const c=Object.keys(this.icons).join("|"),r=new RegExp(`(${c})`,"gi");return this.formattedShortcut.split(r).filter(Boolean)}}},d={key:0,class:"d-keyboard-shortcut--sr-only"},h=["innerHTML"];function p(c,r,o,D,_,a){return e.openBlock(),e.createElementBlock("kbd",{class:e.normalizeClass(["d-keyboard-shortcut",{"d-keyboard-shortcut--inverted":o.inverted}])},[o.screenReaderText?(e.openBlock(),e.createElementBlock("span",d,e.toDisplayString(o.screenReaderText),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.formattedShortcutSplit,(n,l)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[a.icons[n]?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(a.icons[n]),{key:`${l}-${n}`,size:"100","aria-hidden":"true",class:e.normalizeClass(["d-keyboard-shortcut__icon",{"d-keyboard-shortcut__icon--inverted":o.inverted}])},null,8,["class"])):(e.openBlock(),e.createElementBlock("span",{key:`${l}-${n}`,"aria-hidden":"true",class:e.normalizeClass(["d-keyboard-shortcut__item",{"d-keyboard-shortcut__item--inverted":o.inverted}]),innerHTML:n},null,10,h))],64))),256))],2)}const m=u._(i,[["render",p]]);exports.default=m;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@dialpad/dialtone-icons/vue3"),t=require("vue"),d=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),s={"{win}":e.DtIconLayoutGrid,"{arrow-right}":e.DtIconArrowRight,"{arrow-left}":e.DtIconArrowLeft,"{arrow-up}":e.DtIconArrowUp,"{arrow-down}":e.DtIconArrowDown,"{cmd}":e.DtIconCommand,"{opt}":e.DtIconOption},l={"{cmd}":"Command","{opt}":"Option","{win}":"Windows","{arrow-right}":"Right Arrow","{arrow-left}":"Left Arrow","{arrow-up}":"Up Arrow","{arrow-down}":"Down Arrow","{plus}":"plus"},u={ctrl:"Control",alt:"Alt",esc:"Escape",del:"Delete",ins:"Insert",pgup:"Page Up",pgdn:"Page Down",num:"Number",caps:"Caps Lock"},p={compatConfig:{MODE:3},name:"DtKeyboardShortcut",components:{DtIconLayoutGrid:e.DtIconLayoutGrid,DtIconArrowRight:e.DtIconArrowRight,DtIconArrowLeft:e.DtIconArrowLeft,DtIconArrowUp:e.DtIconArrowUp,DtIconArrowDown:e.DtIconArrowDown,DtIconCommand:e.DtIconCommand,DtIconOption:e.DtIconOption,DtIconPlus:e.DtIconPlus},props:{inverted:{type:Boolean,default:!1},shortcut:{type:String,required:!0},screenReaderText:{type:String,default:null}},data(){return{separator:/\+/gi}},computed:{icons(){return{...s,"{plus}":e.DtIconPlus}},shortcutWithSeparator(){return this.shortcut.replace(this.separator,"{plus}")},formattedShortcut(){return Object.keys(s).reduce((o,r)=>o.replace(new RegExp("{"+r+"}","gi"),s[r]),this.shortcutWithSeparator)},formattedShortcutSplit(){const o=Object.keys(this.icons).join("|"),r=new RegExp(`(${o})`,"gi");return this.formattedShortcut.split(r).filter(Boolean)},generatedScreenReaderText(){return this.formattedShortcutSplit.map(o=>{const r=o.trim();if(l[r])return l[r];const n=r.toLowerCase();return u[n]?u[n]:r}).filter(o=>o).join(" ")}}},m={class:"d-keyboard-shortcut--sr-only"},w=["innerHTML"];function h(o,r,n,I,_,a){return t.openBlock(),t.createElementBlock("kbd",{class:t.normalizeClass(["d-keyboard-shortcut",{"d-keyboard-shortcut--inverted":n.inverted}])},[t.createElementVNode("span",m,t.toDisplayString(n.screenReaderText||a.generatedScreenReaderText),1),(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(a.formattedShortcutSplit,(c,i)=>(t.openBlock(),t.createElementBlock(t.Fragment,null,[a.icons[c]?(t.openBlock(),t.createBlock(t.resolveDynamicComponent(a.icons[c]),{key:`icon-${i}-${c}`,size:"100","aria-hidden":"true",class:t.normalizeClass(["d-keyboard-shortcut__icon",{"d-keyboard-shortcut__icon--inverted":n.inverted}])},null,8,["class"])):c.trim()?(t.openBlock(),t.createElementBlock("span",{key:`text-${i}-${c}`,"aria-hidden":"true",class:t.normalizeClass(["d-keyboard-shortcut__item",{"d-keyboard-shortcut__item--inverted":n.inverted}]),innerHTML:c},null,10,w)):t.createCommentVNode("",!0)],64))),256))],2)}const D=d._(p,[["render",h]]);exports.default=D;
 //# sourceMappingURL=keyboard-shortcut.cjs.map

package/dist/vue3/lib/keyboard-shortcut/keyboard-shortcut.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.cjs","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\n      v-if=\"screenReaderText\"\n      class=\"d-keyboard-shortcut--sr-only\"\n    >\n      {{ screenReaderText }}\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=\"`${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\n        :key=\"`${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  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};\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    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} {win} {arrow-right} {arrow-left} {arrow-up} {arrow-down}\n     */\n    shortcut: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Text entered here will be read by assistive technology. If null this component will be ignored by AT.\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};\n</script>\n"],"names":["SHORTCUTS_ICON_ALIASES","DtIconLayoutGrid","DtIconArrowRight","DtIconArrowLeft","DtIconArrowUp","DtIconArrowDown","DtIconCommand","_sfc_main","DtIconPlus","result","key","iconAliasString","regex","_hoisted_2","_createElementBlock","_normalizeClass","$props","_hoisted_1","_toDisplayString","_createCommentVNode","_openBlock","_Fragment","_renderList","$options","item","i","_createBlock","_resolveDynamicComponent"],"mappings":"uOAqDMA,EAAyB,CAC7B,QAASC,EAAAA,iBACT,gBAAiBC,EAAAA,iBACjB,eAAgBC,EAAAA,gBAChB,aAAcC,EAAAA,cACd,eAAgBC,EAAAA,gBAChB,QAASC,EAAAA,aACX,EAMKC,EAAU,CACb,aAAc,CAAE,KAAM,GACtB,KAAM,qBAEN,WAAY,CACV,iBAAAN,EAAAA,iBACA,iBAAAC,EAAAA,iBACA,gBAAAC,EAAAA,8BACAC,EAAAA,cACA,gBAAAC,EAAAA,8BACAC,EAAAA,yBACAE,EAAAA,YAGF,MAAO,CAKL,SAAU,CACR,KAAM,QACN,QAAS,IAOX,SAAU,CACR,KAAM,OACN,SAAU,IAMZ,iBAAkB,CAChB,KAAM,OACN,QAAS,OAIb,MAAQ,CACN,MAAO,CACL,UAAW,OAEf,EAEA,SAAU,CACR,OAAS,CACP,MAAO,CACL,GAAGR,EACH,SAAUQ,EAAAA,WAEd,EAEA,uBAAyB,CACvB,OAAO,KAAK,SAAS,QAAQ,KAAK,UAAW,QAAQ,CACvD,EAEA,mBAAqB,CACnB,OAAO,OAAO,KAAKR,CAAsB,EAAE,OAAO,CAACS,EAAQC,IAClDD,EAAO,QAAQ,IAAI,OAAO,IAAMC,EAAM,IAAK,IAAI,EAAGV,EAAuBU,CAAG,CAAC,EACnF,KAAK,qBAAqB,CAC/B,EAGA,wBAA0B,CACxB,MAAMC,EAAkB,OAAO,KAAK,KAAK,KAAK,EAAE,KAAK,GAAG,EAOlDC,EAAQ,IAAI,OAAO,IAAID,CAAe,IAAK,IAAI,EACrD,OAAO,KAAK,kBAAkB,MAAMC,CAAK,EAAE,OAAO,OAAO,CAC3D,EAEJ,KAjJA,IAAA,EAUM,MAAM,gCAVZC,EAAA,CAAA,WAAA,+CAEEC,EAAAA,mBAqCM,MAAA,CApCH,MAHLC,EAAAA,eAAA,wDAGoFC,EAAA,QAAQ,MAMhFA,EAAA,gCADRF,EAAAA,mBAKO,OALPG,EAKOC,EAAAA,gBADFF,EAAA,gBAAgB,EAAA,CAAA,GAZzBG,EAAAA,mBAAA,GAAA,EAAA,GAcIC,EAAAA,UAAA,EAAA,EAAAN,EAAAA,mBAwBWO,gBAtCfC,EAAAA,WAe0BC,EAAA,uBAf1B,CAecC,EAAMC,KAfpBL,YAAA,EAAAN,qBAAAO,EAAAA,SAAA,KAAA,CAmBcE,EAAA,MAAMC,CAAI,GAFlBJ,EAAAA,UAAA,EAAAM,EAAAA,YAUEC,EAAAA,wBATKJ,EAAA,MAAMC,CAAI,CAAA,EAAA,CAEd,IAAG,GAAKC,CAAC,IAAID,CAAI,GAClB,KAAK,MACL,cAAY,OACX,MAvBTT,EAAAA,eAAA,oEAuB4GC,EAAA,QAAQ,uCAK9GF,EAAAA,mBASE,OAAA,CAPC,IAAG,GAAKW,CAAC,IAAID,CAAI,GAClB,cAAY,OACX,MAhCTT,EAAAA,eAAA,oEAgC4GC,EAAA,QAAQ,IAI5G,UAAQQ,CApChB,EAAA,KAAA,GAAAX,CAAA"}
+{"version":3,"file":"keyboard-shortcut.cjs","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"],"names":["SHORTCUTS_ICON_ALIASES","DtIconLayoutGrid","DtIconArrowRight","DtIconArrowLeft","DtIconArrowUp","DtIconArrowDown","DtIconCommand","DtIconOption","ICON_ALIAS_TO_TEXT","KEY_ABBREVIATIONS","_sfc_main","DtIconPlus","result","key","iconAliasString","regex","item","trimmedItem","lowerItem","_hoisted_1","_hoisted_2","_createElementBlock","_normalizeClass","$props","_createElementVNode","_toDisplayString","$options","_openBlock","_Fragment","_renderList","_createBlock","_resolveDynamicComponent","_createCommentVNode"],"mappings":"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"}

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

@@ -1,23 +1,44 @@
-import { DtIconPlus as u, DtIconCommand as h, DtIconArrowDown as p, DtIconArrowUp as m, DtIconArrowLeft as _, DtIconArrowRight as y, DtIconLayoutGrid as f } from "@dialpad/dialtone-icons/vue3";
-import { createElementBlock as n, openBlock as t, normalizeClass as s, createCommentVNode as S, toDisplayString as k, Fragment as l, renderList as g, createBlock as w, resolveDynamicComponent as D } from "vue";
-import { _ as b } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-const d = {
-  "{win}": f,
-  "{arrow-right}": y,
-  "{arrow-left}": _,
-  "{arrow-up}": m,
-  "{arrow-down}": p,
-  "{cmd}": h
+import { DtIconPlus as u, DtIconOption as h, DtIconCommand as w, DtIconArrowDown as _, DtIconArrowUp as f, DtIconArrowLeft as S, DtIconArrowRight as g, DtIconLayoutGrid as y } from "@dialpad/dialtone-icons/vue3";
+import { createElementBlock as c, openBlock as n, normalizeClass as s, createElementVNode as D, toDisplayString as I, Fragment as l, renderList as A, createBlock as k, createCommentVNode as b, resolveDynamicComponent as C } from "vue";
+import { _ as T } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const i = {
+  "{win}": y,
+  "{arrow-right}": g,
+  "{arrow-left}": S,
+  "{arrow-up}": f,
+  "{arrow-down}": _,
+  "{cmd}": w,
+  "{opt}": h
+}, p = {
+  "{cmd}": "Command",
+  "{opt}": "Option",
+  "{win}": "Windows",
+  "{arrow-right}": "Right Arrow",
+  "{arrow-left}": "Left Arrow",
+  "{arrow-up}": "Up Arrow",
+  "{arrow-down}": "Down Arrow",
+  "{plus}": "plus"
+}, m = {
+  ctrl: "Control",
+  alt: "Alt",
+  esc: "Escape",
+  del: "Delete",
+  ins: "Insert",
+  pgup: "Page Up",
+  pgdn: "Page Down",
+  num: "Number",
+  caps: "Caps Lock"
 }, x = {
   compatConfig: { MODE: 3 },
   name: "DtKeyboardShortcut",
   components: {
-    DtIconLayoutGrid: f,
-    DtIconArrowRight: y,
-    DtIconArrowLeft: _,
-    DtIconArrowUp: m,
-    DtIconArrowDown: p,
-    DtIconCommand: h,
+    DtIconLayoutGrid: y,
+    DtIconArrowRight: g,
+    DtIconArrowLeft: S,
+    DtIconArrowUp: f,
+    DtIconArrowDown: _,
+    DtIconCommand: w,
+    DtIconOption: h,
     DtIconPlus: u
   },
   props: {
@@ -31,14 +52,15 @@ const d = {
     },
     /**
      * Include any of these tokens in your string to render the corresponding symbol:
-     * {cmd} {win} {arrow-right} {arrow-left} {arrow-up} {arrow-down}
+     * {cmd} {opt} {win} {arrow-right} {arrow-left} {arrow-up} {arrow-down}
      */
     shortcut: {
       type: String,
       required: !0
     },
     /**
-     * Text entered here will be read by assistive technology. If null this component will be ignored by AT.
+     * Optional text to override the auto-generated accessible text for assistive technology.
+     * If not provided, accessible text will be automatically generated from the shortcut.
      */
     screenReaderText: {
       type: String,
@@ -53,7 +75,7 @@ const d = {
   computed: {
     icons() {
       return {
-        ...d,
+        ...i,
         "{plus}": u
       };
     },
@@ -61,49 +83,56 @@ const d = {
       return this.shortcut.replace(this.separator, "{plus}");
     },
     formattedShortcut() {
-      return Object.keys(d).reduce((c, e) => c.replace(new RegExp("{" + e + "}", "gi"), d[e]), this.shortcutWithSeparator);
+      return Object.keys(i).reduce((r, t) => r.replace(new RegExp("{" + t + "}", "gi"), i[t]), this.shortcutWithSeparator);
     },
     // Splits any icon based aliases into their own array items.
     formattedShortcutSplit() {
-      const c = Object.keys(this.icons).join("|"), e = new RegExp(`(${c})`, "gi");
-      return this.formattedShortcut.split(e).filter(Boolean);
+      const r = Object.keys(this.icons).join("|"), t = new RegExp(`(${r})`, "gi");
+      return this.formattedShortcut.split(t).filter(Boolean);
+    },
+    // Generates accessible text for the keyboard shortcut
+    generatedScreenReaderText() {
+      return this.formattedShortcutSplit.map((r) => {
+        const t = r.trim();
+        if (p[t])
+          return p[t];
+        const e = t.toLowerCase();
+        return m[e] ? m[e] : t;
+      }).filter((r) => r).join(" ");
     }
   }
-}, I = {
-  key: 0,
-  class: "d-keyboard-shortcut--sr-only"
-}, v = ["innerHTML"];
-function A(c, e, r, C, R, a) {
-  return t(), n("kbd", {
+}, E = { class: "d-keyboard-shortcut--sr-only" }, L = ["innerHTML"];
+function O(r, t, e, R, v, a) {
+  return n(), c("kbd", {
     class: s([
       "d-keyboard-shortcut",
-      { "d-keyboard-shortcut--inverted": r.inverted }
+      { "d-keyboard-shortcut--inverted": e.inverted }
     ])
   }, [
-    r.screenReaderText ? (t(), n("span", I, k(r.screenReaderText), 1)) : S("", !0),
-    (t(!0), n(l, null, g(a.formattedShortcutSplit, (o, i) => (t(), n(l, null, [
-      a.icons[o] ? (t(), w(D(a.icons[o]), {
-        key: `${i}-${o}`,
+    D("span", E, I(e.screenReaderText || a.generatedScreenReaderText), 1),
+    (n(!0), c(l, null, A(a.formattedShortcutSplit, (o, d) => (n(), c(l, null, [
+      a.icons[o] ? (n(), k(C(a.icons[o]), {
+        key: `icon-${d}-${o}`,
         size: "100",
         "aria-hidden": "true",
         class: s([
           "d-keyboard-shortcut__icon",
-          { "d-keyboard-shortcut__icon--inverted": r.inverted }
+          { "d-keyboard-shortcut__icon--inverted": e.inverted }
         ])
-      }, null, 8, ["class"])) : (t(), n("span", {
-        key: `${i}-${o}`,
+      }, null, 8, ["class"])) : o.trim() ? (n(), c("span", {
+        key: `text-${d}-${o}`,
         "aria-hidden": "true",
         class: s([
           "d-keyboard-shortcut__item",
-          { "d-keyboard-shortcut__item--inverted": r.inverted }
+          { "d-keyboard-shortcut__item--inverted": e.inverted }
         ]),
         innerHTML: o
-      }, null, 10, v))
+      }, null, 10, L)) : b("", !0)
     ], 64))), 256))
   ], 2);
 }
-const E = /* @__PURE__ */ b(x, [["render", A]]);
+const U = /* @__PURE__ */ T(x, [["render", O]]);
 export {
-  E as default
+  U as default
 };
 //# sourceMappingURL=keyboard-shortcut.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.js","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\n      v-if=\"screenReaderText\"\n      class=\"d-keyboard-shortcut--sr-only\"\n    >\n      {{ screenReaderText }}\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=\"`${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\n        :key=\"`${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  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};\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    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} {win} {arrow-right} {arrow-left} {arrow-up} {arrow-down}\n     */\n    shortcut: {\n      type: String,\n      required: true,\n    },\n\n    /**\n     * Text entered here will be read by assistive technology. If null this component will be ignored by AT.\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};\n</script>\n"],"names":["SHORTCUTS_ICON_ALIASES","DtIconLayoutGrid","DtIconArrowRight","DtIconArrowLeft","DtIconArrowUp","DtIconArrowDown","DtIconCommand","_sfc_main","DtIconPlus","result","key","iconAliasString","regex","_hoisted_2","_createElementBlock","_normalizeClass","$props","_hoisted_1","_toDisplayString","_createCommentVNode","_openBlock","_Fragment","_renderList","$options","item","_createBlock","_resolveDynamicComponent"],"mappings":";;;AAqDA,MAAMA,IAAyB;AAAA,EAC7B,SAASC;AAAA,EACT,iBAAiBC;AAAA,EACjB,gBAAgBC;AAAA,EAChB,cAAcC;AAAA,EACd,gBAAgBC;AAAA,EAChB,SAASC;AACX,GAMKC,IAAU;AAAA,EACb,cAAc,EAAE,MAAM;EACtB,MAAM;AAAA,EAEN,YAAY;AAAA,IACV,kBAAAN;AAAA,IACA,kBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAE;AAAA;EAGF,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKL,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;;;;;IAOX,UAAU;AAAA,MACR,MAAM;AAAA,MACN,UAAU;AAAA;;;;IAMZ,kBAAkB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA;;EAIb,OAAQ;AACN,WAAO;AAAA,MACL,WAAW;AAAA;EAEf;AAAA,EAEA,UAAU;AAAA,IACR,QAAS;AACP,aAAO;AAAA,QACL,GAAGR;AAAA,QACH,UAAUQ;AAAA;IAEd;AAAA,IAEA,wBAAyB;AACvB,aAAO,KAAK,SAAS,QAAQ,KAAK,WAAW,QAAQ;AAAA,IACvD;AAAA,IAEA,oBAAqB;AACnB,aAAO,OAAO,KAAKR,CAAsB,EAAE,OAAO,CAACS,GAAQC,MAClDD,EAAO,QAAQ,IAAI,OAAO,MAAMC,IAAM,KAAK,IAAI,GAAGV,EAAuBU,CAAG,CAAC,GACnF,KAAK,qBAAqB;AAAA,IAC/B;AAAA;AAAA,IAGA,yBAA0B;AACxB,YAAMC,IAAkB,OAAO,KAAK,KAAK,KAAK,EAAE,KAAK,GAAG,GAOlDC,IAAQ,IAAI,OAAO,IAAID,CAAe,KAAK,IAAI;AACrD,aAAO,KAAK,kBAAkB,MAAMC,CAAK,EAAE,OAAO,OAAO;AAAA,IAC3D;AAAA;AAEJ;EAjJA,KAAA;AAAA,EAUM,OAAM;GAVZC,IAAA,CAAA,WAAA;;cAEEC,EAqCM,OAAA;AAAA,IApCH,OAHLC,EAAA;AAAA;yCAGoFC,EAAA,SAAQ;AAAA;;IAMhFA,EAAA,yBADRF,EAKO,QALPG,GAKOC,EADFF,EAAA,gBAAgB,GAAA,CAAA,KAZzBG,EAAA,IAAA,EAAA;AAAA,KAcIC,EAAA,EAAA,GAAAN,EAwBWO,SAtCfC,EAe0BC,EAAA,wBAf1B,CAecC,GAAM,OAfpBJ,EAAA,GAAAN,EAAAO,GAAA,MAAA;AAAA,MAmBcE,EAAA,MAAMC,CAAI,KAFlBJ,EAAA,GAAAK,EAUEC,EATKH,EAAA,MAAMC,CAAI,CAAA,GAAA;AAAA,QAEd,KAAG,GAAK,CAAC,IAAIA,CAAI;AAAA,QAClB,MAAK;AAAA,QACL,eAAY;AAAA,QACX,OAvBTT,EAAA;AAAA;mDAuB4GC,EAAA,SAAQ;AAAA;sCAK9GF,EASE,QAAA;AAAA,QAPC,KAAG,GAAK,CAAC,IAAIU,CAAI;AAAA,QAClB,eAAY;AAAA,QACX,OAhCTT,EAAA;AAAA;mDAgC4GC,EAAA,SAAQ;AAAA;QAI5G,WAAQQ;AAAA,MApChB,GAAA,MAAA,IAAAX,CAAA;AAAA;;;;"}
+{"version":3,"file":"keyboard-shortcut.js","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"],"names":["SHORTCUTS_ICON_ALIASES","DtIconLayoutGrid","DtIconArrowRight","DtIconArrowLeft","DtIconArrowUp","DtIconArrowDown","DtIconCommand","DtIconOption","ICON_ALIAS_TO_TEXT","KEY_ABBREVIATIONS","_sfc_main","DtIconPlus","result","key","iconAliasString","regex","item","trimmedItem","lowerItem","_hoisted_1","_hoisted_2","_createElementBlock","_normalizeClass","$props","_createElementVNode","_toDisplayString","$options","_openBlock","_Fragment","_renderList","i","_createBlock","_resolveDynamicComponent","_createCommentVNode"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),d=require("../../common/constants/index.cjs"),o=require("./select-menu-constants.cjs"),i=require("../../common/utils/index.cjs"),u=require("../../common/mixins/input.cjs"),S=require("./select-menu-validators.cjs"),m=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),E=require("../validation-messages/validation-messages.cjs"),_={compatConfig:{MODE:3},name:"DtSelectMenu",components:{DtValidationMessages:E.default},mixins:[u.MessagesMixin],inheritAttrs:!1,props:{label:{type:String,default:""},description:{type:String,default:""},options:{type:Array,default:()=>[],validator:t=>S.optionsValidator(t)},size:{type:String,default:"md",validator:t=>Object.keys(o.SELECT_SIZE_MODIFIERS).includes(t)},labelClass:{type:[String,Array,Object],default:""},descriptionClass:{type:[String,Array,Object],default:""},selectClass:{type:[String,Array,Object],default:""},optionClass:{type:[String,Array,Object],default:""},labelChildProps:{type:Object,default:()=>({})},descriptionChildProps:{type:Object,default:()=>({})},optionChildProps:{type:Object,default:()=>({})},disabled:{type:Boolean,default:!1},rootClass:{type:[String,Object,Array],default:""}},emits:["input","update:modelValue","change"],data(){return{LABEL_SIZE_MODIFIERS:d.LABEL_SIZE_MODIFIERS,DESCRIPTION_SIZE_MODIFIERS:d.DESCRIPTION_SIZE_MODIFIERS,SELECT_SIZE_MODIFIERS:o.SELECT_SIZE_MODIFIERS,SELECT_STATE_MODIFIERS:o.SELECT_STATE_MODIFIERS,hasSlotContent:i.hasSlotContent}},computed:{selectListeners(){return{input:()=>{},change:t=>this.emitValue(t.target.value,t)}},state(){return i.getValidationState(this.formattedMessages)},selectKey(){return i.getUniqueString()},descriptionKey(){return`select-${this.selectKey}-description`},labelAriaDetails(){return this.$slots.description||this.description?this.descriptionKey:this.$attrs["aria-details"]}},mounted(){this.validateOptionsPresence()},beforeUpdate(){this.validateOptionsPresence()},methods:{removeClassStyleAttrs:i.removeClassStyleAttrs,addClassStyleAttrs:i.addClassStyleAttrs,emitValue(t,r){this.$emit("update:modelValue",t,r),this.$emit("input",t,r),this.$emit("change",t,r)},getOptionKey(t){return`select-${this.selectKey}-option-${t}`},validateOptionsPresence(){var t;((t=this.options)==null?void 0:t.length)<1&&!this.$slots.default&&e.warn("Options are expected to be provided via prop or slot",this)}}},p=["aria-details"],g=["id"],C=["disabled"],I=["value"];function h(t,r,s,b,a,l){const c=e.resolveComponent("dt-validation-messages");return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:s.rootClass},l.addClassStyleAttrs(t.$attrs)),[e.createElementVNode("label",null,[a.hasSlotContent(t.$slots.label)||s.label?(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:0,"aria-details":l.labelAriaDetails,class:["d-label",a.LABEL_SIZE_MODIFIERS[s.size],s.labelClass]},s.labelChildProps,{"data-qa":"dt-select-label"}),[e.renderSlot(t.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(s.label),1)])],16,p)):e.createCommentVNode("",!0),a.hasSlotContent(t.$slots.description)||s.description?(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:1,id:l.descriptionKey,class:["d-description",a.DESCRIPTION_SIZE_MODIFIERS[s.size],s.descriptionClass]},s.descriptionChildProps,{"data-qa":"dt-select-description"}),[e.renderSlot(t.$slots,"description",{},()=>[e.createTextVNode(e.toDisplayString(s.description),1)])],16,g)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["d-select",a.SELECT_SIZE_MODIFIERS[s.size],s.selectClass,{"d-select--disabled":s.disabled}]),"data-qa":"dt-select-wrapper"},[e.createElementVNode("select",e.mergeProps({ref:"selectElement",class:["d-select__input",a.SELECT_STATE_MODIFIERS[l.state]]},l.removeClassStyleAttrs(t.$attrs),{"data-qa":"dt-select",disabled:s.disabled},e.toHandlers(l.selectListeners,!0)),[e.renderSlot(t.$slots,"default",{},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.options,n=>(e.openBlock(),e.createElementBlock("option",e.mergeProps({key:l.getOptionKey(n.value),value:n.value,class:s.optionClass},s.optionChildProps),e.toDisplayString(n.label),17,I))),128))])],16,C)],2)]),e.createVNode(c,e.mergeProps({"validation-messages":t.formattedMessages,"show-messages":t.showMessages,class:t.messagesClass},t.messagesChildProps,{"data-qa":"dt-select-messages"}),null,16,["validation-messages","show-messages","class"])],16)}const y=m._(_,[["render",h]]);exports.default=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),d=require("../../common/constants/index.cjs"),o=require("./select-menu-constants.cjs"),i=require("../../common/utils/index.cjs"),u=require("../../common/mixins/input.cjs"),m=require("./select-menu-validators.cjs"),S=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),E=require("../validation-messages/validation-messages.cjs"),_={compatConfig:{MODE:3},name:"DtSelectMenu",components:{DtValidationMessages:E.default},mixins:[u.MessagesMixin],inheritAttrs:!1,props:{label:{type:String,default:""},description:{type:String,default:""},options:{type:Array,default:()=>[],validator:t=>m.optionsValidator(t)},size:{type:String,default:"md",validator:t=>Object.keys(o.SELECT_SIZE_MODIFIERS).includes(t)},labelClass:{type:[String,Array,Object],default:""},descriptionClass:{type:[String,Array,Object],default:""},selectClass:{type:[String,Array,Object],default:""},optionClass:{type:[String,Array,Object],default:""},labelChildProps:{type:Object,default:()=>({})},descriptionChildProps:{type:Object,default:()=>({})},optionChildProps:{type:Object,default:()=>({})},disabled:{type:Boolean,default:!1},rootClass:{type:[String,Object,Array],default:""},modelValue:{type:[String,Number],default:""}},emits:["input","update:modelValue","change"],data(){return{LABEL_SIZE_MODIFIERS:d.LABEL_SIZE_MODIFIERS,DESCRIPTION_SIZE_MODIFIERS:d.DESCRIPTION_SIZE_MODIFIERS,SELECT_SIZE_MODIFIERS:o.SELECT_SIZE_MODIFIERS,SELECT_STATE_MODIFIERS:o.SELECT_STATE_MODIFIERS,hasSlotContent:i.hasSlotContent}},computed:{selectListeners(){return{input:()=>{},change:t=>this.emitValue(t.target.value,t)}},state(){return i.getValidationState(this.formattedMessages)},selectKey(){return i.getUniqueString()},descriptionKey(){return`select-${this.selectKey}-description`},labelAriaDetails(){return this.$slots.description||this.description?this.descriptionKey:this.$attrs["aria-details"]}},mounted(){this.validateOptionsPresence()},beforeUpdate(){this.validateOptionsPresence()},methods:{removeClassStyleAttrs:i.removeClassStyleAttrs,addClassStyleAttrs:i.addClassStyleAttrs,emitValue(t,r){this.$emit("update:modelValue",t,r),this.$emit("input",t,r),this.$emit("change",t,r)},getOptionKey(t){return`select-${this.selectKey}-option-${t}`},validateOptionsPresence(){var t;((t=this.options)==null?void 0:t.length)<1&&!this.$slots.default&&e.warn("Options are expected to be provided via prop or slot",this)}}},p=["aria-details"],g=["id"],C=["disabled","value"],y=["value"];function I(t,r,s,b,a,l){const c=e.resolveComponent("dt-validation-messages");return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:s.rootClass},l.addClassStyleAttrs(t.$attrs)),[e.createElementVNode("label",null,[a.hasSlotContent(t.$slots.label)||s.label?(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:0,"aria-details":l.labelAriaDetails,class:["d-label",a.LABEL_SIZE_MODIFIERS[s.size],s.labelClass]},s.labelChildProps,{"data-qa":"dt-select-label"}),[e.renderSlot(t.$slots,"label",{},()=>[e.createTextVNode(e.toDisplayString(s.label),1)])],16,p)):e.createCommentVNode("",!0),a.hasSlotContent(t.$slots.description)||s.description?(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:1,id:l.descriptionKey,class:["d-description",a.DESCRIPTION_SIZE_MODIFIERS[s.size],s.descriptionClass]},s.descriptionChildProps,{"data-qa":"dt-select-description"}),[e.renderSlot(t.$slots,"description",{},()=>[e.createTextVNode(e.toDisplayString(s.description),1)])],16,g)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["d-select",a.SELECT_SIZE_MODIFIERS[s.size],s.selectClass,{"d-select--disabled":s.disabled}]),"data-qa":"dt-select-wrapper"},[e.createElementVNode("select",e.mergeProps({ref:"selectElement",class:["d-select__input",a.SELECT_STATE_MODIFIERS[l.state]]},l.removeClassStyleAttrs(t.$attrs),{"data-qa":"dt-select",disabled:s.disabled,value:s.modelValue},e.toHandlers(l.selectListeners,!0)),[e.renderSlot(t.$slots,"default",{},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(s.options,n=>(e.openBlock(),e.createElementBlock("option",e.mergeProps({key:l.getOptionKey(n.value),value:n.value,class:s.optionClass},s.optionChildProps),e.toDisplayString(n.label),17,y))),128))])],16,C)],2)]),e.createVNode(c,e.mergeProps({"validation-messages":t.formattedMessages,"show-messages":t.showMessages,class:t.messagesClass},t.messagesChildProps,{"data-qa":"dt-select-messages"}),null,16,["validation-messages","show-messages","class"])],16)}const h=S._(_,[["render",I]]);exports.default=h;
 //# sourceMappingURL=select-menu.cjs.map

package/dist/vue3/lib/select-menu/select-menu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"select-menu.cjs","sources":["../../../components/select_menu/select_menu.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"rootClass\"\n    v-bind=\"addClassStyleAttrs($attrs)\"\n  >\n    <label>\n      <div\n        v-if=\"hasSlotContent($slots.label) || label\"\n        :aria-details=\"labelAriaDetails\"\n        :class=\"[\n          'd-label',\n          LABEL_SIZE_MODIFIERS[size],\n          labelClass,\n        ]\"\n        v-bind=\"labelChildProps\"\n        data-qa=\"dt-select-label\"\n      >\n        <!-- @slot Slot for label, defaults to label prop -->\n        <slot name=\"label\">{{ label }}</slot>\n      </div>\n      <div\n        v-if=\"hasSlotContent($slots.description) || description\"\n        :id=\"descriptionKey\"\n        :class=\"[\n          'd-description',\n          DESCRIPTION_SIZE_MODIFIERS[size],\n          descriptionClass,\n        ]\"\n        v-bind=\"descriptionChildProps\"\n        data-qa=\"dt-select-description\"\n      >\n        <!-- @slot Slot for description, defaults to description prop -->\n        <slot name=\"description\">{{ description }}</slot>\n      </div>\n      <div\n        :class=\"[\n          'd-select',\n          SELECT_SIZE_MODIFIERS[size],\n          selectClass,\n          { 'd-select--disabled': disabled },\n        ]\"\n        data-qa=\"dt-select-wrapper\"\n      >\n        <select\n          ref=\"selectElement\"\n          :class=\"[\n            'd-select__input',\n            SELECT_STATE_MODIFIERS[state],\n          ]\"\n          v-bind=\"removeClassStyleAttrs($attrs)\"\n          data-qa=\"dt-select\"\n          :disabled=\"disabled\"\n          v-on=\"selectListeners\"\n        >\n          <!-- @slot Slot for select menu options, defaults to options prop -->\n          <slot>\n            <option\n              v-for=\"option in options\"\n              :key=\"getOptionKey(option.value)\"\n              :value=\"option.value\"\n              :class=\"optionClass\"\n              v-bind=\"optionChildProps\"\n            >\n              {{ option.label }}\n            </option>\n          </slot>\n        </select>\n      </div>\n    </label>\n    <dt-validation-messages\n      :validation-messages=\"formattedMessages\"\n      :show-messages=\"showMessages\"\n      :class=\"messagesClass\"\n      v-bind=\"messagesChildProps\"\n      data-qa=\"dt-select-messages\"\n    />\n  </div>\n</template>\n\n<script>\nimport { warn } from 'vue';\nimport {\n  LABEL_SIZE_MODIFIERS,\n  DESCRIPTION_SIZE_MODIFIERS,\n} from '@/common/constants';\nimport {\n  SELECT_SIZE_MODIFIERS,\n  SELECT_STATE_MODIFIERS,\n} from './select_menu_constants';\nimport {\n  getUniqueString,\n  getValidationState,\n  hasSlotContent,\n  removeClassStyleAttrs,\n  addClassStyleAttrs,\n} from '@/common/utils';\nimport { MessagesMixin } from '@/common/mixins/input';\nimport { optionsValidator } from './select_menu_validators.js';\nimport { DtValidationMessages } from '../validation_messages';\n\n/**\n * A select menu is an input control that allows users to choose one option from a list.\n * @property {Boolean} disabled attribute\n * @property {String} name attribute\n * @property {String} value attribute\n * @see https://dialtone.dialpad.com/components/select.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtSelectMenu',\n\n  components: { DtValidationMessages },\n\n  mixins: [MessagesMixin],\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Label for the select\n     */\n    label: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Description for the select\n     */\n    description: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Select Menu Options, overridden by default slot. Each option has the following structure:\n     * `{ value: number || string (required), label: string (required) }`\n     * @param {Object[]} options - Optional - A list that can be used to create a list of select menu options\n     * @param {number|string} options[].value - Required - The option value\n     * @param {string} options[].label - Required - The option Label\n     */\n    options: {\n      type: Array,\n      default: () => [],\n      validator: options => optionsValidator(options),\n    },\n\n    /**\n     * Controls the size of the select\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(SELECT_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * Used to customize the label container\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the description container\n     */\n    descriptionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the select\n     */\n    selectClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize each option, should options be provided via prop\n     */\n    optionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * A set of props that are passed into the label container\n     */\n    labelChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into the description container\n     */\n    descriptionChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into each option, should options be provided via prop\n     */\n    optionChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * Disabled state of the select\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the root element.\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    rootClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'input',\n\n    /**\n     * Event fired to sync the modelValue prop with the parent component\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'update:modelValue',\n\n    /**\n     * Native change event\n     *\n     * @event change\n     * @type {String | Number}\n     */\n    'change',\n  ],\n\n  data () {\n    return {\n      LABEL_SIZE_MODIFIERS,\n      DESCRIPTION_SIZE_MODIFIERS,\n      SELECT_SIZE_MODIFIERS,\n      SELECT_STATE_MODIFIERS,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    selectListeners () {\n      return {\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n         * element which will result in the handler being called twice (once on the select element and once by the\n         * emitted input event by the change listener).\n        */\n        input: () => {},\n        change: event => this.emitValue(event.target.value, event),\n      };\n    },\n\n    state () {\n      return getValidationState(this.formattedMessages);\n    },\n\n    selectKey () {\n      return getUniqueString();\n    },\n\n    descriptionKey () {\n      return `select-${this.selectKey}-description`;\n    },\n\n    labelAriaDetails () {\n      if (this.$slots.description || this.description) {\n        return this.descriptionKey;\n      }\n\n      return this.$attrs['aria-details'];\n    },\n  },\n\n  mounted () {\n    this.validateOptionsPresence();\n  },\n\n  beforeUpdate () {\n    this.validateOptionsPresence();\n  },\n\n  methods: {\n    removeClassStyleAttrs,\n    addClassStyleAttrs,\n    emitValue (value, event) {\n      this.$emit('update:modelValue', value, event);\n      this.$emit('input', value, event);\n      this.$emit('change', value, event);\n    },\n\n    getOptionKey (value) {\n      return `select-${this.selectKey}-option-${value}`;\n    },\n\n    validateOptionsPresence () {\n      if (this.options?.length < 1 && !this.$slots.default) {\n        warn('Options are expected to be provided via prop or slot', this);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","MessagesMixin","options","optionsValidator","s","SELECT_SIZE_MODIFIERS","LABEL_SIZE_MODIFIERS","DESCRIPTION_SIZE_MODIFIERS","SELECT_STATE_MODIFIERS","hasSlotContent","event","getValidationState","getUniqueString","removeClassStyleAttrs","addClassStyleAttrs","value","_a","warn","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_createElementBlock","_mergeProps","$props","$options","_ctx","_createElementVNode","$data","_openBlock","_renderSlot","_createTextVNode","_toDisplayString","_createCommentVNode","_normalizeClass","_toHandlers","_Fragment","_renderList","option","_createVNode","_component_dt_validation_messages"],"mappings":"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"}
+{"version":3,"file":"select-menu.cjs","sources":["../../../components/select_menu/select_menu.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"rootClass\"\n    v-bind=\"addClassStyleAttrs($attrs)\"\n  >\n    <label>\n      <div\n        v-if=\"hasSlotContent($slots.label) || label\"\n        :aria-details=\"labelAriaDetails\"\n        :class=\"[\n          'd-label',\n          LABEL_SIZE_MODIFIERS[size],\n          labelClass,\n        ]\"\n        v-bind=\"labelChildProps\"\n        data-qa=\"dt-select-label\"\n      >\n        <!-- @slot Slot for label, defaults to label prop -->\n        <slot name=\"label\">{{ label }}</slot>\n      </div>\n      <div\n        v-if=\"hasSlotContent($slots.description) || description\"\n        :id=\"descriptionKey\"\n        :class=\"[\n          'd-description',\n          DESCRIPTION_SIZE_MODIFIERS[size],\n          descriptionClass,\n        ]\"\n        v-bind=\"descriptionChildProps\"\n        data-qa=\"dt-select-description\"\n      >\n        <!-- @slot Slot for description, defaults to description prop -->\n        <slot name=\"description\">{{ description }}</slot>\n      </div>\n      <div\n        :class=\"[\n          'd-select',\n          SELECT_SIZE_MODIFIERS[size],\n          selectClass,\n          { 'd-select--disabled': disabled },\n        ]\"\n        data-qa=\"dt-select-wrapper\"\n      >\n        <select\n          ref=\"selectElement\"\n          :class=\"[\n            'd-select__input',\n            SELECT_STATE_MODIFIERS[state],\n          ]\"\n          v-bind=\"removeClassStyleAttrs($attrs)\"\n          data-qa=\"dt-select\"\n          :disabled=\"disabled\"\n          :value=\"modelValue\"\n          v-on=\"selectListeners\"\n        >\n          <!-- @slot Slot for select menu options, defaults to options prop -->\n          <slot>\n            <option\n              v-for=\"option in options\"\n              :key=\"getOptionKey(option.value)\"\n              :value=\"option.value\"\n              :class=\"optionClass\"\n              v-bind=\"optionChildProps\"\n            >\n              {{ option.label }}\n            </option>\n          </slot>\n        </select>\n      </div>\n    </label>\n    <dt-validation-messages\n      :validation-messages=\"formattedMessages\"\n      :show-messages=\"showMessages\"\n      :class=\"messagesClass\"\n      v-bind=\"messagesChildProps\"\n      data-qa=\"dt-select-messages\"\n    />\n  </div>\n</template>\n\n<script>\nimport { warn } from 'vue';\nimport {\n  LABEL_SIZE_MODIFIERS,\n  DESCRIPTION_SIZE_MODIFIERS,\n} from '@/common/constants';\nimport {\n  SELECT_SIZE_MODIFIERS,\n  SELECT_STATE_MODIFIERS,\n} from './select_menu_constants';\nimport {\n  getUniqueString,\n  getValidationState,\n  hasSlotContent,\n  removeClassStyleAttrs,\n  addClassStyleAttrs,\n} from '@/common/utils';\nimport { MessagesMixin } from '@/common/mixins/input';\nimport { optionsValidator } from './select_menu_validators.js';\nimport { DtValidationMessages } from '../validation_messages';\n\n/**\n * A select menu is an input control that allows users to choose one option from a list.\n * @property {Boolean} disabled attribute\n * @property {String} name attribute\n * @property {String} value attribute\n * @see https://dialtone.dialpad.com/components/select.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtSelectMenu',\n\n  components: { DtValidationMessages },\n\n  mixins: [MessagesMixin],\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Label for the select\n     */\n    label: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Description for the select\n     */\n    description: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Select Menu Options, overridden by default slot. Each option has the following structure:\n     * `{ value: number || string (required), label: string (required) }`\n     * @param {Object[]} options - Optional - A list that can be used to create a list of select menu options\n     * @param {number|string} options[].value - Required - The option value\n     * @param {string} options[].label - Required - The option Label\n     */\n    options: {\n      type: Array,\n      default: () => [],\n      validator: options => optionsValidator(options),\n    },\n\n    /**\n     * Controls the size of the select\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(SELECT_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * Used to customize the label container\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the description container\n     */\n    descriptionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the select\n     */\n    selectClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize each option, should options be provided via prop\n     */\n    optionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * A set of props that are passed into the label container\n     */\n    labelChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into the description container\n     */\n    descriptionChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into each option, should options be provided via prop\n     */\n    optionChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * Disabled state of the select\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the root element.\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    rootClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * The value of the select menu\n     */\n    modelValue: {\n      type: [String, Number],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'input',\n\n    /**\n     * Event fired to sync the modelValue prop with the parent component\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'update:modelValue',\n\n    /**\n     * Native change event\n     *\n     * @event change\n     * @type {String | Number}\n     */\n    'change',\n  ],\n\n  data () {\n    return {\n      LABEL_SIZE_MODIFIERS,\n      DESCRIPTION_SIZE_MODIFIERS,\n      SELECT_SIZE_MODIFIERS,\n      SELECT_STATE_MODIFIERS,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    selectListeners () {\n      return {\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n         * element which will result in the handler being called twice (once on the select element and once by the\n         * emitted input event by the change listener).\n        */\n        input: () => {},\n        change: event => this.emitValue(event.target.value, event),\n      };\n    },\n\n    state () {\n      return getValidationState(this.formattedMessages);\n    },\n\n    selectKey () {\n      return getUniqueString();\n    },\n\n    descriptionKey () {\n      return `select-${this.selectKey}-description`;\n    },\n\n    labelAriaDetails () {\n      if (this.$slots.description || this.description) {\n        return this.descriptionKey;\n      }\n\n      return this.$attrs['aria-details'];\n    },\n  },\n\n  mounted () {\n    this.validateOptionsPresence();\n  },\n\n  beforeUpdate () {\n    this.validateOptionsPresence();\n  },\n\n  methods: {\n    removeClassStyleAttrs,\n    addClassStyleAttrs,\n    emitValue (value, event) {\n      this.$emit('update:modelValue', value, event);\n      this.$emit('input', value, event);\n      this.$emit('change', value, event);\n    },\n\n    getOptionKey (value) {\n      return `select-${this.selectKey}-option-${value}`;\n    },\n\n    validateOptionsPresence () {\n      if (this.options?.length < 1 && !this.$slots.default) {\n        warn('Options are expected to be provided via prop or slot', this);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","MessagesMixin","options","optionsValidator","s","SELECT_SIZE_MODIFIERS","LABEL_SIZE_MODIFIERS","DESCRIPTION_SIZE_MODIFIERS","SELECT_STATE_MODIFIERS","hasSlotContent","event","getValidationState","getUniqueString","removeClassStyleAttrs","addClassStyleAttrs","value","_a","warn","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_createElementBlock","_mergeProps","$props","$options","_ctx","_createElementVNode","$data","_openBlock","_renderSlot","_createTextVNode","_toDisplayString","_createCommentVNode","_normalizeClass","_toHandlers","_Fragment","_renderList","option","_createVNode","_component_dt_validation_messages"],"mappings":"+cA4GKA,EAAU,CACb,aAAc,CAAE,KAAM,GACtB,KAAM,eAEN,WAAY,CAAA,qBAAEC,EAAAA,SAEd,OAAQ,CAACC,EAAAA,aAAa,EAEtB,aAAc,GAEd,MAAO,CAIL,MAAO,CACL,KAAM,OACN,QAAS,IAMX,YAAa,CACX,KAAM,OACN,QAAS,IAUX,QAAS,CACP,KAAM,MACN,QAAS,IAAM,CAAA,EACf,UAAWC,GAAWC,EAAAA,iBAAiBD,CAAO,GAOhD,KAAM,CACJ,KAAM,OACN,QAAS,KACT,UAAYE,GAAM,OAAO,KAAKC,uBAAqB,EAAE,SAASD,CAAC,GAMjE,WAAY,CACV,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,IAMX,iBAAkB,CAChB,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,IAMX,YAAa,CACX,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,IAMX,YAAa,CACX,KAAM,CAAC,OAAQ,MAAO,MAAM,EAC5B,QAAS,IAMX,gBAAiB,CACf,KAAM,OACN,QAAS,KAAO,CAAA,IAMlB,sBAAuB,CACrB,KAAM,OACN,QAAS,KAAO,CAAA,IAMlB,iBAAkB,CAChB,KAAM,OACN,QAAS,KAAO,CAAA,IAOlB,SAAU,CACR,KAAM,QACN,QAAS,IAQX,UAAW,CACT,KAAM,CAAC,OAAQ,OAAQ,KAAK,EAC5B,QAAS,IAMX,WAAY,CACV,KAAM,CAAC,OAAQ,MAAM,EACrB,QAAS,KAIb,MAAO,CAOL,QAQA,oBAQA,UAGF,MAAQ,CACN,MAAO,CACL,qBAAAE,EAAAA,gDACAC,EAAAA,2BACA,sBAAAF,EAAAA,6CACAG,EAAAA,uBACA,eAAAC,EAAAA,eAEJ,EAEA,SAAU,CACR,iBAAmB,CACjB,MAAO,CAML,MAAO,IAAM,CAAC,EACd,OAAQC,GAAS,KAAK,UAAUA,EAAM,OAAO,MAAOA,CAAK,EAE7D,EAEA,OAAS,CACP,OAAOC,EAAAA,mBAAmB,KAAK,iBAAiB,CAClD,EAEA,WAAa,CACX,OAAOC,kBAAe,CACxB,EAEA,gBAAkB,CAChB,MAAO,UAAU,KAAK,SAAS,cACjC,EAEA,kBAAoB,CAClB,OAAI,KAAK,OAAO,aAAe,KAAK,YAC3B,KAAK,eAGP,KAAK,OAAO,cAAc,CACnC,GAGF,SAAW,CACT,KAAK,wBAAuB,CAC9B,EAEA,cAAgB,CACd,KAAK,wBAAuB,CAC9B,EAEA,QAAS,CACP,sBAAAC,EAAAA,sBACA,mBAAAC,EAAAA,mBACA,UAAWC,EAAOL,EAAO,CACvB,KAAK,MAAM,oBAAqBK,EAAOL,CAAK,EAC5C,KAAK,MAAM,QAASK,EAAOL,CAAK,EAChC,KAAK,MAAM,SAAUK,EAAOL,CAAK,CACnC,EAEA,aAAcK,EAAO,CACnB,MAAO,UAAU,KAAK,SAAS,WAAWA,CAAK,EACjD,EAEA,yBAA2B,SACrBC,EAAA,KAAK,UAAL,YAAAA,EAAc,QAAS,GAAK,CAAC,KAAK,OAAO,SAC3CC,EAAAA,KAAK,uDAAwD,IAAI,CAErE,EAEJ,EAnVAC,EAAA,CAAA,cAAA,EAAAC,EAAA,CAAA,IAAA,EAAAC,EAAA,CAAA,WAAA,OAAA,EAAAC,EAAA,CAAA,OAAA,oGACEC,EAAAA,mBA4EM,MA5ENC,EAAAA,WA4EM,CA3EH,MAAOC,EAAA,SAAS,EACTC,EAAA,mBAAmBC,EAAA,MAAM,CAAA,EAAA,CAEjCC,EAAAA,mBAgEQ,QAAA,KAAA,CA9DEC,EAAA,eAAeF,EAAA,OAAO,KAAK,GAAKF,EAAA,OADxCK,EAAAA,YAAAP,EAAAA,mBAaM,MAbNC,aAaM,CAnBZ,IAAA,EAQS,eAAcE,EAAA,iBACd,MAAK,WAAmCG,EAAA,qBAAqBJ,EAAA,IAAI,EAAaA,EAAA,aAKvEA,EAAA,gBAAe,CACvB,UAAQ,iBAAiB,CAAA,EAAA,CAGzBM,EAAAA,WAAqCJ,oBAArC,IAAqC,CAlB7CK,EAAAA,gBAAAC,EAAAA,gBAkB8BR,EAAA,KAAK,EAAA,CAAA,GAlBnC,EAAA,GAAAN,CAAA,GAAAe,EAAAA,mBAAA,GAAA,EAAA,EAqBcL,EAAA,eAAeF,EAAA,OAAO,WAAW,GAAKF,EAAA,aAD9CK,EAAAA,YAAAP,EAAAA,mBAaM,MAbNC,aAaM,CAjCZ,IAAA,EAsBS,GAAIE,EAAA,eACJ,MAAK,iBAAyCG,EAAA,2BAA2BJ,EAAA,IAAI,EAAaA,EAAA,mBAKnFA,EAAA,sBAAqB,CAC7B,UAAQ,uBAAuB,CAAA,EAAA,CAG/BM,EAAAA,WAAiDJ,0BAAjD,IAAiD,CAhCzDK,EAAAA,gBAAAC,EAAAA,gBAgCoCR,EAAA,WAAW,EAAA,CAAA,GAhC/C,EAAA,GAAAL,CAAA,GAAAc,EAAAA,mBAAA,GAAA,EAAA,EAkCMN,EAAAA,mBAkCM,MAAA,CAjCH,MAnCTO,EAAAA,eAAA,YAmCkDN,EAAA,sBAAsBJ,EAAA,IAAI,EAAaA,EAAA,kCAA+CA,EAAA,QAAQ,IAMxI,UAAQ,sBAERG,EAAAA,mBAwBS,SAxBTJ,aAwBS,CAvBP,IAAI,gBACH,MAAK,mBAA+CK,EAAA,uBAAuBH,EAAA,KAAK,EAIzE,EAAAA,EAAA,sBAAsBC,EAAA,MAAM,EAAA,CACpC,UAAQ,YACP,SAAUF,EAAA,SACV,MAAOA,EAAA,UACR,EAAAW,EAAAA,WAAsBV,EAAhB,gBAAe,EAAA,CAAA,EAAA,CAGrBK,EAAAA,WAUOJ,sBAVP,IAUO,EATLG,YAAA,EAAA,EAAAP,EAAAA,mBAQSc,EAAAA,SAAA,KAjErBC,EAAAA,WA0D+Bb,EAAA,QAAVc,IADTT,YAAA,EAAAP,qBAQS,SARTC,EAAAA,WAQS,CANN,IAAKE,EAAA,aAAaa,EAAO,KAAK,EAC9B,MAAOA,EAAO,MACd,MAAOd,EAAA,WACA,EAAAA,EAAA,gBAAgB,EAAAQ,EAAAA,gBAErBM,EAAO,KAAK,EAAA,GAhE7BjB,CAAA,WAAA,EAAA,GAAAD,CAAA,QAsEImB,EAAAA,YAMEC,EANFjB,aAME,CALC,sBAAqBG,EAAA,kBACrB,gBAAeA,EAAA,aACf,MAAOA,EAAA,eACAA,EAAA,mBAAkB,CAC1B,UAAQ,oBAAoB,CAAA,EAAA,KAAA,GAAA,CAAA,sBAAA,gBAAA,OAAA,CAAA"}

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

@@ -1,16 +1,16 @@
 import { resolveComponent as f, createElementBlock as i, openBlock as r, mergeProps as l, createElementVNode as n, createVNode as g, createCommentVNode as u, renderSlot as c, createTextVNode as p, toDisplayString as m, normalizeClass as y, toHandlers as C, Fragment as b, renderList as E, warn as _ } from "vue";
 import { DESCRIPTION_SIZE_MODIFIERS as I, LABEL_SIZE_MODIFIERS as O } from "../../common/constants/index.js";
 import { SELECT_STATE_MODIFIERS as v, SELECT_SIZE_MODIFIERS as S } from "./select-menu-constants.js";
-import { addClassStyleAttrs as A, removeClassStyleAttrs as D, getUniqueString as M, getValidationState as P, hasSlotContent as L } from "../../common/utils/index.js";
-import { MessagesMixin as T } from "../../common/mixins/input.js";
-import { optionsValidator as V } from "./select-menu-validators.js";
+import { addClassStyleAttrs as A, removeClassStyleAttrs as D, getUniqueString as M, getValidationState as P, hasSlotContent as V } from "../../common/utils/index.js";
+import { MessagesMixin as L } from "../../common/mixins/input.js";
+import { optionsValidator as T } from "./select-menu-validators.js";
 import { _ as R } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
 import j from "../validation-messages/validation-messages.js";
 const F = {
   compatConfig: { MODE: 3 },
   name: "DtSelectMenu",
   components: { DtValidationMessages: j },
-  mixins: [T],
+  mixins: [L],
   inheritAttrs: !1,
   props: {
     /**
@@ -37,7 +37,7 @@ const F = {
     options: {
       type: Array,
       default: () => [],
-      validator: (e) => V(e)
+      validator: (e) => T(e)
     },
     /**
      * Controls the size of the select
@@ -113,6 +113,13 @@ const F = {
     rootClass: {
       type: [String, Object, Array],
       default: ""
+    },
+    /**
+     * The value of the select menu
+     */
+    modelValue: {
+      type: [String, Number],
+      default: ""
     }
   },
   emits: [
@@ -144,7 +151,7 @@ const F = {
       DESCRIPTION_SIZE_MODIFIERS: I,
       SELECT_SIZE_MODIFIERS: S,
       SELECT_STATE_MODIFIERS: v,
-      hasSlotContent: L
+      hasSlotContent: V
     };
   },
   computed: {
@@ -193,7 +200,7 @@ const F = {
       ((e = this.options) == null ? void 0 : e.length) < 1 && !this.$slots.default && _("Options are expected to be provided via prop or slot", this);
     }
   }
-}, K = ["aria-details"], k = ["id"], q = ["disabled"], N = ["value"];
+}, K = ["aria-details"], N = ["id"], k = ["disabled", "value"], q = ["value"];
 function Z(e, d, t, w, a, s) {
   const h = f("dt-validation-messages");
   return r(), i("div", l({ class: t.rootClass }, s.addClassStyleAttrs(e.$attrs)), [
@@ -223,7 +230,7 @@ function Z(e, d, t, w, a, s) {
         c(e.$slots, "description", {}, () => [
           p(m(t.description), 1)
         ])
-      ], 16, k)) : u("", !0),
+      ], 16, N)) : u("", !0),
       n("div", {
         class: y([
           "d-select",
@@ -241,16 +248,17 @@ function Z(e, d, t, w, a, s) {
           ]
         }, s.removeClassStyleAttrs(e.$attrs), {
           "data-qa": "dt-select",
-          disabled: t.disabled
+          disabled: t.disabled,
+          value: t.modelValue
         }, C(s.selectListeners, !0)), [
           c(e.$slots, "default", {}, () => [
             (r(!0), i(b, null, E(t.options, (o) => (r(), i("option", l({
               key: s.getOptionKey(o.value),
               value: o.value,
               class: t.optionClass
-            }, t.optionChildProps), m(o.label), 17, N))), 128))
+            }, t.optionChildProps), m(o.label), 17, q))), 128))
           ])
-        ], 16, q)
+        ], 16, k)
       ], 2)
     ]),
     g(h, l({

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

@@ -1 +1 @@
-{"version":3,"file":"select-menu.js","sources":["../../../components/select_menu/select_menu.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"rootClass\"\n    v-bind=\"addClassStyleAttrs($attrs)\"\n  >\n    <label>\n      <div\n        v-if=\"hasSlotContent($slots.label) || label\"\n        :aria-details=\"labelAriaDetails\"\n        :class=\"[\n          'd-label',\n          LABEL_SIZE_MODIFIERS[size],\n          labelClass,\n        ]\"\n        v-bind=\"labelChildProps\"\n        data-qa=\"dt-select-label\"\n      >\n        <!-- @slot Slot for label, defaults to label prop -->\n        <slot name=\"label\">{{ label }}</slot>\n      </div>\n      <div\n        v-if=\"hasSlotContent($slots.description) || description\"\n        :id=\"descriptionKey\"\n        :class=\"[\n          'd-description',\n          DESCRIPTION_SIZE_MODIFIERS[size],\n          descriptionClass,\n        ]\"\n        v-bind=\"descriptionChildProps\"\n        data-qa=\"dt-select-description\"\n      >\n        <!-- @slot Slot for description, defaults to description prop -->\n        <slot name=\"description\">{{ description }}</slot>\n      </div>\n      <div\n        :class=\"[\n          'd-select',\n          SELECT_SIZE_MODIFIERS[size],\n          selectClass,\n          { 'd-select--disabled': disabled },\n        ]\"\n        data-qa=\"dt-select-wrapper\"\n      >\n        <select\n          ref=\"selectElement\"\n          :class=\"[\n            'd-select__input',\n            SELECT_STATE_MODIFIERS[state],\n          ]\"\n          v-bind=\"removeClassStyleAttrs($attrs)\"\n          data-qa=\"dt-select\"\n          :disabled=\"disabled\"\n          v-on=\"selectListeners\"\n        >\n          <!-- @slot Slot for select menu options, defaults to options prop -->\n          <slot>\n            <option\n              v-for=\"option in options\"\n              :key=\"getOptionKey(option.value)\"\n              :value=\"option.value\"\n              :class=\"optionClass\"\n              v-bind=\"optionChildProps\"\n            >\n              {{ option.label }}\n            </option>\n          </slot>\n        </select>\n      </div>\n    </label>\n    <dt-validation-messages\n      :validation-messages=\"formattedMessages\"\n      :show-messages=\"showMessages\"\n      :class=\"messagesClass\"\n      v-bind=\"messagesChildProps\"\n      data-qa=\"dt-select-messages\"\n    />\n  </div>\n</template>\n\n<script>\nimport { warn } from 'vue';\nimport {\n  LABEL_SIZE_MODIFIERS,\n  DESCRIPTION_SIZE_MODIFIERS,\n} from '@/common/constants';\nimport {\n  SELECT_SIZE_MODIFIERS,\n  SELECT_STATE_MODIFIERS,\n} from './select_menu_constants';\nimport {\n  getUniqueString,\n  getValidationState,\n  hasSlotContent,\n  removeClassStyleAttrs,\n  addClassStyleAttrs,\n} from '@/common/utils';\nimport { MessagesMixin } from '@/common/mixins/input';\nimport { optionsValidator } from './select_menu_validators.js';\nimport { DtValidationMessages } from '../validation_messages';\n\n/**\n * A select menu is an input control that allows users to choose one option from a list.\n * @property {Boolean} disabled attribute\n * @property {String} name attribute\n * @property {String} value attribute\n * @see https://dialtone.dialpad.com/components/select.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtSelectMenu',\n\n  components: { DtValidationMessages },\n\n  mixins: [MessagesMixin],\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Label for the select\n     */\n    label: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Description for the select\n     */\n    description: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Select Menu Options, overridden by default slot. Each option has the following structure:\n     * `{ value: number || string (required), label: string (required) }`\n     * @param {Object[]} options - Optional - A list that can be used to create a list of select menu options\n     * @param {number|string} options[].value - Required - The option value\n     * @param {string} options[].label - Required - The option Label\n     */\n    options: {\n      type: Array,\n      default: () => [],\n      validator: options => optionsValidator(options),\n    },\n\n    /**\n     * Controls the size of the select\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(SELECT_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * Used to customize the label container\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the description container\n     */\n    descriptionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the select\n     */\n    selectClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize each option, should options be provided via prop\n     */\n    optionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * A set of props that are passed into the label container\n     */\n    labelChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into the description container\n     */\n    descriptionChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into each option, should options be provided via prop\n     */\n    optionChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * Disabled state of the select\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the root element.\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    rootClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'input',\n\n    /**\n     * Event fired to sync the modelValue prop with the parent component\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'update:modelValue',\n\n    /**\n     * Native change event\n     *\n     * @event change\n     * @type {String | Number}\n     */\n    'change',\n  ],\n\n  data () {\n    return {\n      LABEL_SIZE_MODIFIERS,\n      DESCRIPTION_SIZE_MODIFIERS,\n      SELECT_SIZE_MODIFIERS,\n      SELECT_STATE_MODIFIERS,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    selectListeners () {\n      return {\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n         * element which will result in the handler being called twice (once on the select element and once by the\n         * emitted input event by the change listener).\n        */\n        input: () => {},\n        change: event => this.emitValue(event.target.value, event),\n      };\n    },\n\n    state () {\n      return getValidationState(this.formattedMessages);\n    },\n\n    selectKey () {\n      return getUniqueString();\n    },\n\n    descriptionKey () {\n      return `select-${this.selectKey}-description`;\n    },\n\n    labelAriaDetails () {\n      if (this.$slots.description || this.description) {\n        return this.descriptionKey;\n      }\n\n      return this.$attrs['aria-details'];\n    },\n  },\n\n  mounted () {\n    this.validateOptionsPresence();\n  },\n\n  beforeUpdate () {\n    this.validateOptionsPresence();\n  },\n\n  methods: {\n    removeClassStyleAttrs,\n    addClassStyleAttrs,\n    emitValue (value, event) {\n      this.$emit('update:modelValue', value, event);\n      this.$emit('input', value, event);\n      this.$emit('change', value, event);\n    },\n\n    getOptionKey (value) {\n      return `select-${this.selectKey}-option-${value}`;\n    },\n\n    validateOptionsPresence () {\n      if (this.options?.length < 1 && !this.$slots.default) {\n        warn('Options are expected to be provided via prop or slot', this);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","MessagesMixin","options","optionsValidator","s","SELECT_SIZE_MODIFIERS","LABEL_SIZE_MODIFIERS","DESCRIPTION_SIZE_MODIFIERS","SELECT_STATE_MODIFIERS","hasSlotContent","event","getValidationState","getUniqueString","removeClassStyleAttrs","addClassStyleAttrs","value","_a","warn","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_createElementBlock","_mergeProps","$props","$options","_ctx","_createElementVNode","$data","_openBlock","_renderSlot","_createTextVNode","_toDisplayString","_createCommentVNode","_normalizeClass","_toHandlers","_Fragment","_renderList","option","_createVNode","_component_dt_validation_messages"],"mappings":"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"}
+{"version":3,"file":"select-menu.js","sources":["../../../components/select_menu/select_menu.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"rootClass\"\n    v-bind=\"addClassStyleAttrs($attrs)\"\n  >\n    <label>\n      <div\n        v-if=\"hasSlotContent($slots.label) || label\"\n        :aria-details=\"labelAriaDetails\"\n        :class=\"[\n          'd-label',\n          LABEL_SIZE_MODIFIERS[size],\n          labelClass,\n        ]\"\n        v-bind=\"labelChildProps\"\n        data-qa=\"dt-select-label\"\n      >\n        <!-- @slot Slot for label, defaults to label prop -->\n        <slot name=\"label\">{{ label }}</slot>\n      </div>\n      <div\n        v-if=\"hasSlotContent($slots.description) || description\"\n        :id=\"descriptionKey\"\n        :class=\"[\n          'd-description',\n          DESCRIPTION_SIZE_MODIFIERS[size],\n          descriptionClass,\n        ]\"\n        v-bind=\"descriptionChildProps\"\n        data-qa=\"dt-select-description\"\n      >\n        <!-- @slot Slot for description, defaults to description prop -->\n        <slot name=\"description\">{{ description }}</slot>\n      </div>\n      <div\n        :class=\"[\n          'd-select',\n          SELECT_SIZE_MODIFIERS[size],\n          selectClass,\n          { 'd-select--disabled': disabled },\n        ]\"\n        data-qa=\"dt-select-wrapper\"\n      >\n        <select\n          ref=\"selectElement\"\n          :class=\"[\n            'd-select__input',\n            SELECT_STATE_MODIFIERS[state],\n          ]\"\n          v-bind=\"removeClassStyleAttrs($attrs)\"\n          data-qa=\"dt-select\"\n          :disabled=\"disabled\"\n          :value=\"modelValue\"\n          v-on=\"selectListeners\"\n        >\n          <!-- @slot Slot for select menu options, defaults to options prop -->\n          <slot>\n            <option\n              v-for=\"option in options\"\n              :key=\"getOptionKey(option.value)\"\n              :value=\"option.value\"\n              :class=\"optionClass\"\n              v-bind=\"optionChildProps\"\n            >\n              {{ option.label }}\n            </option>\n          </slot>\n        </select>\n      </div>\n    </label>\n    <dt-validation-messages\n      :validation-messages=\"formattedMessages\"\n      :show-messages=\"showMessages\"\n      :class=\"messagesClass\"\n      v-bind=\"messagesChildProps\"\n      data-qa=\"dt-select-messages\"\n    />\n  </div>\n</template>\n\n<script>\nimport { warn } from 'vue';\nimport {\n  LABEL_SIZE_MODIFIERS,\n  DESCRIPTION_SIZE_MODIFIERS,\n} from '@/common/constants';\nimport {\n  SELECT_SIZE_MODIFIERS,\n  SELECT_STATE_MODIFIERS,\n} from './select_menu_constants';\nimport {\n  getUniqueString,\n  getValidationState,\n  hasSlotContent,\n  removeClassStyleAttrs,\n  addClassStyleAttrs,\n} from '@/common/utils';\nimport { MessagesMixin } from '@/common/mixins/input';\nimport { optionsValidator } from './select_menu_validators.js';\nimport { DtValidationMessages } from '../validation_messages';\n\n/**\n * A select menu is an input control that allows users to choose one option from a list.\n * @property {Boolean} disabled attribute\n * @property {String} name attribute\n * @property {String} value attribute\n * @see https://dialtone.dialpad.com/components/select.html\n */\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtSelectMenu',\n\n  components: { DtValidationMessages },\n\n  mixins: [MessagesMixin],\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Label for the select\n     */\n    label: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Description for the select\n     */\n    description: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Select Menu Options, overridden by default slot. Each option has the following structure:\n     * `{ value: number || string (required), label: string (required) }`\n     * @param {Object[]} options - Optional - A list that can be used to create a list of select menu options\n     * @param {number|string} options[].value - Required - The option value\n     * @param {string} options[].label - Required - The option Label\n     */\n    options: {\n      type: Array,\n      default: () => [],\n      validator: options => optionsValidator(options),\n    },\n\n    /**\n     * Controls the size of the select\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(SELECT_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * Used to customize the label container\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the description container\n     */\n    descriptionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize the select\n     */\n    selectClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Used to customize each option, should options be provided via prop\n     */\n    optionClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * A set of props that are passed into the label container\n     */\n    labelChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into the description container\n     */\n    descriptionChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * A set of props that are passed into each option, should options be provided via prop\n     */\n    optionChildProps: {\n      type: Object,\n      default: () => ({}),\n    },\n\n    /**\n     * Disabled state of the select\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the root element.\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    rootClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * The value of the select menu\n     */\n    modelValue: {\n      type: [String, Number],\n      default: '',\n    },\n  },\n\n  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'input',\n\n    /**\n     * Event fired to sync the modelValue prop with the parent component\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'update:modelValue',\n\n    /**\n     * Native change event\n     *\n     * @event change\n     * @type {String | Number}\n     */\n    'change',\n  ],\n\n  data () {\n    return {\n      LABEL_SIZE_MODIFIERS,\n      DESCRIPTION_SIZE_MODIFIERS,\n      SELECT_SIZE_MODIFIERS,\n      SELECT_STATE_MODIFIERS,\n      hasSlotContent,\n    };\n  },\n\n  computed: {\n    selectListeners () {\n      return {\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n         * element which will result in the handler being called twice (once on the select element and once by the\n         * emitted input event by the change listener).\n        */\n        input: () => {},\n        change: event => this.emitValue(event.target.value, event),\n      };\n    },\n\n    state () {\n      return getValidationState(this.formattedMessages);\n    },\n\n    selectKey () {\n      return getUniqueString();\n    },\n\n    descriptionKey () {\n      return `select-${this.selectKey}-description`;\n    },\n\n    labelAriaDetails () {\n      if (this.$slots.description || this.description) {\n        return this.descriptionKey;\n      }\n\n      return this.$attrs['aria-details'];\n    },\n  },\n\n  mounted () {\n    this.validateOptionsPresence();\n  },\n\n  beforeUpdate () {\n    this.validateOptionsPresence();\n  },\n\n  methods: {\n    removeClassStyleAttrs,\n    addClassStyleAttrs,\n    emitValue (value, event) {\n      this.$emit('update:modelValue', value, event);\n      this.$emit('input', value, event);\n      this.$emit('change', value, event);\n    },\n\n    getOptionKey (value) {\n      return `select-${this.selectKey}-option-${value}`;\n    },\n\n    validateOptionsPresence () {\n      if (this.options?.length < 1 && !this.$slots.default) {\n        warn('Options are expected to be provided via prop or slot', this);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtValidationMessages","MessagesMixin","options","optionsValidator","s","SELECT_SIZE_MODIFIERS","LABEL_SIZE_MODIFIERS","DESCRIPTION_SIZE_MODIFIERS","SELECT_STATE_MODIFIERS","hasSlotContent","event","getValidationState","getUniqueString","removeClassStyleAttrs","addClassStyleAttrs","value","_a","warn","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_createElementBlock","_mergeProps","$props","$options","_ctx","_createElementVNode","$data","_openBlock","_renderSlot","_createTextVNode","_toDisplayString","_createCommentVNode","_normalizeClass","_toHandlers","_Fragment","_renderList","option","_createVNode","_component_dt_validation_messages"],"mappings":"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"}

package/dist/vue3/lib/stack/stack-constants.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={default:"column",column:"column",row:"row","row-reverse":"row-reverse","column-reverse":"column-reverse"},o=["sm","md","lg","xl"],r=["0","50","100","200","300","350","400","450","500","525","550","600","625","650","700"],T={DT_STACK_DIRECTION:e,DT_STACK_RESPONSIVE_BREAKPOINTS:o,DT_STACK_GAP:r};exports.DT_STACK_DIRECTION=e;exports.DT_STACK_GAP=r;exports.DT_STACK_RESPONSIVE_BREAKPOINTS=o;exports.default=T;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={default:"column",column:"column",row:"row","row-reverse":"row-reverse","column-reverse":"column-reverse"},t=["sm","md","lg","xl"],T=["0","50","100","200","300","350","400","450","500","525","550","600","625","650","700"],_=["normal","start","center","end","stretch","baseline"],n=["start","center","end","around","between","evenly"],r={DT_STACK_DIRECTION:e,DT_STACK_RESPONSIVE_BREAKPOINTS:t,DT_STACK_GAP:T,DT_STACK_ALIGN:_,DT_STACK_JUSTIFY:n};exports.DT_STACK_ALIGN=_;exports.DT_STACK_DIRECTION=e;exports.DT_STACK_GAP=T;exports.DT_STACK_JUSTIFY=n;exports.DT_STACK_RESPONSIVE_BREAKPOINTS=t;exports.default=r;
 //# sourceMappingURL=stack-constants.cjs.map

package/dist/vue3/lib/stack/stack-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"stack-constants.cjs","sources":["../../../components/stack/stack_constants.js"],"sourcesContent":["export const DT_STACK_DIRECTION = {\n  default: 'column',\n  column: 'column',\n  row: 'row',\n  'row-reverse': 'row-reverse',\n  'column-reverse': 'column-reverse',\n};\n\nexport const DT_STACK_RESPONSIVE_BREAKPOINTS = ['sm', 'md', 'lg', 'xl'];\n\nexport const DT_STACK_GAP = ['0', '50', '100', '200', '300', '350', '400', '450', '500', '525', '550', '600', '625', '650', '700'];\n\nexport default {\n  DT_STACK_DIRECTION,\n  DT_STACK_RESPONSIVE_BREAKPOINTS,\n  DT_STACK_GAP,\n};\n"],"names":["DT_STACK_DIRECTION","DT_STACK_RESPONSIVE_BREAKPOINTS","DT_STACK_GAP","stack_constants"],"mappings":"4GAAY,MAACA,EAAqB,CAChC,QAAS,SACT,OAAQ,SACR,IAAK,MACL,cAAe,cACf,iBAAkB,gBACpB,EAEaC,EAAkC,CAAC,KAAM,KAAM,KAAM,IAAI,EAEzDC,EAAe,CAAC,IAAK,KAAM,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,KAAK,EAEjIC,EAAe,CACb,mBAAAH,EACA,gCAAAC,EACA,aAAAC,CACF"}
+{"version":3,"file":"stack-constants.cjs","sources":["../../../components/stack/stack_constants.js"],"sourcesContent":["/**\n * Direction values for the stack component.\n * Uses object format for historical compatibility - changing to array would be breaking.\n * The object keys are the valid values, and the values are the CSS class suffixes.\n * @type {Object<string, string>}\n */\nexport const DT_STACK_DIRECTION = {\n  default: 'column',\n  column: 'column',\n  row: 'row',\n  'row-reverse': 'row-reverse',\n  'column-reverse': 'column-reverse',\n};\n\n/**\n * Responsive breakpoint names used for all responsive props.\n * @type {string[]}\n */\nexport const DT_STACK_RESPONSIVE_BREAKPOINTS = ['sm', 'md', 'lg', 'xl'];\n\n/**\n * Gap values for spacing between stack items.\n * Uses array format.\n * @type {string[]}\n */\nexport const DT_STACK_GAP = ['0', '50', '100', '200', '300', '350', '400', '450', '500', '525', '550', '600', '625', '650', '700'];\n\n/**\n * Align values for the stack component (cross-axis alignment).\n * Uses array format - simpler structure for newer props.\n * @type {string[]}\n */\nexport const DT_STACK_ALIGN = ['normal', 'start', 'center', 'end', 'stretch', 'baseline'];\n\n/**\n * Justify values for the stack component (main-axis distribution).\n * Uses array format - simpler structure for newer props.\n * @type {string[]}\n */\nexport const DT_STACK_JUSTIFY = ['start', 'center', 'end', 'around', 'between', 'evenly'];\n\nexport default {\n  DT_STACK_DIRECTION,\n  DT_STACK_RESPONSIVE_BREAKPOINTS,\n  DT_STACK_GAP,\n  DT_STACK_ALIGN,\n  DT_STACK_JUSTIFY,\n};\n"],"names":["DT_STACK_DIRECTION","DT_STACK_RESPONSIVE_BREAKPOINTS","DT_STACK_GAP","DT_STACK_ALIGN","DT_STACK_JUSTIFY","stack_constants"],"mappings":"4GAMY,MAACA,EAAqB,CAChC,QAAS,SACT,OAAQ,SACR,IAAK,MACL,cAAe,cACf,iBAAkB,gBACpB,EAMaC,EAAkC,CAAC,KAAM,KAAM,KAAM,IAAI,EAOzDC,EAAe,CAAC,IAAK,KAAM,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,MAAO,KAAK,EAOpHC,EAAiB,CAAC,SAAU,QAAS,SAAU,MAAO,UAAW,UAAU,EAO3EC,EAAmB,CAAC,QAAS,SAAU,MAAO,SAAU,UAAW,QAAQ,EAExFC,EAAe,CACb,mBAAAL,EACA,gCAAAC,EACA,aAAAC,EACA,eAAAC,EACA,iBAAAC,CACF"}