@fairyhunter13/opentui-core 0.1.112 → 0.1.114

package/src/lib/RGBA.ts

@@ -0,0 +1,204 @@
+export class RGBA {
+  buffer: Float32Array
+
+  constructor(buffer: Float32Array) {
+    this.buffer = buffer
+  }
+
+  static fromArray(array: Float32Array) {
+    return new RGBA(array)
+  }
+
+  static fromValues(r: number, g: number, b: number, a: number = 1.0) {
+    return new RGBA(new Float32Array([r, g, b, a]))
+  }
+
+  static fromInts(r: number, g: number, b: number, a: number = 255) {
+    return new RGBA(new Float32Array([r / 255, g / 255, b / 255, a / 255]))
+  }
+
+  static fromHex(hex: string): RGBA {
+    return hexToRgb(hex)
+  }
+
+  toInts(): [number, number, number, number] {
+    return [Math.round(this.r * 255), Math.round(this.g * 255), Math.round(this.b * 255), Math.round(this.a * 255)]
+  }
+
+  get r(): number {
+    return this.buffer[0]
+  }
+
+  set r(value: number) {
+    this.buffer[0] = value
+  }
+
+  get g(): number {
+    return this.buffer[1]
+  }
+
+  set g(value: number) {
+    this.buffer[1] = value
+  }
+
+  get b(): number {
+    return this.buffer[2]
+  }
+
+  set b(value: number) {
+    this.buffer[2] = value
+  }
+
+  get a(): number {
+    return this.buffer[3]
+  }
+
+  set a(value: number) {
+    this.buffer[3] = value
+  }
+
+  map<R>(fn: (value: number) => R) {
+    return [fn(this.r), fn(this.g), fn(this.b), fn(this.a)]
+  }
+
+  toString() {
+    return `rgba(${this.r.toFixed(2)}, ${this.g.toFixed(2)}, ${this.b.toFixed(2)}, ${this.a.toFixed(2)})`
+  }
+
+  equals(other?: RGBA): boolean {
+    if (!other) return false
+    return this.r === other.r && this.g === other.g && this.b === other.b && this.a === other.a
+  }
+}
+
+export type ColorInput = string | RGBA
+
+export function hexToRgb(hex: string): RGBA {
+  hex = hex.replace(/^#/, "")
+
+  if (hex.length === 3) {
+    hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2]
+  } else if (hex.length === 4) {
+    hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2] + hex[3] + hex[3]
+  }
+
+  if (!/^[0-9A-Fa-f]{6}$/.test(hex) && !/^[0-9A-Fa-f]{8}$/.test(hex)) {
+    console.warn(`Invalid hex color: ${hex}, defaulting to magenta`)
+    return RGBA.fromValues(1, 0, 1, 1)
+  }
+
+  const r = parseInt(hex.substring(0, 2), 16) / 255
+  const g = parseInt(hex.substring(2, 4), 16) / 255
+  const b = parseInt(hex.substring(4, 6), 16) / 255
+  const a = hex.length === 8 ? parseInt(hex.substring(6, 8), 16) / 255 : 1
+
+  return RGBA.fromValues(r, g, b, a)
+}
+
+export function rgbToHex(rgb: RGBA): string {
+  const components = rgb.a === 1 ? [rgb.r, rgb.g, rgb.b] : [rgb.r, rgb.g, rgb.b, rgb.a]
+  return (
+    "#" +
+    components
+      .map((x) => {
+        const hex = Math.floor(Math.max(0, Math.min(1, x) * 255)).toString(16)
+        return hex.length === 1 ? "0" + hex : hex
+      })
+      .join("")
+  )
+}
+
+export function hsvToRgb(h: number, s: number, v: number): RGBA {
+  let r = 0,
+    g = 0,
+    b = 0
+
+  const i = Math.floor(h / 60) % 6
+  const f = h / 60 - Math.floor(h / 60)
+  const p = v * (1 - s)
+  const q = v * (1 - f * s)
+  const t = v * (1 - (1 - f) * s)
+
+  switch (i) {
+    case 0:
+      r = v
+      g = t
+      b = p
+      break
+    case 1:
+      r = q
+      g = v
+      b = p
+      break
+    case 2:
+      r = p
+      g = v
+      b = t
+      break
+    case 3:
+      r = p
+      g = q
+      b = v
+      break
+    case 4:
+      r = t
+      g = p
+      b = v
+      break
+    case 5:
+      r = v
+      g = p
+      b = q
+      break
+  }
+
+  return RGBA.fromValues(r, g, b, 1)
+}
+
+const CSS_COLOR_NAMES: Record<string, string> = {
+  black: "#000000",
+  white: "#FFFFFF",
+  red: "#FF0000",
+  green: "#008000",
+  blue: "#0000FF",
+  yellow: "#FFFF00",
+  cyan: "#00FFFF",
+  magenta: "#FF00FF",
+  silver: "#C0C0C0",
+  gray: "#808080",
+  grey: "#808080",
+  maroon: "#800000",
+  olive: "#808000",
+  lime: "#00FF00",
+  aqua: "#00FFFF",
+  teal: "#008080",
+  navy: "#000080",
+  fuchsia: "#FF00FF",
+  purple: "#800080",
+  orange: "#FFA500",
+  brightblack: "#666666",
+  brightred: "#FF6666",
+  brightgreen: "#66FF66",
+  brightblue: "#6666FF",
+  brightyellow: "#FFFF66",
+  brightcyan: "#66FFFF",
+  brightmagenta: "#FF66FF",
+  brightwhite: "#FFFFFF",
+}
+
+export function parseColor(color: ColorInput): RGBA {
+  if (typeof color === "string") {
+    const lowerColor = color.toLowerCase()
+
+    if (lowerColor === "transparent") {
+      return RGBA.fromValues(0, 0, 0, 0)
+    }
+
+    if (CSS_COLOR_NAMES[lowerColor]) {
+      return hexToRgb(CSS_COLOR_NAMES[lowerColor])
+    }
+
+    return hexToRgb(color)
+  }
+  return color
+}

