import { createVNode as _createVNode } from "vue";
import { defineComponent, computed } from "vue";
import { filterEmpty } from "../_util/props-util";
const prefixCls = 'x-space';
const Space = defineComponent({
  name: prefixCls,
  props: {
    wrap: {
      default: true
    },
    vertical: Boolean,
    align: String,
    justify: String,
    gap: {
      type: [Number, String],
      default: 8
    },
    itemStyle: [String, Object]
  },

  setup(props, {
    slots
  }) {
    const itemGapStyleRef = computed(() => {
      const style = Object.create(null);
      style[props.vertical ? 'margin-bottom' : 'margin-right'] = props.gap + 'px';
      return style;
    });
    return vm => {
      var _slots$default;

      let items = (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
      items = filterEmpty(items);
      const cls = [prefixCls, {
        [`${prefixCls}-wrap`]: props.wrap,
        [`${prefixCls}-vertical`]: props.vertical
      }];
      return _createVNode("div", {
        "class": cls,
        "style": {
          justifyContent: props.justify,
          alignItems: props.align
        }
      }, [items.map((item, i) => {
        const extraProps = {
          class: `${prefixCls}_item`,
          style: [props.itemStyle, i + 1 < items.length ? itemGapStyleRef.value : undefined]
        };
        return _createVNode("div", extraProps, [item]); // return cloneVNode(item, props)
      })]);
    };
  }

});

Space.install = app => {
  app.component(Space.name, Space);
};

export default Space;