@dialpad/dialtone 9.130.0 → 9.131.1

package/dist/vue2/lib/root-layout/root-layout-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"root-layout-constants.js","sources":["../../../components/root_layout/root_layout_constants.js"],"sourcesContent":["export const ROOT_LAYOUT_SIDEBAR_POSITIONS = {\n  LEFT: 'left',\n  RIGHT: 'right',\n};\n\nexport const ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS = ['sm', 'md', 'lg', null];\n\nexport default {\n  ROOT_LAYOUT_SIDEBAR_POSITIONS,\n  ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS,\n};\n"],"names":["ROOT_LAYOUT_SIDEBAR_POSITIONS","ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS","root_layout_constants"],"mappings":"AAAY,MAACA,IAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,OAAO;AACT,GAEaC,IAAqC,CAAC,MAAM,MAAM,MAAM,IAAI,GAE1DC,IAAA;AAAA,EACb,+BAAAF;AAAA,EACA,oCAAAC;AACF;"}
+{"version":3,"file":"root-layout-constants.js","sources":["../../../components/root_layout/root_layout_constants.js"],"sourcesContent":["export const ROOT_LAYOUT_SIDEBAR_POSITIONS = {\n  LEFT: 'left',\n  RIGHT: 'right',\n};\n\nexport const ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS = ['sm', 'md', 'lg', null];\n\nexport default {\n  ROOT_LAYOUT_SIDEBAR_POSITIONS,\n  ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS,\n};\n"],"names":["ROOT_LAYOUT_SIDEBAR_POSITIONS","ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS","root_layout_constants"],"mappings":"AAAY,MAACA,IAAgC;AAAA,EAC3C,MAAM;AAAA,EACN,OAAO;AACT,GAEaC,IAAqC,CAAC,MAAM,MAAM,MAAM,IAAI,GAEzEC,IAAe;AAAA,EACb,+BAAAF;AAAA,EACA,oCAAAC;AACF;"}

package/dist/vue2/lib/root-layout/root-layout.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"root-layout.cjs","sources":["../../../components/root_layout/root_layout.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'root-layout',\n      'd-root-layout',\n      {\n        'd-root-layout--fixed': fixed,\n        'd-root-layout--inverted': isInverted,\n      },\n      responsiveBreakpointClass,\n    ]\"\n    data-qa=\"dt-root-layout\"\n  >\n    <header\n      :class=\"['d-root-layout__header', { 'd-root-layout__header--sticky': headerSticky }, headerClass]\"\n      data-qa=\"dt-root-layout-header\"\n    >\n      <!-- @slot Slot for header content, be sure to set a height on the element inside this\n        if you want a fixed height. -->\n      <slot name=\"header\" />\n    </header>\n    <aside\n      ref=\"root-layout-sidebar\"\n      tabindex=\"0\"\n      :class=\"['d-root-layout__sidebar', sidebarClass]\"\n      data-qa=\"dt-root-layout-sidebar\"\n    >\n      <!-- @slot Slot for sidebar content, be sure to set a width on the element within this. -->\n      <slot name=\"sidebar\" />\n    </aside>\n    <main\n      ref=\"root-layout-content\"\n      :class=\"['d-root-layout__content', contentClass]\"\n      data-qa=\"dt-root-layout-content\"\n      tabindex=\"0\"\n    >\n      <!-- @slot Slot for the main content -->\n      <slot />\n    </main>\n    <footer\n      :class=\"['d-root-layout__footer', footerClass]\"\n      data-qa=\"dt-root-layout-footer\"\n    >\n      <!-- @slot Slot for footer content, be sure to set a height on the element inside this\n        if you want a fixed height. -->\n      <slot name=\"footer\" />\n    </footer>\n  </div>\n</template>\n\n<script>\nimport { ROOT_LAYOUT_SIDEBAR_POSITIONS, ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS } from './root_layout_constants';\n\n/**\n * A root layout provides a standardized group of containers to display content at the root level.\n */\nexport default {\n  name: 'DtRootLayout',\n\n  props: {\n    /**\n     * When true, the header, footer and sidebar will be locked in position and the content will\n     * be scrollable. When false the header, footer and sidebar  will scroll out of view.\n     * @values true, false\n     */\n    fixed: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Additional class name for the header element\n     */\n    headerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * DEPRECATED: set the height of the inner element instead.\n     */\n    headerHeight: {\n      type: String,\n      default: '64px',\n    },\n\n    /**\n     * Scroll the header with the page\n     * @values true, false\n     */\n    headerSticky: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the content element\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the sidebar element\n     */\n    sidebarClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * DEPRECATED: set the width of the inner element instead.\n     */\n    sidebarWidth: {\n      type: String,\n      default: '256px',\n    },\n\n    /**\n     * Whether the sidebar is on the left or right side\n     * Possible options: 'left', 'right'\n     * @values left, right\n     */\n    sidebarPosition: {\n      type: String,\n      default: 'left',\n      validator: (s) => Object.values(ROOT_LAYOUT_SIDEBAR_POSITIONS).includes(s),\n    },\n\n    /**\n     * Additional class name for the footer element\n     */\n    footerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * DEPRECATED: set the height of the inner element instead.\n     */\n    footerHeight: {\n      type: String,\n      default: '64px',\n    },\n\n    /**\n     * Defines the breakpoint when the root layout will change to responsive version\n     * @values 'sm', 'md', 'lg', null\n     */\n    responsiveBreakpoint: {\n      type: String,\n      default: null,\n      validator: (bp) => ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS.includes(bp),\n    },\n  },\n\n  computed: {\n    isInverted () {\n      return this.sidebarPosition === ROOT_LAYOUT_SIDEBAR_POSITIONS.RIGHT;\n    },\n\n    responsiveBreakpointClass () {\n      return this.responsiveBreakpoint\n        ? `d-root-layout__responsive--${this.responsiveBreakpoint}`\n        : 'd-root-layout__responsive--default';\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","s","ROOT_LAYOUT_SIDEBAR_POSITIONS","bp","ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS"],"mappings":"mNAwDAA,EAAA,CACA,KAAA,eAEA,MAAA,CAMA,MAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,MACA,EAMA,aAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,OACA,EAOA,gBAAA,CACA,KAAA,OACA,QAAA,OACA,UAAAC,GAAA,OAAA,OAAAC,+BAAA,EAAA,SAAAD,CAAA,CACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,MACA,EAMA,qBAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAE,GAAAC,qCAAA,SAAAD,CAAA,CACA,CACA,EAEA,SAAA,CACA,YAAA,CACA,OAAA,KAAA,kBAAAD,EAAA,8BAAA,KACA,EAEA,2BAAA,CACA,OAAA,KAAA,qBACA,8BAAA,KAAA,oBAAA,GACA,oCACA,CACA,CACA"}
+{"version":3,"file":"root-layout.cjs","sources":["../../../components/root_layout/root_layout.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'root-layout',\n      'd-root-layout',\n      {\n        'd-root-layout--fixed': fixed,\n        'd-root-layout--inverted': isInverted,\n      },\n      responsiveBreakpointClass,\n    ]\"\n    data-qa=\"dt-root-layout\"\n  >\n    <header\n      :class=\"['d-root-layout__header', { 'd-root-layout__header--sticky': headerSticky }, headerClass]\"\n      data-qa=\"dt-root-layout-header\"\n    >\n      <!-- @slot Slot for header content, be sure to set a height on the element inside this\n        if you want a fixed height. -->\n      <slot name=\"header\" />\n    </header>\n    <aside\n      ref=\"root-layout-sidebar\"\n      tabindex=\"0\"\n      :class=\"['d-root-layout__sidebar', sidebarClass]\"\n      data-qa=\"dt-root-layout-sidebar\"\n    >\n      <!-- @slot Slot for sidebar content, be sure to set a width on the element within this. -->\n      <slot name=\"sidebar\" />\n    </aside>\n    <main\n      ref=\"root-layout-content\"\n      :class=\"['d-root-layout__content', contentClass]\"\n      data-qa=\"dt-root-layout-content\"\n      tabindex=\"0\"\n    >\n      <!-- @slot Slot for the main content -->\n      <slot />\n    </main>\n    <footer\n      :class=\"['d-root-layout__footer', footerClass]\"\n      data-qa=\"dt-root-layout-footer\"\n    >\n      <!-- @slot Slot for footer content, be sure to set a height on the element inside this\n        if you want a fixed height. -->\n      <slot name=\"footer\" />\n    </footer>\n  </div>\n</template>\n\n<script>\nimport { ROOT_LAYOUT_SIDEBAR_POSITIONS, ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS } from './root_layout_constants';\n\n/**\n * A root layout provides a standardized group of containers to display content at the root level.\n */\nexport default {\n  name: 'DtRootLayout',\n\n  props: {\n    /**\n     * When true, the header, footer and sidebar will be locked in position and the content will\n     * be scrollable. When false the header, footer and sidebar  will scroll out of view.\n     * @values true, false\n     */\n    fixed: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Additional class name for the header element\n     */\n    headerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * DEPRECATED: set the height of the inner element instead.\n     */\n    headerHeight: {\n      type: String,\n      default: '64px',\n    },\n\n    /**\n     * Scroll the header with the page\n     * @values true, false\n     */\n    headerSticky: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Additional class name for the content element\n     */\n    contentClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Additional class name for the sidebar element\n     */\n    sidebarClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * DEPRECATED: set the width of the inner element instead.\n     */\n    sidebarWidth: {\n      type: String,\n      default: '256px',\n    },\n\n    /**\n     * Whether the sidebar is on the left or right side\n     * Possible options: 'left', 'right'\n     * @values left, right\n     */\n    sidebarPosition: {\n      type: String,\n      default: 'left',\n      validator: (s) => Object.values(ROOT_LAYOUT_SIDEBAR_POSITIONS).includes(s),\n    },\n\n    /**\n     * Additional class name for the footer element\n     */\n    footerClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * DEPRECATED: set the height of the inner element instead.\n     */\n    footerHeight: {\n      type: String,\n      default: '64px',\n    },\n\n    /**\n     * Defines the breakpoint when the root layout will change to responsive version\n     * @values 'sm', 'md', 'lg', null\n     */\n    responsiveBreakpoint: {\n      type: String,\n      default: null,\n      validator: (bp) => ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS.includes(bp),\n    },\n  },\n\n  computed: {\n    isInverted () {\n      return this.sidebarPosition === ROOT_LAYOUT_SIDEBAR_POSITIONS.RIGHT;\n    },\n\n    responsiveBreakpointClass () {\n      return this.responsiveBreakpoint\n        ? `d-root-layout__responsive--${this.responsiveBreakpoint}`\n        : 'd-root-layout__responsive--default';\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","s","ROOT_LAYOUT_SIDEBAR_POSITIONS","bp","ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS"],"mappings":"mNAwDAA,EAAA,CACA,KAAA,eAEA,MAAA,CAMA,MAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,MACA,EAMA,aAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,OACA,EAOA,gBAAA,CACA,KAAA,OACA,QAAA,OACA,UAAAC,GAAA,OAAA,OAAAC,+BAAA,EAAA,SAAAD,CAAA,CACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,MACA,EAMA,qBAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAE,GAAAC,qCAAA,SAAAD,CAAA,CACA,CACA,EAEA,SAAA,CACA,YAAA,CACA,OAAA,KAAA,kBAAAD,EAAAA,8BAAA,KACA,EAEA,2BAAA,CACA,OAAA,KAAA,qBACA,8BAAA,KAAA,oBAAA,GACA,oCACA,CACA,CACA"}

package/dist/vue2/lib/root-layout/root-layout.js

@@ -1,4 +1,4 @@
-import { ROOT_LAYOUT_SIDEBAR_POSITIONS as o, ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS as r } from "./root-layout-constants.js";
+import { ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS as r, ROOT_LAYOUT_SIDEBAR_POSITIONS as o } from "./root-layout-constants.js";
 import { n as s } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
 const d = {
   name: "DtRootLayout",

package/dist/vue2/lib/scrollbar-directive/scrollbar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar.cjs","sources":["../../../directives/scrollbar_directive/scrollbar.js"],"sourcesContent":["import { OverlayScrollbars, ClickScrollPlugin } from 'overlayscrollbars';\n\nexport const DtScrollbarDirective = {\n  name: 'dt-scrollbar-directive',\n  install (Vue) {\n    OverlayScrollbars.plugin(ClickScrollPlugin);\n    const instances = new WeakMap();\n    Vue.directive('dt-scrollbar', {\n      inserted (el, binding) {\n        const os = OverlayScrollbars({\n          target: el,\n          elements: {\n            viewport: el.children[0],\n          },\n        }, {\n          scrollbars: {\n            autoHide: `${binding.arg || 'leave'}`,\n            clickScroll: true,\n            autoHideDelay: `${!binding.arg || binding.arg === 'leave' ? 0 : 1300}`,\n          },\n        });\n        el.setAttribute('data-overlayscrollbars-initialize', true);\n        el.classList.add('d-scrollbar');\n        instances.set(el, os);\n      },\n      unbind (el) {\n        instances.get(el).destroy();\n      },\n    });\n  },\n};\n\nexport default DtScrollbarDirective;\n"],"names":["DtScrollbarDirective","Vue","OverlayScrollbars","ClickScrollPlugin","instances","el","binding","os"],"mappings":"iJAEaA,EAAuB,CAClC,KAAM,yBACN,QAASC,EAAK,CACZC,oBAAkB,OAAOC,EAAAA,iBAAiB,EAC1C,MAAMC,EAAY,IAAI,QACtBH,EAAI,UAAU,eAAgB,CAC5B,SAAUI,EAAIC,EAAS,CACrB,MAAMC,EAAKL,EAAAA,kBAAkB,CAC3B,OAAQG,EACR,SAAU,CACR,SAAUA,EAAG,SAAS,CAAC,CACxB,CACX,EAAW,CACD,WAAY,CACV,SAAU,GAAGC,EAAQ,KAAO,OAAO,GACnC,YAAa,GACb,cAAe,GAAG,CAACA,EAAQ,KAAOA,EAAQ,MAAQ,QAAU,EAAI,IAAI,EACrE,CACX,CAAS,EACDD,EAAG,aAAa,oCAAqC,EAAI,EACzDA,EAAG,UAAU,IAAI,aAAa,EAC9BD,EAAU,IAAIC,EAAIE,CAAE,CACrB,EACD,OAAQF,EAAI,CACVD,EAAU,IAAIC,CAAE,EAAE,QAAO,CAC1B,CACP,CAAK,CACF,CACH"}
+{"version":3,"file":"scrollbar.cjs","sources":["../../../directives/scrollbar_directive/scrollbar.js"],"sourcesContent":["import { OverlayScrollbars, ClickScrollPlugin } from 'overlayscrollbars';\n\nexport const DtScrollbarDirective = {\n  name: 'dt-scrollbar-directive',\n  install (Vue) {\n    OverlayScrollbars.plugin(ClickScrollPlugin);\n    const instances = new WeakMap();\n    Vue.directive('dt-scrollbar', {\n      inserted (el, binding) {\n        const os = OverlayScrollbars({\n          target: el,\n          elements: {\n            viewport: el.children[0],\n          },\n        }, {\n          scrollbars: {\n            autoHide: `${binding.arg || 'leave'}`,\n            clickScroll: true,\n            autoHideDelay: `${!binding.arg || binding.arg === 'leave' ? 0 : 1300}`,\n          },\n        });\n        el.setAttribute('data-overlayscrollbars-initialize', true);\n        el.classList.add('d-scrollbar');\n        instances.set(el, os);\n      },\n      unbind (el) {\n        instances.get(el).destroy();\n      },\n    });\n  },\n};\n\nexport default DtScrollbarDirective;\n"],"names":["DtScrollbarDirective","Vue","OverlayScrollbars","ClickScrollPlugin","instances","el","binding","os"],"mappings":"iJAEaA,EAAuB,CAClC,KAAM,yBACN,QAASC,EAAK,CACZC,EAAAA,kBAAkB,OAAOC,mBAAiB,EAC1C,MAAMC,EAAY,IAAI,QACtBH,EAAI,UAAU,eAAgB,CAC5B,SAAUI,EAAIC,EAAS,CACrB,MAAMC,EAAKL,EAAAA,kBAAkB,CAC3B,OAAQG,EACR,SAAU,CACR,SAAUA,EAAG,SAAS,CAAC,CACnC,CACA,EAAW,CACD,WAAY,CACV,SAAU,GAAGC,EAAQ,KAAO,OAAO,GACnC,YAAa,GACb,cAAe,GAAG,CAACA,EAAQ,KAAOA,EAAQ,MAAQ,QAAU,EAAI,IAAI,EAChF,CACA,CAAS,EACDD,EAAG,aAAa,oCAAqC,EAAI,EACzDA,EAAG,UAAU,IAAI,aAAa,EAC9BD,EAAU,IAAIC,EAAIE,CAAE,CACtB,EACA,OAAQF,EAAI,CACVD,EAAU,IAAIC,CAAE,EAAE,QAAO,CAC3B,CACN,CAAK,CACH,CACF"}

package/dist/vue2/lib/scrollbar-directive/scrollbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar.js","sources":["../../../directives/scrollbar_directive/scrollbar.js"],"sourcesContent":["import { OverlayScrollbars, ClickScrollPlugin } from 'overlayscrollbars';\n\nexport const DtScrollbarDirective = {\n  name: 'dt-scrollbar-directive',\n  install (Vue) {\n    OverlayScrollbars.plugin(ClickScrollPlugin);\n    const instances = new WeakMap();\n    Vue.directive('dt-scrollbar', {\n      inserted (el, binding) {\n        const os = OverlayScrollbars({\n          target: el,\n          elements: {\n            viewport: el.children[0],\n          },\n        }, {\n          scrollbars: {\n            autoHide: `${binding.arg || 'leave'}`,\n            clickScroll: true,\n            autoHideDelay: `${!binding.arg || binding.arg === 'leave' ? 0 : 1300}`,\n          },\n        });\n        el.setAttribute('data-overlayscrollbars-initialize', true);\n        el.classList.add('d-scrollbar');\n        instances.set(el, os);\n      },\n      unbind (el) {\n        instances.get(el).destroy();\n      },\n    });\n  },\n};\n\nexport default DtScrollbarDirective;\n"],"names":["DtScrollbarDirective","Vue","OverlayScrollbars","ClickScrollPlugin","instances","el","binding","os"],"mappings":";AAEY,MAACA,IAAuB;AAAA,EAClC,MAAM;AAAA,EACN,QAASC,GAAK;AACZ,IAAAC,EAAkB,OAAOC,CAAiB;AAC1C,UAAMC,IAAY,oBAAI;AACtB,IAAAH,EAAI,UAAU,gBAAgB;AAAA,MAC5B,SAAUI,GAAIC,GAAS;AACrB,cAAMC,IAAKL,EAAkB;AAAA,UAC3B,QAAQG;AAAA,UACR,UAAU;AAAA,YACR,UAAUA,EAAG,SAAS,CAAC;AAAA,UACxB;AAAA,QACX,GAAW;AAAA,UACD,YAAY;AAAA,YACV,UAAU,GAAGC,EAAQ,OAAO,OAAO;AAAA,YACnC,aAAa;AAAA,YACb,eAAe,GAAG,CAACA,EAAQ,OAAOA,EAAQ,QAAQ,UAAU,IAAI,IAAI;AAAA,UACrE;AAAA,QACX,CAAS;AACD,QAAAD,EAAG,aAAa,qCAAqC,EAAI,GACzDA,EAAG,UAAU,IAAI,aAAa,GAC9BD,EAAU,IAAIC,GAAIE,CAAE;AAAA,MACrB;AAAA,MACD,OAAQF,GAAI;AACV,QAAAD,EAAU,IAAIC,CAAE,EAAE,QAAO;AAAA,MAC1B;AAAA,IACP,CAAK;AAAA,EACF;AACH;"}
+{"version":3,"file":"scrollbar.js","sources":["../../../directives/scrollbar_directive/scrollbar.js"],"sourcesContent":["import { OverlayScrollbars, ClickScrollPlugin } from 'overlayscrollbars';\n\nexport const DtScrollbarDirective = {\n  name: 'dt-scrollbar-directive',\n  install (Vue) {\n    OverlayScrollbars.plugin(ClickScrollPlugin);\n    const instances = new WeakMap();\n    Vue.directive('dt-scrollbar', {\n      inserted (el, binding) {\n        const os = OverlayScrollbars({\n          target: el,\n          elements: {\n            viewport: el.children[0],\n          },\n        }, {\n          scrollbars: {\n            autoHide: `${binding.arg || 'leave'}`,\n            clickScroll: true,\n            autoHideDelay: `${!binding.arg || binding.arg === 'leave' ? 0 : 1300}`,\n          },\n        });\n        el.setAttribute('data-overlayscrollbars-initialize', true);\n        el.classList.add('d-scrollbar');\n        instances.set(el, os);\n      },\n      unbind (el) {\n        instances.get(el).destroy();\n      },\n    });\n  },\n};\n\nexport default DtScrollbarDirective;\n"],"names":["DtScrollbarDirective","Vue","OverlayScrollbars","ClickScrollPlugin","instances","el","binding","os"],"mappings":";AAEY,MAACA,IAAuB;AAAA,EAClC,MAAM;AAAA,EACN,QAASC,GAAK;AACZ,IAAAC,EAAkB,OAAOC,CAAiB;AAC1C,UAAMC,IAAY,oBAAI,QAAO;AAC7B,IAAAH,EAAI,UAAU,gBAAgB;AAAA,MAC5B,SAAUI,GAAIC,GAAS;AACrB,cAAMC,IAAKL,EAAkB;AAAA,UAC3B,QAAQG;AAAA,UACR,UAAU;AAAA,YACR,UAAUA,EAAG,SAAS,CAAC;AAAA,UACnC;AAAA,QACA,GAAW;AAAA,UACD,YAAY;AAAA,YACV,UAAU,GAAGC,EAAQ,OAAO,OAAO;AAAA,YACnC,aAAa;AAAA,YACb,eAAe,GAAG,CAACA,EAAQ,OAAOA,EAAQ,QAAQ,UAAU,IAAI,IAAI;AAAA,UAChF;AAAA,QACA,CAAS;AACD,QAAAD,EAAG,aAAa,qCAAqC,EAAI,GACzDA,EAAG,UAAU,IAAI,aAAa,GAC9BD,EAAU,IAAIC,GAAIE,CAAE;AAAA,MACtB;AAAA,MACA,OAAQF,GAAI;AACV,QAAAD,EAAU,IAAIC,CAAE,EAAE,QAAO;AAAA,MAC3B;AAAA,IACN,CAAK;AAAA,EACH;AACF;"}

package/dist/vue2/lib/select-menu/select-menu-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"select-menu-constants.cjs","sources":["../../../components/select_menu/select_menu_constants.js"],"sourcesContent":["export const SELECT_SIZE_MODIFIERS = {\n  xs: 'd-select--xs',\n  sm: 'd-select--sm',\n  md: '',\n  lg: 'd-select--lg',\n  xl: 'd-select--xl',\n};\n\nexport const SELECT_STATE_MODIFIERS = {\n  error: 'd-select__input--error',\n  warning: 'd-select__input--warning',\n  success: 'd-select__input--success',\n};\n\nexport default {\n  SELECT_SIZE_MODIFIERS,\n  SELECT_STATE_MODIFIERS,\n};\n"],"names":["SELECT_SIZE_MODIFIERS","SELECT_STATE_MODIFIERS","select_menu_constants"],"mappings":"4GAAY,MAACA,EAAwB,CACnC,GAAI,eACJ,GAAI,eACJ,GAAI,GACJ,GAAI,eACJ,GAAI,cACN,EAEaC,EAAyB,CACpC,MAAO,yBACP,QAAS,2BACT,QAAS,0BACX,EAEeC,EAAA,CACb,sBAAAF,EACA,uBAAAC,CACF"}
+{"version":3,"file":"select-menu-constants.cjs","sources":["../../../components/select_menu/select_menu_constants.js"],"sourcesContent":["export const SELECT_SIZE_MODIFIERS = {\n  xs: 'd-select--xs',\n  sm: 'd-select--sm',\n  md: '',\n  lg: 'd-select--lg',\n  xl: 'd-select--xl',\n};\n\nexport const SELECT_STATE_MODIFIERS = {\n  error: 'd-select__input--error',\n  warning: 'd-select__input--warning',\n  success: 'd-select__input--success',\n};\n\nexport default {\n  SELECT_SIZE_MODIFIERS,\n  SELECT_STATE_MODIFIERS,\n};\n"],"names":["SELECT_SIZE_MODIFIERS","SELECT_STATE_MODIFIERS","select_menu_constants"],"mappings":"4GAAY,MAACA,EAAwB,CACnC,GAAI,eACJ,GAAI,eACJ,GAAI,GACJ,GAAI,eACJ,GAAI,cACN,EAEaC,EAAyB,CACpC,MAAO,yBACP,QAAS,2BACT,QAAS,0BACX,EAEAC,EAAe,CACb,sBAAAF,EACA,uBAAAC,CACF"}

