tass-ui/es/packages/components/col/src/col.mjs

A high quality UI Toolkit built on Vue.js3+.

import "../../../theme-chalk/src/col.scss.mjs";
import "../../../theme-chalk/src/row.scss.mjs";
import { defineComponent, inject, computed, h } from "vue";
const col = defineComponent({
  name: "TassCol",
  props: {
    tag: {
      type: String,
      default: "div"
    },
    span: {
      type: Number,
      default: 24
    },
    offset: {
      type: Number,
      default: 0
    }
  },
  setup(props, ctx) {
    const gutter = inject("TassRow");
    const Class = computed(() => {
      const res = [];
      const pops = ["span", "offset"];
      pops.forEach((item) => {
        const size = props[item];
        if (typeof size === "number" && size > 0) {
          res.push(`tas-col-${item}-${size}`);
        }
      });
      return ["tas-col", ...res];
    });
    const styles = computed(() => {
      if (gutter !== 0) {
        return {
          paddingLeft: gutter / 2 + "px",
          paddingRight: gutter / 2 + "px"
        };
      }
      return {};
    });
    return () => {
      var _a, _b;
      return h(
        props.tag,
        {
          class: Class.value,
          style: styles.value
        },
        (_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)
      );
    };
  }
});
export {
  col as default
};