@opensig/opendesign/es/grid/ORow.vue.mjs

<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制，使用 TypeScript</b></p>

import { defineComponent, computed, createElementBlock, openBlock, normalizeStyle, normalizeClass, renderSlot } from "vue";
import { rowProps } from "./types.mjs";
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "ORow",
  props: 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 = computed(() => {
      return getMediaGap(props);
    });
    const lgGap = computed(() => {
      return getMediaGap(props.laptop);
    });
    const mdGap = computed(() => {
      return getMediaGap(props.pad);
    });
    const smGap = computed(() => {
      return getMediaGap(props.padV);
    });
    const xsGap = computed(() => {
      return getMediaGap(props.phone);
    });
    return (_ctx, _cache) => {
      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
      return openBlock(), createElementBlock(
        "div",
        {
          class: normalizeClass(["o-row", {
            "o-row-phone": !!props.phone,
            "o-row-pad-v": !!props.padV,
            "o-row-pad": !!props.pad,
            "o-row-laptop": !!props.laptop
          }]),
          style: 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
          })
        },
        [
          renderSlot(_ctx.$slots, "default")
        ],
        6
        /* CLASS, STYLE */
      );
    };
  }
});
export {
  _sfc_main as default
};