@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
91 lines (90 loc) • 2.1 kB
JavaScript
import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
import { SKELETON_SHAPES as t } from "./skeleton-constants.js";
import n from "./skeleton-shape.js";
import r from "./skeleton-paragraph.js";
import { createElementBlock as i, createElementVNode as a, createVNode as o, mergeProps as s, normalizeClass as c, openBlock as l, resolveComponent as u } from "vue";
//#region components/skeleton/skeleton-list-item.vue
var d = {
compatConfig: { MODE: 3 },
name: "DtSkeletonListItem",
components: {
DtSkeletonShape: n,
DtSkeletonParagraph: r
},
props: {
shape: {
type: String,
default: "circle",
validator: (e) => Object.keys(t).includes(e)
},
shapeSize: {
type: String,
default: "md"
},
paragraphs: {
type: Object,
default: () => ({
rows: 3,
randomWidth: !0
})
},
animationDuration: {
type: Number,
default: -1
},
animate: {
type: Boolean,
default: !0
},
offset: {
type: Number,
default: 1
},
shapeClass: {
type: String,
default: ""
},
contentClass: {
type: String,
default: ""
}
}
}, f = { class: "d-skeleton-list-item__paragraph-container" };
function p(e, t, n, r, d, p) {
let m = u("dt-skeleton-shape"), h = u("dt-skeleton-paragraph");
return l(), i("div", {
"data-qa": "skeleton-list-item",
class: c([
"d-skeleton-list-item",
{ "d-skeleton-list-item--single": n.paragraphs.rows === 1 },
n.contentClass
])
}, [o(m, {
class: "d-skeleton-list-item__shape",
size: n.shapeSize,
shape: n.shape,
"animation-duration": n.animationDuration,
animate: n.animate,
offset: n.offset,
"content-class": n.shapeClass
}, null, 8, [
"size",
"shape",
"animation-duration",
"animate",
"offset",
"content-class"
]), a("div", f, [o(h, s(n.paragraphs, {
"animation-duration": n.animationDuration,
animate: n.animate,
offset: n.offset
}), null, 16, [
"animation-duration",
"animate",
"offset"
])])], 2);
}
var m = /* @__PURE__ */ e(d, [["render", p]]);
//#endregion
export { m as default };
//# sourceMappingURL=skeleton-list-item.js.map