import { n as a } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
const l = {
  name: "DtItemLayout",
  props: {
    /**
     * Set this prop to render layout as a specific HTML element.
     */
    as: {
      type: String,
      default: "div"
    },
    /**
     * Set this prop to remove the default styling.
     * @values true, false
     */
    unstyled: {
      type: Boolean,
      default: !1
    },
    /**
     * Set the class for the left section.
     */
    leftClass: {
      type: String,
      default: ""
    },
    /**
     * Set the class for the content section.
     */
    contentClass: {
      type: String,
      default: ""
    },
    /**
     * Set the class for the title section.
     */
    titleClass: {
      type: String,
      default: ""
    },
    /**
     * Set the class for the subtitle section.
     */
    subtitleClass: {
      type: String,
      default: ""
    },
    /**
     * Set the class for the bottom section.
     */
    bottomClass: {
      type: String,
      default: ""
    },
    /**
     * Set the class for the right section.
     */
    rightClass: {
      type: String,
      default: ""
    },
    /**
     * Set the class for the selected section.
     */
    selectedClass: {
      type: String,
      default: ""
    }
  },
  methods: {
    /**
     * Generate dynamic grid template columns
     */
    dynamicGridTemplateColumns() {
      const s = this.$slots.left ? "auto" : "", t = this.$slots.right ? "auto" : "", e = this.$slots.selected ? "auto" : "";
      return `
        grid-template-columns: ${s} 1fr ${t} ${e};
      `;
    }
  }
};
var o = function() {
  var t = this, e = t._self._c;
  return e(t.as, { tag: "component", class: t.unstyled ? "d-item-layout--custom" : "d-item-layout", style: t.unstyled && t.dynamicGridTemplateColumns() }, [t.$slots.left ? e("section", { class: [t.leftClass, "d-item-layout__left"], attrs: { "data-qa": "dt-item-layout-left-wrapper" } }, [t._t("left")], 2) : t._e(), e("section", { class: [t.contentClass, "d-item-layout__content"], attrs: { "data-qa": "dt-item-layout-content-wrapper" } }, [t.$slots.default ? e("div", { class: [t.titleClass, "d-item-layout__title"], attrs: { "data-qa": "dt-item-layout-title-wrapper" } }, [t._t("default")], 2) : t._e(), t.$slots.subtitle ? e("div", { class: [t.subtitleClass, "d-item-layout__subtitle", { "d-item-layout__subtitle-with-title": t.$slots.default }], attrs: { "data-qa": "dt-item-layout-subtitle-wrapper" } }, [t._t("subtitle")], 2) : t._e(), t.$slots.bottom ? e("div", { class: [t.bottomClass, "d-item-layout__bottom"], attrs: { "data-qa": "dt-item-layout-bottom-wrapper" } }, [t._t("bottom")], 2) : t._e()]), t.$slots.right ? e("section", { class: [t.rightClass, "d-item-layout__right"], attrs: { "data-qa": "dt-item-layout-right-wrapper" } }, [t._t("right")], 2) : t._e(), t.$slots.selected ? e("section", { class: [t.selectedClass, "d-item-layout__selected"], attrs: { "data-qa": "dt-item-layout-selected-wrapper" } }, [t._t("selected")], 2) : t._e()]);
}, i = [], d = /* @__PURE__ */ a(
  l,
  o,
  i
);
const r = d.exports;
export {
  r as default
};
//# sourceMappingURL=item-layout.js.map
