@opensig/opendesign/lib/grid/ORow.vue.js

"use strict";
const vue = require("vue");
const types = require("./types.js");
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "ORow",
  props: types.rowProps,
  setup(__props) {
    const props = __props;
    const getMediaGap = (opts) => {
      if (!opts) {
        return;
      }
      const { gapX, gapY, gap: gapXY } = opts;
      let gx = gapX;
      let gy = gapY;
      if (gapXY) {
        const [x, y] = gapXY.split(" ");
        gx = gx ?? x;
        gy = gy ?? y ?? gx;
      }
      return {
        x: gx === "auto" ? void 0 : gx,
        y: gy === "auto" ? void 0 : gy
      };
    };
    const gap = vue.computed(() => {
      return getMediaGap(props);
    });
    const xlGap = vue.computed(() => {
      return getMediaGap(props.pcS);
    });
    const lgGap = vue.computed(() => {
      return getMediaGap(props.laptop);
    });
    const mdGap = vue.computed(() => {
      return getMediaGap(props.pad);
    });
    const smGap = vue.computed(() => {
      return getMediaGap(props.padV);
    });
    const xsGap = vue.computed(() => {
      return getMediaGap(props.phone);
    });
    return (_ctx, _cache) => {
      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
      return vue.openBlock(), vue.createElementBlock(
        "div",
        {
          class: vue.normalizeClass(["o-row", {
            "o-row-phone": !!props.phone,
            "o-row-pad-v": !!props.padV,
            "o-row-pad": !!props.pad,
            "o-row-laptop": !!props.laptop,
            "o-row-pc-s": !!props.pcS
          }]),
          style: vue.normalizeStyle({
            justifyContent: props.justify,
            flexDirection: props.direction,
            alignItems: props.align,
            flexWrap: props.wrap,
            "--row-gap-x": (_a = gap.value) == null ? void 0 : _a.x,
            "--row-gap-y": (_b = gap.value) == null ? void 0 : _b.y,
            "--row-phone-gap-x": (_c = xsGap.value) == null ? void 0 : _c.x,
            "--row-phone-gap-y": (_d = xsGap.value) == null ? void 0 : _d.y,
            "--row-pad-v-gap-x": (_e = smGap.value) == null ? void 0 : _e.x,
            "--row-pad-v-gap-y": (_f = smGap.value) == null ? void 0 : _f.y,
            "--row-pad-gap-x": (_g = mdGap.value) == null ? void 0 : _g.x,
            "--row-pad-gap-y": (_h = mdGap.value) == null ? void 0 : _h.y,
            "--row-laptop-gap-x": (_i = lgGap.value) == null ? void 0 : _i.x,
            "--row-laptop-gap-y": (_j = lgGap.value) == null ? void 0 : _j.y,
            "--row-pc-s-gap-x": (_k = xlGap.value) == null ? void 0 : _k.x,
            "--row-pc-s-gap-y": (_l = xlGap.value) == null ? void 0 : _l.y
          })
        },
        [
          vue.renderSlot(_ctx.$slots, "default")
        ],
        6
        /* CLASS, STYLE */
      );
    };
  }
});
module.exports = _sfc_main;