hongluan-ui/lib/components/row/src/row.js

Hongluan Component Library for Vue 3

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
require('../../../hooks/index.js');
var index = require('../../../hooks/use-namespace/index.js');

const rowProps = {
  tag: {
    type: String,
    default: "div"
  },
  align: {
    type: String,
    default: ""
  },
  layout: {
    type: String
  },
  gap: String,
  gapX: String,
  gapY: String,
  count: {
    type: [Number, String],
    default: 1
  },
  dir: {
    type: String,
    default: "vertical"
  }
};
const Row = vue.defineComponent({
  name: "Row",
  props: rowProps,
  setup(props, { slots }) {
    const gap = vue.computed(() => props.gap);
    const layout = vue.computed(() => props.layout);
    vue.provide("Row", { layout, gap });
    const { namespace } = index.useNamespace("row");
    return () => {
      var _a;
      return vue.h(props.tag, {
        class: [
          namespace.value,
          props.align,
          props.layout,
          props.layout ? typeof props.count === "number" ? `count-` + props.count : props.count : "",
          props.layout === "grid" && `grid-direction-${props.dir}`
        ],
        style: [
          props.gap ? `--row-gap-x: ${props.gap}; --row-gap-y: ${props.gap}` : "",
          props.gapX ? `--row-gap-x: ${props.gapX}` : "",
          props.gapY ? `--row-gap-y: ${props.gapY}` : ""
        ]
      }, (_a = slots.default) == null ? void 0 : _a.call(slots));
    };
  }
});

exports["default"] = Row;
exports.rowProps = rowProps;
//# sourceMappingURL=row.js.map