package/dist/vue2/lib/select-menu/select-menu-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-menu-constants.js","sources":["../../../components/select_menu/select_menu_constants.js"],"sourcesContent":["export const SELECT_SIZE_MODIFIERS = {\n  xs: 'd-select--xs',\n  sm: 'd-select--sm',\n  md: '',\n  lg: 'd-select--lg',\n  xl: 'd-select--xl',\n};\n\nexport const SELECT_STATE_MODIFIERS = {\n  error: 'd-select__input--error',\n  warning: 'd-select__input--warning',\n  success: 'd-select__input--success',\n};\n\nexport default {\n  SELECT_SIZE_MODIFIERS,\n  SELECT_STATE_MODIFIERS,\n};\n"],"names":["SELECT_SIZE_MODIFIERS","SELECT_STATE_MODIFIERS","select_menu_constants"],"mappings":"AAAY,MAACA,IAAwB;AAAA,EACnC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAyB;AAAA,EACpC,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AACX,GAEeC,IAAA;AAAA,EACb,uBAAAF;AAAA,EACA,wBAAAC;AACF;"}
+{"version":3,"file":"select-menu-constants.js","sources":["../../../components/select_menu/select_menu_constants.js"],"sourcesContent":["export const SELECT_SIZE_MODIFIERS = {\n  xs: 'd-select--xs',\n  sm: 'd-select--sm',\n  md: '',\n  lg: 'd-select--lg',\n  xl: 'd-select--xl',\n};\n\nexport const SELECT_STATE_MODIFIERS = {\n  error: 'd-select__input--error',\n  warning: 'd-select__input--warning',\n  success: 'd-select__input--success',\n};\n\nexport default {\n  SELECT_SIZE_MODIFIERS,\n  SELECT_STATE_MODIFIERS,\n};\n"],"names":["SELECT_SIZE_MODIFIERS","SELECT_STATE_MODIFIERS","select_menu_constants"],"mappings":"AAAY,MAACA,IAAwB;AAAA,EACnC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAyB;AAAA,EACpC,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AACX,GAEAC,IAAe;AAAA,EACb,uBAAAF;AAAA,EACA,wBAAAC;AACF;"}

package/dist/vue2/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    <label>\n      <div\n        v-if=\"$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=\"$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=\"$attrs\"\n          :value=\"value\"\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 Vue 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} 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  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     * Sets the selected value of the select menu. If it does not match a value in the options array, then it will be\n     * 'unselected'.\n     */\n    value: {\n      type: String,\n      default: null,\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  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'input',\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    };\n  },\n\n  computed: {\n    selectListeners () {\n      return {\n        /* TODO\n            Check if any usages of this component leverage $listeners and either remove if unused or scope the removal\n            and migration prior to upgrading to Vue 3.x\n        */\n        ...this.$listeners,\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n         * element which will result in the hander 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    emitValue (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        Vue.util.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","event","getValidationState","getUniqueString","value","_a","Vue"],"mappings":"6cAsGAA,EAAA,CACA,KAAA,eAEA,WAAA,CAAAC,qBAAAA,EAAAA,OAAA,EAEA,OAAA,CAAAC,EAAAA,aAAA,EAEA,aAAA,GAEA,MAAA,CAIA,MAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,EACA,EASA,QAAA,CACA,KAAA,MACA,QAAA,IAAA,CAAA,EACA,UAAAC,GAAAC,EAAA,iBAAAD,CAAA,CACA,EAMA,MAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAE,GAAA,OAAA,KAAAC,uBAAA,EAAA,SAAAD,CAAA,CACA,EAKA,WAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,iBAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,gBAAA,CACA,KAAA,OACA,QAAA,KAAA,CAAA,EACA,EAKA,sBAAA,CACA,KAAA,OACA,QAAA,KAAA,CAAA,EACA,EAKA,iBAAA,CACA,KAAA,OACA,QAAA,KAAA,CAAA,EACA,EAMA,SAAA,CACA,KAAA,QACA,QAAA,EACA,CACA,EAEA,MAAA,CAOA,QAQA,QACA,EAEA,MAAA,CACA,MAAA,CACA,qBAAAE,EAAA,qBACA,2BAAAC,EAAA,2BACA,sBAAAF,EAAA,sBACA,uBAAAG,EAAA,sBACA,CACA,EAEA,SAAA,CACA,iBAAA,CACA,MAAA,CAKA,GAAA,KAAA,WAMA,MAAA,IAAA,CAAA,EACA,OAAAC,GAAA,KAAA,UAAAA,EAAA,OAAA,MAAAA,CAAA,CACA,CACA,EAEA,OAAA,CACA,OAAAC,EAAA,mBAAA,KAAA,iBAAA,CACA,EAEA,WAAA,CACA,OAAAC,EAAA,gBAAA,CACA,EAEA,gBAAA,CACA,MAAA,UAAA,KAAA,SAAA,cACA,EAEA,kBAAA,CACA,OAAA,KAAA,OAAA,aAAA,KAAA,YACA,KAAA,eAGA,KAAA,OAAA,cAAA,CACA,CACA,EAEA,SAAA,CACA,KAAA,wBAAA,CACA,EAEA,cAAA,CACA,KAAA,wBAAA,CACA,EAEA,QAAA,CACA,UAAAC,EAAAH,EAAA,CACA,KAAA,MAAA,QAAAG,EAAAH,CAAA,EACA,KAAA,MAAA,SAAAG,EAAAH,CAAA,CACA,EAEA,aAAAG,EAAA,CACA,MAAA,UAAA,KAAA,SAAA,WAAAA,CAAA,EACA,EAEA,yBAAA,SACAC,EAAA,KAAA,UAAA,YAAAA,EAAA,QAAA,GAAA,CAAA,KAAA,OAAA,SACAC,EAAA,KAAA,KAAA,uDAAA,IAAA,CAEA,CACA,CACA"}
+{"version":3,"file":"select-menu.cjs","sources":["../../../components/select_menu/select_menu.vue"],"sourcesContent":["<template>\n  <div>\n    <label>\n      <div\n        v-if=\"$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=\"$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=\"$attrs\"\n          :value=\"value\"\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 Vue 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} 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  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     * Sets the selected value of the select menu. If it does not match a value in the options array, then it will be\n     * 'unselected'.\n     */\n    value: {\n      type: String,\n      default: null,\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  emits: [\n    /**\n     * Native input event\n     *\n     * @event input\n     * @type {String | Number}\n     */\n    'input',\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    };\n  },\n\n  computed: {\n    selectListeners () {\n      return {\n        /* TODO\n            Check if any usages of this component leverage $listeners and either remove if unused or scope the removal\n            and migration prior to upgrading to Vue 3.x\n        */\n        ...this.$listeners,\n        /*\n         * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n         * element which will result in the hander 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    emitValue (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        Vue.util.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","event","getValidationState","getUniqueString","value","_a","Vue"],"mappings":"6cAsGAA,EAAA,CACA,KAAA,eAEA,WAAA,CAAA,qBAAAC,EAAAA,OAAA,EAEA,OAAA,CAAAC,EAAAA,aAAA,EAEA,aAAA,GAEA,MAAA,CAIA,MAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,EACA,EASA,QAAA,CACA,KAAA,MACA,QAAA,IAAA,CAAA,EACA,UAAAC,GAAAC,EAAAA,iBAAAD,CAAA,CACA,EAMA,MAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAE,GAAA,OAAA,KAAAC,uBAAA,EAAA,SAAAD,CAAA,CACA,EAKA,WAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,iBAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,gBAAA,CACA,KAAA,OACA,QAAA,KAAA,CAAA,EACA,EAKA,sBAAA,CACA,KAAA,OACA,QAAA,KAAA,CAAA,EACA,EAKA,iBAAA,CACA,KAAA,OACA,QAAA,KAAA,CAAA,EACA,EAMA,SAAA,CACA,KAAA,QACA,QAAA,EACA,CACA,EAEA,MAAA,CAOA,QAQA,QACA,EAEA,MAAA,CACA,MAAA,CACA,qBAAAE,EAAAA,qBACA,2BAAAC,EAAAA,2BACA,sBAAAF,EAAAA,sBACA,uBAAAG,EAAAA,sBACA,CACA,EAEA,SAAA,CACA,iBAAA,CACA,MAAA,CAKA,GAAA,KAAA,WAMA,MAAA,IAAA,CAAA,EACA,OAAAC,GAAA,KAAA,UAAAA,EAAA,OAAA,MAAAA,CAAA,CACA,CACA,EAEA,OAAA,CACA,OAAAC,EAAAA,mBAAA,KAAA,iBAAA,CACA,EAEA,WAAA,CACA,OAAAC,kBAAA,CACA,EAEA,gBAAA,CACA,MAAA,UAAA,KAAA,SAAA,cACA,EAEA,kBAAA,CACA,OAAA,KAAA,OAAA,aAAA,KAAA,YACA,KAAA,eAGA,KAAA,OAAA,cAAA,CACA,CACA,EAEA,SAAA,CACA,KAAA,wBAAA,CACA,EAEA,cAAA,CACA,KAAA,wBAAA,CACA,EAEA,QAAA,CACA,UAAAC,EAAAH,EAAA,CACA,KAAA,MAAA,QAAAG,EAAAH,CAAA,EACA,KAAA,MAAA,SAAAG,EAAAH,CAAA,CACA,EAEA,aAAAG,EAAA,CACA,MAAA,UAAA,KAAA,SAAA,WAAAA,CAAA,EACA,EAEA,yBAAA,SACAC,EAAA,KAAA,UAAA,YAAAA,EAAA,QAAA,GAAA,CAAA,KAAA,OAAA,SACAC,EAAA,KAAA,KAAA,uDAAA,IAAA,CAEA,CACA,CACA"}

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

@@ -1,7 +1,7 @@
 import l from "vue";
-import { LABEL_SIZE_MODIFIERS as r, DESCRIPTION_SIZE_MODIFIERS as o } from "../../common/constants/index.js";
-import { SELECT_SIZE_MODIFIERS as i, SELECT_STATE_MODIFIERS as n } from "./select-menu-constants.js";
-import { getValidationState as d, getUniqueString as p } from "../../common/utils/index.js";
+import { DESCRIPTION_SIZE_MODIFIERS as r, LABEL_SIZE_MODIFIERS as o } from "../../common/constants/index.js";
+import { SELECT_STATE_MODIFIERS as n, SELECT_SIZE_MODIFIERS as i } from "./select-menu-constants.js";
+import { getUniqueString as d, getValidationState as p } from "../../common/utils/index.js";
 import { MessagesMixin as c } from "../../common/mixins/input.js";
 import { optionsValidator as u } from "./select-menu-validators.js";
 import { n as _ } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
