@dialpad/dialtone-vue 3.18.0 → 3.19.1

package/dist/emoji.common.js

@@ -1,7 +1,7 @@
 /******/ (() => { // webpackBootstrap
 /******/ 	var __webpack_modules__ = ({
 
-/***/ 511:
+/***/ 141:
 /***/ ((module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
@@ -18,7 +18,7 @@ __webpack_require__.r(__webpack_exports__);
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, ".skeleton-placeholder{display:flex;stroke:none;fill:var(--placeholder-from-color,var(--black-075));background:var(--placeholder-from-color,var(--black-075))}.skeleton-placeholder--animate{animation-name:placeholder-throb;animation-iteration-count:infinite}@keyframes placeholder-throb{10%{fill:var(--placeholder-from-color,var(--black-075));background:var(--placeholder-from-color,var(--black-075))}50%{fill:var(--placeholder-to-color,var(--black-025));background:var(--placeholder-to-color,var(--black-025))}90%{fill:var(--placeholder-from-color,var(--black-075));background:var(--placeholder-from-color,var(--black-075))}}", ""]);
+___CSS_LOADER_EXPORT___.push([module.id, ".skeleton-placeholder{display:flex;stroke:none;fill:var(--placeholder-from-color,var(--black-300));background:var(--placeholder-from-color,var(--black-300))}.skeleton-placeholder--animate{animation-name:placeholder-throb;animation-iteration-count:infinite}@keyframes placeholder-throb{10%{fill:var(--placeholder-from-color,var(--black-300));background:var(--placeholder-from-color,var(--black-300))}50%{fill:var(--placeholder-to-color,var(--black-100));background:var(--placeholder-to-color,var(--black-100))}90%{fill:var(--placeholder-from-color,var(--black-300));background:var(--placeholder-from-color,var(--black-300))}}", ""]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -177,19 +177,19 @@ exports.Z = (sfc, props) => {
 
 /***/ }),
 
-/***/ 878:
+/***/ 309:
 /***/ ((module, __unused_webpack_exports, __webpack_require__) => {
 
 // style-loader: Adds some css to the DOM by adding a <style> tag
 
 // load the styles
-var content = __webpack_require__(511);
+var content = __webpack_require__(141);
 if(content.__esModule) content = content.default;
 if(typeof content === 'string') content = [[module.id, content, '']];
 if(content.locals) module.exports = content.locals;
 // add the styles to the DOM
 var add = (__webpack_require__(402)/* ["default"] */ .Z)
-var update = add("6f5d0b60", content, true, {"sourceMap":false,"shadowMode":false});
+var update = add("3230f382", content, true, {"sourceMap":false,"shadowMode":false});
 
 /***/ }),
 
@@ -780,7 +780,7 @@ function findEmojis(textContent) {
 }
 ;// CONCATENATED MODULE: external {"commonjs":"vue","commonjs2":"vue","root":"Vue"}
 const external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject = require("vue");
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/emoji/emoji.vue?vue&type=template&id=334ba6aa
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/emoji/emoji.vue?vue&type=template&id=a9cdd478
 
 const _hoisted_1 = ["aria-label", "alt", "title", "src"];
 function render(_ctx, _cache, $props, $setup, $data, $options) {
@@ -811,7 +811,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     })
   }, null, 42, _hoisted_1), [[external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.vShow, !$data.imgLoading]])], 2);
 }
