@zseven-w/pen-sdk 0.7.0 → 0.7.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 ZSeven—W
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,56 +1,147 @@
 # @zseven-w/pen-sdk
 
-The umbrella SDK for [OpenPencil](https://github.com/nicepkg/openpencil). One import gives you everything — types, document operations, code generation, Figma import, and rendering.
+The umbrella SDK for [OpenPencil](https://github.com/ZSeven-W/openpencil). One import gives you everything — types, document operations, headless engine, React components, code generation, Figma import, and GPU rendering.
 
 ## Install
 
 ```bash
 npm install @zseven-w/pen-sdk
+# or
+bun add @zseven-w/pen-sdk
 ```
 
-## What's Included
+## Overview
+
+`pen-sdk` re-exports all OpenPencil packages through a single entry point. Use it when you want the full stack without managing individual dependencies. For smaller bundles, install only the packages you need.
 
-This package re-exports all OpenPencil packages:
+## What's Included
 
-| Package                  | Provides                                                                  |
-| ------------------------ | ------------------------------------------------------------------------- |
-| `@zseven-w/pen-types`    | TypeScript types for the document model                                   |
-| `@zseven-w/pen-core`     | Tree operations, layout engine, variables, boolean ops                    |
-| `@zseven-w/pen-codegen`  | Code generators (React, HTML, Vue, Svelte, Flutter, SwiftUI, Compose, RN) |
-| `@zseven-w/pen-figma`    | Figma `.fig` parser and converter                                         |
-| `@zseven-w/pen-renderer` | CanvasKit/Skia GPU renderer                                               |
+| Package                                     | Provides                                                                            |
+| ------------------------------------------- | ----------------------------------------------------------------------------------- |
+| [`@zseven-w/pen-types`](../pen-types)       | TypeScript types for the document model (`PenDocument`, `PenNode`, `PenFill`, etc.) |
+| [`@zseven-w/pen-core`](../pen-core)         | Tree operations, layout engine, variables, boolean ops, normalization, 3-way merge  |
+| [`@zseven-w/pen-engine`](../pen-engine)     | Headless design engine — document, selection, history, viewport, spatial index      |
+| [`@zseven-w/pen-react`](../pen-react)       | React UI SDK — `DesignProvider`, `DesignCanvas`, 10 hooks, 39 components            |
+| [`@zseven-w/pen-renderer`](../pen-renderer) | CanvasKit/Skia GPU renderer with viewport, hit testing, font/image management       |
+| [`@zseven-w/pen-figma`](../pen-figma)       | Figma `.fig` binary parser and converter                                            |
 
 ## Usage
 
-```ts
+### Build a full editor
+
+```tsx
+import {
+  DesignProvider,
+  DesignCanvas,
+  CoreToolbar,
+  LayerPanel,
+  PropertyPanel,
+  useDocument,
+  useSelection,
+  useHistory,
+} from '@zseven-w/pen-sdk';
+
+function Editor() {
+  return (
+    <DesignProvider initialDocument={myDoc}>
+      <CoreToolbar />
+      <DesignCanvas />
+      <LayerPanel />
+      <PropertyPanel />
+    </DesignProvider>
+  );
+}
+```
+
+### Document operations
+
+```typescript
 import {
-  // Types
   type PenDocument,
   type PenNode,
-
-  // Document operations
   createEmptyDocument,
   findNodeInTree,
   insertNodeInTree,
+  flattenNodes,
   normalizePenDocument,
+  resolveNodeForCanvas,
+} from '@zseven-w/pen-sdk';
+
+const doc = createEmptyDocument();
+const node = findNodeInTree(doc.children, 'header');
+```
+
+### Headless engine (no React)
+
+```typescript
+import { DesignEngine } from '@zseven-w/pen-sdk';
+
+const engine = new DesignEngine();
+engine.loadDocument(doc);
+engine.addNode(null, { type: 'frame', name: 'Page', width: 1200, height: 800 });
+engine.select(['node-1']);
+engine.undo();
+```
+
+### Code generation
 
-  // Code generation
+```typescript
+import {
   generateReactFromDocument,
   generateHTMLFromDocument,
   generateFlutterFromDocument,
+  generateVueFromDocument,
+  generateSvelteFromDocument,
+  generateSwiftUIFromDocument,
+} from '@zseven-w/pen-sdk';
 
-  // Figma import
-  parseFigFile,
-  figmaAllPagesToPenDocument,
+const reactCode = generateReactFromDocument(doc);
+const htmlCode = generateHTMLFromDocument(doc);
+```
 
-  // Rendering
-  loadCanvasKit,
-  PenRenderer,
-} from '@zseven-w/pen-sdk';
+### Figma import
+
+```typescript
+import { parseFigFile, figmaAllPagesToPenDocument, isFigmaClipboardHtml } from '@zseven-w/pen-sdk';
+
+const figFile = parseFigFile(buffer);
+const document = figmaAllPagesToPenDocument(figFile);
+```
+
+### GPU rendering (headless)
+
+```typescript
+import { loadCanvasKit, PenRenderer } from '@zseven-w/pen-sdk';
+
+await loadCanvasKit();
+const renderer = new PenRenderer(canvas, document);
+renderer.render();
 ```
 
-Or install individual packages for smaller bundles — see each package's README for details.
+## Individual Packages
+
+For smaller bundles, install only what you need:
+
+```bash
+# Types only (zero runtime)
+npm install @zseven-w/pen-types
+
+# Document operations (no rendering)
+npm install @zseven-w/pen-core
+
+# Headless engine (no React)
+npm install @zseven-w/pen-engine
+
+# React components
+npm install @zseven-w/pen-react
+
+# GPU renderer
+npm install @zseven-w/pen-renderer canvaskit-wasm
+
+# Figma import
+npm install @zseven-w/pen-figma
+```
 
 ## License
 
-MIT
+[MIT](./LICENSE)

package/package.json

@@ -1,7 +1,21 @@
 {
   "name": "@zseven-w/pen-sdk",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "OpenPencil SDK — parse, manipulate, and generate code from .op design files",
+  "homepage": "https://github.com/ZSeven-W/openpencil/tree/main/packages/pen-sdk",
+  "bugs": {
+    "url": "https://github.com/ZSeven-W/openpencil/issues"
+  },
+  "license": "MIT",
+  "author": {
+    "name": "ZSeven-W",
+    "email": "xkayshen@gmail.com"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ZSeven-W/openpencil.git",
+    "directory": "packages/pen-sdk"
+  },
   "files": [
     "src"
   ],
@@ -16,12 +30,12 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@zseven-w/pen-core": "0.7.0",
-    "@zseven-w/pen-engine": "0.7.0",
-    "@zseven-w/pen-figma": "0.7.0",
-    "@zseven-w/pen-react": "0.7.0",
-    "@zseven-w/pen-renderer": "0.7.0",
-    "@zseven-w/pen-types": "0.7.0"
+    "@zseven-w/pen-core": "0.7.1",
+    "@zseven-w/pen-engine": "0.7.1",
+    "@zseven-w/pen-figma": "0.7.1",
+    "@zseven-w/pen-react": "0.7.1",
+    "@zseven-w/pen-renderer": "0.7.1",
+    "@zseven-w/pen-types": "0.7.1"
   },
   "devDependencies": {
     "typescript": "^5.7.2"