@@ -131,8 +131,8 @@ const m = {
   ],
   data() {
     return {
-      LABEL_SIZE_MODIFIERS: r,
-      DESCRIPTION_SIZE_MODIFIERS: o,
+      LABEL_SIZE_MODIFIERS: o,
+      DESCRIPTION_SIZE_MODIFIERS: r,
       SELECT_SIZE_MODIFIERS: i,
       SELECT_STATE_MODIFIERS: n
     };
@@ -156,10 +156,10 @@ const m = {
       };
     },
     state() {
-      return d(this.formattedMessages);
+      return p(this.formattedMessages);
     },
     selectKey() {
-      return p();
+      return d();
     },
     descriptionKey() {
       return `select-${this.selectKey}-description`;

package/dist/vue2/lib/settings-menu-button/settings-menu-button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"settings-menu-button.cjs","sources":["../../../recipes/header/settings_menu_button/settings_menu_button.vue"],"sourcesContent":["<template>\n  <dt-button\n    v-if=\"updateAvailable\"\n    importance=\"outlined\"\n    size=\"xs\"\n    icon-position=\"right\"\n    class=\"d-recipe-settings-menu-button-update\"\n    :aria-label=\"ariaLabel\"\n    v-on=\"$listeners\"\n  >\n    <slot />\n    <template #icon>\n      <dt-icon-more-vertical\n        size=\"300\"\n      />\n    </template>\n  </dt-button>\n  <dt-button\n    v-else\n    importance=\"clear\"\n    kind=\"inverted\"\n    class=\"d-recipe-settings-menu-button\"\n    :aria-label=\"ariaLabel\"\n    v-on=\"$listeners\"\n  >\n    <template #icon>\n      <dt-icon-more-vertical\n        size=\"300\"\n      />\n    </template>\n  </dt-button>\n</template>\n\n<script>\n/*\n * TODO (Dialtone 10): Localize this component as it'd be a breaking change localizing right now.\n */\nimport DtButton from '@/components/button/button.vue';\nimport { DtIconMoreVertical } from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n  name: 'DtRecipeSettingsMenuButton',\n\n  components: {\n    DtButton,\n    DtIconMoreVertical,\n  },\n\n  props: {\n    /**\n     * Determines whether the button should display the update state\n     * default is false\n     * @values true, false\n     */\n    updateAvailable: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Aria label\n     */\n    ariaLabel: {\n      type: String,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Native click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n  ],\n\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtIconMoreVertical"],"mappings":"sPAwCAA,EAAA,CACA,KAAA,6BAEA,WAAA,CACA,SAAAC,EAAA,QACA,mBAAAC,EAAA,kBACA,EAEA,MAAA,CAMA,gBAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,UAAA,CACA,KAAA,OACA,SAAA,EACA,CACA,EAEA,MAAA,CAOA,OACA,CAEA"}
+{"version":3,"file":"settings-menu-button.cjs","sources":["../../../recipes/header/settings_menu_button/settings_menu_button.vue"],"sourcesContent":["<template>\n  <dt-button\n    v-if=\"updateAvailable\"\n    importance=\"outlined\"\n    size=\"xs\"\n    icon-position=\"right\"\n    class=\"d-recipe-settings-menu-button-update\"\n    :aria-label=\"ariaLabel\"\n    v-on=\"$listeners\"\n  >\n    <slot />\n    <template #icon>\n      <dt-icon-more-vertical\n        size=\"300\"\n      />\n    </template>\n  </dt-button>\n  <dt-button\n    v-else\n    importance=\"clear\"\n    kind=\"inverted\"\n    class=\"d-recipe-settings-menu-button\"\n    :aria-label=\"ariaLabel\"\n    v-on=\"$listeners\"\n  >\n    <template #icon>\n      <dt-icon-more-vertical\n        size=\"300\"\n      />\n    </template>\n  </dt-button>\n</template>\n\n<script>\n/*\n * TODO (Dialtone 10): Localize this component as it'd be a breaking change localizing right now.\n */\nimport DtButton from '@/components/button/button.vue';\nimport { DtIconMoreVertical } from '@dialpad/dialtone-icons/vue2';\n\nexport default {\n  name: 'DtRecipeSettingsMenuButton',\n\n  components: {\n    DtButton,\n    DtIconMoreVertical,\n  },\n\n  props: {\n    /**\n     * Determines whether the button should display the update state\n     * default is false\n     * @values true, false\n     */\n    updateAvailable: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Aria label\n     */\n    ariaLabel: {\n      type: String,\n      required: true,\n    },\n  },\n\n  emits: [\n    /**\n     * Native click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'click',\n  ],\n\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtIconMoreVertical"],"mappings":"sPAwCAA,EAAA,CACA,KAAA,6BAEA,WAAA,CACA,SAAAC,EAAAA,QACA,mBAAAC,EAAAA,kBACA,EAEA,MAAA,CAMA,gBAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,UAAA,CACA,KAAA,OACA,SAAA,EACA,CACA,EAEA,MAAA,CAOA,OACA,CAEA"}

package/dist/vue2/lib/skeleton/skeleton-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-constants.cjs","sources":["../../../components/skeleton/skeleton_constants.js"],"sourcesContent":["// NOTE: RippleDuration controls how long the delay is for the animation\n// of a skeleton 1000 pixels from the top of the page. Each skeleton\n// from the top down will have a delay duration from 0 to this offset.\n// The delay of each skeleton animation is based on how far down the page\n// the skeleton is rendered. This is a linear relationship. The unit\n// is miliseconds.\nexport const SKELETON_RIPPLE_DURATION = 3000000;\n\nexport const SKELETON_SHAPES = {\n  circle: 'd-bar-circle',\n  square: 'd-bar2',\n};\n\nexport const SKELETON_TEXT_TYPES = [\n  'body',\n  'heading',\n];\n\nexport const SKELETON_SHAPE_SIZES = {\n  sm: '24px',\n  md: '32px',\n  lg: '48px',\n};\n\nexport const SKELETON_HEADING_HEIGHTS = {\n  sm: 'd-h16',\n  md: 'd-h24',\n  lg: 'd-h32',\n};\n\nexport default {\n  SKELETON_RIPPLE_DURATION,\n  SKELETON_SHAPES,\n  SKELETON_TEXT_TYPES,\n  SKELETON_HEADING_HEIGHTS,\n};\n"],"names":["SKELETON_RIPPLE_DURATION","SKELETON_SHAPES","SKELETON_TEXT_TYPES","SKELETON_SHAPE_SIZES","SKELETON_HEADING_HEIGHTS","skeleton_constants"],"mappings":"4GAMY,MAACA,EAA2B,IAE3BC,EAAkB,CAC7B,OAAQ,eACR,OAAQ,QACV,EAEaC,EAAsB,CACjC,OACA,SACF,EAEaC,EAAuB,CAClC,GAAI,OACJ,GAAI,OACJ,GAAI,MACN,EAEaC,EAA2B,CACtC,GAAI,QACJ,GAAI,QACJ,GAAI,OACN,EAEeC,EAAA,CACb,yBAAAL,EACA,gBAAAC,EACA,oBAAAC,EACA,yBAAAE,CACF"}
+{"version":3,"file":"skeleton-constants.cjs","sources":["../../../components/skeleton/skeleton_constants.js"],"sourcesContent":["// NOTE: RippleDuration controls how long the delay is for the animation\n// of a skeleton 1000 pixels from the top of the page. Each skeleton\n// from the top down will have a delay duration from 0 to this offset.\n// The delay of each skeleton animation is based on how far down the page\n// the skeleton is rendered. This is a linear relationship. The unit\n// is miliseconds.\nexport const SKELETON_RIPPLE_DURATION = 3000000;\n\nexport const SKELETON_SHAPES = {\n  circle: 'd-bar-circle',\n  square: 'd-bar2',\n};\n\nexport const SKELETON_TEXT_TYPES = [\n  'body',\n  'heading',\n];\n\nexport const SKELETON_SHAPE_SIZES = {\n  sm: '24px',\n  md: '32px',\n  lg: '48px',\n};\n\nexport const SKELETON_HEADING_HEIGHTS = {\n  sm: 'd-h16',\n  md: 'd-h24',\n  lg: 'd-h32',\n};\n\nexport default {\n  SKELETON_RIPPLE_DURATION,\n  SKELETON_SHAPES,\n  SKELETON_TEXT_TYPES,\n  SKELETON_HEADING_HEIGHTS,\n};\n"],"names":["SKELETON_RIPPLE_DURATION","SKELETON_SHAPES","SKELETON_TEXT_TYPES","SKELETON_SHAPE_SIZES","SKELETON_HEADING_HEIGHTS","skeleton_constants"],"mappings":"4GAMY,MAACA,EAA2B,IAE3BC,EAAkB,CAC7B,OAAQ,eACR,OAAQ,QACV,EAEaC,EAAsB,CACjC,OACA,SACF,EAEaC,EAAuB,CAClC,GAAI,OACJ,GAAI,OACJ,GAAI,MACN,EAEaC,EAA2B,CACtC,GAAI,QACJ,GAAI,QACJ,GAAI,OACN,EAEAC,EAAe,CACb,yBAAAL,EACA,gBAAAC,EACA,oBAAAC,EACA,yBAAAE,CACF"}

package/dist/vue2/lib/skeleton/skeleton-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-constants.js","sources":["../../../components/skeleton/skeleton_constants.js"],"sourcesContent":["// NOTE: RippleDuration controls how long the delay is for the animation\n// of a skeleton 1000 pixels from the top of the page. Each skeleton\n// from the top down will have a delay duration from 0 to this offset.\n// The delay of each skeleton animation is based on how far down the page\n// the skeleton is rendered. This is a linear relationship. The unit\n// is miliseconds.\nexport const SKELETON_RIPPLE_DURATION = 3000000;\n\nexport const SKELETON_SHAPES = {\n  circle: 'd-bar-circle',\n  square: 'd-bar2',\n};\n\nexport const SKELETON_TEXT_TYPES = [\n  'body',\n  'heading',\n];\n\nexport const SKELETON_SHAPE_SIZES = {\n  sm: '24px',\n  md: '32px',\n  lg: '48px',\n};\n\nexport const SKELETON_HEADING_HEIGHTS = {\n  sm: 'd-h16',\n  md: 'd-h24',\n  lg: 'd-h32',\n};\n\nexport default {\n  SKELETON_RIPPLE_DURATION,\n  SKELETON_SHAPES,\n  SKELETON_TEXT_TYPES,\n  SKELETON_HEADING_HEIGHTS,\n};\n"],"names":["SKELETON_RIPPLE_DURATION","SKELETON_SHAPES","SKELETON_TEXT_TYPES","SKELETON_SHAPE_SIZES","SKELETON_HEADING_HEIGHTS","skeleton_constants"],"mappings":"AAMY,MAACA,IAA2B,KAE3BC,IAAkB;AAAA,EAC7B,QAAQ;AAAA,EACR,QAAQ;AACV,GAEaC,IAAsB;AAAA,EACjC;AAAA,EACA;AACF,GAEaC,IAAuB;AAAA,EAClC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAA2B;AAAA,EACtC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEeC,IAAA;AAAA,EACb;AAAA,EACA,iBAAAJ;AAAA,EACA,qBAAAC;AAAA,EACA,0BAAAE;AACF;"}
+{"version":3,"file":"skeleton-constants.js","sources":["../../../components/skeleton/skeleton_constants.js"],"sourcesContent":["// NOTE: RippleDuration controls how long the delay is for the animation\n// of a skeleton 1000 pixels from the top of the page. Each skeleton\n// from the top down will have a delay duration from 0 to this offset.\n// The delay of each skeleton animation is based on how far down the page\n// the skeleton is rendered. This is a linear relationship. The unit\n// is miliseconds.\nexport const SKELETON_RIPPLE_DURATION = 3000000;\n\nexport const SKELETON_SHAPES = {\n  circle: 'd-bar-circle',\n  square: 'd-bar2',\n};\n\nexport const SKELETON_TEXT_TYPES = [\n  'body',\n  'heading',\n];\n\nexport const SKELETON_SHAPE_SIZES = {\n  sm: '24px',\n  md: '32px',\n  lg: '48px',\n};\n\nexport const SKELETON_HEADING_HEIGHTS = {\n  sm: 'd-h16',\n  md: 'd-h24',\n  lg: 'd-h32',\n};\n\nexport default {\n  SKELETON_RIPPLE_DURATION,\n  SKELETON_SHAPES,\n  SKELETON_TEXT_TYPES,\n  SKELETON_HEADING_HEIGHTS,\n};\n"],"names":["SKELETON_RIPPLE_DURATION","SKELETON_SHAPES","SKELETON_TEXT_TYPES","SKELETON_SHAPE_SIZES","SKELETON_HEADING_HEIGHTS","skeleton_constants"],"mappings":"AAMY,MAACA,IAA2B,KAE3BC,IAAkB;AAAA,EAC7B,QAAQ;AAAA,EACR,QAAQ;AACV,GAEaC,IAAsB;AAAA,EACjC;AAAA,EACA;AACF,GAEaC,IAAuB;AAAA,EAClC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAA2B;AAAA,EACtC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEAC,IAAe;AAAA,EACb;AAAA,EACA,iBAAAJ;AAAA,EACA,qBAAAC;AAAA,EACA,0BAAAE;AACF;"}

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

@@ -1 +1 @@
-{"version":3,"file":"skeleton-list-item.cjs","sources":["../../../components/skeleton/skeleton-list-item.vue"],"sourcesContent":["<template>\n  <div\n    data-qa=\"skeleton-list-item\"\n    :class=\"[\n      'd-skeleton-list-item',\n      {\n        'd-skeleton-list-item--single': paragraphs.rows === 1,\n      },\n      contentClass,\n    ]\"\n  >\n    <dt-skeleton-shape\n      class=\"d-skeleton-list-item__shape\"\n      :size=\"shapeSize\"\n      :shape=\"shape\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n      :content-class=\"shapeClass\"\n    />\n    <div class=\"d-skeleton-list-item__paragraph-container\">\n      <dt-skeleton-paragraph\n        v-bind=\"paragraphs\"\n        :animation-duration=\"animationDuration\"\n        :animate=\"animate\"\n        :offset=\"offset\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { SKELETON_SHAPES } from './skeleton_constants';\nimport DtSkeletonShape from './skeleton-shape.vue';\nimport DtSkeletonParagraph from './skeleton-paragraph.vue';\n\nexport default {\n  name: 'DtSkeletonListItem',\n\n  components: {\n    DtSkeletonShape,\n    DtSkeletonParagraph,\n  },\n\n  props: {\n    /**\n     * Defines the shape of the skeleton, accepts circle or square.\n     * @values circle, square\n     */\n    shape: {\n      type: String,\n      default: 'circle',\n      validator: shape => Object.keys(SKELETON_SHAPES).includes(shape),\n    },\n\n    /**\n     * Size of the shape\n     * @values xs, sm, md, lg, xl\n     */\n    shapeSize: {\n      type: String,\n      default: 'md',\n    },\n\n    /**\n     * Object containing quantity of paragraphs to display\n     * and a randomWidth boolean.\n     */\n    paragraphs: {\n      type: Object,\n      default: () => ({ rows: 3, randomWidth: true }),\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Additional class name for the shape.\n     */\n    shapeClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtSkeletonShape","DtSkeletonParagraph","shape","SKELETON_SHAPES"],"mappings":"wRAoCAA,EAAA,CACA,KAAA,qBAEA,WAAA,CACA,gBAAAC,EAAA,QACA,oBAAAC,EAAA,OACA,EAEA,MAAA,CAKA,MAAA,CACA,KAAA,OACA,QAAA,SACA,UAAAC,GAAA,OAAA,KAAAC,EAAAA,eAAA,EAAA,SAAAD,CAAA,CACA,EAMA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,WAAA,CACA,KAAA,OACA,QAAA,KAAA,CAAA,KAAA,EAAA,YAAA,EAAA,EACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,EAKA,WAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,EACA,CACA,CACA"}
+{"version":3,"file":"skeleton-list-item.cjs","sources":["../../../components/skeleton/skeleton-list-item.vue"],"sourcesContent":["<template>\n  <div\n    data-qa=\"skeleton-list-item\"\n    :class=\"[\n      'd-skeleton-list-item',\n      {\n        'd-skeleton-list-item--single': paragraphs.rows === 1,\n      },\n      contentClass,\n    ]\"\n  >\n    <dt-skeleton-shape\n      class=\"d-skeleton-list-item__shape\"\n      :size=\"shapeSize\"\n      :shape=\"shape\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n      :content-class=\"shapeClass\"\n    />\n    <div class=\"d-skeleton-list-item__paragraph-container\">\n      <dt-skeleton-paragraph\n        v-bind=\"paragraphs\"\n        :animation-duration=\"animationDuration\"\n        :animate=\"animate\"\n        :offset=\"offset\"\n      />\n    </div>\n  </div>\n</template>\n\n<script>\nimport { SKELETON_SHAPES } from './skeleton_constants';\nimport DtSkeletonShape from './skeleton-shape.vue';\nimport DtSkeletonParagraph from './skeleton-paragraph.vue';\n\nexport default {\n  name: 'DtSkeletonListItem',\n\n  components: {\n    DtSkeletonShape,\n    DtSkeletonParagraph,\n  },\n\n  props: {\n    /**\n     * Defines the shape of the skeleton, accepts circle or square.\n     * @values circle, square\n     */\n    shape: {\n      type: String,\n      default: 'circle',\n      validator: shape => Object.keys(SKELETON_SHAPES).includes(shape),\n    },\n\n    /**\n     * Size of the shape\n     * @values xs, sm, md, lg, xl\n     */\n    shapeSize: {\n      type: String,\n      default: 'md',\n    },\n\n    /**\n     * Object containing quantity of paragraphs to display\n     * and a randomWidth boolean.\n     */\n    paragraphs: {\n      type: Object,\n      default: () => ({ rows: 3, randomWidth: true }),\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Additional class name for the shape.\n     */\n    shapeClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtSkeletonShape","DtSkeletonParagraph","shape","SKELETON_SHAPES"],"mappings":"wRAoCAA,EAAA,CACA,KAAA,qBAEA,WAAA,CACA,gBAAAC,EAAAA,QACA,oBAAAC,EAAAA,OACA,EAEA,MAAA,CAKA,MAAA,CACA,KAAA,OACA,QAAA,SACA,UAAAC,GAAA,OAAA,KAAAC,EAAAA,eAAA,EAAA,SAAAD,CAAA,CACA,EAMA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,WAAA,CACA,KAAA,OACA,QAAA,KAAA,CAAA,KAAA,EAAA,YAAA,EAAA,EACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,EAKA,WAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,EACA,CACA,CACA"}