-;// CONCATENATED MODULE: ./components/emoji/emoji.vue?vue&type=template&id=334ba6aa
+;// CONCATENATED MODULE: ./components/emoji/emoji.vue?vue&type=template&id=a9cdd478
 
 ;// CONCATENATED MODULE: ./components/emoji/emoji_constants.js
 const EMOJI_SIZES = {
@@ -828,10 +828,10 @@ const EMOJI_SIZES = {
 /* harmony default export */ const emoji_constants = ({
   EMOJI_SIZES
 });
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton.vue?vue&type=template&id=293e767b
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton.vue?vue&type=template&id=47dbc65e
 
-const skeletonvue_type_template_id_293e767b_hoisted_1 = ["aria-label"];
-function skeletonvue_type_template_id_293e767b_render(_ctx, _cache, $props, $setup, $data, $options) {
+const skeletonvue_type_template_id_47dbc65e_hoisted_1 = ["aria-label"];
+function skeletonvue_type_template_id_47dbc65e_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_skeleton_list_item = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-skeleton-list-item");
 
   const _component_dt_skeleton_shape = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-skeleton-shape");
@@ -868,13 +868,13 @@ function skeletonvue_type_template_id_293e767b_render(_ctx, _cache, $props, $set
     "animation-duration": $props.animationDuration,
     animate: $props.animate,
     offset: $props.offset
-  }), null, 16, ["animation-duration", "animate", "offset"]))], 8, skeletonvue_type_template_id_293e767b_hoisted_1);
+  }), null, 16, ["animation-duration", "animate", "offset"]))], 8, skeletonvue_type_template_id_47dbc65e_hoisted_1);
 }
-;// CONCATENATED MODULE: ./components/skeleton/skeleton.vue?vue&type=template&id=293e767b
+;// CONCATENATED MODULE: ./components/skeleton/skeleton.vue?vue&type=template&id=47dbc65e
 
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-shape.vue?vue&type=template&id=9cb05e20
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-shape.vue?vue&type=template&id=afabf0b6
 
-function skeleton_shapevue_type_template_id_9cb05e20_render(_ctx, _cache, $props, $setup, $data, $options) {
+function skeleton_shapevue_type_template_id_afabf0b6_render(_ctx, _cache, $props, $setup, $data, $options) {
   return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", {
     ref: "skeleton",
     "data-qa": "skeleton-shape",
@@ -884,7 +884,7 @@ function skeleton_shapevue_type_template_id_9cb05e20_render(_ctx, _cache, $props
     style: (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.normalizeStyle)($options.shapeStyles)
   }, null, 6);
 }
-;// CONCATENATED MODULE: ./components/skeleton/skeleton-shape.vue?vue&type=template&id=9cb05e20
+;// CONCATENATED MODULE: ./components/skeleton/skeleton-shape.vue?vue&type=template&id=afabf0b6
 
 ;// CONCATENATED MODULE: ./components/skeleton/skeleton_constants.js
 // NOTE: RippleDuration controls how long the delay is for the animation
@@ -917,6 +917,10 @@ const SKELETON_HEADING_HEIGHTS = {
 });
 ;// CONCATENATED MODULE: ./common/mixins/skeleton.js
 
