import { measureViewportBox } from "../../projection/utils/measure.js";
import { DOMVisualElement } from "../dom/DOMVisualElement.js";
import { buildHTMLStyles } from "./utils/build-styles.js";
import { renderHTML } from "./utils/render.js";
import { scrapeMotionValuesFromProps } from "./utils/scrape-motion-values.js";
import { transformProps } from "../../../../../motion-dom/dist/es/render/utils/keys-transform.js";
import { defaultTransformValue, readTransformValue } from "../../../../../motion-dom/dist/es/render/dom/parse-transform.js";
import { isCSSVariableName } from "../../../../../motion-dom/dist/es/animation/utils/is-css-variable.js";
function getComputedStyle(element) {
  return window.getComputedStyle(element);
}
class HTMLVisualElement extends DOMVisualElement {
  constructor() {
    super(...arguments);
    this.type = "html";
    this.renderInstance = renderHTML;
  }
  readValueFromInstance(instance, key) {
    if (transformProps.has(key)) {
      return this.projection?.isProjecting ? defaultTransformValue(key) : readTransformValue(instance, key);
    } else {
      const computedStyle = getComputedStyle(instance);
      const value = (isCSSVariableName(key) ? computedStyle.getPropertyValue(key) : computedStyle[key]) || 0;
      return typeof value === "string" ? value.trim() : value;
    }
  }
  measureInstanceViewportBox(instance, { transformPagePoint }) {
    return measureViewportBox(instance, transformPagePoint);
  }
  build(renderState, latestValues, props) {
    buildHTMLStyles(renderState, latestValues, props.transformTemplate);
  }
  scrapeMotionValuesFromProps(props, prevProps, visualElement) {
    return scrapeMotionValuesFromProps(props, prevProps, visualElement);
  }
}
export {
  HTMLVisualElement,
  getComputedStyle
};
//# sourceMappingURL=HTMLVisualElement.js.map
