// composer-facing registry. shared tokens live in
// `sootsim-engine/src/screenshots/tokens.ts` so the live browser
// screenshot mode and the post-process composer render from the same
// canvas / background / text / pose / animation / clamp vocabulary.
//
// this module re-exports those tokens plus the composer-specific
// `FrameComposeSpec` shape.

import type { DeviceModel } from 'sootsim-engine/settings'

export {
  BACKGROUND_PRESETS,
  DEFAULT_FRAME_SHADOW,
  DEFAULT_FRAME_STYLE,
  SCREENSHOT_CANVASES,
  SCREENSHOT_MODE_ANIM,
  SCREENSHOT_TEXT_CLAMP,
  SCREENSHOT_TEXT_SAFE_AREA,
  cloneBackgroundSpec,
  resolveBackgroundPreset,
  resolveCanvasPreset,
} from 'sootsim-engine/screenshots/tokens'

export type {
  BackgroundPresetName,
  BackgroundSpec,
  CanvasPreset,
  FrameShadowSpec,
  GradientStop,
  PosePresetName,
  ScreenshotCanvasName,
  TextPresetName,
} from 'sootsim-engine/screenshots/tokens'

import type { FrameShadowSpec, PosePresetName } from 'sootsim-engine/screenshots/tokens'

export interface FrameComposeSpec {
  show: boolean
  style: DeviceModel
  pose: PosePresetName
  scale: number
  offsetY: number
  shadow: FrameShadowSpec
}

export function toAssetKey(value: string): string {
  const normalized = value
    .replace(/\\/g, '/')
    .replace(/\.png$/i, '')
    .trim()
    .split('/')
    .filter(Boolean)
    .join('--')
    .replace(/[^A-Za-z0-9-]+/g, '-')
    .replace(/-+/g, '-')
    .replace(/^-|-$/g, '')
  return normalized || 'slide'
}