package/dist/vue2/lib/skeleton/skeleton-paragraph.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-paragraph.cjs","sources":["../../../components/skeleton/skeleton-paragraph.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'd-skeleton-paragraph',\n      contentClass,\n    ]\"\n    contentClass\n    data-qa=\"skeleton-paragraph\"\n  >\n    <dt-skeleton-text\n      v-for=\"row in integerRows\"\n      :key=\"row\"\n      data-qa=\"skeleton-paragraph-row\"\n      :content-class=\"rowClass\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n      :animation-duration=\"animationDuration\"\n      :width=\"getSizeParagraphRow(row)\"\n    />\n  </div>\n</template>\n\n<script>\nimport DtSkeletonText from './skeleton-text.vue';\n\nconst validator = number => number !== '' && !Number.isNaN(Number(number));\nexport default {\n  name: 'DtSkeletonParagraph',\n  components: {\n    DtSkeletonText,\n  },\n\n  props: {\n    /**\n     * Quantity of rows to display\n     */\n    rows: {\n      type: [Number, String],\n      default: 3,\n      validator,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Controls the min width of paragraphs\n     */\n    minWidth: {\n      type: [Number, String],\n      default: 30,\n      validator,\n    },\n\n    /**\n     * Controls the max width of paragraphs\n     */\n    maxWidth: {\n      type: [Number, String],\n      default: 100,\n      validator,\n    },\n\n    /**\n     * Controls the width of paragraphs\n     */\n    width: {\n      type: [String, Array],\n      default: null,\n    },\n\n    /**\n     * If true, row widths will be random\n     * @values true, false\n     */\n    randomWidth: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the row.\n     */\n    rowClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  computed: {\n    integerRows () {\n      return Number(this.rows);\n    },\n  },\n\n  methods: {\n    randomWidthPercentage () {\n      const min = Math.min(this.minWidth, this.maxWidth);\n      const max = Math.max(this.minWidth, this.maxWidth);\n      return `${Math.round(Math.random() * (max - min)) + min}%`;\n    },\n\n    getSizeParagraphRow (row) {\n      const paragraphWidth = this.width;\n      const isArrayWidth = Array.isArray(paragraphWidth);\n      const currentWidth = paragraphWidth?.[row - 1];\n      const isLastRow = row === this.rows;\n\n      if (this.randomWidth) {\n        return this.randomWidthPercentage();\n      }\n\n      if (paragraphWidth && !isArrayWidth) {\n        return paragraphWidth;\n      }\n\n      if (paragraphWidth && isArrayWidth && currentWidth) {\n        return currentWidth;\n      }\n\n      return isLastRow ? '38%' : '100%';\n    },\n  },\n};\n</script>\n"],"names":["validator","number","_sfc_main","DtSkeletonText","min","max","row","paragraphWidth","isArrayWidth","currentWidth","isLastRow"],"mappings":"2MAyBAA,EAAAC,GAAAA,IAAA,IAAA,CAAA,OAAA,MAAA,OAAAA,CAAA,CAAA,EACAC,EAAA,CACA,KAAA,sBACA,WAAA,CACA,eAAAC,EAAA,OACA,EAEA,MAAA,CAIA,KAAA,CACA,KAAA,CAAA,OAAA,MAAA,EACA,QAAA,EACA,UAAAH,CACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,SAAA,CACA,KAAA,CAAA,OAAA,MAAA,EACA,QAAA,GACA,UAAAA,CACA,EAKA,SAAA,CACA,KAAA,CAAA,OAAA,MAAA,EACA,QAAA,IACA,UAAAA,CACA,EAKA,MAAA,CACA,KAAA,CAAA,OAAA,KAAA,EACA,QAAA,IACA,EAMA,YAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,SAAA,CACA,KAAA,OACA,QAAA,EACA,CACA,EAEA,SAAA,CACA,aAAA,CACA,OAAA,OAAA,KAAA,IAAA,CACA,CACA,EAEA,QAAA,CACA,uBAAA,CACA,MAAAI,EAAA,KAAA,IAAA,KAAA,SAAA,KAAA,QAAA,EACAC,EAAA,KAAA,IAAA,KAAA,SAAA,KAAA,QAAA,EACA,MAAA,GAAA,KAAA,MAAA,KAAA,OAAA,GAAAA,EAAAD,EAAA,EAAAA,CAAA,GACA,EAEA,oBAAAE,EAAA,CACA,MAAAC,EAAA,KAAA,MACAC,EAAA,MAAA,QAAAD,CAAA,EACAE,EAAAF,GAAA,YAAAA,EAAAD,EAAA,GACAI,EAAAJ,IAAA,KAAA,KAEA,OAAA,KAAA,YACA,KAAA,wBAGAC,GAAA,CAAAC,EACAD,EAGAA,GAAAC,GAAAC,EACAA,EAGAC,EAAA,MAAA,MACA,CACA,CACA"}
+{"version":3,"file":"skeleton-paragraph.cjs","sources":["../../../components/skeleton/skeleton-paragraph.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'd-skeleton-paragraph',\n      contentClass,\n    ]\"\n    contentClass\n    data-qa=\"skeleton-paragraph\"\n  >\n    <dt-skeleton-text\n      v-for=\"row in integerRows\"\n      :key=\"row\"\n      data-qa=\"skeleton-paragraph-row\"\n      :content-class=\"rowClass\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n      :animation-duration=\"animationDuration\"\n      :width=\"getSizeParagraphRow(row)\"\n    />\n  </div>\n</template>\n\n<script>\nimport DtSkeletonText from './skeleton-text.vue';\n\nconst validator = number => number !== '' && !Number.isNaN(Number(number));\nexport default {\n  name: 'DtSkeletonParagraph',\n  components: {\n    DtSkeletonText,\n  },\n\n  props: {\n    /**\n     * Quantity of rows to display\n     */\n    rows: {\n      type: [Number, String],\n      default: 3,\n      validator,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Controls the min width of paragraphs\n     */\n    minWidth: {\n      type: [Number, String],\n      default: 30,\n      validator,\n    },\n\n    /**\n     * Controls the max width of paragraphs\n     */\n    maxWidth: {\n      type: [Number, String],\n      default: 100,\n      validator,\n    },\n\n    /**\n     * Controls the width of paragraphs\n     */\n    width: {\n      type: [String, Array],\n      default: null,\n    },\n\n    /**\n     * If true, row widths will be random\n     * @values true, false\n     */\n    randomWidth: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the row.\n     */\n    rowClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  computed: {\n    integerRows () {\n      return Number(this.rows);\n    },\n  },\n\n  methods: {\n    randomWidthPercentage () {\n      const min = Math.min(this.minWidth, this.maxWidth);\n      const max = Math.max(this.minWidth, this.maxWidth);\n      return `${Math.round(Math.random() * (max - min)) + min}%`;\n    },\n\n    getSizeParagraphRow (row) {\n      const paragraphWidth = this.width;\n      const isArrayWidth = Array.isArray(paragraphWidth);\n      const currentWidth = paragraphWidth?.[row - 1];\n      const isLastRow = row === this.rows;\n\n      if (this.randomWidth) {\n        return this.randomWidthPercentage();\n      }\n\n      if (paragraphWidth && !isArrayWidth) {\n        return paragraphWidth;\n      }\n\n      if (paragraphWidth && isArrayWidth && currentWidth) {\n        return currentWidth;\n      }\n\n      return isLastRow ? '38%' : '100%';\n    },\n  },\n};\n</script>\n"],"names":["validator","number","_sfc_main","DtSkeletonText","min","max","row","paragraphWidth","isArrayWidth","currentWidth","isLastRow"],"mappings":"2MAyBAA,EAAAC,GAAAA,IAAA,IAAA,CAAA,OAAA,MAAA,OAAAA,CAAA,CAAA,EACAC,EAAA,CACA,KAAA,sBACA,WAAA,CACA,eAAAC,EAAAA,OACA,EAEA,MAAA,CAIA,KAAA,CACA,KAAA,CAAA,OAAA,MAAA,EACA,QAAA,EACA,UAAAH,CACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,SAAA,CACA,KAAA,CAAA,OAAA,MAAA,EACA,QAAA,GACA,UAAAA,CACA,EAKA,SAAA,CACA,KAAA,CAAA,OAAA,MAAA,EACA,QAAA,IACA,UAAAA,CACA,EAKA,MAAA,CACA,KAAA,CAAA,OAAA,KAAA,EACA,QAAA,IACA,EAMA,YAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,SAAA,CACA,KAAA,OACA,QAAA,EACA,CACA,EAEA,SAAA,CACA,aAAA,CACA,OAAA,OAAA,KAAA,IAAA,CACA,CACA,EAEA,QAAA,CACA,uBAAA,CACA,MAAAI,EAAA,KAAA,IAAA,KAAA,SAAA,KAAA,QAAA,EACAC,EAAA,KAAA,IAAA,KAAA,SAAA,KAAA,QAAA,EACA,MAAA,GAAA,KAAA,MAAA,KAAA,UAAAA,EAAAD,EAAA,EAAAA,CAAA,GACA,EAEA,oBAAAE,EAAA,CACA,MAAAC,EAAA,KAAA,MACAC,EAAA,MAAA,QAAAD,CAAA,EACAE,EAAAF,GAAA,YAAAA,EAAAD,EAAA,GACAI,EAAAJ,IAAA,KAAA,KAEA,OAAA,KAAA,YACA,KAAA,sBAAA,EAGAC,GAAA,CAAAC,EACAD,EAGAA,GAAAC,GAAAC,EACAA,EAGAC,EAAA,MAAA,MACA,CACA,CACA"}

package/dist/vue2/lib/skeleton/skeleton-paragraph.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-paragraph.js","sources":["../../../components/skeleton/skeleton-paragraph.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'd-skeleton-paragraph',\n      contentClass,\n    ]\"\n    contentClass\n    data-qa=\"skeleton-paragraph\"\n  >\n    <dt-skeleton-text\n      v-for=\"row in integerRows\"\n      :key=\"row\"\n      data-qa=\"skeleton-paragraph-row\"\n      :content-class=\"rowClass\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n      :animation-duration=\"animationDuration\"\n      :width=\"getSizeParagraphRow(row)\"\n    />\n  </div>\n</template>\n\n<script>\nimport DtSkeletonText from './skeleton-text.vue';\n\nconst validator = number => number !== '' && !Number.isNaN(Number(number));\nexport default {\n  name: 'DtSkeletonParagraph',\n  components: {\n    DtSkeletonText,\n  },\n\n  props: {\n    /**\n     * Quantity of rows to display\n     */\n    rows: {\n      type: [Number, String],\n      default: 3,\n      validator,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Controls the min width of paragraphs\n     */\n    minWidth: {\n      type: [Number, String],\n      default: 30,\n      validator,\n    },\n\n    /**\n     * Controls the max width of paragraphs\n     */\n    maxWidth: {\n      type: [Number, String],\n      default: 100,\n      validator,\n    },\n\n    /**\n     * Controls the width of paragraphs\n     */\n    width: {\n      type: [String, Array],\n      default: null,\n    },\n\n    /**\n     * If true, row widths will be random\n     * @values true, false\n     */\n    randomWidth: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the row.\n     */\n    rowClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  computed: {\n    integerRows () {\n      return Number(this.rows);\n    },\n  },\n\n  methods: {\n    randomWidthPercentage () {\n      const min = Math.min(this.minWidth, this.maxWidth);\n      const max = Math.max(this.minWidth, this.maxWidth);\n      return `${Math.round(Math.random() * (max - min)) + min}%`;\n    },\n\n    getSizeParagraphRow (row) {\n      const paragraphWidth = this.width;\n      const isArrayWidth = Array.isArray(paragraphWidth);\n      const currentWidth = paragraphWidth?.[row - 1];\n      const isLastRow = row === this.rows;\n\n      if (this.randomWidth) {\n        return this.randomWidthPercentage();\n      }\n\n      if (paragraphWidth && !isArrayWidth) {\n        return paragraphWidth;\n      }\n\n      if (paragraphWidth && isArrayWidth && currentWidth) {\n        return currentWidth;\n      }\n\n      return isLastRow ? '38%' : '100%';\n    },\n  },\n};\n</script>\n"],"names":["validator","number","_sfc_main","DtSkeletonText","min","max","row","paragraphWidth","isArrayWidth","currentWidth","isLastRow"],"mappings":";;AAyBA,MAAAA,IAAA,CAAAC,MAAAA,MAAA,MAAA,CAAA,OAAA,MAAA,OAAAA,CAAA,CAAA,GACAC,IAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA,gBAAAC;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,MAAA,CAAA,QAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAAH;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA,CAAA,QAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA,CAAA,QAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA,CAAA,QAAA,KAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,cAAA;AACA,aAAA,OAAA,KAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,wBAAA;AACA,YAAAI,IAAA,KAAA,IAAA,KAAA,UAAA,KAAA,QAAA,GACAC,IAAA,KAAA,IAAA,KAAA,UAAA,KAAA,QAAA;AACA,aAAA,GAAA,KAAA,MAAA,KAAA,OAAA,KAAAA,IAAAD,EAAA,IAAAA,CAAA;AAAA,IACA;AAAA,IAEA,oBAAAE,GAAA;AACA,YAAAC,IAAA,KAAA,OACAC,IAAA,MAAA,QAAAD,CAAA,GACAE,IAAAF,KAAA,gBAAAA,EAAAD,IAAA,IACAI,IAAAJ,MAAA,KAAA;AAEA,aAAA,KAAA,cACA,KAAA,0BAGAC,KAAA,CAAAC,IACAD,IAGAA,KAAAC,KAAAC,IACAA,IAGAC,IAAA,QAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;"}
+{"version":3,"file":"skeleton-paragraph.js","sources":["../../../components/skeleton/skeleton-paragraph.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[\n      'd-skeleton-paragraph',\n      contentClass,\n    ]\"\n    contentClass\n    data-qa=\"skeleton-paragraph\"\n  >\n    <dt-skeleton-text\n      v-for=\"row in integerRows\"\n      :key=\"row\"\n      data-qa=\"skeleton-paragraph-row\"\n      :content-class=\"rowClass\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n      :animation-duration=\"animationDuration\"\n      :width=\"getSizeParagraphRow(row)\"\n    />\n  </div>\n</template>\n\n<script>\nimport DtSkeletonText from './skeleton-text.vue';\n\nconst validator = number => number !== '' && !Number.isNaN(Number(number));\nexport default {\n  name: 'DtSkeletonParagraph',\n  components: {\n    DtSkeletonText,\n  },\n\n  props: {\n    /**\n     * Quantity of rows to display\n     */\n    rows: {\n      type: [Number, String],\n      default: 3,\n      validator,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Controls the min width of paragraphs\n     */\n    minWidth: {\n      type: [Number, String],\n      default: 30,\n      validator,\n    },\n\n    /**\n     * Controls the max width of paragraphs\n     */\n    maxWidth: {\n      type: [Number, String],\n      default: 100,\n      validator,\n    },\n\n    /**\n     * Controls the width of paragraphs\n     */\n    width: {\n      type: [String, Array],\n      default: null,\n    },\n\n    /**\n     * If true, row widths will be random\n     * @values true, false\n     */\n    randomWidth: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Additional class name for the row.\n     */\n    rowClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  computed: {\n    integerRows () {\n      return Number(this.rows);\n    },\n  },\n\n  methods: {\n    randomWidthPercentage () {\n      const min = Math.min(this.minWidth, this.maxWidth);\n      const max = Math.max(this.minWidth, this.maxWidth);\n      return `${Math.round(Math.random() * (max - min)) + min}%`;\n    },\n\n    getSizeParagraphRow (row) {\n      const paragraphWidth = this.width;\n      const isArrayWidth = Array.isArray(paragraphWidth);\n      const currentWidth = paragraphWidth?.[row - 1];\n      const isLastRow = row === this.rows;\n\n      if (this.randomWidth) {\n        return this.randomWidthPercentage();\n      }\n\n      if (paragraphWidth && !isArrayWidth) {\n        return paragraphWidth;\n      }\n\n      if (paragraphWidth && isArrayWidth && currentWidth) {\n        return currentWidth;\n      }\n\n      return isLastRow ? '38%' : '100%';\n    },\n  },\n};\n</script>\n"],"names":["validator","number","_sfc_main","DtSkeletonText","min","max","row","paragraphWidth","isArrayWidth","currentWidth","isLastRow"],"mappings":";;AAyBA,MAAAA,IAAA,CAAAC,MAAAA,MAAA,MAAA,CAAA,OAAA,MAAA,OAAAA,CAAA,CAAA,GACAC,IAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA,gBAAAC;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA,IAIA,MAAA;AAAA,MACA,MAAA,CAAA,QAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAAH;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA,CAAA,QAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA,CAAA,QAAA,MAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,OAAA;AAAA,MACA,MAAA,CAAA,QAAA,KAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,cAAA;AACA,aAAA,OAAA,KAAA,IAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,wBAAA;AACA,YAAAI,IAAA,KAAA,IAAA,KAAA,UAAA,KAAA,QAAA,GACAC,IAAA,KAAA,IAAA,KAAA,UAAA,KAAA,QAAA;AACA,aAAA,GAAA,KAAA,MAAA,KAAA,YAAAA,IAAAD,EAAA,IAAAA,CAAA;AAAA,IACA;AAAA,IAEA,oBAAAE,GAAA;AACA,YAAAC,IAAA,KAAA,OACAC,IAAA,MAAA,QAAAD,CAAA,GACAE,IAAAF,KAAA,gBAAAA,EAAAD,IAAA,IACAI,IAAAJ,MAAA,KAAA;AAEA,aAAA,KAAA,cACA,KAAA,sBAAA,IAGAC,KAAA,CAAAC,IACAD,IAGAA,KAAAC,KAAAC,IACAA,IAGAC,IAAA,QAAA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;;;;;;"}