+/**
+ * @displayName Skeleton Animation Mixin
+ */
+
 /* harmony default export */ const skeleton = ({
   computed: {
     skeletonOffset() {
@@ -956,27 +960,58 @@ const SKELETON_HEADING_HEIGHTS = {
   name: 'DtSkeletonShape',
   mixins: [skeleton],
   props: {
+    /**
+     * Defines the shape of the skeleton, accepts circle or square.
+     * @values circle, square
+     */
     shape: {
       type: String,
       default: 'circle',
       validator: shape => Object.keys(SKELETON_SHAPES).includes(shape)
     },
+
+    /**
+     * Size of the shape
+     * @values xs, sm, md, lg, xl
+     */
     size: {
       type: String,
       default: 'md'
     },
+
+    /**
+     * Duration time of the animation (ms), set -1 for an infinite animation.
+     */
     animationDuration: {
       type: Number,
       default: -1
     },
+
+    /**
+     * This property has higher priority than "option.animate"
+     * @values true, false
+     */
     animate: {
       type: Boolean,
       default: true
     },
+
+    /**
+     * RippleDuration controls how long the delay is for the animation of a
+     * placeholder 1000 pixels from the top of the page. Each placeholder
+     * from the top down will have a delay duration from 0 to this offset.
+     * The delay of each placeholder animation is based on how far down the page
+     * the placeholder is rendered. This is a linear relationship. The unit
+     * is milliseconds.
+     */
     offset: {
       type: Number,
       default: 1
     },
+
+    /**
+     * Additional class name for the content.
+     */
     contentClass: {
       type: [String, Object, Array],
       default: ''
@@ -1012,15 +1047,15 @@ var exportHelper = __webpack_require__(744);
 
 
 ;
-const __exports__ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeleton_shapevue_type_script_lang_js, [['render',skeleton_shapevue_type_template_id_9cb05e20_render]])
+const __exports__ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeleton_shapevue_type_script_lang_js, [['render',skeleton_shapevue_type_template_id_afabf0b6_render]])
 
 /* harmony default export */ const skeleton_shape = (__exports__);
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-list-item.vue?vue&type=template&id=550b8bfc
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-list-item.vue?vue&type=template&id=550aef30
 
-const skeleton_list_itemvue_type_template_id_550b8bfc_hoisted_1 = {
+const skeleton_list_itemvue_type_template_id_550aef30_hoisted_1 = {
   class: "d-d-flex d-fd-column d-w100p"
 };
-function skeleton_list_itemvue_type_template_id_550b8bfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+function skeleton_list_itemvue_type_template_id_550aef30_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_skeleton_shape = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-skeleton-shape");
 
   const _component_dt_skeleton_paragraph = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-skeleton-paragraph");
@@ -1038,17 +1073,17 @@ function skeleton_list_itemvue_type_template_id_550b8bfc_render(_ctx, _cache, $p
     animate: $props.animate,
     offset: $props.offset,
     "content-class": $props.shapeClass
-  }, null, 8, ["size", "shape", "animation-duration", "animate", "offset", "content-class"]), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", skeleton_list_itemvue_type_template_id_550b8bfc_hoisted_1, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_skeleton_paragraph, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.mergeProps)($props.paragraphs, {
+  }, null, 8, ["size", "shape", "animation-duration", "animate", "offset", "content-class"]), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementVNode)("div", skeleton_list_itemvue_type_template_id_550aef30_hoisted_1, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createVNode)(_component_dt_skeleton_paragraph, (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.mergeProps)($props.paragraphs, {
     "animation-duration": $props.animationDuration,
     animate: $props.animate,
     offset: $props.offset
   }), null, 16, ["animation-duration", "animate", "offset"])])], 2);
 }
-;// CONCATENATED MODULE: ./components/skeleton/skeleton-list-item.vue?vue&type=template&id=550b8bfc
+;// CONCATENATED MODULE: ./components/skeleton/skeleton-list-item.vue?vue&type=template&id=550aef30
 
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-paragraph.vue?vue&type=template&id=5c1bdf76
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-paragraph.vue?vue&type=template&id=74552fc9
 
-function skeleton_paragraphvue_type_template_id_5c1bdf76_render(_ctx, _cache, $props, $setup, $data, $options) {
+function skeleton_paragraphvue_type_template_id_74552fc9_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_dt_skeleton_text = (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.resolveComponent)("dt-skeleton-text");
 
   return (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", {
@@ -1070,11 +1105,11 @@ function skeleton_paragraphvue_type_template_id_5c1bdf76_render(_ctx, _cache, $p
     }, null, 8, ["class", "content-class", "animate", "offset", "animation-duration", "width"]);
   }), 128))], 2);
 }
-;// CONCATENATED MODULE: ./components/skeleton/skeleton-paragraph.vue?vue&type=template&id=5c1bdf76
+;// CONCATENATED MODULE: ./components/skeleton/skeleton-paragraph.vue?vue&type=template&id=74552fc9
 
-;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-text.vue?vue&type=template&id=b36ce9f2
+;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-text.vue?vue&type=template&id=0603ca4d
 