package/src/lib/ascii.font.ts

@@ -0,0 +1,330 @@
+import { OptimizedBuffer } from "../buffer.js"
+import { parseColor, RGBA, type ColorInput } from "./RGBA.js"
+import block from "./fonts/block.json" with { type: "json" }
+import shade from "./fonts/shade.json" with { type: "json" }
+import slick from "./fonts/slick.json" with { type: "json" }
+import tiny from "./fonts/tiny.json" with { type: "json" }
+import huge from "./fonts/huge.json" with { type: "json" }
+import grid from "./fonts/grid.json" with { type: "json" }
+import pallet from "./fonts/pallet.json" with { type: "json" }
+
+/*
+ * Renders ASCII fonts to a buffer.
+ * Font definitions plugged from cfonts - https://github.com/dominikwilkowski/cfonts
+ */
+
+export type ASCIIFontName = "tiny" | "block" | "shade" | "slick" | "huge" | "grid" | "pallet"
+
+export const fonts = {
+  tiny,
+  block,
+  shade,
+  slick,
+  huge,
+  grid,
+  pallet,
+}
+
+type FontSegment = {
+  text: string
+  colorIndex: number
+}
+
+type FontDefinition = {
+  name: string
+  lines: number
+  letterspace_size: number
+  letterspace: string[]
+  colors?: number
+  chars: Record<string, string[]>
+}
+
+type ParsedFontDefinition = {
+  name: string
+  lines: number
+  letterspace_size: number
+  letterspace: string[]
+  colors: number
+  chars: Record<string, FontSegment[][]>
+}
+
+const parsedFonts: Record<string, ParsedFontDefinition> = {}
+
+function parseColorTags(text: string): FontSegment[] {
+  const segments: FontSegment[] = []
+  let currentIndex = 0
+
+  const colorTagRegex = /<c(\d+)>(.*?)<\/c\d+>/g
+  let lastIndex = 0
+  let match
+
+  while ((match = colorTagRegex.exec(text)) !== null) {
+    if (match.index > lastIndex) {
+      const plainText = text.slice(lastIndex, match.index)
+      if (plainText) {
+        segments.push({ text: plainText, colorIndex: 0 })
+      }
+    }
+
+    const colorIndex = parseInt(match[1]) - 1
+    const taggedText = match[2]
+    segments.push({ text: taggedText, colorIndex: Math.max(0, colorIndex) })
+
+    lastIndex = match.index + match[0].length
+  }
+
+  if (lastIndex < text.length) {
+    const remainingText = text.slice(lastIndex)
+    if (remainingText) {
+      segments.push({ text: remainingText, colorIndex: 0 })
+    }
+  }
+
+  return segments
+}
+
+function getParsedFont(fontKey: keyof typeof fonts): ParsedFontDefinition {
+  if (!parsedFonts[fontKey]) {
+    const fontDef = fonts[fontKey] as FontDefinition
+    const parsedChars: Record<string, FontSegment[][]> = {}
+
+    for (const [char, lines] of Object.entries(fontDef.chars)) {
+      parsedChars[char] = lines.map((line) => parseColorTags(line))
+    }
+
+    parsedFonts[fontKey] = {
+      ...fontDef,
+      colors: fontDef.colors || 1,
+      chars: parsedChars,
+    }
+  }
+
+  return parsedFonts[fontKey]
+}
+
+export function measureText({ text, font = "tiny" }: { text: string; font?: keyof typeof fonts }): {
+  width: number
+  height: number
+} {
+  const fontDef = getParsedFont(font)
+  if (!fontDef) {
+    console.warn(`Font '${font}' not found`)
+    return { width: 0, height: 0 }
+  }
+
+  let currentX = 0
+
+  for (let i = 0; i < text.length; i++) {
+    const char = text[i].toUpperCase()
+    const charDef = fontDef.chars[char]
+
+    if (!charDef) {
+      const spaceChar = fontDef.chars[" "]
+      if (spaceChar && spaceChar[0]) {
+        let spaceWidth = 0
+        for (const segment of spaceChar[0]) {
+          spaceWidth += segment.text.length
+        }
+        currentX += spaceWidth
+      } else {
+        currentX += 1
+      }
+      continue
+    }
+
+    let charWidth = 0
+    if (charDef[0]) {
+      for (const segment of charDef[0]) {
+        charWidth += segment.text.length
+      }
+    }
+
+    currentX += charWidth
+
+    if (i < text.length - 1) {
+      currentX += fontDef.letterspace_size
+    }
+  }
+
+  return {
+    width: currentX,
+    height: fontDef.lines,
+  }
+}
+
+export function getCharacterPositions(text: string, font: keyof typeof fonts = "tiny"): number[] {
+  const fontDef = getParsedFont(font)
+  if (!fontDef) {
+    return [0]
+  }
+
+  const positions: number[] = [0]
+  let currentX = 0
+
+  for (let i = 0; i < text.length; i++) {
+    const char = text[i].toUpperCase()
+    const charDef = fontDef.chars[char]
+
+    let charWidth = 0
+    if (!charDef) {
+      const spaceChar = fontDef.chars[" "]
+      if (spaceChar && spaceChar[0]) {
+        for (const segment of spaceChar[0]) {
+          charWidth += segment.text.length
+        }
+      } else {
+        charWidth = 1
+      }
+    } else if (charDef[0]) {
+      for (const segment of charDef[0]) {
+        charWidth += segment.text.length
+      }
+    }
+
+    currentX += charWidth
+
+    if (i < text.length - 1) {
+      currentX += fontDef.letterspace_size
+    }
+
+    positions.push(currentX)
+  }
+
+  return positions
+}
+
+export function coordinateToCharacterIndex(x: number, text: string, font: keyof typeof fonts = "tiny"): number {
+  const positions = getCharacterPositions(text, font)
+
+  if (x < 0) {
+    return 0
+  }
+
+  for (let i = 0; i < positions.length - 1; i++) {
+    const currentPos = positions[i]
+    const nextPos = positions[i + 1]
+
+    if (x >= currentPos && x < nextPos) {
+      const charMidpoint = currentPos + (nextPos - currentPos) / 2
+      return x < charMidpoint ? i : i + 1
+    }
+  }
+
+  if (positions.length > 0 && x >= positions[positions.length - 1]) {
+    return text.length
+  }
+
+  return 0
+}
+
+export function renderFontToFrameBuffer(
+  buffer: OptimizedBuffer,
+  {
+    text,
+    x = 0,
+    y = 0,
+    color = [RGBA.fromInts(255, 255, 255, 255)],
+    backgroundColor = RGBA.fromInts(0, 0, 0, 255),
+    font = "tiny",
+  }: {
+    text: string
+    x?: number
+    y?: number
+    color?: ColorInput | ColorInput[]
+    backgroundColor?: ColorInput
+    font?: keyof typeof fonts
+  },
+): { width: number; height: number } {
+  const width = buffer.width
+  const height = buffer.height
+
+  const fontDef = getParsedFont(font)
+  if (!fontDef) {
+    console.warn(`Font '${font}' not found`)
+    return { width: 0, height: 0 }
+  }
+
+  const colors = Array.isArray(color) ? color : [color]
+
+  if (y < 0 || y + fontDef.lines > height) {
+    return { width: 0, height: fontDef.lines }
+  }
+
+  let currentX = x
+  const startX = x
+
+  for (let i = 0; i < text.length; i++) {
+    const char = text[i].toUpperCase()
+    const charDef = fontDef.chars[char]
+
+    if (!charDef) {
+      const spaceChar = fontDef.chars[" "]
+      if (spaceChar && spaceChar[0]) {
+        let spaceWidth = 0
+        for (const segment of spaceChar[0]) {
+          spaceWidth += segment.text.length
+        }
+        currentX += spaceWidth
+      } else {
+        currentX += 1
+      }
+      continue
+    }
+
+    let charWidth = 0
+    if (charDef[0]) {
+      for (const segment of charDef[0]) {
+        charWidth += segment.text.length
+      }
+    }
+
+    if (currentX >= width) break
+    if (currentX + charWidth < 0) {
+      currentX += charWidth + fontDef.letterspace_size
+      continue
+    }
+
+    for (let lineIdx = 0; lineIdx < fontDef.lines && lineIdx < charDef.length; lineIdx++) {
+      const segments = charDef[lineIdx]
+      const renderY = y + lineIdx
+
+      if (renderY >= 0 && renderY < height) {
+        let segmentX = currentX
+
+        for (const segment of segments) {
+          const segmentColor = colors[segment.colorIndex] || colors[0]
+
+          for (let charIdx = 0; charIdx < segment.text.length; charIdx++) {
+            const renderX = segmentX + charIdx
+
+            if (renderX >= 0 && renderX < width) {
+              const fontChar = segment.text[charIdx]
+              if (fontChar !== " ") {
+                buffer.setCellWithAlphaBlending(
+                  renderX,
+                  renderY,
+                  fontChar,
+                  parseColor(segmentColor),
+                  parseColor(backgroundColor),
+                )
+              }
+            }
+          }
+
+          segmentX += segment.text.length
+        }
+      }
+    }
+
+    currentX += charWidth
+
+    if (i < text.length - 1) {
+      currentX += fontDef.letterspace_size
+    }
+  }
+
+  return {
+    width: currentX - startX,
+    height: fontDef.lines,
+  }
+}