package/dist/vue2/lib/skeleton/skeleton-shape.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-shape.cjs","sources":["../../../components/skeleton/skeleton-shape.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"skeleton\"\n    data-qa=\"skeleton-shape\"\n    :class=\"[\n      'd-skeleton-placeholder',\n      SKELETON_SHAPES[shape],\n      {\n        'd-skeleton-placeholder--animate': animate,\n      },\n      contentClass,\n    ]\"\n    :style=\"shapeStyles\"\n  />\n</template>\n\n<script>\nimport SkeletonAnimation from '@/common/mixins/skeleton';\nimport {\n  SKELETON_SHAPES,\n  SKELETON_SHAPE_SIZES,\n} from './skeleton_constants';\n\nexport default {\n  name: 'DtSkeletonShape',\n\n  mixins: [SkeletonAnimation],\n\n  props: {\n    /**\n     * Defines the shape of the skeleton, accepts circle or square.\n     * @values circle, square\n     */\n    shape: {\n      type: String,\n      default: 'circle',\n      validator: shape => Object.keys(SKELETON_SHAPES).includes(shape),\n    },\n\n    /**\n     * Size of the shape\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  data () {\n    return {\n      SKELETON_SHAPES,\n    };\n  },\n\n  computed: {\n    shapeStyles () {\n      const size = SKELETON_SHAPE_SIZES[this.size] || this.size;\n      return {\n        ...this.skeletonStyle,\n        'min-width': size,\n        'max-width': size,\n        'min-height': size,\n        'max-height': size,\n      };\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","SkeletonAnimation","shape","SKELETON_SHAPES","size","SKELETON_SHAPE_SIZES"],"mappings":"8PAuBAA,EAAA,CACA,KAAA,kBAEA,OAAA,CAAAC,EAAAA,OAAA,EAEA,MAAA,CAKA,MAAA,CACA,KAAA,OACA,QAAA,SACA,UAAAC,GAAA,OAAA,KAAAC,EAAAA,eAAA,EAAA,SAAAD,CAAA,CACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,OAAA,KAAA,EACA,QAAA,EACA,CACA,EAEA,MAAA,CACA,MAAA,CACA,gBAAAC,EAAA,eACA,CACA,EAEA,SAAA,CACA,aAAA,CACA,MAAAC,EAAAC,EAAAA,qBAAA,KAAA,IAAA,GAAA,KAAA,KACA,MAAA,CACA,GAAA,KAAA,cACA,YAAAD,EACA,YAAAA,EACA,aAAAA,EACA,aAAAA,CACA,CACA,CACA,CACA"}
+{"version":3,"file":"skeleton-shape.cjs","sources":["../../../components/skeleton/skeleton-shape.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"skeleton\"\n    data-qa=\"skeleton-shape\"\n    :class=\"[\n      'd-skeleton-placeholder',\n      SKELETON_SHAPES[shape],\n      {\n        'd-skeleton-placeholder--animate': animate,\n      },\n      contentClass,\n    ]\"\n    :style=\"shapeStyles\"\n  />\n</template>\n\n<script>\nimport SkeletonAnimation from '@/common/mixins/skeleton';\nimport {\n  SKELETON_SHAPES,\n  SKELETON_SHAPE_SIZES,\n} from './skeleton_constants';\n\nexport default {\n  name: 'DtSkeletonShape',\n\n  mixins: [SkeletonAnimation],\n\n  props: {\n    /**\n     * Defines the shape of the skeleton, accepts circle or square.\n     * @values circle, square\n     */\n    shape: {\n      type: String,\n      default: 'circle',\n      validator: shape => Object.keys(SKELETON_SHAPES).includes(shape),\n    },\n\n    /**\n     * Size of the shape\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n  },\n\n  data () {\n    return {\n      SKELETON_SHAPES,\n    };\n  },\n\n  computed: {\n    shapeStyles () {\n      const size = SKELETON_SHAPE_SIZES[this.size] || this.size;\n      return {\n        ...this.skeletonStyle,\n        'min-width': size,\n        'max-width': size,\n        'min-height': size,\n        'max-height': size,\n      };\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","SkeletonAnimation","shape","SKELETON_SHAPES","size","SKELETON_SHAPE_SIZES"],"mappings":"8PAuBAA,EAAA,CACA,KAAA,kBAEA,OAAA,CAAAC,EAAAA,OAAA,EAEA,MAAA,CAKA,MAAA,CACA,KAAA,OACA,QAAA,SACA,UAAAC,GAAA,OAAA,KAAAC,EAAAA,eAAA,EAAA,SAAAD,CAAA,CACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,OAAA,KAAA,EACA,QAAA,EACA,CACA,EAEA,MAAA,CACA,MAAA,CACA,gBAAAC,EAAAA,eACA,CACA,EAEA,SAAA,CACA,aAAA,CACA,MAAAC,EAAAC,EAAAA,qBAAA,KAAA,IAAA,GAAA,KAAA,KACA,MAAA,CACA,GAAA,KAAA,cACA,YAAAD,EACA,YAAAA,EACA,aAAAA,EACA,aAAAA,CACA,CACA,CACA,CACA"}

package/dist/vue2/lib/skeleton/skeleton-shape.js

@@ -1,5 +1,5 @@
 import s from "../../common/mixins/skeleton.js";
-import { SKELETON_SHAPES as a, SKELETON_SHAPE_SIZES as r } from "./skeleton-constants.js";
+import { SKELETON_SHAPE_SIZES as r, SKELETON_SHAPES as a } from "./skeleton-constants.js";
 import { n as i } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
 const o = {
   name: "DtSkeletonShape",

package/dist/vue2/lib/skeleton/skeleton-text.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-text.cjs","sources":["../../../components/skeleton/skeleton-text.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"type === 'body'\"\n    ref=\"skeleton\"\n    data-qa=\"skeleton-text-body\"\n    :class=\"[\n      'd-skeleton-text',\n      'd-skeleton-placeholder',\n      {\n        'd-skeleton-placeholder--animate': animate,\n      },\n      contentClass,\n    ]\"\n    :style=\"{\n      width,\n      ...skeletonStyle,\n    }\"\n  />\n  <div\n    v-else-if=\"type === 'heading'\"\n    ref=\"skeleton\"\n    data-qa=\"skeleton-text-heading\"\n    :class=\"[\n      SKELETON_HEADING_HEIGHTS[headingHeight],\n      'd-skeleton-text--heading',\n      'd-skeleton-placeholder',\n      {\n        'd-skeleton-placeholder--animate': animate,\n      },\n      contentClass,\n    ]\"\n    :style=\"{\n      width,\n      ...skeletonStyle,\n    }\"\n  />\n</template>\n\n<script>\nimport { SKELETON_HEADING_HEIGHTS, SKELETON_TEXT_TYPES } from './skeleton_constants';\nimport SkeletonAnimation from '@/common/mixins/skeleton';\n\nexport default {\n  name: 'DtSkeletonText',\n\n  mixins: [SkeletonAnimation],\n\n  props: {\n    /**\n     * Skeleton type\n     * @values body, heading\n     */\n    type: {\n      type: String,\n      default: 'body',\n      validator: type => SKELETON_TEXT_TYPES.includes(type),\n    },\n\n    /**\n     * Heading height\n     * @values sm, md, lg\n     */\n    headingHeight: {\n      type: String,\n      default: 'md',\n      validator: headingHeight => Object.keys(SKELETON_HEADING_HEIGHTS).includes(headingHeight),\n    },\n\n    /**\n     * Width of the skeleton\n     */\n    width: {\n      type: String,\n      default: '100%',\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  data () {\n    return {\n      SKELETON_HEADING_HEIGHTS,\n    };\n  },\n};\n</script>\n"],"names":["_sfc_main","SkeletonAnimation","type","SKELETON_TEXT_TYPES","headingHeight","SKELETON_HEADING_HEIGHTS"],"mappings":"8PA0CAA,EAAA,CACA,KAAA,iBAEA,OAAA,CAAAC,EAAAA,OAAA,EAEA,MAAA,CAKA,KAAA,CACA,KAAA,OACA,QAAA,OACA,UAAAC,GAAAC,sBAAA,SAAAD,CAAA,CACA,EAMA,cAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAE,GAAA,OAAA,KAAAC,EAAAA,wBAAA,EAAA,SAAAD,CAAA,CACA,EAKA,MAAA,CACA,KAAA,OACA,QAAA,MACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,EACA,CACA,EAEA,MAAA,CACA,MAAA,CACA,yBAAAC,EAAA,wBACA,CACA,CACA"}
+{"version":3,"file":"skeleton-text.cjs","sources":["../../../components/skeleton/skeleton-text.vue"],"sourcesContent":["<template>\n  <div\n    v-if=\"type === 'body'\"\n    ref=\"skeleton\"\n    data-qa=\"skeleton-text-body\"\n    :class=\"[\n      'd-skeleton-text',\n      'd-skeleton-placeholder',\n      {\n        'd-skeleton-placeholder--animate': animate,\n      },\n      contentClass,\n    ]\"\n    :style=\"{\n      width,\n      ...skeletonStyle,\n    }\"\n  />\n  <div\n    v-else-if=\"type === 'heading'\"\n    ref=\"skeleton\"\n    data-qa=\"skeleton-text-heading\"\n    :class=\"[\n      SKELETON_HEADING_HEIGHTS[headingHeight],\n      'd-skeleton-text--heading',\n      'd-skeleton-placeholder',\n      {\n        'd-skeleton-placeholder--animate': animate,\n      },\n      contentClass,\n    ]\"\n    :style=\"{\n      width,\n      ...skeletonStyle,\n    }\"\n  />\n</template>\n\n<script>\nimport { SKELETON_HEADING_HEIGHTS, SKELETON_TEXT_TYPES } from './skeleton_constants';\nimport SkeletonAnimation from '@/common/mixins/skeleton';\n\nexport default {\n  name: 'DtSkeletonText',\n\n  mixins: [SkeletonAnimation],\n\n  props: {\n    /**\n     * Skeleton type\n     * @values body, heading\n     */\n    type: {\n      type: String,\n      default: 'body',\n      validator: type => SKELETON_TEXT_TYPES.includes(type),\n    },\n\n    /**\n     * Heading height\n     * @values sm, md, lg\n     */\n    headingHeight: {\n      type: String,\n      default: 'md',\n      validator: headingHeight => Object.keys(SKELETON_HEADING_HEIGHTS).includes(headingHeight),\n    },\n\n    /**\n     * Width of the skeleton\n     */\n    width: {\n      type: String,\n      default: '100%',\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n\n    /**\n     * Additional class name for the content.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  data () {\n    return {\n      SKELETON_HEADING_HEIGHTS,\n    };\n  },\n};\n</script>\n"],"names":["_sfc_main","SkeletonAnimation","type","SKELETON_TEXT_TYPES","headingHeight","SKELETON_HEADING_HEIGHTS"],"mappings":"8PA0CAA,EAAA,CACA,KAAA,iBAEA,OAAA,CAAAC,EAAAA,OAAA,EAEA,MAAA,CAKA,KAAA,CACA,KAAA,OACA,QAAA,OACA,UAAAC,GAAAC,sBAAA,SAAAD,CAAA,CACA,EAMA,cAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAE,GAAA,OAAA,KAAAC,EAAAA,wBAAA,EAAA,SAAAD,CAAA,CACA,EAKA,MAAA,CACA,KAAA,OACA,QAAA,MACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,EACA,CACA,EAEA,MAAA,CACA,MAAA,CACA,yBAAAC,EAAAA,wBACA,CACA,CACA"}

package/dist/vue2/lib/skeleton/skeleton.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./skeleton-shape.cjs"),o=require("./skeleton-list-item.cjs"),i=require("./skeleton-paragraph.cjs"),r=require("./skeleton-text.cjs"),s=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs");require("./skeleton-constants.cjs");const l={name:"DtSkeleton",components:{DtSkeletonText:r.default,DtSkeletonShape:n.default,DtSkeletonListItem:o.default,DtSkeletonParagraph:i.default},props:{paragraphOption:{type:[Object,Boolean],default:null},listItemOption:{type:[Object,Boolean],default:null},textOption:{type:Object,default:null},shapeOption:{type:[Object,Boolean],default:null},animationDuration:{type:Number,default:-1},ariaLabel:{type:String,default:""},animate:{type:Boolean,default:!0},offset:{type:Number,default:1}},computed:{validationOptions(){return{paragraphOption:this.paragraphOption,listItemOption:this.listItemOption,textOption:this.textOption,shapeOption:this.shapeOption}}},watch:{$props:{immediate:!0,handler:"validator"}},methods:{validator(){const a=Object.entries(this.validationOptions).filter(([t,e])=>e);if(a.length>=2){const t=`Use only one of ${a.map(([e])=>e).join(" | ")} options at the same time`;console.error(t)}}}};var p=function(){var t=this,e=t._self._c;return e("div",{attrs:{"aria-busy":"true",role:"status","aria-label":t.ariaLabel}},[t.listItemOption?e("dt-skeleton-list-item",t._b({attrs:{"animation-duration":t.animationDuration,animate:t.animate,offset:t.offset}},"dt-skeleton-list-item",t.listItemOption===!0?{}:t.listItemOption,!1)):t.shapeOption?e("dt-skeleton-shape",t._b({attrs:{"animation-duration":t.animationDuration,animate:t.animate,offset:t.offset}},"dt-skeleton-shape",t.shapeOption===!0?{}:t.shapeOption,!1)):t.paragraphOption?e("dt-skeleton-paragraph",t._b({attrs:{"animation-duration":t.animationDuration,animate:t.animate,offset:t.offset}},"dt-skeleton-paragraph",t.paragraphOption===!0?{}:t.paragraphOption,!1)):e("dt-skeleton-text",t._b({attrs:{"animation-duration":t.animationDuration,animate:t.animate,offset:t.offset}},"dt-skeleton-text",t.textOption||{},!1))],1)},u=[],f=s.n(l,p,u);const m=f.exports;exports.default=m;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./skeleton-shape.cjs"),o=require("./skeleton-list-item.cjs"),i=require("./skeleton-paragraph.cjs"),r=require("./skeleton-text.cjs"),s=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs");require("./skeleton-constants.cjs");const l={name:"DtSkeleton",components:{DtSkeletonText:r.default,DtSkeletonShape:n.default,DtSkeletonListItem:o.default,DtSkeletonParagraph:i.default},props:{paragraphOption:{type:[Object,Boolean],default:null},listItemOption:{type:[Object,Boolean],default:null},textOption:{type:Object,default:null},shapeOption:{type:[Object,Boolean],default:null},animationDuration:{type:Number,default:-1},ariaLabel:{type:String,default:""},animate:{type:Boolean,default:!0},offset:{type:Number,default:1}},computed:{validationOptions(){return{paragraphOption:this.paragraphOption,listItemOption:this.listItemOption,textOption:this.textOption,shapeOption:this.shapeOption}}},watch:{$props:{immediate:!0,handler:"validator"}},methods:{validator(){const a=Object.entries(this.validationOptions).filter(([,t])=>t);if(a.length>=2){const t=`Use only one of ${a.map(([e])=>e).join(" | ")} options at the same time`;console.error(t)}}}};var p=function(){var t=this,e=t._self._c;return e("div",{attrs:{"aria-busy":"true",role:"status","aria-label":t.ariaLabel}},[t.listItemOption?e("dt-skeleton-list-item",t._b({attrs:{"animation-duration":t.animationDuration,animate:t.animate,offset:t.offset}},"dt-skeleton-list-item",t.listItemOption===!0?{}:t.listItemOption,!1)):t.shapeOption?e("dt-skeleton-shape",t._b({attrs:{"animation-duration":t.animationDuration,animate:t.animate,offset:t.offset}},"dt-skeleton-shape",t.shapeOption===!0?{}:t.shapeOption,!1)):t.paragraphOption?e("dt-skeleton-paragraph",t._b({attrs:{"animation-duration":t.animationDuration,animate:t.animate,offset:t.offset}},"dt-skeleton-paragraph",t.paragraphOption===!0?{}:t.paragraphOption,!1)):e("dt-skeleton-text",t._b({attrs:{"animation-duration":t.animationDuration,animate:t.animate,offset:t.offset}},"dt-skeleton-text",t.textOption||{},!1))],1)},u=[],f=s.n(l,p,u);const m=f.exports;exports.default=m;
 //# sourceMappingURL=skeleton.cjs.map