-function skeleton_textvue_type_template_id_b36ce9f2_render(_ctx, _cache, $props, $setup, $data, $options) {
+function skeleton_textvue_type_template_id_0603ca4d_render(_ctx, _cache, $props, $setup, $data, $options) {
   return $props.type === 'body' ? ((0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.openBlock)(), (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createElementBlock)("div", {
     key: 0,
     ref: "skeleton",
@@ -1099,7 +1134,7 @@ function skeleton_textvue_type_template_id_b36ce9f2_render(_ctx, _cache, $props,
     })
   }, null, 6)) : (0,external_commonjs_vue_commonjs2_vue_root_Vue_namespaceObject.createCommentVNode)("", true);
 }
-;// CONCATENATED MODULE: ./components/skeleton/skeleton-text.vue?vue&type=template&id=b36ce9f2
+;// CONCATENATED MODULE: ./components/skeleton/skeleton-text.vue?vue&type=template&id=0603ca4d
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-text.vue?vue&type=script&lang=js
 
@@ -1108,32 +1143,67 @@ function skeleton_textvue_type_template_id_b36ce9f2_render(_ctx, _cache, $props,
   name: 'DtSkeletonText',
   mixins: [skeleton],
   props: {
+    /**
+     * Skeleton type
+     * @values body, heading
+     */
     type: {
       type: String,
       default: 'body',
       validator: type => SKELETON_TEXT_TYPES.includes(type)
     },
+
+    /**
+     * Heading height
+     * @values sm, md, lg
+     */
     headingHeight: {
       type: String,
       default: 'md',
       validator: headingHeight => Object.keys(SKELETON_HEADING_HEIGHTS).includes(headingHeight)
     },
+
+    /**
+     * Width of the skeleton
+     */
     width: {
       type: String,
       default: '100%'
     },
+
+    /**
+     * Duration time of the animation (ms), set -1 for an infinite animation.
+     */
     animationDuration: {
       type: Number,
       default: -1
     },
+
+    /**
+     * This property has higher priority than "option.animate"
+     * @values true, false
+     */
     animate: {
       type: Boolean,
       default: false
     },
+
+    /**
+     * RippleDuration controls how long the delay is for the animation of a
+     * placeholder 1000 pixels from the top of the page. Each placeholder
+     * from the top down will have a delay duration from 0 to this offset.
+     * The delay of each placeholder animation is based on how far down the page
+     * the placeholder is rendered. This is a linear relationship. The unit
+     * is milliseconds.
+     */
     offset: {
       type: Number,
       default: 1
     },
+
+    /**
+     * Additional class name for the content.
+     */
     contentClass: {
       type: String,
       default: ''
@@ -1155,7 +1225,7 @@ function skeleton_textvue_type_template_id_b36ce9f2_render(_ctx, _cache, $props,
 
 
 ;
-const skeleton_text_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeleton_textvue_type_script_lang_js, [['render',skeleton_textvue_type_template_id_b36ce9f2_render]])
+const skeleton_text_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeleton_textvue_type_script_lang_js, [['render',skeleton_textvue_type_template_id_0603ca4d_render]])
 
 /* harmony default export */ const skeleton_text = (skeleton_text_exports_);
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-paragraph.vue?vue&type=script&lang=js
@@ -1169,45 +1239,91 @@ const validator = number => number !== '' && !Number.isNaN(Number(number));
     DtSkeletonText: skeleton_text
   },
   props: {
+    /**
+     * Quantity of rows to display
+     */
     rows: {
       type: [Number, String],
       default: 3,
       validator
     },
+
+    /**
+     * This property has higher priority than "option.animate"
+     * @values true, false
+     */
     animate: {
       type: Boolean,
       default: true
     },
+
+    /**
+     * Controls the min width of paragraphs
+     */
     minWidth: {
       type: [Number, String],
       default: 30,
       validator
     },
+
+    /**
+     * Controls the max width of paragraphs
+     */
     maxWidth: {
       type: [Number, String],
       default: 100,
       validator
     },
+
+    /**
+     * Controls the width of paragraphs
+     */
     width: {
       type: [String, Array],
       default: null
     },
+
+    /**
+     * If true, row widths will be random
+     * @values true, false
+     */
     randomWidth: {
       type: Boolean,
       default: false
     },
+
+    /**
+     * RippleDuration controls how long the delay is for the animation of a
+     * placeholder 1000 pixels from the top of the page. Each placeholder
+     * from the top down will have a delay duration from 0 to this offset.
+     * The delay of each placeholder animation is based on how far down the page
+     * the placeholder is rendered. This is a linear relationship. The unit
+     * is milliseconds.
+     */
     offset: {
       type: Number,
       default: 1
     },
+
+    /**
+     * Duration time of the animation (ms), set -1 for an infinite animation.
+     */
     animationDuration: {
       type: Number,
       default: -1
     },
+
+    /**
+     * Additional class name for the content.
+     */
     contentClass: {
       type: String,
       default: ''
     },
+
+    /**
+     * Additional class name for the row.
+     */
     rowClass: {
       type: String,
       default: ''
@@ -1257,7 +1373,7 @@ const validator = number => number !== '' && !Number.isNaN(Number(number));
 
 
 ;
-const skeleton_paragraph_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeleton_paragraphvue_type_script_lang_js, [['render',skeleton_paragraphvue_type_template_id_5c1bdf76_render]])
+const skeleton_paragraph_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeleton_paragraphvue_type_script_lang_js, [['render',skeleton_paragraphvue_type_template_id_74552fc9_render]])
 
 /* harmony default export */ const skeleton_paragraph = (skeleton_paragraph_exports_);
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton-list-item.vue?vue&type=script&lang=js
@@ -1271,15 +1387,29 @@ const skeleton_paragraph_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)
     DtSkeletonParagraph: skeleton_paragraph
   },
   props: {
+    /**
+     * Defines the shape of the skeleton, accepts circle or square.
+     * @values circle, square
+     */
     shape: {
       type: String,
       default: 'circle',
       validator: shape => Object.keys(SKELETON_SHAPES).includes(shape)
     },
+
+    /**
+     * Size of the shape
+     * @values xs, sm, md, lg, xl
+     */
     shapeSize: {
       type: String,
       default: 'md'
     },
+
+    /**
+     * Object containing quantity of paragraphs to display
+     * and a randomWidth boolean.
+     */
     paragraphs: {
       type: Object,
       default: () => ({
@@ -1287,22 +1417,48 @@ const skeleton_paragraph_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)
         randomWidth: true
       })
     },
