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

// src/components/theme-listener/theme-listener.ts
import { css } from "lit";

// src/internal/theme-observer.ts
import StyleObserver from "style-observer";
var ThemeObserver = class {
  constructor(host, callback) {
    this.host = host;
    this.callback = callback;
  }
  connect() {
    this.observer = new StyleObserver((records) => {
      var _a, _b;
      const theme = (_b = (_a = records == null ? void 0 : records[0]) == null ? void 0 : _a.value) == null ? void 0 : _b.replaceAll(`'`, "");
      if (!theme) return;
      this.callback(theme);
    });
    this.observer.observe(this.host, "--sd-theme");
  }
  disconnect() {
    var _a;
    (_a = this.observer) == null ? void 0 : _a.unobserve(this.host);
  }
};

// src/components/theme-listener/theme-listener.ts
var SdThemeListener = class extends SolidElement {
  handleThemeChange(theme) {
    this.emit("sd-theme-change", { detail: { theme }, bubbles: true });
  }
  connectedCallback() {
    super.connectedCallback();
    this.themeObserver = new ThemeObserver(this, this.handleThemeChange.bind(this));
    this.themeObserver.connect();
  }
  disconnectedCallback() {
    var _a;
    super.disconnectedCallback();
    (_a = this.themeObserver) == null ? void 0 : _a.disconnect();
  }
};
SdThemeListener.styles = [
  ...SolidElement.styles,
  css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
:host{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}`
];
SdThemeListener = __decorateClass([
  customElement("sd-6-22-0-theme-listener")
], SdThemeListener);

export {
  SdThemeListener
};
