@bigmistqke/solid-hex-editor


minimal hex-editor

https://github.com/user-attachments/assets/88b8874d-63f7-4a2a-97d4-e504385deee4

Quick start

Install it:

``bash
npm i @bigmistqke/solid-hex-editor


or

yarn add @bigmistqke/solid-hex-editor

or

pnpm add @bigmistqke/solid-hex-editor
`

Use it:

`tsx
import { HexEditor } from '@bigmistqke/solid-hex-editor'

const [array, setArray] = createSignal(
new Uint8Array(Array.from({ length: 50 50 3 }, (_, i) => i % 255)),
{ equals: false },
)
render(
() => (
array={array()}
onArrayUpdate={(index, value) => {
setArray(array => {
array[index] = value
return array
})
}}
/>
),
document.body,
)
`

Style it:

`css
.editor {
gap: 5px;

/ data-grid={offset | hex | ascii} /
& > [data-grid='offset'] {
color: darkgrey;
}

& [data-cell] {
padding: 2px;
}
}
``