import { markHTMLString } from "./escape.js";
import { slide, fade } from "../../transitions/index.js";
const transitionNameMap = /* @__PURE__ */ new WeakMap();
function incrementTransitionNumber(result) {
  let num = 1;
  if (transitionNameMap.has(result)) {
    num = transitionNameMap.get(result) + 1;
  }
  transitionNameMap.set(result, num);
  return num;
}
function createTransitionScope(result, hash) {
  const num = incrementTransitionNumber(result);
  return `astro-${hash}-${num}`;
}
function renderTransition(result, hash, animationName, transitionName) {
  let animations = null;
  switch (animationName) {
    case "fade": {
      animations = fade();
      break;
    }
    case "slide": {
      animations = slide();
      break;
    }
    default: {
      if (typeof animationName === "object") {
        animations = animationName;
      }
    }
  }
  const scope = createTransitionScope(result, hash);
  if (!transitionName) {
    transitionName = scope;
  }
  const styles = markHTMLString(`<style>[data-astro-transition-scope="${scope}"] {
	view-transition-name: ${transitionName};
}
	${!animations ? `` : (
    // Regular animations
    `
::view-transition-old(${transitionName}) {
	${stringifyAnimation(animations.forwards.old)}
}

[data-astro-transition-fallback=old] [data-astro-transition-scope="${scope}"] {
	${stringifyAnimation(animations.forwards.old)}
}

::view-transition-new(${transitionName}) {
	${stringifyAnimation(animations.forwards.new)}
}

[data-astro-transition-fallback=new] [data-astro-transition-scope="${scope}"] {
	${stringifyAnimation(animations.forwards.new)}
}

[data-astro-transition=back]::view-transition-old(${transitionName}) {
	${stringifyAnimation(animations.backwards.old)}
}

[data-astro-transition=back][data-astro-transition-fallback=old] [data-astro-transition-scope="${scope}"] {
	${stringifyAnimation(animations.backwards.old)}
}

[data-astro-transition=back]::view-transition-new(${transitionName}) {
	${stringifyAnimation(animations.backwards.new)}
}

[data-astro-transition=back][data-astro-transition-fallback=new] [data-astro-transition-scope="${scope}"] {
	${stringifyAnimation(animations.backwards.new)}
}
	`.trim()
  )}
	</style>`);
  result._metadata.extraHead.push(styles);
  return scope;
}
function addAnimationProperty(builder, prop, value) {
  let arr = builder[prop];
  if (Array.isArray(arr)) {
    arr.push(value.toString());
  } else {
    builder[prop] = [value.toString()];
  }
}
function animationBuilder() {
  return {
    toString() {
      let out = "";
      for (let k in this) {
        let value = this[k];
        if (Array.isArray(value)) {
          out += `
	${k}: ${value.join(", ")};`;
        }
      }
      return out;
    }
  };
}
function stringifyAnimation(anim) {
  if (Array.isArray(anim)) {
    return stringifyAnimations(anim);
  } else {
    return stringifyAnimations([anim]);
  }
}
function stringifyAnimations(anims) {
  const builder = animationBuilder();
  for (const anim of anims) {
    if (anim.duration) {
      addAnimationProperty(builder, "animation-duration", toTimeValue(anim.duration));
    }
    if (anim.easing) {
      addAnimationProperty(builder, "animation-timing-function", anim.easing);
    }
    if (anim.direction) {
      addAnimationProperty(builder, "animation-direction", anim.direction);
    }
    if (anim.delay) {
      addAnimationProperty(builder, "animation-delay", anim.delay);
    }
    if (anim.fillMode) {
      addAnimationProperty(builder, "animation-fill-mode", anim.fillMode);
    }
    addAnimationProperty(builder, "animation-name", anim.name);
  }
  return builder.toString();
}
function toTimeValue(num) {
  return typeof num === "number" ? num + "ms" : num;
}
export {
  renderTransition
};