+
+    /**
+     * Duration time of the animation (ms), set -1 for an infinite animation.
+     */
     animationDuration: {
       type: Number,
       default: -1
     },
+
+    /**
+     * This property has higher priority than "option.animate"
+     * @values true, false
+     */
     animate: {
       type: Boolean,
       default: true
     },
+
+    /**
+     * RippleDuration controls how long the delay is for the animation of a
+     * placeholder 1000 pixels from the top of the page. Each placeholder
+     * from the top down will have a delay duration from 0 to this offset.
+     * The delay of each placeholder animation is based on how far down the page
+     * the placeholder is rendered. This is a linear relationship. The unit
+     * is milliseconds.
+     */
     offset: {
       type: Number,
       default: 1
     },
+
+    /**
+     * Additional class name for the shape.
+     */
     shapeClass: {
       type: String,
       default: ''
     },
+
+    /**
+     * Additional class name for the content.
+     */
     contentClass: {
       type: String,
       default: ''
@@ -1317,7 +1473,7 @@ const skeleton_paragraph_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)
 
 
 ;
-const skeleton_list_item_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeleton_list_itemvue_type_script_lang_js, [['render',skeleton_list_itemvue_type_template_id_550b8bfc_render]])
+const skeleton_list_item_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeleton_list_itemvue_type_script_lang_js, [['render',skeleton_list_itemvue_type_template_id_550aef30_render]])
 
 /* harmony default export */ const skeleton_list_item = (skeleton_list_item_exports_);
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton.vue?vue&type=script&lang=js
@@ -1325,6 +1481,13 @@ const skeleton_list_item_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)
 
 
 
