@dialpad/dialtone/dist/vue3/lib/description-list/description-list.js

Dialpad's Dialtone design system monorepo

import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
import { DT_STACK_GAP as t } from "../stack/stack-constants.js";
import { DT_DESCRIPTION_LIST_DIRECTION as n } from "./description-list-constants.js";
import { itemsValidator as r } from "./description-list-validators.js";
import { Fragment as i, createElementBlock as a, createElementVNode as o, normalizeClass as s, openBlock as c, renderList as l, toDisplayString as u } from "vue";
//#region components/description_list/description_list.vue
var d = {
	compatConfig: { MODE: 3 },
	name: "DtDescriptionList",
	props: {
		direction: {
			type: String,
			default: "row",
			validator: (e) => n.includes(e)
		},
		items: {
			type: Array,
			default: () => [],
			validator: (e) => r(e),
			required: !0
		},
		gap: {
			type: String,
			default: "400",
			validator: (e) => t.includes(e)
		},
		termClass: {
			type: [
				String,
				Array,
				Object
			],
			default: ""
		},
		descriptionClass: {
			type: [
				String,
				Array,
				Object
			],
			default: ""
		}
	},
	computed: {
		dtClass() {
			return ["d-description-list__term", this.termClass];
		},
		ddClass() {
			return ["d-description-list__description", this.descriptionClass];
		},
		getDirectionClass() {
			return `d-description-list--${this.direction}`;
		},
		getGapClass() {
			return `d-description-list--gap-${this.gap}`;
		}
	}
};
function f(e, t, n, r, d, f) {
	return c(), a("dl", { class: s([
		"d-description-list",
		f.getDirectionClass,
		f.getGapClass
	]) }, [(c(!0), a(i, null, l(n.items, (e) => (c(), a(i, { key: e.term }, [o("dt", { class: s(f.dtClass) }, u(e.term), 3), o("dd", { class: s(f.ddClass) }, u(e.description), 3)], 64))), 128))], 2);
}
var p = /* @__PURE__ */ e(d, [["render", f]]);
//#endregion
export { p as default };

//# sourceMappingURL=description-list.js.map