No description
Find a file
waaraawa 39f3e84fac feat(core): add color scheme support (default/dark/light)
- Add colorScheme option to RenderOptions and ByteGridConfig
  - Implement color transformation with RGB ↔ HSL conversion
    - Default: original pastel colors (no transformation)
    - Dark: reduce saturation (-20%) and lightness (-10%)
    - Light: increase lightness (+20%)
  - Apply color transformation to both grid blocks and legend
  - Add 10 new tests (4 parser, 6 renderer)
2025-10-15 08:30:24 +09:00
examples feat(core): improve legendColumns with row-major order 2025-10-14 13:16:36 +09:00
packages feat(core): add color scheme support (default/dark/light) 2025-10-15 08:30:24 +09:00
.eslintrc.json chore: initial project setup 2025-10-13 09:34:29 +09:00
.gitignore feat(plugin): add basic SVG rendering prototype 2025-10-13 12:57:20 +09:00
.prettierignore chore: initial project setup 2025-10-13 09:34:29 +09:00
.prettierrc.json chore: initial project setup 2025-10-13 09:34:29 +09:00
CLAUDE.md docs: add archtecture document 2025-10-08 11:58:30 +09:00
jest.config.js chore: initial project setup 2025-10-13 09:34:29 +09:00
LICENSE Initial commit 2025-10-04 00:19:35 +09:00
package.json chore: initial project setup 2025-10-13 09:34:29 +09:00
README.md chore: initial project setup 2025-10-13 09:34:29 +09:00
roadmap.md feat(core): improve legendColumns with row-major order 2025-10-14 13:16:36 +09:00
tsconfig.json chore: initial project setup 2025-10-13 09:34:29 +09:00

ByteGrid

Binary data and C struct memory layout visualization for Obsidian

Overview

ByteGrid is an Obsidian plugin that visualizes binary data and C structure memory layouts as interactive SVG diagrams.

Features

  • 🎨 Color-coded field visualization
  • 📏 Byte-accurate grid layout
  • 🔍 Bitfield support
  • 📊 Hex dump integration
  • 🎯 Interactive tooltips
  • 📤 Multiple export formats (SVG, PNG, C code, Markdown)

Project Status

🚧 In Development - Currently in Phase 1 (MVP)

Quick Start

# Install dependencies
npm install

# Build all packages
npm run build

# Run tests
npm run test

# Lint
npm run lint

# Format code
npm run format

Project Structure

bytegrid/
├── packages/
│   ├── core/              # Core rendering logic
│   └── obsidian-plugin/   # Obsidian plugin
├── docs/                  # Design documentation
└── examples/              # Example files

Documentation

See CLAUDE.md for detailed project guidelines and architecture.

Development

This project follows Test-Driven Development (TDD):

  1. Write tests first
  2. Implement minimal code to pass tests
  3. Refactor

Key Principles

  • offset is SSOT - Field size calculated from offset ranges
  • No magic numbers - Use constants for all layout values
  • Dynamic height - SVG dimensions calculated from content
  • Explicit padding - Use reserved or padding types

License

MIT License - see LICENSE for details

Contributing

Currently in initial development phase. Contribution guidelines will be added soon.