+/**
+ * Skeleton loader is a non-interactive placeholder that displays a preview of the UI to visually communicate
+ * that content is in the process of loading. Skeleton is used to provide a low fidelity
+ * representation of the user interface (UI) before content appears on the page.
+ * @see https://dialpad.design/components/skeleton.html
+ */
+
 /* harmony default export */ const skeletonvue_type_script_lang_js = ({
   name: 'DtSkeleton',
   components: {
@@ -1334,34 +1497,75 @@ const skeleton_list_item_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)
     DtSkeletonParagraph: skeleton_paragraph
   },
   props: {
+    /**
+     * Set this prop to have the skeleton render as multiple lines of text.
+     * Set only one option prop at a time.
+     */
     paragraphOption: {
       type: [Object, Boolean],
       default: null
     },
+
+    /**
+     * Set this prop to have the skeleton render as a list item with an avatar and wrapping text.
+     * Set only one option prop at a time.
+     */
     listItemOption: {
       type: [Object, Boolean],
       default: null
     },
+
+    /**
+     * Set this prop to have the skeleton render as a single line of text.
+     * Set only one option prop at a time.
+     */
     textOption: {
       type: Object,
       default: null
     },
+
+    /**
+     * Set this prop to have the skeleton render as a specific shape.
+     * Set only one option prop at a time.
+     */
     shapeOption: {
       type: [Object, Boolean],
       default: null
     },
+
+    /**
+     * Duration time of the animation (ms), set -1 for an infinite animation.
+     */
     animationDuration: {
       type: Number,
       default: -1
     },
+
+    /**
+     * Descriptive label for the content.
+     */
     ariaLabel: {
       type: String,
       default: ''
     },
+
+    /**
+     * This property has higher priority than "option.animate"
+     * @values true, false
+     */
     animate: {
       type: Boolean,
       default: true
     },
+
+    /**
+     * RippleDuration controls how long the delay is for the animation of a
+     * placeholder 1000 pixels from the top of the page. Each placeholder
+     * from the top down will have a delay duration from 0 to this offset.
+     * The delay of each placeholder animation is based on how far down the page
+     * the placeholder is rendered. This is a linear relationship. The unit
+     * is milliseconds.
+     */
     offset: {
       type: Number,
       default: 1
@@ -1404,9 +1608,9 @@ const skeleton_list_item_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)
 });
 ;// CONCATENATED MODULE: ./components/skeleton/skeleton.vue?vue&type=script&lang=js
  
-// EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[4]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton.vue?vue&type=style&index=0&id=293e767b&lang=less
-var skeletonvue_type_style_index_0_id_293e767b_lang_less = __webpack_require__(878);
-;// CONCATENATED MODULE: ./components/skeleton/skeleton.vue?vue&type=style&index=0&id=293e767b&lang=less
+// EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-32.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-32.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[2]!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-32.use[3]!./node_modules/less-loader/dist/cjs.js??clonedRuleSet-32.use[4]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./components/skeleton/skeleton.vue?vue&type=style&index=0&id=47dbc65e&lang=less
+var skeletonvue_type_style_index_0_id_47dbc65e_lang_less = __webpack_require__(309);
+;// CONCATENATED MODULE: ./components/skeleton/skeleton.vue?vue&type=style&index=0&id=47dbc65e&lang=less
 
 ;// CONCATENATED MODULE: ./components/skeleton/skeleton.vue
 
@@ -1416,7 +1620,7 @@ var skeletonvue_type_style_index_0_id_293e767b_lang_less = __webpack_require__(8
 ;
 
 
-const skeleton_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeletonvue_type_script_lang_js, [['render',skeletonvue_type_template_id_293e767b_render]])
+const skeleton_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeletonvue_type_script_lang_js, [['render',skeletonvue_type_template_id_47dbc65e_render]])
 
 /* harmony default export */ const skeleton_skeleton = (skeleton_exports_);
 ;// CONCATENATED MODULE: ./components/skeleton/index.js
