"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const React = require("react");
const isForcedMotionValue = require("./dist-es-motion-utils-is-forced-motion-value.cjs");
const isMotionValue = require("./dist-es-value-utils-is-motion-value.cjs");
const buildStyles = require("./dist-es-render-html-utils-build-styles.cjs");
const createRenderState = require("./dist-es-render-html-utils-create-render-state.cjs");
function copyRawValuesOnly(target, source, props) {
  for (const key in source) {
    if (!isMotionValue.isMotionValue(source[key]) && !isForcedMotionValue.isForcedMotionValue(key, props)) {
      target[key] = source[key];
    }
  }
}
function useInitialMotionValues({ transformTemplate }, visualState) {
  return React.useMemo(() => {
    const state = createRenderState.createHtmlRenderState();
    buildStyles.buildHTMLStyles(state, visualState, transformTemplate);
    return Object.assign({}, state.vars, state.style);
  }, [visualState]);
}
function useStyle(props, visualState) {
  const styleProp = props.style || {};
  const style = {};
  copyRawValuesOnly(style, styleProp, props);
  Object.assign(style, useInitialMotionValues(props, visualState));
  return style;
}
function useHTMLProps(props, visualState) {
  const htmlProps = {};
  const style = useStyle(props, visualState);
  if (props.drag && props.dragListener !== false) {
    htmlProps.draggable = false;
    style.userSelect = style.WebkitUserSelect = style.WebkitTouchCallout = "none";
    style.touchAction = props.drag === true ? "none" : `pan-${props.drag === "x" ? "y" : "x"}`;
  }
  if (props.tabIndex === void 0 && (props.onTap || props.onTapStart || props.whileTap)) {
    htmlProps.tabIndex = 0;
  }
  htmlProps.style = style;
  return htmlProps;
}
exports.copyRawValuesOnly = copyRawValuesOnly;
exports.useHTMLProps = useHTMLProps;
//# sourceMappingURL=dist-es-render-html-use-props.cjs.map
