/**
 * 交互过渡时长（hover / focus / 展开折叠等，GLOBAL §6）
 * 事实源：语义 token instant / fast / normal / slow，每档一个 duration。
 */

export const MOTION_TRANSITION_DURATION_META = {
  label: '过渡时长',
  desc: '属性状态切换（非无限循环 loading）',
};

/** 对外唯一交互过渡 token：时长 + 标准缓动一体 */
export const MOTION_UI_TRANSITION_META = {
  label: '交互过渡',
  desc: 'hover / focus / 展开折叠只选本组四档；Tailwind 用 tfds-motion-ui-{tier}，inline 用 var(--motion-ui-{tier})',
};

/** id = 语义名；--motion-transition-{id} 为唯一对外 CSS 变量 */
export const TOKEN_MOTION_TRANSITION = {
  instant: { label: 'instant', duration: '100ms', hint: '日历格、选项轻反馈' },
  fast: { label: 'fast', duration: '150ms', hint: 'hover/focus 微变化（主力档）' },
  normal: {
    label: 'normal',
    duration: '200ms',
    hint: '常速交互、Tabs、Card、TagBar 折叠',
  },
  slow: { label: 'slow', duration: '300ms', hint: '侧栏展开、抽屉/大面积布局' },
};

/** 最快 → 最慢 */
export const MOTION_TRANSITION_IDS = ['instant', 'fast', 'normal', 'slow'];

/** 旧版数字 id → 语义名（resolve / 扁平表兼容） */
export const MOTION_TRANSITION_LEGACY_NUMERIC = {
  100: 'instant',
  150: 'fast',
  200: 'normal',
  300: 'slow',
};

/** @param {string} [semanticOrLegacyId] */
export function resolveMotionTransitionDuration(semanticOrLegacyId) {
  const legacy = MOTION_TRANSITION_LEGACY_NUMERIC[semanticOrLegacyId];
  const id = legacy || (TOKEN_MOTION_TRANSITION[semanticOrLegacyId] ? semanticOrLegacyId : 'normal');
  return TOKEN_MOTION_TRANSITION[id]?.duration ?? '200ms';
}

/** 扁平 duration 表（TOKEN_MOTION.transitionFlat） */
export function buildMotionTransitionFlatMap() {
  const out = {};
  MOTION_TRANSITION_IDS.forEach((id) => {
    out[id] = TOKEN_MOTION_TRANSITION[id].duration;
  });
  Object.entries(MOTION_TRANSITION_LEGACY_NUMERIC).forEach(([num, id]) => {
    out[num] = TOKEN_MOTION_TRANSITION[id].duration;
  });
  return out;
}

/** @theme 语义过渡变量（每档直接写 duration，不再双层 ms + 别名） */
export function buildMotionTransitionCssVarLines({ indent = '  ' } = {}) {
  const lines = [];
  lines.push(`${indent}/* ── 交互过渡时长（内部实现 · AI 选用 --motion-ui-*）── */`);
  MOTION_TRANSITION_IDS.forEach((id) => {
    lines.push(`${indent}--motion-transition-${id}: ${TOKEN_MOTION_TRANSITION[id].duration};`);
  });
  return lines;
}

/** @theme 交互过渡预设（duration + --motion-transition-easing） */
export function buildMotionUiTransitionCssVarLines({ indent = '  ' } = {}) {
  const lines = [];
  lines.push(`${indent}/* ── 交互过渡预设（--motion-ui-{instant|fast|normal|slow}）── */`);
  MOTION_TRANSITION_IDS.forEach((id) => {
    lines.push(
      `${indent}--motion-ui-${id}: var(--motion-transition-${id}) var(--motion-transition-easing);`,
    );
  });
  return lines;
}

/** theme.css 工具类：同时设置 duration 与 transition-timing-function */
export function buildMotionUiUtilityCssLines() {
  const lines = [];
  lines.push('');
  lines.push('/* ── 交互过渡预设工具类（tfds-motion-ui-*）── */');
  MOTION_TRANSITION_IDS.forEach((id) => {
    lines.push(`.tfds-motion-ui-${id} {`);
    lines.push(`  transition-duration: var(--motion-transition-${id});`);
    lines.push('  transition-timing-function: var(--motion-transition-easing);');
    lines.push('}');
  });
  return lines;
}