package/dist/vue2/lib/skeleton/skeleton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.cjs","sources":["../../../components/skeleton/skeleton.vue"],"sourcesContent":["<template>\n  <div\n    aria-busy=\"true\"\n    role=\"status\"\n    :aria-label=\"ariaLabel\"\n  >\n    <dt-skeleton-list-item\n      v-if=\"listItemOption\"\n      v-bind=\"listItemOption === true ? {} : listItemOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-shape\n      v-else-if=\"shapeOption\"\n      v-bind=\"shapeOption === true ? {} : shapeOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-paragraph\n      v-else-if=\"paragraphOption\"\n      v-bind=\"paragraphOption === true ? {} : paragraphOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-text\n      v-else\n      v-bind=\"textOption || {}\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n  </div>\n</template>\n\n<script>\nimport DtSkeletonShape from './skeleton-shape.vue';\nimport DtSkeletonListItem from './skeleton-list-item.vue';\nimport DtSkeletonParagraph from './skeleton-paragraph.vue';\nimport DtSkeletonText from './skeleton-text.vue';\n\n/**\n * Skeleton loader is a non-interactive placeholder that displays a preview of the UI to visually communicate\n * that content is in the process of loading. Skeleton is used to provide a low fidelity\n * representation of the user interface (UI) before content appears on the page.\n * @see https://dialtone.dialpad.com/components/skeleton.html\n */\nexport default {\n  name: 'DtSkeleton',\n  components: {\n    DtSkeletonText,\n    DtSkeletonShape,\n    DtSkeletonListItem,\n    DtSkeletonParagraph,\n  },\n\n  props: {\n    /**\n     * Set this prop to have the skeleton render as multiple lines of text.\n     * Set only one option prop at a time.\n     */\n    paragraphOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a list item with an avatar and wrapping text.\n     * Set only one option prop at a time.\n     */\n    listItemOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a single line of text.\n     * Set only one option prop at a time.\n     */\n    textOption: {\n      type: Object,\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a specific shape.\n     * Set only one option prop at a time.\n     */\n    shapeOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * Descriptive label for the content.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n  },\n\n  computed: {\n    validationOptions () {\n      return {\n        paragraphOption: this.paragraphOption,\n        listItemOption: this.listItemOption,\n        textOption: this.textOption,\n        shapeOption: this.shapeOption,\n      };\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      handler: 'validator',\n    },\n  },\n\n  methods: {\n    validator () {\n      const filtered = Object.entries(this.validationOptions)\n        .filter(([_, option]) => option);\n      if (filtered.length >= 2) {\n        const errorMessage = `Use only one of ${filtered.map(([key]) => key).join(' | ')} options at the same time`;\n        console.error(errorMessage);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtSkeletonText","DtSkeletonShape","DtSkeletonListItem","DtSkeletonParagraph","filtered","_","option","errorMessage","key"],"mappings":"6VAiDA,MAAAA,EAAA,CACA,KAAA,aACA,WAAA,CACA,eAAAC,EAAA,QACA,gBAAAC,EAAA,QACA,mBAAAC,EAAA,QACA,oBAAAC,EAAA,OACA,EAEA,MAAA,CAKA,gBAAA,CACA,KAAA,CAAA,OAAA,OAAA,EACA,QAAA,IACA,EAMA,eAAA,CACA,KAAA,CAAA,OAAA,OAAA,EACA,QAAA,IACA,EAMA,WAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,YAAA,CACA,KAAA,CAAA,OAAA,OAAA,EACA,QAAA,IACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,UAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,CACA,EAEA,SAAA,CACA,mBAAA,CACA,MAAA,CACA,gBAAA,KAAA,gBACA,eAAA,KAAA,eACA,WAAA,KAAA,WACA,YAAA,KAAA,WACA,CACA,CACA,EAEA,MAAA,CACA,OAAA,CACA,UAAA,GACA,QAAA,WACA,CACA,EAEA,QAAA,CACA,WAAA,CACA,MAAAC,EAAA,OAAA,QAAA,KAAA,iBAAA,EACA,OAAA,CAAA,CAAAC,EAAAC,CAAA,IAAAA,CAAA,EACA,GAAAF,EAAA,QAAA,EAAA,CACA,MAAAG,EAAA,mBAAAH,EAAA,IAAA,CAAA,CAAAI,CAAA,IAAAA,CAAA,EAAA,KAAA,KAAA,CAAA,4BACA,QAAA,MAAAD,CAAA,CACA,CACA,CACA,CACA"}
+{"version":3,"file":"skeleton.cjs","sources":["../../../components/skeleton/skeleton.vue"],"sourcesContent":["<template>\n  <div\n    aria-busy=\"true\"\n    role=\"status\"\n    :aria-label=\"ariaLabel\"\n  >\n    <dt-skeleton-list-item\n      v-if=\"listItemOption\"\n      v-bind=\"listItemOption === true ? {} : listItemOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-shape\n      v-else-if=\"shapeOption\"\n      v-bind=\"shapeOption === true ? {} : shapeOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-paragraph\n      v-else-if=\"paragraphOption\"\n      v-bind=\"paragraphOption === true ? {} : paragraphOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-text\n      v-else\n      v-bind=\"textOption || {}\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n  </div>\n</template>\n\n<script>\nimport DtSkeletonShape from './skeleton-shape.vue';\nimport DtSkeletonListItem from './skeleton-list-item.vue';\nimport DtSkeletonParagraph from './skeleton-paragraph.vue';\nimport DtSkeletonText from './skeleton-text.vue';\n\n/**\n * Skeleton loader is a non-interactive placeholder that displays a preview of the UI to visually communicate\n * that content is in the process of loading. Skeleton is used to provide a low fidelity\n * representation of the user interface (UI) before content appears on the page.\n * @see https://dialtone.dialpad.com/components/skeleton.html\n */\nexport default {\n  name: 'DtSkeleton',\n  components: {\n    DtSkeletonText,\n    DtSkeletonShape,\n    DtSkeletonListItem,\n    DtSkeletonParagraph,\n  },\n\n  props: {\n    /**\n     * Set this prop to have the skeleton render as multiple lines of text.\n     * Set only one option prop at a time.\n     */\n    paragraphOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a list item with an avatar and wrapping text.\n     * Set only one option prop at a time.\n     */\n    listItemOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a single line of text.\n     * Set only one option prop at a time.\n     */\n    textOption: {\n      type: Object,\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a specific shape.\n     * Set only one option prop at a time.\n     */\n    shapeOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * Descriptive label for the content.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n  },\n\n  computed: {\n    validationOptions () {\n      return {\n        paragraphOption: this.paragraphOption,\n        listItemOption: this.listItemOption,\n        textOption: this.textOption,\n        shapeOption: this.shapeOption,\n      };\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      handler: 'validator',\n    },\n  },\n\n  methods: {\n    validator () {\n      const filtered = Object.entries(this.validationOptions)\n        .filter(([, option]) => option);\n      if (filtered.length >= 2) {\n        const errorMessage = `Use only one of ${filtered.map(([key]) => key).join(' | ')} options at the same time`;\n        console.error(errorMessage);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtSkeletonText","DtSkeletonShape","DtSkeletonListItem","DtSkeletonParagraph","filtered","option","errorMessage","key"],"mappings":"6VAiDA,MAAAA,EAAA,CACA,KAAA,aACA,WAAA,CACA,eAAAC,EAAAA,QACA,gBAAAC,EAAAA,QACA,mBAAAC,EAAAA,QACA,oBAAAC,EAAAA,OACA,EAEA,MAAA,CAKA,gBAAA,CACA,KAAA,CAAA,OAAA,OAAA,EACA,QAAA,IACA,EAMA,eAAA,CACA,KAAA,CAAA,OAAA,OAAA,EACA,QAAA,IACA,EAMA,WAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,YAAA,CACA,KAAA,CAAA,OAAA,OAAA,EACA,QAAA,IACA,EAKA,kBAAA,CACA,KAAA,OACA,QAAA,EACA,EAKA,UAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAUA,OAAA,CACA,KAAA,OACA,QAAA,CACA,CACA,EAEA,SAAA,CACA,mBAAA,CACA,MAAA,CACA,gBAAA,KAAA,gBACA,eAAA,KAAA,eACA,WAAA,KAAA,WACA,YAAA,KAAA,WACA,CACA,CACA,EAEA,MAAA,CACA,OAAA,CACA,UAAA,GACA,QAAA,WACA,CACA,EAEA,QAAA,CACA,WAAA,CACA,MAAAC,EAAA,OAAA,QAAA,KAAA,iBAAA,EACA,OAAA,CAAA,CAAA,CAAAC,CAAA,IAAAA,CAAA,EACA,GAAAD,EAAA,QAAA,EAAA,CACA,MAAAE,EAAA,mBAAAF,EAAA,IAAA,CAAA,CAAAG,CAAA,IAAAA,CAAA,EAAA,KAAA,KAAA,CAAA,4BACA,QAAA,MAAAD,CAAA,CACA,CACA,CACA,CACA"}

package/dist/vue2/lib/skeleton/skeleton.js

@@ -98,7 +98,7 @@ const p = {
   },
   methods: {
     validator() {
-      const a = Object.entries(this.validationOptions).filter(([t, e]) => e);
+      const a = Object.entries(this.validationOptions).filter(([, t]) => t);
       if (a.length >= 2) {
         const t = `Use only one of ${a.map(([e]) => e).join(" | ")} options at the same time`;
         console.error(t);

package/dist/vue2/lib/skeleton/skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.js","sources":["../../../components/skeleton/skeleton.vue"],"sourcesContent":["<template>\n  <div\n    aria-busy=\"true\"\n    role=\"status\"\n    :aria-label=\"ariaLabel\"\n  >\n    <dt-skeleton-list-item\n      v-if=\"listItemOption\"\n      v-bind=\"listItemOption === true ? {} : listItemOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-shape\n      v-else-if=\"shapeOption\"\n      v-bind=\"shapeOption === true ? {} : shapeOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-paragraph\n      v-else-if=\"paragraphOption\"\n      v-bind=\"paragraphOption === true ? {} : paragraphOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-text\n      v-else\n      v-bind=\"textOption || {}\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n  </div>\n</template>\n\n<script>\nimport DtSkeletonShape from './skeleton-shape.vue';\nimport DtSkeletonListItem from './skeleton-list-item.vue';\nimport DtSkeletonParagraph from './skeleton-paragraph.vue';\nimport DtSkeletonText from './skeleton-text.vue';\n\n/**\n * Skeleton loader is a non-interactive placeholder that displays a preview of the UI to visually communicate\n * that content is in the process of loading. Skeleton is used to provide a low fidelity\n * representation of the user interface (UI) before content appears on the page.\n * @see https://dialtone.dialpad.com/components/skeleton.html\n */\nexport default {\n  name: 'DtSkeleton',\n  components: {\n    DtSkeletonText,\n    DtSkeletonShape,\n    DtSkeletonListItem,\n    DtSkeletonParagraph,\n  },\n\n  props: {\n    /**\n     * Set this prop to have the skeleton render as multiple lines of text.\n     * Set only one option prop at a time.\n     */\n    paragraphOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a list item with an avatar and wrapping text.\n     * Set only one option prop at a time.\n     */\n    listItemOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a single line of text.\n     * Set only one option prop at a time.\n     */\n    textOption: {\n      type: Object,\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a specific shape.\n     * Set only one option prop at a time.\n     */\n    shapeOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * Descriptive label for the content.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n  },\n\n  computed: {\n    validationOptions () {\n      return {\n        paragraphOption: this.paragraphOption,\n        listItemOption: this.listItemOption,\n        textOption: this.textOption,\n        shapeOption: this.shapeOption,\n      };\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      handler: 'validator',\n    },\n  },\n\n  methods: {\n    validator () {\n      const filtered = Object.entries(this.validationOptions)\n        .filter(([_, option]) => option);\n      if (filtered.length >= 2) {\n        const errorMessage = `Use only one of ${filtered.map(([key]) => key).join(' | ')} options at the same time`;\n        console.error(errorMessage);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtSkeletonText","DtSkeletonShape","DtSkeletonListItem","DtSkeletonParagraph","filtered","_","option","errorMessage","key"],"mappings":";;;;;;AAiDA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA,gBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,qBAAAC;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,iBAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,gBAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,oBAAA;AACA,aAAA;AAAA,QACA,iBAAA,KAAA;AAAA,QACA,gBAAA,KAAA;AAAA,QACA,YAAA,KAAA;AAAA,QACA,aAAA,KAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,YAAA;AACA,YAAAC,IAAA,OAAA,QAAA,KAAA,iBAAA,EACA,OAAA,CAAA,CAAAC,GAAAC,CAAA,MAAAA,CAAA;AACA,UAAAF,EAAA,UAAA,GAAA;AACA,cAAAG,IAAA,mBAAAH,EAAA,IAAA,CAAA,CAAAI,CAAA,MAAAA,CAAA,EAAA,KAAA,KAAA,CAAA;AACA,gBAAA,MAAAD,CAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;"}
+{"version":3,"file":"skeleton.js","sources":["../../../components/skeleton/skeleton.vue"],"sourcesContent":["<template>\n  <div\n    aria-busy=\"true\"\n    role=\"status\"\n    :aria-label=\"ariaLabel\"\n  >\n    <dt-skeleton-list-item\n      v-if=\"listItemOption\"\n      v-bind=\"listItemOption === true ? {} : listItemOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-shape\n      v-else-if=\"shapeOption\"\n      v-bind=\"shapeOption === true ? {} : shapeOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-paragraph\n      v-else-if=\"paragraphOption\"\n      v-bind=\"paragraphOption === true ? {} : paragraphOption\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n    <dt-skeleton-text\n      v-else\n      v-bind=\"textOption || {}\"\n      :animation-duration=\"animationDuration\"\n      :animate=\"animate\"\n      :offset=\"offset\"\n    />\n  </div>\n</template>\n\n<script>\nimport DtSkeletonShape from './skeleton-shape.vue';\nimport DtSkeletonListItem from './skeleton-list-item.vue';\nimport DtSkeletonParagraph from './skeleton-paragraph.vue';\nimport DtSkeletonText from './skeleton-text.vue';\n\n/**\n * Skeleton loader is a non-interactive placeholder that displays a preview of the UI to visually communicate\n * that content is in the process of loading. Skeleton is used to provide a low fidelity\n * representation of the user interface (UI) before content appears on the page.\n * @see https://dialtone.dialpad.com/components/skeleton.html\n */\nexport default {\n  name: 'DtSkeleton',\n  components: {\n    DtSkeletonText,\n    DtSkeletonShape,\n    DtSkeletonListItem,\n    DtSkeletonParagraph,\n  },\n\n  props: {\n    /**\n     * Set this prop to have the skeleton render as multiple lines of text.\n     * Set only one option prop at a time.\n     */\n    paragraphOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a list item with an avatar and wrapping text.\n     * Set only one option prop at a time.\n     */\n    listItemOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a single line of text.\n     * Set only one option prop at a time.\n     */\n    textOption: {\n      type: Object,\n      default: null,\n    },\n\n    /**\n     * Set this prop to have the skeleton render as a specific shape.\n     * Set only one option prop at a time.\n     */\n    shapeOption: {\n      type: [Object, Boolean],\n      default: null,\n    },\n\n    /**\n     * Duration time of the animation (ms), set -1 for an infinite animation.\n     */\n    animationDuration: {\n      type: Number,\n      default: -1,\n    },\n\n    /**\n     * Descriptive label for the content.\n     */\n    ariaLabel: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * This property has higher priority than \"option.animate\"\n     * @values true, false\n     */\n    animate: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * RippleDuration controls how long the delay is for the animation of a\n     * placeholder 1000 pixels from the top of the page. Each placeholder\n     * from the top down will have a delay duration from 0 to this offset.\n     * The delay of each placeholder animation is based on how far down the page\n     * the placeholder is rendered. This is a linear relationship. The unit\n     * is milliseconds.\n     */\n    offset: {\n      type: Number,\n      default: 1,\n    },\n  },\n\n  computed: {\n    validationOptions () {\n      return {\n        paragraphOption: this.paragraphOption,\n        listItemOption: this.listItemOption,\n        textOption: this.textOption,\n        shapeOption: this.shapeOption,\n      };\n    },\n  },\n\n  watch: {\n    $props: {\n      immediate: true,\n      handler: 'validator',\n    },\n  },\n\n  methods: {\n    validator () {\n      const filtered = Object.entries(this.validationOptions)\n        .filter(([, option]) => option);\n      if (filtered.length >= 2) {\n        const errorMessage = `Use only one of ${filtered.map(([key]) => key).join(' | ')} options at the same time`;\n        console.error(errorMessage);\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtSkeletonText","DtSkeletonShape","DtSkeletonListItem","DtSkeletonParagraph","filtered","option","errorMessage","key"],"mappings":";;;;;;AAiDA,MAAAA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,IACA,gBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,qBAAAC;AAAA,EACA;AAAA,EAEA,OAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAKA,iBAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,gBAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,aAAA;AAAA,MACA,MAAA,CAAA,QAAA,OAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,mBAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA,IAKA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMA,SAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUA,QAAA;AAAA,MACA,MAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,UAAA;AAAA,IACA,oBAAA;AACA,aAAA;AAAA,QACA,iBAAA,KAAA;AAAA,QACA,gBAAA,KAAA;AAAA,QACA,YAAA,KAAA;AAAA,QACA,aAAA,KAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,OAAA;AAAA,IACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,SAAA;AAAA,IACA;AAAA,EACA;AAAA,EAEA,SAAA;AAAA,IACA,YAAA;AACA,YAAAC,IAAA,OAAA,QAAA,KAAA,iBAAA,EACA,OAAA,CAAA,CAAA,EAAAC,CAAA,MAAAA,CAAA;AACA,UAAAD,EAAA,UAAA,GAAA;AACA,cAAAE,IAAA,mBAAAF,EAAA,IAAA,CAAA,CAAAG,CAAA,MAAAA,CAAA,EAAA,KAAA,KAAA,CAAA;AACA,gBAAA,MAAAD,CAAA;AAAA,MACA;AAAA,IACA;AAAA,EACA;AACA;;;;;;;;;;"}

package/dist/vue2/lib/split-button/split-button-alpha.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"split-button-alpha.cjs","sources":["../../../components/split_button/split_button-alpha.vue"],"sourcesContent":["<template>\n  <dt-button\n    v-dt-tooltip=\"tooltipText\"\n    data-qa=\"dt-split-button-alpha\"\n    :active=\"active\"\n    :aria-label=\"ariaLabel\"\n    :assertive-on-focus=\"assertiveOnFocus\"\n    :class=\"`d-split-btn__alpha d-split-btn__alpha--${size}`\"\n    :disabled=\"disabled\"\n    :icon-position=\"iconPosition\"\n    :importance=\"importance\"\n    :kind=\"kind\"\n    :label-class=\"labelClass\"\n    :loading=\"loading\"\n    :size=\"size\"\n  >\n    <template #icon>\n      <slot\n        name=\"icon\"\n        :size=\"BUTTON_ICON_SIZES[size]\"\n      />\n    </template>\n    <slot name=\"default\" />\n  </dt-button>\n</template>\n\n<script>\nimport { BUTTON_ICON_SIZES, DtButton } from '@/components/button';\n\nexport default {\n  name: 'SplitButtonAlpha',\n\n  components: {\n    DtButton,\n  },\n\n  props: {\n    /**\n     * Determines whether the button should have active styling\n     */\n    active: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the button\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * The position of the icon slot within the button.\n     */\n    iconPosition: {\n      type: String,\n      default: 'left',\n    },\n\n    /**\n     * Used to customize the label container\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Whether the button should display a loading animation or not.\n     */\n    loading: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Text shown in tooltip when you hover the button\n     */\n    tooltipText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines whether a screenreader reads live updates of\n     * the button content to the user while the button is in focus.\n     */\n    assertiveOnFocus: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * HTML button disabled attribute\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The fill and outline of the button associated with its visual importance.\n     */\n    importance: {\n      type: String,\n      default: 'primary',\n    },\n\n    /**\n     * The color of the button.\n     */\n    kind: {\n      type: String,\n      default: 'default',\n    },\n\n    /**\n     * The size of the button.\n     */\n    size: {\n      type: String,\n      default: 'md',\n    },\n  },\n\n  data () {\n    return {\n      BUTTON_ICON_SIZES,\n    };\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","BUTTON_ICON_SIZES"],"mappings":"wPA6BAA,EAAA,CACA,KAAA,mBAEA,WAAA,CACA,SAAAC,EAAA,OACA,EAEA,MAAA,CAIA,OAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,MACA,EAKA,WAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,iBAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,SAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,WAAA,CACA,KAAA,OACA,QAAA,SACA,EAKA,KAAA,CACA,KAAA,OACA,QAAA,SACA,EAKA,KAAA,CACA,KAAA,OACA,QAAA,IACA,CACA,EAEA,MAAA,CACA,MAAA,CACA,kBAAAC,EAAA,iBACA,CACA,CACA"}
+{"version":3,"file":"split-button-alpha.cjs","sources":["../../../components/split_button/split_button-alpha.vue"],"sourcesContent":["<template>\n  <dt-button\n    v-dt-tooltip=\"tooltipText\"\n    data-qa=\"dt-split-button-alpha\"\n    :active=\"active\"\n    :aria-label=\"ariaLabel\"\n    :assertive-on-focus=\"assertiveOnFocus\"\n    :class=\"`d-split-btn__alpha d-split-btn__alpha--${size}`\"\n    :disabled=\"disabled\"\n    :icon-position=\"iconPosition\"\n    :importance=\"importance\"\n    :kind=\"kind\"\n    :label-class=\"labelClass\"\n    :loading=\"loading\"\n    :size=\"size\"\n  >\n    <template #icon>\n      <slot\n        name=\"icon\"\n        :size=\"BUTTON_ICON_SIZES[size]\"\n      />\n    </template>\n    <slot name=\"default\" />\n  </dt-button>\n</template>\n\n<script>\nimport { BUTTON_ICON_SIZES, DtButton } from '@/components/button';\n\nexport default {\n  name: 'SplitButtonAlpha',\n\n  components: {\n    DtButton,\n  },\n\n  props: {\n    /**\n     * Determines whether the button should have active styling\n     */\n    active: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the button\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * The position of the icon slot within the button.\n     */\n    iconPosition: {\n      type: String,\n      default: 'left',\n    },\n\n    /**\n     * Used to customize the label container\n     */\n    labelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Whether the button should display a loading animation or not.\n     */\n    loading: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Text shown in tooltip when you hover the button\n     */\n    tooltipText: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines whether a screenreader reads live updates of\n     * the button content to the user while the button is in focus.\n     */\n    assertiveOnFocus: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * HTML button disabled attribute\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The fill and outline of the button associated with its visual importance.\n     */\n    importance: {\n      type: String,\n      default: 'primary',\n    },\n\n    /**\n     * The color of the button.\n     */\n    kind: {\n      type: String,\n      default: 'default',\n    },\n\n    /**\n     * The size of the button.\n     */\n    size: {\n      type: String,\n      default: 'md',\n    },\n  },\n\n  data () {\n    return {\n      BUTTON_ICON_SIZES,\n    };\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","BUTTON_ICON_SIZES"],"mappings":"wPA6BAA,EAAA,CACA,KAAA,mBAEA,WAAA,CACA,SAAAC,EAAAA,OACA,EAEA,MAAA,CAIA,OAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,aAAA,CACA,KAAA,OACA,QAAA,MACA,EAKA,WAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,QAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,EACA,EAMA,iBAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,SAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,WAAA,CACA,KAAA,OACA,QAAA,SACA,EAKA,KAAA,CACA,KAAA,OACA,QAAA,SACA,EAKA,KAAA,CACA,KAAA,OACA,QAAA,IACA,CACA,EAEA,MAAA,CACA,MAAA,CACA,kBAAAC,EAAAA,iBACA,CACA,CACA"}