@@ -1430,6 +1634,11 @@ const skeleton_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeletonv
 
 
 
+/**
+ * Renders an emoji from a shortcode such as :smile: or unicode character such as 😄
+ * @see https://dialpad.design/components/emoji.html
+ */
+
 /* harmony default export */ const emojivue_type_script_lang_js = ({
   name: 'DtEmoji',
   components: {
@@ -1437,19 +1646,21 @@ const skeleton_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeletonv
   },
   props: {
     /**
-      * Supports shortcode ex: :smile: or unicode ex: 😄. Will display the resulting emoji.
-      * See https://emojipedia.org/joypixels/ for all supported shortcode/unicode or the docs
-      * for setting up custom emojis.
-      */
+     * Supports shortcode ex: :smile: or unicode ex: 😄. Will display the resulting emoji.
+     * See <a href="https://emojipedia.org/joypixels/" target="_blank">JoyPixels</a>
+     *  for all supported shortcode/unicode or the docs for setting up custom emojis.
+     */
     code: {
       type: String,
       default: null
     },
 
     /**
-      * The size of the emoji. Can be any of the svg size utility
-      * classes from https://dialpad.design/utilities/svg/size
-      */
+     * The size of the emoji. Can be any of the svg size utility classes from
+     * <a href="https://dialpad.design/utilities/svg/size" target="_blank"> Dialpad SVG Size</a>
+     * @values d-svg--size14, d-svg--size16, d-svg--size18, d-svg--size20
+     * d-svg--size24, d-svg--size32, d-svg--size48, d-svg--size64, d-svg--size100p
+     */
     size: {
       type: String,
       default: EMOJI_SIZES.SIZE_20,
@@ -1458,8 +1669,8 @@ const skeleton_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeletonv
 
     /**
      * Additional class name for the emoji img element.
-     * Can accept all of String, Object, and Array, i.e. has the
-     * same api as Vue's built-in handling of the class attribute.
+     * Can accept String, Object, and Array, i.e. has the
+     * same API as Vue's built-in handling of the class attribute.
      */
     imgClass: {
       type: [String, Object, Array],
@@ -1467,7 +1678,7 @@ const skeleton_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeletonv
     },
 
     /**
-     * Will be read out on a screenreader for this emoji. You must use this prop if you want your emoji to be i18n
+     * Will be read out on a screen reader for this emoji. You must use this prop if you want your emoji to be i18n
      * Compatible as Dialtone Vue will not translate it by itself. If you do not set this prop the aria-label will
      * be set to the english description of the emoji. You can retrieve the description for an emoji yourself via the
      * getEmojiData() function
@@ -1479,6 +1690,7 @@ const skeleton_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(skeletonv
 
     /**
      * Shows a skeleton loader while the emoji asset is loading.
+     * @values true, false
      */
     showSkeleton: {
       type: Boolean,
@@ -1584,6 +1796,11 @@ const emoji_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(emojivue_typ
 
 
 
+/**
+ * Wrapper to find and replace shortcodes like :smile: or unicode chars such as 😄 with our custom Emojis implementation.
+ * @see https://dialpad.design/components/emoji_text_wrapper.html
+ */
+
 /* harmony default export */ const emoji_text_wrappervue_type_script_lang_js = ({
   name: 'DtEmojiTextWrapper',
   components: {
@@ -1592,7 +1809,7 @@ const emoji_exports_ = /*#__PURE__*/(0,exportHelper/* default */.Z)(emojivue_typ
   inheritAttrs: false,
   props: {
     /**
-     * The type of element to use for the wrapper.
+     * Element type (tag name) to use for the wrapper.
      */
     elementType: {
       type: String,