@bendyline/squisq 2.1.0 → 2.2.0

package/src/schemas/Transitions.ts

@@ -1,224 +0,0 @@
-/**
- * Shared transition vocabulary for block-to-block slide changes.
- *
- * The canonical names are based on PowerPoint / PresentationML transition
- * names where possible, with a few legacy renderer aliases kept so older
- * Squisq documents continue to work.
- */
-
-export const DEFAULT_TRANSITION_DURATION_SECONDS = 0.7;
-
-export const TRANSITION_TYPES = [
-  // Existing / common transitions
-  'cut',
-  'fade',
-  'dissolve',
-  'push',
-  'wipe',
-  'split',
-  'reveal',
-  'randomBars',
-  'shape',
-  'uncover',
-  'cover',
-  'zoom',
-  'pan',
-
-  // PowerPoint subtle / exciting transitions
-  'flash',
-  'fallOver',
-  'drape',
-  'curtains',
-  'wind',
-  'prestige',
-  'fracture',
-  'crush',
-  'peelOff',
-  'pageCurl',
-  'airplane',
-  'origami',
-  'checkerboard',
-  'blinds',
-  'clock',
-  'ripple',
-  'honeycomb',
-  'glitter',
-  'vortex',
-  'shred',
-  'switch',
-  'flip',
-  'gallery',
-  'cube',
-  'doors',
-  'box',
-  'ferrisWheel',
-  'conveyor',
-  'rotate',
-  'window',
-  'orbit',
-  'flyThrough',
-  'morph',
-
-  // PresentationML/Open XML precise names and legacy aliases
-  'checker',
-  'circle',
-  'comb',
-  'diamond',
-  'newsflash',
-  'plus',
-  'pull',
-  'random',
-  'randomBar',
-  'strips',
-  'wedge',
-  'wheel',
-  'prism',
-  'warp',
-  'ferris',
-  'flythrough',
-  'wheelReverse',
-  'pageCurlDouble',
-  'pageCurlSingle',
-  'slideLeft',
-  'slideRight',
-  'slideUp',
-  'slideDown',
-] as const;
-
-export type TransitionType = (typeof TRANSITION_TYPES)[number];
-
-export const TRANSITION_DIRECTIONS = [
-  'left',
-  'right',
-  'up',
-  'down',
-  'in',
-  'out',
-  'horizontal',
-  'vertical',
-] as const;
-
-export type TransitionDirection = (typeof TRANSITION_DIRECTIONS)[number];
-
-/**
- * Transition between blocks.
- *
- * A block's transition is the lead-in from the previous block. The same
- * transition drives the entering block and the previous block's exit.
- */
-export interface Transition {
-  /** Transition type */
-  type: TransitionType;
-  /** Duration in seconds. Defaults to DEFAULT_TRANSITION_DURATION_SECONDS. */
-  duration?: number;
-  /** Optional direction/variant for directional transitions. */
-  direction?: TransitionDirection;
-}
-
-const TRANSITION_TYPE_SET = new Set<string>(TRANSITION_TYPES);
-
-const TRANSITION_TYPE_ALIASES: Record<string, TransitionType> = {
-  none: 'cut',
-  randombars: 'randomBars',
-  randombar: 'randomBar',
-  // Self-referential spellings (`checkerboard`, `shape`, `uncover`) are
-  // intentionally absent: an exact valid type returns early from
-  // `normalizeTransitionType`, and any case variant resolves through
-  // `NORMALIZED_TRANSITION_TYPES`. Only the *plural* aliases need an entry.
-  checkerboards: 'checkerboard',
-  shapes: 'shape',
-  ferris: 'ferrisWheel',
-  ferriswheel: 'ferrisWheel',
-  flythrough: 'flyThrough',
-  flythru: 'flyThrough',
-  pagecurl: 'pageCurl',
-  pagecurldouble: 'pageCurlDouble',
-  pagecurlsingle: 'pageCurlSingle',
-  wheelreverse: 'wheelReverse',
-  slideleft: 'slideLeft',
-  slideright: 'slideRight',
-  slideup: 'slideUp',
-  slidedown: 'slideDown',
-};
-
-const NORMALIZED_TRANSITION_TYPES = new Map<string, TransitionType>(
-  TRANSITION_TYPES.map((type) => [normalizeToken(type), type]),
-);
-
-export function isTransitionType(value: string): value is TransitionType {
-  return TRANSITION_TYPE_SET.has(value);
-}
-
-export function normalizeTransitionType(value: string): TransitionType | null {
-  const trimmed = value.trim();
-  if (!trimmed) return null;
-  if (isTransitionType(trimmed)) return trimmed;
-  const normalized = normalizeToken(trimmed);
-  return TRANSITION_TYPE_ALIASES[normalized] ?? NORMALIZED_TRANSITION_TYPES.get(normalized) ?? null;
-}
-
-export function normalizeTransitionDirection(value: string): TransitionDirection | null {
-  const normalized = normalizeToken(value);
-  switch (normalized) {
-    case 'left':
-    case 'l':
-      return 'left';
-    case 'right':
-    case 'r':
-      return 'right';
-    case 'up':
-    case 'u':
-      return 'up';
-    case 'down':
-    case 'd':
-      return 'down';
-    case 'in':
-      return 'in';
-    case 'out':
-      return 'out';
-    case 'horizontal':
-    case 'horz':
-    case 'h':
-      return 'horizontal';
-    case 'vertical':
-    case 'vert':
-    case 'v':
-      return 'vertical';
-    default:
-      return null;
-  }
-}
-
-export function resolveTransitionDuration(
-  transition: Transition | undefined,
-  fallback: number = DEFAULT_TRANSITION_DURATION_SECONDS,
-): number {
-  const duration = transition?.duration;
-  return duration != null && Number.isFinite(duration) && duration > 0 ? duration : fallback;
-}
-
-/**
- * Resolve the effective transition for a block: the authored value wins
- * (markdown frontmatter and transform styles both write `block.transition`
- * upstream), then the theme's `renderStyle.defaultTransition`, then
- * `undefined` (the player's built-in default).
- *
- * Block 0 never gets a theme default — an entrance transition on the first
- * block would dim the opening frames of every exported video.
- *
- * The theme parameter is structural (not `Theme`) to avoid a schema import
- * cycle; pass any resolved theme.
- */
-export function resolveBlockTransition(
-  block: { transition?: Transition },
-  theme: { renderStyle: { defaultTransition?: Transition } },
-  blockIndex: number,
-): Transition | undefined {
-  if (block.transition) return block.transition;
-  if (blockIndex === 0) return undefined;
-  return theme.renderStyle.defaultTransition;
-}
-
-function normalizeToken(value: string): string {
-  return value.toLowerCase().replace(/[\s_-]+/g, '');
-}

