import { DT_MODE_ISLAND_TYPES as r } from "./mode-island-constants.js";
import { modeValidator as i } from "./validators.js";
import { getRootContrast as s, getOppositeMode as d, findParentMode as l, getRootMode as u } from "./utils.js";
import { n as c } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
const m = {
  name: "DtModeIsland",
  provide() {
    return {
      dtModeIslandMode: () => this.computedMode
    };
  },
  inject: {
    parentModeIslandMode: {
      from: "dtModeIslandMode",
      default: null
    }
  },
  inheritAttrs: !1,
  props: {
    /**
     * Set this prop to render the mode island as a specific HTML element.
     * @type {String}
     * @values div, section, nav, article, aside, header, footer, main
     */
    as: {
      type: String,
      default: "div"
    },
    /**
     * The mode to apply to the island.
     * - 'inverted': Opposite of parent or root mode
     * - 'light': Always light mode
     * - 'dark': Always dark mode
     * @type {String}
     * @values inverted, light, dark
     */
    mode: {
      type: String,
      default: r.INVERTED,
      validator: i
    }
  },
  data() {
    return {
      currentContrast: s(),
      contrastObserver: null,
      modeObserver: null,
      elementRef: null,
      calculatedMode: null
      // Store calculated mode as reactive data
    };
  },
  computed: {
    isInverted() {
      return this.mode === r.INVERTED;
    },
    invertedAttribute() {
      return this.isInverted ? "" : null;
    },
    computedMode() {
      return this.mode === r.LIGHT || this.mode === r.DARK ? this.mode : this.mode === r.INVERTED && this.calculatedMode ? this.calculatedMode : this.calculateInvertedMode();
    }
  },
  beforeCreate() {
    if (this.$attrs && this.$attrs["data-dt-brand"])
      throw new Error("[DtModeIsland] The data-dt-brand attribute is not allowed on mode islands. Brand should only be set at the root level.");
  },
  mounted() {
    this.elementRef = this.$el, this.setupContrastObserver(), this.isInverted && (this.calculatedMode = this.calculateInvertedMode(), this.setupModeObserver()), this.currentContrast = s();
  },
  beforeDestroy() {
    this.contrastObserver && (this.contrastObserver.disconnect(), this.contrastObserver = null), this.modeObserver && (this.modeObserver.disconnect(), this.modeObserver = null);
  },
  methods: {
    calculateInvertedMode() {
      if (this.parentModeIslandMode) {
        const e = typeof this.parentModeIslandMode == "function" ? this.parentModeIslandMode() : this.parentModeIslandMode;
        return d(e);
      }
      if (this.elementRef) {
        const e = l(this.elementRef);
        return d(e);
      }
      return d(u());
    },
    setupContrastObserver() {
      this.contrastObserver = new MutationObserver((e) => {
        for (const t of e)
          t.type === "attributes" && t.attributeName === "data-dt-contrast" && (this.currentContrast = s());
      }), this.contrastObserver.observe(document.documentElement, {
        attributes: !0,
        attributeFilter: ["data-dt-contrast"]
      });
    },
    setupModeObserver() {
      var o;
      const e = {
        attributes: !0,
        attributeFilter: ["data-dt-mode"],
        subtree: !1
      };
      this.modeObserver = new MutationObserver((a) => {
        for (const n of a)
          n.type === "attributes" && n.attributeName === "data-dt-mode" && (this.calculatedMode = this.calculateInvertedMode());
      }), this.modeObserver.observe(document.documentElement, e);
      let t = (o = this.elementRef) == null ? void 0 : o.parentElement;
      for (; t; )
        t.hasAttribute("data-dt-mode") && this.modeObserver.observe(t, e), t = t.parentElement;
    }
  }
};
var h = function() {
  var t = this, o = t._self._c;
  return o(t.as, t._b({ tag: "component", staticClass: "d-mode-island", attrs: { "data-dt-mode": t.computedMode, "data-mode-island-inverted": t.invertedAttribute, "data-dt-contrast": t.currentContrast } }, "component", t.$attrs, !1), [t._t("default")], 2);
}, f = [], b = /* @__PURE__ */ c(
  m,
  h,
  f
);
const O = b.exports;
export {
  O as default
};
//# sourceMappingURL=mode-island.js.map
