@dialpad/dialtone/dist/vue3/components/item_layout/item_layout.vue.cjs.map

Dialpad's Dialtone design system monorepo

{"version":3,"file":"item_layout.vue.cjs","sources":["../../../components/item_layout/item_layout.vue"],"sourcesContent":["<template>\n  <component\n    :is=\"as\"\n    :class=\"unstyled ? 'd-item-layout--custom' : 'd-item-layout'\"\n    :style=\"unstyled && dynamicGridTemplateColumns()\"\n  >\n    <section\n      v-if=\"hasSlotContent($slots.left)\"\n      data-qa=\"dt-item-layout-left-wrapper\"\n      :class=\"[leftClass, 'd-item-layout__left']\"\n    >\n      <!-- @slot Slot for left content -->\n      <slot name=\"left\" />\n    </section>\n    <section\n      data-qa=\"dt-item-layout-content-wrapper\"\n      :class=\"[contentClass, 'd-item-layout__content']\"\n    >\n      <div\n        v-if=\"hasSlotContent($slots.default)\"\n        data-qa=\"dt-item-layout-title-wrapper\"\n        :class=\"[titleClass, 'd-item-layout__title']\"\n      >\n        <!-- @slot Slot for main content -->\n        <slot />\n      </div>\n      <div\n        v-if=\"hasSlotContent($slots.subtitle)\"\n        data-qa=\"dt-item-layout-subtitle-wrapper\"\n        :class=\"[\n          subtitleClass,\n          'd-item-layout--subtitle',\n          { 'd-item-layout--subtitle--with-title': hasSlotContent($slots.default) },\n        ]\"\n      >\n        <!-- @slot Slot for content below main content -->\n        <slot name=\"subtitle\" />\n      </div>\n      <div\n        v-if=\"hasSlotContent($slots.bottom)\"\n        data-qa=\"dt-item-layout-bottom-wrapper\"\n        :class=\"[bottomClass, 'd-item-layout__bottom']\"\n      >\n        <!-- @slot Slot for content below subtitle -->\n        <slot name=\"bottom\" />\n      </div>\n    </section>\n    <section\n      v-if=\"hasSlotContent($slots.right)\"\n      data-qa=\"dt-item-layout-right-wrapper\"\n      :class=\"[rightClass, 'd-item-layout__right']\"\n    >\n      <!-- @slot Slot for right content -->\n      <slot name=\"right\" />\n    </section>\n    <section\n      v-if=\"hasSlotContent($slots.selected)\"\n      data-qa=\"dt-item-layout-selected-wrapper\"\n      :class=\"[selectedClass, 'd-item-layout__selected']\"\n    >\n      <!-- @slot Slot for selected icon -->\n      <slot name=\"selected\" />\n    </section>\n  </component>\n</template>\n\n/**\n * Custom layout to enable developer to use list-item like stack.\n * It is used as base for `dt-list-item` component\n * @see https://dialtone.dialpad.com/components/item_layout.html\n */\n<script>\nimport { hasSlotContent } from '@/common/utils';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtItemLayout',\n  props: {\n    /**\n     * Set this prop to render layout as a specific HTML element.\n     */\n    as: {\n      type: String,\n      default: 'div',\n    },\n\n    /**\n     * Set this prop to remove the default styling.\n     * @values true, false\n     */\n    unstyled: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Set the class for the left section.\n     */\n    leftClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Set the class for the content section.\n     */\n    contentClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Set the class for the title section.\n     */\n    titleClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Set the class for the subtitle section.\n     */\n    subtitleClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Set the class for the bottom section.\n     */\n    bottomClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Set the class for the right section.\n     */\n    rightClass: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Set the class for the selected section.\n     */\n    selectedClass: {\n      type: String,\n      default: '',\n    },\n  },\n\n  methods: {\n    /**\n     * Generate dynamic grid template columns\n     */\n    dynamicGridTemplateColumns () {\n      const leftContentColumn = this.$slots.left ? 'auto' : '';\n      const rightContentColumn = this.$slots.right ? 'auto' : '';\n      const selectedContentColumn = this.$slots.selected ? 'auto' : '';\n\n      return `\n        grid-template-columns: ${leftContentColumn} 1fr ${rightContentColumn} ${selectedContentColumn};\n      `;\n    },\n\n    hasSlotContent,\n  },\n};\n</script>\n"],"names":["hasSlotContent","_createBlock","_resolveDynamicComponent","_normalizeClass","_normalizeStyle","_withCtx","_createElementBlock","_renderSlot","_createCommentVNode","_createElementVNode"],"mappings":"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"}