open-index/open-npm huggingface dataset:
npm package: @gridsheet/preact-core
Description: Spreadsheet component for Preact
Author: righ
Latest version: 3.0.6

# @gridsheet/preact-core

Spreadsheet component for Preact

## Installation

```bash
npm install @gridsheet/preact-core @gridsheet/functions
```

### Peer Dependencies

This package requires the following peer dependencies:

- `preact` ^10.26.6
- `dayjs` ^1.11.13

## Usage

```tsx
import { GridSheet } from '@gridsheet/preact-core';
import { useSpellbook } from '@gridsheet/preact-core/spellbook'; // requires @gridsheet/functions

function App() {
  const book = useSpellbook();
  return (
    <>
      <GridSheet
        book={book}
        initialCells={{
          A1: { value: 'Hello' },
          B1: { value: 'Preact', style: { backgroundColor: '#448888' } },
          A2: { value: 123 },
          B2: { value: 456 },
          A3: { value: 789 },
          C6: { value: '=SUM(A2:B2)' },
        }}
        options={{
          mode: 'dark',
        }}
        sheetName="Sheet1"
      />
      <GridSheet
        book={book}
        initialCells={{
          C3: { value: '=SUM(Sheet1!A2:B3)' },
        }}
        options={{}}
        sheetName="Sheet2"
      />
    </>
  );
}
```

## Exports

This package exports all the core GridSheet functionality along with Preact compatibility layer. It includes:

- All React compatibility exports from `preact/compat`
- Core GridSheet components and utilities
- Preact-specific exports (`h`, `render`)

## Docs

- [GridSheet document](https://gridsheet.walkframe.com/)
- [Examples](https://gridsheet.walkframe.com/examples/case1)

## Development

```bash
# Build the package
pnpm build
```

## License

Apache-2.0
npm package: @gridsheet/react-dev
Description: Development tools for GridSheet
Author: righ
Latest version: 3.0.6

# @gridsheet/react-dev

Development tools for [GridSheet](https://github.com/walkframe/gridsheet).

> **Note:** Intended for use during development only. Do not include in production builds.

## Installation

```bash
npm install --save-dev @gridsheet/react-dev
# or
pnpm add -D @gridsheet/react-dev
```

## Usage

Pass a `book` object (created via `useBook` from `@gridsheet/react-core`) to the `Debugger` component.

```tsx
import React from 'react';
import { GridSheet, useBook } from '@gridsheet/react-core';
import { Debugger } from '@gridsheet/react-dev';

export default function App() {
  const book = useBook();
  return (
    <>
      <GridSheet book={book} />
      <Debugger book={book} />
    </>
  );
}
```

## Props

### `Debugger`

| Prop         | Type       | Default | Description                                          |
|--------------|------------|---------|------------------------------------------------------|
| `book`       | `BookType` | —       | The book object connected to a `GridSheet` instance. |
| `intervalMs` | `number`   | `500`   | Polling interval (ms) for refreshing the state view. |

## License

Apache-2.0