package/dist/vue2/lib/split-button/split-button-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"split-button-constants.cjs","sources":["../../../components/split_button/split_button_constants.js"],"sourcesContent":["export const SPLIT_BUTTON_ICON_SIZES = {\n  xs: '100',\n  sm: '100',\n  md: '200',\n  lg: '200',\n  xl: '300',\n};\n\nexport default {\n  SPLIT_BUTTON_ICON_SIZES,\n};\n"],"names":["SPLIT_BUTTON_ICON_SIZES","split_button_constants"],"mappings":"4GAAY,MAACA,EAA0B,CACrC,GAAI,MACJ,GAAI,MACJ,GAAI,MACJ,GAAI,MACJ,GAAI,KACN,EAEeC,EAAA,CACb,wBAAAD,CACF"}
+{"version":3,"file":"split-button-constants.cjs","sources":["../../../components/split_button/split_button_constants.js"],"sourcesContent":["export const SPLIT_BUTTON_ICON_SIZES = {\n  xs: '100',\n  sm: '100',\n  md: '200',\n  lg: '200',\n  xl: '300',\n};\n\nexport default {\n  SPLIT_BUTTON_ICON_SIZES,\n};\n"],"names":["SPLIT_BUTTON_ICON_SIZES","split_button_constants"],"mappings":"4GAAY,MAACA,EAA0B,CACrC,GAAI,MACJ,GAAI,MACJ,GAAI,MACJ,GAAI,MACJ,GAAI,KACN,EAEAC,EAAe,CACb,wBAAAD,CACF"}

package/dist/vue2/lib/split-button/split-button-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"split-button-constants.js","sources":["../../../components/split_button/split_button_constants.js"],"sourcesContent":["export const SPLIT_BUTTON_ICON_SIZES = {\n  xs: '100',\n  sm: '100',\n  md: '200',\n  lg: '200',\n  xl: '300',\n};\n\nexport default {\n  SPLIT_BUTTON_ICON_SIZES,\n};\n"],"names":["SPLIT_BUTTON_ICON_SIZES","split_button_constants"],"mappings":"AAAY,MAACA,IAA0B;AAAA,EACrC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEeC,IAAA;AAAA,EACb,yBAAAD;AACF;"}
+{"version":3,"file":"split-button-constants.js","sources":["../../../components/split_button/split_button_constants.js"],"sourcesContent":["export const SPLIT_BUTTON_ICON_SIZES = {\n  xs: '100',\n  sm: '100',\n  md: '200',\n  lg: '200',\n  xl: '300',\n};\n\nexport default {\n  SPLIT_BUTTON_ICON_SIZES,\n};\n"],"names":["SPLIT_BUTTON_ICON_SIZES","split_button_constants"],"mappings":"AAAY,MAACA,IAA0B;AAAA,EACrC,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEAC,IAAe;AAAA,EACb,yBAAAD;AACF;"}

package/dist/vue2/lib/split-button/split-button-omega.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"split-button-omega.cjs","sources":["../../../components/split_button/split_button-omega.vue"],"sourcesContent":["<template>\n  <dt-button\n    :id=\"id\"\n    v-dt-tooltip=\"tooltipText\"\n    data-qa=\"dt-split-button-omega\"\n    :active=\"active\"\n    :aria-label=\"ariaLabel\"\n    :class=\"`d-split-btn__omega d-split-btn__omega--${size}`\"\n    :disabled=\"disabled\"\n    :importance=\"importance\"\n    :kind=\"kind\"\n    :size=\"size\"\n  >\n    <template #icon>\n      <slot\n        name=\"icon\"\n        :size=\"SPLIT_BUTTON_ICON_SIZES[size]\"\n      >\n        <dt-icon-chevron-down :size=\"SPLIT_BUTTON_ICON_SIZES[size]\" />\n      </slot>\n    </template>\n  </dt-button>\n</template>\n\n<script>\nimport { SPLIT_BUTTON_ICON_SIZES } from './split_button_constants';\nimport { DtButton } from '@/components/button';\nimport { DtIconChevronDown } from '@dialpad/dialtone-icons/vue2';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n  name: 'SplitButtonOmega',\n  components: {\n    DtButton,\n    DtIconChevronDown,\n  },\n\n  props: {\n    /**\n     * Determines whether the button should have active styling\n     */\n    active: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the button\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * HTML button disabled attribute\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Element ID, useful in case you need to reference the button\n     * as an external anchor for popover\n     */\n    id: {\n      type: String,\n      default: getUniqueString(),\n    },\n\n    /**\n     * The fill and outline of the button associated with its visual importance.\n     */\n    importance: {\n      type: String,\n      default: 'primary',\n    },\n\n    /**\n     * The color of the button.\n     */\n    kind: {\n      type: String,\n      default: 'default',\n    },\n\n    /**\n     * The size of the button.\n     */\n    size: {\n      type: String,\n      default: 'md',\n    },\n\n    /**\n     * Text shown in tooltip when you hover the button\n     */\n    tooltipText: {\n      type: String,\n      default: '',\n    },\n  },\n\n  data () {\n    return {\n      SPLIT_BUTTON_ICON_SIZES,\n    };\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtIconChevronDown","getUniqueString","SPLIT_BUTTON_ICON_SIZES"],"mappings":"0UA8BAA,EAAA,CACA,KAAA,mBACA,WAAA,CACA,SAAAC,EAAA,QACA,kBAAAC,EAAA,iBACA,EAEA,MAAA,CAIA,OAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,SAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,GAAA,CACA,KAAA,OACA,QAAAC,EAAAA,gBAAA,CACA,EAKA,WAAA,CACA,KAAA,OACA,QAAA,SACA,EAKA,KAAA,CACA,KAAA,OACA,QAAA,SACA,EAKA,KAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,EACA,CACA,EAEA,MAAA,CACA,MAAA,CACA,wBAAAC,EAAA,uBACA,CACA,CACA"}
+{"version":3,"file":"split-button-omega.cjs","sources":["../../../components/split_button/split_button-omega.vue"],"sourcesContent":["<template>\n  <dt-button\n    :id=\"id\"\n    v-dt-tooltip=\"tooltipText\"\n    data-qa=\"dt-split-button-omega\"\n    :active=\"active\"\n    :aria-label=\"ariaLabel\"\n    :class=\"`d-split-btn__omega d-split-btn__omega--${size}`\"\n    :disabled=\"disabled\"\n    :importance=\"importance\"\n    :kind=\"kind\"\n    :size=\"size\"\n  >\n    <template #icon>\n      <slot\n        name=\"icon\"\n        :size=\"SPLIT_BUTTON_ICON_SIZES[size]\"\n      >\n        <dt-icon-chevron-down :size=\"SPLIT_BUTTON_ICON_SIZES[size]\" />\n      </slot>\n    </template>\n  </dt-button>\n</template>\n\n<script>\nimport { SPLIT_BUTTON_ICON_SIZES } from './split_button_constants';\nimport { DtButton } from '@/components/button';\nimport { DtIconChevronDown } from '@dialpad/dialtone-icons/vue2';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n  name: 'SplitButtonOmega',\n  components: {\n    DtButton,\n    DtIconChevronDown,\n  },\n\n  props: {\n    /**\n     * Determines whether the button should have active styling\n     */\n    active: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the button\n     */\n    ariaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * HTML button disabled attribute\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Element ID, useful in case you need to reference the button\n     * as an external anchor for popover\n     */\n    id: {\n      type: String,\n      default: getUniqueString(),\n    },\n\n    /**\n     * The fill and outline of the button associated with its visual importance.\n     */\n    importance: {\n      type: String,\n      default: 'primary',\n    },\n\n    /**\n     * The color of the button.\n     */\n    kind: {\n      type: String,\n      default: 'default',\n    },\n\n    /**\n     * The size of the button.\n     */\n    size: {\n      type: String,\n      default: 'md',\n    },\n\n    /**\n     * Text shown in tooltip when you hover the button\n     */\n    tooltipText: {\n      type: String,\n      default: '',\n    },\n  },\n\n  data () {\n    return {\n      SPLIT_BUTTON_ICON_SIZES,\n    };\n  },\n};\n</script>\n"],"names":["_sfc_main","DtButton","DtIconChevronDown","getUniqueString","SPLIT_BUTTON_ICON_SIZES"],"mappings":"0UA8BAA,EAAA,CACA,KAAA,mBACA,WAAA,CACA,SAAAC,EAAAA,QACA,kBAAAC,EAAAA,iBACA,EAEA,MAAA,CAIA,OAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,UAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,SAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,GAAA,CACA,KAAA,OACA,QAAAC,EAAAA,gBAAA,CACA,EAKA,WAAA,CACA,KAAA,OACA,QAAA,SACA,EAKA,KAAA,CACA,KAAA,OACA,QAAA,SACA,EAKA,KAAA,CACA,KAAA,OACA,QAAA,IACA,EAKA,YAAA,CACA,KAAA,OACA,QAAA,EACA,CACA,EAEA,MAAA,CACA,MAAA,CACA,wBAAAC,EAAAA,uBACA,CACA,CACA"}

