/*
 * @Author: LiZhiWei
 * @Date: 2025-12-29 11:59:39
 * @LastEditors: LiZhiWei
 * @LastEditTime: 2025-12-30 11:58:04
 * @Description: 
 */
import type { CSSProperties } from "vue"
import type { PptxElement } from "./pptxTypes"
import { getNumber } from "./pptxUtils"

export function getHtmlBoxStyle(_el: PptxElement) {
  return {
    position: "absolute",
    left: 0,
    top: 0,
    width: "100%",
    height: "100%",
    display: "table" as const,
  } as CSSProperties
}

export function getHtmlInnerStyle(el: PptxElement) {
  const autoFit = (el as any)?.autoFit
  const rawScale = autoFit && typeof autoFit === "object" ? getNumber(autoFit.fontScale) : 1
  const fontScale = rawScale && rawScale !== 1 ? Math.max(0.1, Math.min(5, rawScale)) : 1

  const isVertical = !!(el as any)?.isVertical
  const writingMode = isVertical ? ("vertical-rl" as const) : undefined
  const textOrientation = isVertical ? ("mixed" as const) : undefined

  const vAlign = String(el.vAlign || "up")
  const verticalAlign = vAlign === "down" ? ("bottom" as const) : vAlign === "mid" ? ("middle" as const) : ("top" as const)

  if (fontScale === 1) {
    return {
      display: "table-cell" as const,
      width: "100%",
      height: "100%",
      verticalAlign,
      writingMode,
      textOrientation,
    } as CSSProperties
  }

  return {
    display: "table-cell" as const,
    // width: `${inv}%`,
    // height: `${inv}%`,
    width: "100%",
    height: "100%",
    position: "absolute",
    left: 0,
    top: 0,
    verticalAlign,
    // transformOrigin: "top left",
    // transform: `scale(${fontScale})`,
    writingMode,
    textOrientation,
  } as CSSProperties
}