package/src/schemas/Types.ts

@@ -1,15 +0,0 @@
-/**
- * Core geographic types shared across squisq.
- */
-
-export interface Coordinates {
-  lat: number;
-  lng: number;
-}
-
-export interface BoundingBox {
-  north: number;
-  south: number;
-  east: number;
-  west: number;
-}

package/src/schemas/Viewport.ts

@@ -1,91 +0,0 @@
-/**
- * Viewport Configuration
- *
- * Defines viewport dimensions for doc rendering across different aspect ratios.
- * Templates use this configuration to adapt their layouts appropriately.
- *
- * Supported aspect ratios:
- * - landscape (16:9) - Default, standard video/presentation format
- * - portrait (9:16) - Vertical video, mobile stories
- * - square (1:1) - Social media posts
- * - standard (4:3) - Classic presentation format
- */
-
-/**
- * Viewport configuration for doc rendering.
- */
-export interface ViewportConfig {
-  /** Canonical width in virtual pixels */
-  width: number;
-  /** Canonical height in virtual pixels */
-  height: number;
-  /** Human-readable name for debugging/display */
-  name: string;
-}
-
-/**
- * Standard viewport presets for common aspect ratios.
- */
-export const VIEWPORT_PRESETS = {
-  /** 16:9 landscape (default, 1080p) */
-  landscape: { width: 1920, height: 1080, name: '16:9 Landscape' },
-  /** 9:16 portrait (vertical video, stories) */
-  portrait: { width: 1080, height: 1920, name: '9:16 Portrait' },
-  /** 1:1 square (social media) */
-  square: { width: 1080, height: 1080, name: '1:1 Square' },
-  /** 4:3 standard */
-  standard: { width: 1440, height: 1080, name: '4:3 Standard' },
-} as const;
-
-/**
- * Viewport preset name.
- */
-export type ViewportPreset = keyof typeof VIEWPORT_PRESETS;
-
-/**
- * Viewport orientation derived from aspect ratio.
- */
-export type ViewportOrientation = 'landscape' | 'portrait' | 'square';
-
-/**
- * Get a viewport configuration from a preset name or return the config if already a ViewportConfig.
- */
-export function getViewport(viewport: ViewportPreset | ViewportConfig): ViewportConfig {
-  if (typeof viewport === 'string') {
-    return VIEWPORT_PRESETS[viewport];
-  }
-  return viewport;
-}
-
-/**
- * Calculate font scale factor for a viewport.
- * Based on diagonal pixels relative to 1080p landscape reference.
- * This ensures text remains readable across different viewport sizes.
- */
-const REFERENCE_DIAGONAL = Math.sqrt(1920 * 1920 + 1080 * 1080); // ~2203
-
-export function calculateFontScale(viewport: ViewportConfig): number {
-  const currentDiagonal = Math.sqrt(
-    viewport.width * viewport.width + viewport.height * viewport.height,
-  );
-  return currentDiagonal / REFERENCE_DIAGONAL;
-}
-
-/**
- * Determine if viewport is landscape, portrait, or square.
- */
-export function getViewportOrientation(viewport: ViewportConfig): ViewportOrientation {
-  const ratio = viewport.width / viewport.height;
-  // Allow small tolerance for "square" classification
-  if (Math.abs(ratio - 1) < 0.05) return 'square';
-  return ratio > 1 ? 'landscape' : 'portrait';
-}
-
-/**
- * Get aspect ratio as a string (e.g., "16:9", "9:16", "1:1").
- */
-export function getAspectRatioString(viewport: ViewportConfig): string {
-  const gcd = (a: number, b: number): number => (b === 0 ? a : gcd(b, a % b));
-  const divisor = gcd(viewport.width, viewport.height);
-  return `${viewport.width / divisor}:${viewport.height / divisor}`;
-}