package/src/lib/border.test.ts

@@ -0,0 +1,83 @@
+import { test, expect, describe, spyOn, afterEach } from "bun:test"
+import { isValidBorderStyle, parseBorderStyle, type BorderStyle } from "./border.js"
+
+describe("isValidBorderStyle", () => {
+  test("returns true for valid border styles", () => {
+    expect(isValidBorderStyle("single")).toBe(true)
+    expect(isValidBorderStyle("double")).toBe(true)
+    expect(isValidBorderStyle("rounded")).toBe(true)
+    expect(isValidBorderStyle("heavy")).toBe(true)
+  })
+
+  test("returns false for invalid border styles", () => {
+    expect(isValidBorderStyle("invalid")).toBe(false)
+    expect(isValidBorderStyle("")).toBe(false)
+    expect(isValidBorderStyle(null)).toBe(false)
+    expect(isValidBorderStyle(undefined)).toBe(false)
+    expect(isValidBorderStyle(123)).toBe(false)
+    expect(isValidBorderStyle({})).toBe(false)
+    expect(isValidBorderStyle([])).toBe(false)
+  })
+})
+
+describe("parseBorderStyle", () => {
+  let warnSpy: ReturnType<typeof spyOn>
+
+  afterEach(() => {
+    warnSpy?.mockRestore()
+  })
+
+  test("returns valid border styles unchanged", () => {
+    expect(parseBorderStyle("single")).toBe("single")
+    expect(parseBorderStyle("double")).toBe("double")
+    expect(parseBorderStyle("rounded")).toBe("rounded")
+    expect(parseBorderStyle("heavy")).toBe("heavy")
+  })
+
+  test("falls back to 'single' for invalid string values", () => {
+    warnSpy = spyOn(console, "warn").mockImplementation(() => {})
+
+    expect(parseBorderStyle("invalid")).toBe("single")
+    expect(parseBorderStyle("")).toBe("single")
+    expect(parseBorderStyle("SINGLE")).toBe("single") // case sensitive
+    expect(parseBorderStyle("Single")).toBe("single")
+  })
+
+  test("falls back to custom fallback for invalid values", () => {
+    warnSpy = spyOn(console, "warn").mockImplementation(() => {})
+
+    expect(parseBorderStyle("invalid", "double")).toBe("double")
+    expect(parseBorderStyle("invalid", "rounded")).toBe("rounded")
+    expect(parseBorderStyle("invalid", "heavy")).toBe("heavy")
+  })
+
+  test("falls back silently for undefined/null without warning", () => {
+    warnSpy = spyOn(console, "warn").mockImplementation(() => {})
+
+    expect(parseBorderStyle(undefined)).toBe("single")
+    expect(parseBorderStyle(null)).toBe("single")
+    expect(warnSpy).not.toHaveBeenCalled()
+  })
+
+  test("logs warning for invalid non-null/undefined values", () => {
+    warnSpy = spyOn(console, "warn").mockImplementation(() => {})
+
+    parseBorderStyle("invalid-style")
+
+    expect(warnSpy).toHaveBeenCalledTimes(1)
+    expect(warnSpy).toHaveBeenCalledWith(
+      'Invalid borderStyle "invalid-style", falling back to "single". Valid values are: single, double, rounded, heavy',
+    )
+  })
+
+  describe("regression: does not crash with unexpected value types", () => {
+    test("handles invalid values", () => {
+      warnSpy = spyOn(console, "warn").mockImplementation(() => {})
+
+      expect(parseBorderStyle(123 as unknown as BorderStyle)).toBe("single")
+      expect(parseBorderStyle({} as unknown as BorderStyle)).toBe("single")
+      expect(parseBorderStyle(true as unknown as BorderStyle)).toBe("single")
+      expect(parseBorderStyle((() => "single") as unknown as BorderStyle)).toBe("single")
+    })
+  })
+})