package/dist/vue2/lib/split-button/split-button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"split-button.cjs","sources":["../../../components/split_button/split_button.vue"],"sourcesContent":["<template>\n  <span\n    data-qa=\"dt-split-button\"\n    class=\"d-split-btn\"\n    :style=\"{ width }\"\n  >\n    <split-button-alpha\n      v-bind=\"alphaButtonProps\"\n      ref=\"alphaButton\"\n      @click.native=\"$emit('alpha-clicked')\"\n    >\n      <template #icon=\"{ size: iconSize }\">\n        <!-- @slot Alpha (left) button icon slot -->\n        <slot\n          name=\"alphaIcon\"\n          :size=\"iconSize\"\n        />\n      </template>\n      <!-- @slot Default content slot -->\n      <slot name=\"default\" />\n    </split-button-alpha>\n    <!-- @slot Omega (right) content slot, overrides omega button styling and functionality completely -->\n    <slot name=\"omega\">\n      <dt-dropdown\n        v-if=\"$slots.dropdownList\"\n        :placement=\"dropdownPlacement\"\n        @click=\"isDropdownOpen = true\"\n        @opened=\"open => isDropdownOpen = open\"\n      >\n        <template #anchor=\"attrs\">\n          <split-button-omega\n            v-bind=\"{ ...attrs, ...omegaButtonProps }\"\n            :active=\"isDropdownOpen\"\n            @click.native=\"$emit('omega-clicked')\"\n          >\n            <template #icon=\"{ size: iconSize }\">\n              <!-- @slot Omega (right) button icon slot -->\n              <slot\n                name=\"omegaIcon\"\n                :size=\"iconSize\"\n              />\n            </template>\n          </split-button-omega>\n        </template>\n        <template #list=\"{ close }\">\n          <!-- @slot Built-in dropdown content slot, use of dt-list-item is highly recommended here. -->\n          <slot\n            name=\"dropdownList\"\n            :close=\"close\"\n          />\n        </template>\n      </dt-dropdown>\n\n      <split-button-omega\n        v-else\n        v-bind=\"omegaButtonProps\"\n        @click.native=\"$emit('omega-clicked')\"\n      >\n        <template #icon=\"{ size: iconSize }\">\n          <!-- @slot Omega (right) button icon slot -->\n          <slot\n            name=\"omegaIcon\"\n            :size=\"iconSize\"\n          />\n        </template>\n      </split-button-omega>\n    </slot>\n  </span>\n</template>\n\n<script>\nimport {\n  BUTTON_IMPORTANCE_MODIFIERS,\n  BUTTON_KIND_MODIFIERS,\n  BUTTON_SIZE_MODIFIERS,\n  ICON_POSITION_MODIFIERS,\n} from '@/components/button';\nimport SplitButtonAlpha from './split_button-alpha.vue';\nimport SplitButtonOmega from './split_button-omega.vue';\nimport { DtDropdown } from '@/components/dropdown';\nimport { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n  name: 'DtSplitButton',\n\n  components: {\n    SplitButtonOmega,\n    DtDropdown,\n    SplitButtonAlpha,\n  },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Determines whether the alpha button should have active styling\n     * @values true, false\n     */\n    alphaActive: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the alpha button\n     */\n    alphaAriaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * The position of the icon slot within the alpha button.\n     * @values left, right, top, bottom\n     */\n    alphaIconPosition: {\n      type: String,\n      default: 'left',\n      validator: (position) => Object.keys(ICON_POSITION_MODIFIERS).includes(position),\n    },\n\n    /**\n     * Used to customize the alpha label container\n     */\n    alphaLabelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Whether the alpha button should display a loading animation or not.\n     * @values true, false\n     */\n    alphaLoading: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Text shown in tooltip when you hover the alpha button,\n     * required if no content is passed to default slot\n     */\n    alphaTooltipText: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Determines whether a screenreader reads live updates of\n     * the button content to the user while the button\n     * is in focus.\n     * @values true, false\n     */\n    assertiveOnFocus: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * HTML button disabled attribute\n     * <a class=\"d-link\" href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#disabled\" target=\"_blank\">\n     *  (Reference)\n     * </a>\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The direction the dropdown displays relative to the anchor.\n     * @values top, top-start, top-end, right, right-start, right-end, left, left-start, left-end, bottom, bottom-start, bottom-end, auto, auto-start, auto-end\n     */\n    dropdownPlacement: {\n      type: String,\n      default: 'bottom-end',\n    },\n\n    /**\n     * The fill and outline of the button associated with its visual importance.\n     * @values clear, outlined, primary\n     */\n    importance: {\n      type: String,\n      default: 'primary',\n      validator: (i) => Object.keys(BUTTON_IMPORTANCE_MODIFIERS).includes(i),\n    },\n\n    /**\n     * The color of the button.\n     * @values default, muted, danger, inverted\n     */\n    kind: {\n      type: String,\n      default: 'default',\n      validator: (k) => Object.keys(BUTTON_KIND_MODIFIERS).includes(k),\n    },\n\n    /**\n     * Determines whether the omega button should have active styling\n     * @values true, false\n     */\n    omegaActive: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the omega button\n     */\n    omegaAriaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Element ID, useful in case you need to reference the button\n     * as an external anchor for popover\n     */\n    omegaId: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Text shown in tooltip when you hover the omega button,\n     * required as it is an icon only button\n     */\n    omegaTooltipText: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * The size of the button.\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(BUTTON_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * Button width, accepts\n     * <a class=\"d-link\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/width\" target=\"_blank\">\n     *   CSS width attribute\n     * </a>\n     * values\n     */\n    width: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: [\n    /**\n     * Native alpha button click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'alpha-clicked',\n\n    /**\n     * Native omega button click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'omega-clicked',\n  ],\n\n  data () {\n    return {\n      isDropdownOpen: false,\n    };\n  },\n\n  computed: {\n    alphaButtonProps () {\n      return {\n        active: this.alphaActive,\n        ariaLabel: this.alphaAriaLabel,\n        assertiveOnFocus: this.assertiveOnFocus,\n        disabled: this.disabled,\n        iconPosition: this.alphaIconPosition,\n        labelClass: this.alphaLabelClass,\n        loading: this.alphaLoading,\n        importance: this.importance,\n        kind: this.kind,\n        size: this.size,\n        tooltipText: this.alphaTooltipText,\n        class: this.$attrs.class,\n      };\n    },\n\n    omegaButtonProps () {\n      return {\n        id: this.omegaId,\n        active: this.omegaActive,\n        ariaLabel: this.omegaAriaLabel,\n        disabled: this.disabled,\n        importance: this.importance,\n        kind: this.kind,\n        size: this.size,\n        tooltipText: this.omegaTooltipText,\n        class: this.$attrs.class,\n      };\n    },\n\n    defaultSlotHasContent () {\n      return this.$scopedSlots.default && this.$scopedSlots.default() && this.$scopedSlots.default()[0]?.text?.trim();\n    },\n\n    omegaSlotIsSet () {\n      return this.$scopedSlots.omega && this.$scopedSlots.omega();\n    },\n  },\n\n  created () {\n    this.validateProps();\n  },\n\n  updated () {\n    this.validateProps();\n  },\n\n  mounted () {\n    warnIfUnmounted(this.$el, this.$options.name);\n  },\n\n  methods: {\n    validateProps () {\n      this.validateAlphaButtonProps();\n      this.validateOmegaButtonProps();\n    },\n\n    validateAlphaButtonProps () {\n      if (this.defaultSlotHasContent) return;\n\n      // This can't be a computed prop due to reactivity issues.\n      const isAlphaIconSet = this.$refs.alphaButton?.$scopedSlots.icon && this.$refs.alphaButton.$scopedSlots.icon();\n\n      if (isAlphaIconSet && !this.alphaTooltipText) {\n        console.warn('alpha-tooltip-text prop must be set if alpha button has an icon only');\n      }\n    },\n\n    validateOmegaButtonProps () {\n      if (this.omegaSlotIsSet) return;\n\n      if (!this.omegaTooltipText) {\n        console.warn('omega-tooltip-text prop is required as it is an icon-only button');\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","SplitButtonOmega","DtDropdown","SplitButtonAlpha","position","ICON_POSITION_MODIFIERS","i","BUTTON_IMPORTANCE_MODIFIERS","k","BUTTON_KIND_MODIFIERS","s","BUTTON_SIZE_MODIFIERS","_b","_a","warnIfUnmounted"],"mappings":"0ZAkFA,MAAAA,EAAA,CACA,KAAA,gBAEA,WAAA,CACA,iBAAAC,EAAA,QACA,WAAAC,EAAA,QACA,iBAAAC,EAAA,OACA,EAEA,aAAA,GAEA,MAAA,CAKA,YAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,eAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,kBAAA,CACA,KAAA,OACA,QAAA,OACA,UAAAC,GAAA,OAAA,KAAAC,yBAAA,EAAA,SAAAD,CAAA,CACA,EAKA,gBAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAMA,aAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,iBAAA,CACA,KAAA,OACA,QAAA,MACA,EAQA,iBAAA,CACA,KAAA,QACA,QAAA,EACA,EASA,SAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,kBAAA,CACA,KAAA,OACA,QAAA,YACA,EAMA,WAAA,CACA,KAAA,OACA,QAAA,UACA,UAAAE,GAAA,OAAA,KAAAC,6BAAA,EAAA,SAAAD,CAAA,CACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,UACA,UAAAE,GAAA,OAAA,KAAAC,uBAAA,EAAA,SAAAD,CAAA,CACA,EAMA,YAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,eAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,QAAA,CACA,KAAA,OACA,QAAA,MACA,EAMA,iBAAA,CACA,KAAA,OACA,QAAA,MACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAE,GAAA,OAAA,KAAAC,uBAAA,EAAA,SAAAD,CAAA,CACA,EASA,MAAA,CACA,KAAA,OACA,QAAA,IACA,CACA,EAEA,MAAA,CAOA,gBAQA,eACA,EAEA,MAAA,CACA,MAAA,CACA,eAAA,EACA,CACA,EAEA,SAAA,CACA,kBAAA,CACA,MAAA,CACA,OAAA,KAAA,YACA,UAAA,KAAA,eACA,iBAAA,KAAA,iBACA,SAAA,KAAA,SACA,aAAA,KAAA,kBACA,WAAA,KAAA,gBACA,QAAA,KAAA,aACA,WAAA,KAAA,WACA,KAAA,KAAA,KACA,KAAA,KAAA,KACA,YAAA,KAAA,iBACA,MAAA,KAAA,OAAA,KACA,CACA,EAEA,kBAAA,CACA,MAAA,CACA,GAAA,KAAA,QACA,OAAA,KAAA,YACA,UAAA,KAAA,eACA,SAAA,KAAA,SACA,WAAA,KAAA,WACA,KAAA,KAAA,KACA,KAAA,KAAA,KACA,YAAA,KAAA,iBACA,MAAA,KAAA,OAAA,KACA,CACA,EAEA,uBAAA,SACA,OAAA,KAAA,aAAA,SAAA,KAAA,aAAA,QAAA,KAAAE,GAAAC,EAAA,KAAA,aAAA,QAAA,EAAA,CAAA,IAAA,YAAAA,EAAA,OAAA,YAAAD,EAAA,OACA,EAEA,gBAAA,CACA,OAAA,KAAA,aAAA,OAAA,KAAA,aAAA,OACA,CACA,EAEA,SAAA,CACA,KAAA,cAAA,CACA,EAEA,SAAA,CACA,KAAA,cAAA,CACA,EAEA,SAAA,CACAE,EAAA,gBAAA,KAAA,IAAA,KAAA,SAAA,IAAA,CACA,EAEA,QAAA,CACA,eAAA,CACA,KAAA,yBAAA,EACA,KAAA,yBAAA,CACA,EAEA,0BAAA,OACA,GAAA,KAAA,sBAAA,SAGAD,EAAA,KAAA,MAAA,cAAA,YAAAA,EAAA,aAAA,OAAA,KAAA,MAAA,YAAA,aAAA,KAAA,GAEA,CAAA,KAAA,kBACA,QAAA,KAAA,sEAAA,CAEA,EAEA,0BAAA,CACA,KAAA,gBAEA,KAAA,kBACA,QAAA,KAAA,kEAAA,CAEA,CACA,CACA"}
+{"version":3,"file":"split-button.cjs","sources":["../../../components/split_button/split_button.vue"],"sourcesContent":["<template>\n  <span\n    data-qa=\"dt-split-button\"\n    class=\"d-split-btn\"\n    :style=\"{ width }\"\n  >\n    <split-button-alpha\n      v-bind=\"alphaButtonProps\"\n      ref=\"alphaButton\"\n      @click.native=\"$emit('alpha-clicked')\"\n    >\n      <template #icon=\"{ size: iconSize }\">\n        <!-- @slot Alpha (left) button icon slot -->\n        <slot\n          name=\"alphaIcon\"\n          :size=\"iconSize\"\n        />\n      </template>\n      <!-- @slot Default content slot -->\n      <slot name=\"default\" />\n    </split-button-alpha>\n    <!-- @slot Omega (right) content slot, overrides omega button styling and functionality completely -->\n    <slot name=\"omega\">\n      <dt-dropdown\n        v-if=\"$slots.dropdownList\"\n        :placement=\"dropdownPlacement\"\n        @click=\"isDropdownOpen = true\"\n        @opened=\"open => isDropdownOpen = open\"\n      >\n        <template #anchor=\"attrs\">\n          <split-button-omega\n            v-bind=\"{ ...attrs, ...omegaButtonProps }\"\n            :active=\"isDropdownOpen\"\n            @click.native=\"$emit('omega-clicked')\"\n          >\n            <template #icon=\"{ size: iconSize }\">\n              <!-- @slot Omega (right) button icon slot -->\n              <slot\n                name=\"omegaIcon\"\n                :size=\"iconSize\"\n              />\n            </template>\n          </split-button-omega>\n        </template>\n        <template #list=\"{ close }\">\n          <!-- @slot Built-in dropdown content slot, use of dt-list-item is highly recommended here. -->\n          <slot\n            name=\"dropdownList\"\n            :close=\"close\"\n          />\n        </template>\n      </dt-dropdown>\n\n      <split-button-omega\n        v-else\n        v-bind=\"omegaButtonProps\"\n        @click.native=\"$emit('omega-clicked')\"\n      >\n        <template #icon=\"{ size: iconSize }\">\n          <!-- @slot Omega (right) button icon slot -->\n          <slot\n            name=\"omegaIcon\"\n            :size=\"iconSize\"\n          />\n        </template>\n      </split-button-omega>\n    </slot>\n  </span>\n</template>\n\n<script>\nimport {\n  BUTTON_IMPORTANCE_MODIFIERS,\n  BUTTON_KIND_MODIFIERS,\n  BUTTON_SIZE_MODIFIERS,\n  ICON_POSITION_MODIFIERS,\n} from '@/components/button';\nimport SplitButtonAlpha from './split_button-alpha.vue';\nimport SplitButtonOmega from './split_button-omega.vue';\nimport { DtDropdown } from '@/components/dropdown';\nimport { warnIfUnmounted } from '@/common/utils';\n\nexport default {\n  name: 'DtSplitButton',\n\n  components: {\n    SplitButtonOmega,\n    DtDropdown,\n    SplitButtonAlpha,\n  },\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Determines whether the alpha button should have active styling\n     * @values true, false\n     */\n    alphaActive: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the alpha button\n     */\n    alphaAriaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * The position of the icon slot within the alpha button.\n     * @values left, right, top, bottom\n     */\n    alphaIconPosition: {\n      type: String,\n      default: 'left',\n      validator: (position) => Object.keys(ICON_POSITION_MODIFIERS).includes(position),\n    },\n\n    /**\n     * Used to customize the alpha label container\n     */\n    alphaLabelClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Whether the alpha button should display a loading animation or not.\n     * @values true, false\n     */\n    alphaLoading: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Text shown in tooltip when you hover the alpha button,\n     * required if no content is passed to default slot\n     */\n    alphaTooltipText: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Determines whether a screenreader reads live updates of\n     * the button content to the user while the button\n     * is in focus.\n     * @values true, false\n     */\n    assertiveOnFocus: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * HTML button disabled attribute\n     * <a class=\"d-link\" href=\"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#disabled\" target=\"_blank\">\n     *  (Reference)\n     * </a>\n     * @values true, false\n     */\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * The direction the dropdown displays relative to the anchor.\n     * @values top, top-start, top-end, right, right-start, right-end, left, left-start, left-end, bottom, bottom-start, bottom-end, auto, auto-start, auto-end\n     */\n    dropdownPlacement: {\n      type: String,\n      default: 'bottom-end',\n    },\n\n    /**\n     * The fill and outline of the button associated with its visual importance.\n     * @values clear, outlined, primary\n     */\n    importance: {\n      type: String,\n      default: 'primary',\n      validator: (i) => Object.keys(BUTTON_IMPORTANCE_MODIFIERS).includes(i),\n    },\n\n    /**\n     * The color of the button.\n     * @values default, muted, danger, inverted\n     */\n    kind: {\n      type: String,\n      default: 'default',\n      validator: (k) => Object.keys(BUTTON_KIND_MODIFIERS).includes(k),\n    },\n\n    /**\n     * Determines whether the omega button should have active styling\n     * @values true, false\n     */\n    omegaActive: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Descriptive label for the omega button\n     */\n    omegaAriaLabel: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Element ID, useful in case you need to reference the button\n     * as an external anchor for popover\n     */\n    omegaId: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * Text shown in tooltip when you hover the omega button,\n     * required as it is an icon only button\n     */\n    omegaTooltipText: {\n      type: String,\n      default: undefined,\n    },\n\n    /**\n     * The size of the button.\n     * @values xs, sm, md, lg, xl\n     */\n    size: {\n      type: String,\n      default: 'md',\n      validator: (s) => Object.keys(BUTTON_SIZE_MODIFIERS).includes(s),\n    },\n\n    /**\n     * Button width, accepts\n     * <a class=\"d-link\" href=\"https://developer.mozilla.org/en-US/docs/Web/CSS/width\" target=\"_blank\">\n     *   CSS width attribute\n     * </a>\n     * values\n     */\n    width: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: [\n    /**\n     * Native alpha button click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'alpha-clicked',\n\n    /**\n     * Native omega button click event\n     *\n     * @event click\n     * @type {PointerEvent | KeyboardEvent}\n     */\n    'omega-clicked',\n  ],\n\n  data () {\n    return {\n      isDropdownOpen: false,\n    };\n  },\n\n  computed: {\n    alphaButtonProps () {\n      return {\n        active: this.alphaActive,\n        ariaLabel: this.alphaAriaLabel,\n        assertiveOnFocus: this.assertiveOnFocus,\n        disabled: this.disabled,\n        iconPosition: this.alphaIconPosition,\n        labelClass: this.alphaLabelClass,\n        loading: this.alphaLoading,\n        importance: this.importance,\n        kind: this.kind,\n        size: this.size,\n        tooltipText: this.alphaTooltipText,\n        class: this.$attrs.class,\n      };\n    },\n\n    omegaButtonProps () {\n      return {\n        id: this.omegaId,\n        active: this.omegaActive,\n        ariaLabel: this.omegaAriaLabel,\n        disabled: this.disabled,\n        importance: this.importance,\n        kind: this.kind,\n        size: this.size,\n        tooltipText: this.omegaTooltipText,\n        class: this.$attrs.class,\n      };\n    },\n\n    defaultSlotHasContent () {\n      return this.$scopedSlots.default && this.$scopedSlots.default() && this.$scopedSlots.default()[0]?.text?.trim();\n    },\n\n    omegaSlotIsSet () {\n      return this.$scopedSlots.omega && this.$scopedSlots.omega();\n    },\n  },\n\n  created () {\n    this.validateProps();\n  },\n\n  updated () {\n    this.validateProps();\n  },\n\n  mounted () {\n    warnIfUnmounted(this.$el, this.$options.name);\n  },\n\n  methods: {\n    validateProps () {\n      this.validateAlphaButtonProps();\n      this.validateOmegaButtonProps();\n    },\n\n    validateAlphaButtonProps () {\n      if (this.defaultSlotHasContent) return;\n\n      // This can't be a computed prop due to reactivity issues.\n      const isAlphaIconSet = this.$refs.alphaButton?.$scopedSlots.icon && this.$refs.alphaButton.$scopedSlots.icon();\n\n      if (isAlphaIconSet && !this.alphaTooltipText) {\n        console.warn('alpha-tooltip-text prop must be set if alpha button has an icon only');\n      }\n    },\n\n    validateOmegaButtonProps () {\n      if (this.omegaSlotIsSet) return;\n\n      if (!this.omegaTooltipText) {\n        console.warn('omega-tooltip-text prop is required as it is an icon-only button');\n      }\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","SplitButtonOmega","DtDropdown","SplitButtonAlpha","position","ICON_POSITION_MODIFIERS","i","BUTTON_IMPORTANCE_MODIFIERS","k","BUTTON_KIND_MODIFIERS","s","BUTTON_SIZE_MODIFIERS","_b","_a","warnIfUnmounted"],"mappings":"0ZAkFA,MAAAA,EAAA,CACA,KAAA,gBAEA,WAAA,CACA,iBAAAC,EAAAA,QACA,WAAAC,EAAAA,QACA,iBAAAC,EAAAA,OACA,EAEA,aAAA,GAEA,MAAA,CAKA,YAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,eAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,kBAAA,CACA,KAAA,OACA,QAAA,OACA,UAAAC,GAAA,OAAA,KAAAC,yBAAA,EAAA,SAAAD,CAAA,CACA,EAKA,gBAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAMA,aAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,iBAAA,CACA,KAAA,OACA,QAAA,MACA,EAQA,iBAAA,CACA,KAAA,QACA,QAAA,EACA,EASA,SAAA,CACA,KAAA,QACA,QAAA,EACA,EAMA,kBAAA,CACA,KAAA,OACA,QAAA,YACA,EAMA,WAAA,CACA,KAAA,OACA,QAAA,UACA,UAAAE,GAAA,OAAA,KAAAC,6BAAA,EAAA,SAAAD,CAAA,CACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,UACA,UAAAE,GAAA,OAAA,KAAAC,uBAAA,EAAA,SAAAD,CAAA,CACA,EAMA,YAAA,CACA,KAAA,QACA,QAAA,EACA,EAKA,eAAA,CACA,KAAA,OACA,QAAA,IACA,EAMA,QAAA,CACA,KAAA,OACA,QAAA,MACA,EAMA,iBAAA,CACA,KAAA,OACA,QAAA,MACA,EAMA,KAAA,CACA,KAAA,OACA,QAAA,KACA,UAAAE,GAAA,OAAA,KAAAC,uBAAA,EAAA,SAAAD,CAAA,CACA,EASA,MAAA,CACA,KAAA,OACA,QAAA,IACA,CACA,EAEA,MAAA,CAOA,gBAQA,eACA,EAEA,MAAA,CACA,MAAA,CACA,eAAA,EACA,CACA,EAEA,SAAA,CACA,kBAAA,CACA,MAAA,CACA,OAAA,KAAA,YACA,UAAA,KAAA,eACA,iBAAA,KAAA,iBACA,SAAA,KAAA,SACA,aAAA,KAAA,kBACA,WAAA,KAAA,gBACA,QAAA,KAAA,aACA,WAAA,KAAA,WACA,KAAA,KAAA,KACA,KAAA,KAAA,KACA,YAAA,KAAA,iBACA,MAAA,KAAA,OAAA,KACA,CACA,EAEA,kBAAA,CACA,MAAA,CACA,GAAA,KAAA,QACA,OAAA,KAAA,YACA,UAAA,KAAA,eACA,SAAA,KAAA,SACA,WAAA,KAAA,WACA,KAAA,KAAA,KACA,KAAA,KAAA,KACA,YAAA,KAAA,iBACA,MAAA,KAAA,OAAA,KACA,CACA,EAEA,uBAAA,SACA,OAAA,KAAA,aAAA,SAAA,KAAA,aAAA,QAAA,KAAAE,GAAAC,EAAA,KAAA,aAAA,QAAA,EAAA,CAAA,IAAA,YAAAA,EAAA,OAAA,YAAAD,EAAA,OACA,EAEA,gBAAA,CACA,OAAA,KAAA,aAAA,OAAA,KAAA,aAAA,MAAA,CACA,CACA,EAEA,SAAA,CACA,KAAA,cAAA,CACA,EAEA,SAAA,CACA,KAAA,cAAA,CACA,EAEA,SAAA,CACAE,EAAAA,gBAAA,KAAA,IAAA,KAAA,SAAA,IAAA,CACA,EAEA,QAAA,CACA,eAAA,CACA,KAAA,yBAAA,EACA,KAAA,yBAAA,CACA,EAEA,0BAAA,OACA,GAAA,KAAA,sBAAA,SAGAD,EAAA,KAAA,MAAA,cAAA,YAAAA,EAAA,aAAA,OAAA,KAAA,MAAA,YAAA,aAAA,KAAA,GAEA,CAAA,KAAA,kBACA,QAAA,KAAA,sEAAA,CAEA,EAEA,0BAAA,CACA,KAAA,gBAEA,KAAA,kBACA,QAAA,KAAA,kEAAA,CAEA,CACA,CACA"}