package/src/schemas/colorUtils.ts

@@ -1,219 +0,0 @@
-/**
- * Color Utilities
- *
- * Pure-JS color math used by theme compilation and contrast checks.
- * No dependencies. Operates on `#rrggbb` hex strings.
- *
- * Internally uses OKLCh — perceptually uniform, so lightening by 0.1
- * looks like the same change at any starting point. Out-of-gamut
- * results are clamped to sRGB.
- */
-
-const HEX_RE = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i;
-
-/** Test whether a string is a valid `#rgb` or `#rrggbb` hex color. */
-export function isHex(value: string): boolean {
-  return HEX_RE.test(value);
-}
-
-/** Parse `#rgb` or `#rrggbb` into 0..1 sRGB triplet. Returns null on failure. */
-function parseHex(hex: string): [number, number, number] | null {
-  if (!HEX_RE.test(hex)) return null;
-  let body = hex.slice(1);
-  if (body.length === 3)
-    body = body
-      .split('')
-      .map((c) => c + c)
-      .join('');
-  return [
-    parseInt(body.slice(0, 2), 16) / 255,
-    parseInt(body.slice(2, 4), 16) / 255,
-    parseInt(body.slice(4, 6), 16) / 255,
-  ];
-}
-
-function toHex(rgb: [number, number, number]): string {
-  const ch = (v: number) => {
-    const c = Math.max(0, Math.min(255, Math.round(v * 255)));
-    return c.toString(16).padStart(2, '0');
-  };
-  return '#' + ch(rgb[0]) + ch(rgb[1]) + ch(rgb[2]);
-}
-
-function srgbToLinear(c: number): number {
-  return c <= 0.04045 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
-}
-
-function linearToSrgb(c: number): number {
-  return c <= 0.0031308 ? c * 12.92 : 1.055 * Math.pow(c, 1 / 2.4) - 0.055;
-}
-
-interface OKLCh {
-  L: number;
-  C: number;
-  h: number;
-}
-
-function rgbToOklch(rgb: [number, number, number]): OKLCh {
-  const [sr, sg, sb] = rgb;
-  const r = srgbToLinear(sr);
-  const g = srgbToLinear(sg);
-  const b = srgbToLinear(sb);
-
-  const l = 0.4122214708 * r + 0.5363325363 * g + 0.0514459929 * b;
-  const m = 0.2119034982 * r + 0.6806995451 * g + 0.1073969566 * b;
-  const s = 0.0883024619 * r + 0.2817188376 * g + 0.6299787005 * b;
-
-  const l_ = Math.cbrt(l);
-  const m_ = Math.cbrt(m);
-  const s_ = Math.cbrt(s);
-
-  const L = 0.2104542553 * l_ + 0.793617785 * m_ - 0.0040720468 * s_;
-  const a = 1.9779984951 * l_ - 2.428592205 * m_ + 0.4505937099 * s_;
-  const bb = 0.0259040371 * l_ + 0.7827717662 * m_ - 0.808675766 * s_;
-
-  const C = Math.sqrt(a * a + bb * bb);
-  let h = (Math.atan2(bb, a) * 180) / Math.PI;
-  if (h < 0) h += 360;
-  return { L, C, h };
-}
-
-function oklchToRgb({ L, C, h }: OKLCh): [number, number, number] {
-  const hr = (h * Math.PI) / 180;
-  const a = C * Math.cos(hr);
-  const bb = C * Math.sin(hr);
-
-  const l_ = L + 0.3963377774 * a + 0.2158037573 * bb;
-  const m_ = L - 0.1055613458 * a - 0.0638541728 * bb;
-  const s_ = L - 0.0894841775 * a - 1.291485548 * bb;
-
-  const l = l_ * l_ * l_;
-  const m = m_ * m_ * m_;
-  const s = s_ * s_ * s_;
-
-  const r = +4.0767416621 * l - 3.3077115913 * m + 0.2309699292 * s;
-  const g = -1.2684380046 * l + 2.6097574011 * m - 0.3413193965 * s;
-  const b = -0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s;
-
-  return [
-    Math.max(0, Math.min(1, linearToSrgb(r))),
-    Math.max(0, Math.min(1, linearToSrgb(g))),
-    Math.max(0, Math.min(1, linearToSrgb(b))),
-  ];
-}
-
-/**
- * Lighten a color by `amount` (0..1) in OKLCh L space.
- * Falls back to the input on parse failure.
- */
-export function oklchLighten(hex: string, amount: number): string {
-  const rgb = parseHex(hex);
-  if (!rgb) return hex;
-  const lch = rgbToOklch(rgb);
-  lch.L = Math.max(0, Math.min(1, lch.L + amount));
-  return toHex(oklchToRgb(lch));
-}
-
-/**
- * Darken a color by `amount` (0..1) in OKLCh L space.
- * Falls back to the input on parse failure.
- */
-export function oklchDarken(hex: string, amount: number): string {
-  return oklchLighten(hex, -amount);
-}
-
-/**
- * Adjust the OKLCh chroma of a color by a multiplier (e.g. 0.7 to mute).
- */
-export function oklchSetChroma(hex: string, multiplier: number): string {
-  const rgb = parseHex(hex);
-  if (!rgb) return hex;
-  const lch = rgbToOklch(rgb);
-  lch.C = Math.max(0, lch.C * multiplier);
-  return toHex(oklchToRgb(lch));
-}
-
-/**
- * WCAG relative luminance of a hex color, returned as 0..1.
- */
-export function relativeLuminance(hex: string): number {
-  const rgb = parseHex(hex);
-  if (!rgb) return 0;
-  const [r, g, b] = rgb.map(srgbToLinear) as [number, number, number];
-  return 0.2126 * r + 0.7152 * g + 0.0722 * b;
-}
-
-/**
- * Hue of a hex color in HSL degrees (0..360). Returns 0 for pure grays
- * and on parse failure. Used by the duotone image treatment to aim its
- * `hue-rotate()` at the theme's tint color.
- */
-export function hexHueDegrees(hex: string): number {
-  const rgb = parseHex(hex);
-  if (!rgb) return 0;
-  const [r, g, b] = rgb;
-  const max = Math.max(r, g, b);
-  const min = Math.min(r, g, b);
-  if (max === min) return 0;
-  const d = max - min;
-  let h: number;
-  if (max === r) h = ((g - b) / d) % 6;
-  else if (max === g) h = (b - r) / d + 2;
-  else h = (r - g) / d + 4;
-  return Math.round((h * 60 + 360) % 360);
-}
-
-/**
- * Convert a hex color + alpha (0..1) to an `rgba()` string.
- * Falls back to the input on parse failure (e.g. a value that is
- * already an rgba()/gradient string).
- */
-export function withAlpha(hex: string, alpha: number): string {
-  const rgb = parseHex(hex);
-  if (!rgb) return hex;
-  const a = Math.max(0, Math.min(1, alpha));
-  const ch = (v: number) => Math.round(v * 255);
-  return `rgba(${ch(rgb[0])}, ${ch(rgb[1])}, ${ch(rgb[2])}, ${a})`;
-}
-
-/**
- * WCAG contrast ratio between two hex colors. Returns 1..21.
- */
-export function contrastRatio(a: string, b: string): number {
-  const la = relativeLuminance(a);
-  const lb = relativeLuminance(b);
-  const lighter = Math.max(la, lb);
-  const darker = Math.min(la, lb);
-  return (lighter + 0.05) / (darker + 0.05);
-}
-
-/**
- * Pick a near-white or near-black text color that contrasts well against `bg`.
- */
-export function pickContrastingText(bg: string, light = '#f7fafc', dark = '#1a202c'): string {
-  return contrastRatio(bg, dark) >= contrastRatio(bg, light) ? dark : light;
-}
-
-/**
- * Derive a 5-step lighter→darker scale from a seed color.
- * Stops are evenly spaced in OKLCh L space around the seed.
- * `spread` controls amplitude (0.05 = subtle, 0.15 = balanced, 0.22 = high).
- */
-export function deriveScale(
-  seedHex: string,
-  spread = 0.15,
-): {
-  lighter2: string;
-  lighter1: string;
-  base: string;
-  darker1: string;
-  darker2: string;
-} {
-  return {
-    lighter2: oklchLighten(seedHex, spread),
-    lighter1: oklchLighten(seedHex, spread / 2),
-    base: seedHex,
-    darker1: oklchDarken(seedHex, spread / 2),
-    darker2: oklchDarken(seedHex, spread),
-  };
-}