import {
  SolidElement,
  customElement
} from "./chunk.H53WQBDK.js";
import {
  __decorateClass
} from "./chunk.S3NI7NKU.js";

// src/components/divider/divider.ts
import { css, html } from "lit";
import { property } from "lit/decorators.js";
import cx from "classix";
var SdDivider = class extends SolidElement {
  constructor() {
    super(...arguments);
    this.orientation = "horizontal";
    this.inverted = false;
  }
  connectedCallback() {
    super.connectedCallback();
    this.setAttribute("role", "separator");
  }
  render() {
    return html`<hr part="main" aria-orientation="${this.orientation}" class="${cx(
      this.inverted ? "sd-divider--inverted-color-border" : "border-neutral-400",
      this.orientation === "horizontal" ? "border-t w-full" : " border-l h-full"
    )}">`;
  }
};
/**
 * Inherits global stylesheet including TailwindCSS
 */
SdDivider.styles = [
  ...SolidElement.styles,
  css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
:host{margin:calc(var(--sd-spacing-1) * 0)}:host(sd-divider[orientation=horizontal]){display:block}:host(sd-divider[orientation=vertical]){display:inline-block}`
];
__decorateClass([
  property({ type: String, reflect: true })
], SdDivider.prototype, "orientation", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdDivider.prototype, "inverted", 2);
SdDivider = __decorateClass([
  customElement("sd-divider")
], SdDivider);

export {
  SdDivider
};
