@dialpad/dialtone/dist/vue3/lib/skeleton/skeleton-paragraph.cjs.map

Dialpad's Dialtone design system monorepo

{"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  compatConfig: { MODE: 3 },\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","_createElementBlock","_normalizeClass","$props","_openBlock","_Fragment","_renderList","$options","_createBlock","_component_dt_skeleton_text"],"mappings":"8NAyBMA,EAAYC,GAAUA,IAAW,IAAM,CAAC,OAAO,MAAM,OAAOA,CAAM,CAAC,EACpEC,EAAU,CACb,aAAc,CAAE,KAAM,GACtB,KAAM,sBACN,WAAY,CACV,eAAAC,EAAAA,SAGF,MAAO,CAIL,KAAM,CACJ,KAAM,CAAC,OAAQ,MAAM,EACrB,QAAS,EACT,UAAAH,GAOF,QAAS,CACP,KAAM,QACN,QAAS,IAMX,SAAU,CACR,KAAM,CAAC,OAAQ,MAAM,EACrB,QAAS,GACT,UAAAA,GAMF,SAAU,CACR,KAAM,CAAC,OAAQ,MAAM,EACrB,QAAS,IACT,UAAAA,GAMF,MAAO,CACL,KAAM,CAAC,OAAQ,KAAK,EACpB,QAAS,MAOX,YAAa,CACX,KAAM,QACN,QAAS,IAWX,OAAQ,CACN,KAAM,OACN,QAAS,GAMX,kBAAmB,CACjB,KAAM,OACN,QAAS,IAMX,aAAc,CACZ,KAAM,OACN,QAAS,IAMX,SAAU,CACR,KAAM,OACN,QAAS,KAIb,SAAU,CACR,aAAe,CACb,OAAO,OAAO,KAAK,IAAI,CACzB,GAGF,QAAS,CACP,uBAAyB,CACvB,MAAMI,EAAM,KAAK,IAAI,KAAK,SAAU,KAAK,QAAQ,EAC3CC,EAAM,KAAK,IAAI,KAAK,SAAU,KAAK,QAAQ,EACjD,MAAO,GAAG,KAAK,MAAM,KAAK,UAAYA,EAAMD,EAAI,EAAIA,CAAG,GACzD,EAEA,oBAAqBE,EAAK,CACxB,MAAMC,EAAiB,KAAK,MACtBC,EAAe,MAAM,QAAQD,CAAc,EAC3CE,EAAeF,GAAA,YAAAA,EAAiBD,EAAM,GACtCI,EAAYJ,IAAQ,KAAK,KAE/B,OAAI,KAAK,YACA,KAAK,sBAAqB,EAG/BC,GAAkB,CAACC,EACdD,EAGLA,GAAkBC,GAAgBC,EAC7BA,EAGFC,EAAY,MAAQ,MAC7B,EAEJ,8FA9JEC,EAAAA,mBAkBM,MAAA,CAjBH,MAFLC,EAAAA,eAAA,wBAEkDC,EAAA,eAI9C,aAAA,GACA,UAAQ,wBAERC,YAAA,EAAA,EAAAH,EAAAA,mBASEI,EAAAA,SAAA,KAlBNC,EAAAA,WAUoBC,EAAA,YAAPX,kBADTY,EAAAA,YASEC,EAAA,CAPC,IAAKb,EACN,UAAQ,yBACP,gBAAeO,EAAA,SACf,QAASA,EAAA,QACT,OAAQA,EAAA,OACR,qBAAoBA,EAAA,kBACpB,MAAOI,EAAA,oBAAoBX,CAAG"}