import { createVNode as _createVNode } from "vue";
// Styles
import "./VDivider.sass"; // Utilities

import { computed, defineComponent } from 'vue';
import { convertToUnit, makeProps } from "../../util/index.mjs"; // Composables

import { useTheme } from "../../composables/theme.mjs"; // Types

export default defineComponent({
  name: 'VDivider',
  props: makeProps({
    inset: Boolean,
    length: [Number, String],
    thickness: [Number, String],
    vertical: Boolean
  }),

  setup(props, {
    attrs
  }) {
    const {
      themeClasses
    } = useTheme();
    const dividerStyles = computed(() => {
      const styles = {};

      if (props.length) {
        styles[props.vertical ? 'maxHeight' : 'maxWidth'] = convertToUnit(props.length);
      }

      if (props.thickness) {
        styles[props.vertical ? 'borderRightWidth' : 'borderTopWidth'] = convertToUnit(props.thickness);
      }

      return styles;
    });
    return () => {
      return _createVNode("hr", {
        "class": [{
          'v-divider': true,
          'v-divider--inset': props.inset,
          'v-divider--vertical': props.vertical
        }, themeClasses.value],
        "style": dividerStyles.value,
        "aria-orientation": !attrs.role || attrs.role === 'separator' ? props.vertical ? 'vertical' : 'horizontal' : undefined,
        "role": "".concat(attrs.role || 'separator')
      }, null, 14, ["aria-orientation", "role"]);
    };
  }

});
//# sourceMappingURL=VDivider.mjs.map