import { w as withInstall } from "../badge/index2.js"; import { defineComponent, useSlots, computed, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, renderSlot, createCommentVNode } from "vue"; var index = /* @__PURE__ */ (() => ".layui-line-horizontal{position:relative;clear:both;width:100%;min-width:100%;max-width:100%;margin:var(--layui-line-margin) 0;border-bottom:var(--layui-line-border-width) var(--layui-line-border-style) var(--global-neutral-color-5);border-top-style:none;border-left-style:none;border-right-style:none}.layui-line-horizontal.layui-line-with-text{margin:14px 0}.layui-line-vertical{display:inline-block;min-width:1px;max-width:1px;height:1em;margin:0 var(--layui-line-margin);vertical-align:middle;border-left:var(--layui-line-border-width) var(--layui-line-border-style) var(--global-neutral-color-5);border-top-style:none;border-bottom-style:none;border-right-style:none}.layui-line-text{position:absolute;top:50%;box-sizing:border-box;padding:0 10px;color:currentColor;line-height:2;background-color:#fff;transform:translateY(-50%)}.layui-line-text-center{left:var(--layui-line-text-offset);transform:translate(-50%,-50%)}.layui-line-text-left{left:var(--layui-line-text-offset)}.layui-line-text-right{right:var(--layui-line-text-offset)}\n")(); const __default__ = { name: "LayLine" }; const _sfc_main = defineComponent({ ...__default__, props: { direction: { default: "horizontal" }, contentPosition: { default: "center" }, borderWidth: { default: "1px" }, borderStyle: { default: "solid" }, offset: { default: "25px" }, theme: null, margin: { default: "8px" } }, setup(__props) { var _a; const props = __props; const slots = useSlots(); const lineTheme = [ "red", "orange", "green", "cyan", "blue", "black", "gray" ]; const isBuiltInColor = lineTheme.includes((_a = props.theme) != null ? _a : ""); const lineClass = computed(() => [ `layui-line-${props.direction}`, { [`layui-border-${props.theme}`]: isBuiltInColor, [`layui-line-with-text`]: Boolean(slots.default) } ]); const lineStyle = computed(() => ({ "border-color": !isBuiltInColor ? props.theme : void 0, "--layui-line-border-width": props.borderWidth, "--layui-line-border-style": props.borderStyle, "--layui-line-margin": props.margin })); const lineTextStyle = computed(() => ({ "--layui-line-text-offset": props.contentPosition != "center" ? props.offset : "50%", transform: calcTranslate() })); function calcTranslate() { if (props.offset.includes("%")) { return props.contentPosition === "right" ? "translate(50%, -50%)" : "translate(-50%, -50%)"; } return void 0; } return (_ctx, _cache) => { return openBlock(), createElementBlock("div", { class: normalizeClass(unref(lineClass)), style: normalizeStyle(unref(lineStyle)) }, [ _ctx.$slots.default && __props.direction === "horizontal" ? (openBlock(), createElementBlock("span", { key: 0, class: normalizeClass([`layui-line-text layui-line-text-${__props.contentPosition}`]), style: normalizeStyle(unref(lineTextStyle)) }, [ renderSlot(_ctx.$slots, "default") ], 6)) : createCommentVNode("", true) ], 6); }; } }); const component = withInstall(_sfc_main); export { component as default };