/**
 * Non-side-effect class export for `<divider-ui>`.
 *
 * Importing this file gives you the class(es) without auto-registering the tag.
 * Useful for test isolation, subclassing with tag-name override, or selective
 * composition.
 *
 * The auto-register path stays at `@adia-ai/web-components/components/divider`
 * (which imports this file + calls `defineIfFree()`).
 *
 * @see ../../USAGE.md#registration--auto-vs-explicit
 */

/**
 * <divider-ui></divider-ui>
 * <divider-ui label="or"></divider-ui>
 * <divider-ui vertical></divider-ui>
 *
 * Horizontal or vertical divider with optional label.
 * Renders as a simple line, or a line broken by centered text.
 */

import { UIElement } from '../../core/element.js';

export class UIDivider extends UIElement {
  static properties = {
    label:    { type: String,  default: '', reflect: true },
    vertical: { type: Boolean, default: false, reflect: true },
  };

  static template = () => null;

  connected() {
    this.setAttribute('role', 'separator');
  }

  render() {
    if (this.vertical) {
      this.setAttribute('aria-orientation', 'vertical');
    } else {
      this.removeAttribute('aria-orientation');
    }

    if (this.label) {
      let span = this.querySelector('[slot="label"]');
      if (!span) {
        span = document.createElement('span');
        span.setAttribute('slot', 'label');
        this.appendChild(span);
      }
      span.textContent = this.label;
    } else {
      const span = this.querySelector('[slot="label"]');
      if (span) span.remove();
    }
  }
}
