import { computed, createVNode, Fragment } from "vue";
import "./styles/divider.scss";
import { makeTagProps } from "../../composables/tag/index.mjs";
import { genericComponent } from "../../utils/define-component.mjs";
import { convertToUnit } from "../../utils/dist/index.mjs";
const VeDividerTextAligns = ["left", "center", "right"];
const Divider = genericComponent()({
  name: "VeDivider",
  props: {
    textAlign: {
      type: String,
      default: "center",
      validator: (val) => VeDividerTextAligns.includes(val)
    },
    length: [Number, String],
    dashed: Boolean,
    vertical: Boolean,
    ...makeTagProps({
      tag: "hr"
    })
  },
  setup(props, {
    attrs,
    slots
  }) {
    const dividerStyles = computed(() => {
      const styles = {};
      if (props.length) {
        styles[props.vertical ? "maxHeight" : "maxWidth"] = convertToUnit(props.length);
      }
      return styles;
    });
    return () => {
      var _a;
      const hasDefaultSlot = !!slots.default;
      const Tag = hasDefaultSlot ? "div" : props.tag;
      const role = (_a = attrs.role) != null ? _a : "separator";
      return createVNode(Tag, {
        "class": ["ve-divider", {
          "ve-divider--dashed": props.dashed,
          "ve-divider--vertical": props.vertical,
          "ve-divider--text": hasDefaultSlot,
          "ve-divider--text-left": props.textAlign === "left",
          "ve-divider--text-right": props.textAlign === "right"
        }],
        "style": [dividerStyles.value],
        "aria-orientation": role === "separator" ? props.vertical ? "vertical" : "horizontal" : void 0,
        "role": role
      }, {
        default: hasDefaultSlot ? () => {
          var _a2;
          return [createVNode(Fragment, null, [createVNode("div", {
            "class": "ve-divider__line"
          }, null), createVNode("div", {
            "class": "ve-divider__wrap"
          }, [(_a2 = slots.default) == null ? void 0 : _a2.call(slots)]), createVNode("div", {
            "class": "ve-divider__line"
          }, null)])];
        } : void 0
      });
    };
  }
});
export {
  Divider
};
//# sourceMappingURL=divider.mjs.map
