@sealpixel/react 1.0.0-rc.0

package/README.md

@@ -0,0 +1,6 @@
+# @sealpixel/react
+
+```tsx
+import { SealpixelEditor } from "@sealpixel/react";
+<SealpixelEditor src={file} editLog={log} onChange={(e) => setLog(e.detail)} />
+```

package/dist/index.d.ts

@@ -0,0 +1,29 @@
+import { type EventName } from '@lit/react';
+import { type EditorSession, type ExportResult, type SealpixelError, type SessionOptions, type SessionState, type SourceDescriptor } from '@sealpixel/core';
+import { SealpixelEditor as SealpixelEditorElement } from '@sealpixel/element';
+import * as React from 'react';
+export type { EditorSession, SessionOptions, SessionState } from '@sealpixel/core';
+/**
+ * `<SealpixelEditor>` for React 18 and 19. Props map to the element's properties.
+ * Controlled: pass `editLog` and `onChange`; uncontrolled: `defaultEditLog`.
+ */
+export declare const SealpixelEditor: import("@lit/react").ReactWebComponent<SealpixelEditorElement, {
+    onChange: EventName<CustomEvent<{
+        log: unknown;
+        index: number;
+    }>>;
+    onProcess: EventName<CustomEvent<ExportResult>>;
+    onError: EventName<CustomEvent<SealpixelError>>;
+    onReady: EventName<CustomEvent<void>>;
+    onLoad: EventName<CustomEvent<SourceDescriptor>>;
+}>;
+export type SealpixelEditorProps = React.ComponentProps<typeof SealpixelEditor>;
+/**
+ * Headless use: one session per component instance, state via
+ * `useSyncExternalStore`. Dispose happens on unmount.
+ */
+export declare function useSealpixelSession(options: SessionOptions): {
+    session: EditorSession;
+    state: SessionState;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAC7D,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,cAAc,EACnB,KAAK,cAAc,EACnB,KAAK,YAAY,EACjB,KAAK,gBAAgB,EACtB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,eAAe,IAAI,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC/E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEnF;;;GAGG;AACH,eAAO,MAAM,eAAe;cAKQ,SAAS,CAAC,WAAW,CAAC;QAAE,GAAG,EAAE,OAAO,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;eACrD,SAAS,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;aACxC,SAAS,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;aACtC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;YAC9B,SAAS,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC;EAEtE,CAAC;AAEH,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,CAAC;AAEhF;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,cAAc,GAAG;IAC5D,OAAO,EAAE,aAAa,CAAC;IACvB,KAAK,EAAE,YAAY,CAAC;CACrB,CAWA"}

package/dist/index.js

@@ -0,0 +1,34 @@
+import { createComponent } from '@lit/react';
+import { createEditorSession, } from '@sealpixel/core';
+import { SealpixelEditor as SealpixelEditorElement } from '@sealpixel/element';
+import * as React from 'react';
+/**
+ * `<SealpixelEditor>` for React 18 and 19. Props map to the element's properties.
+ * Controlled: pass `editLog` and `onChange`; uncontrolled: `defaultEditLog`.
+ */
+export const SealpixelEditor = createComponent({
+    react: React,
+    tagName: 'sealpixel-editor',
+    elementClass: SealpixelEditorElement,
+    events: {
+        onChange: 'sealpixel:change',
+        onProcess: 'sealpixel:process',
+        onError: 'sealpixel:error',
+        onReady: 'sealpixel:ready',
+        onLoad: 'sealpixel:load',
+    },
+});
+/**
+ * Headless use: one session per component instance, state via
+ * `useSyncExternalStore`. Dispose happens on unmount.
+ */
+export function useSealpixelSession(options) {
+    const ref = React.useRef(null);
+    if (ref.current === null)
+        ref.current = createEditorSession(options);
+    const session = ref.current;
+    React.useEffect(() => () => session.dispose(), [session]);
+    const state = React.useSyncExternalStore((listener) => session.subscribe(() => listener()), () => session.getState(), () => session.getState());
+    return { session, state };
+}
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAkB,MAAM,YAAY,CAAC;AAC7D,OAAO,EACL,mBAAmB,GAOpB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,eAAe,IAAI,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC/E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,eAAe,CAAC;IAC7C,KAAK,EAAE,KAAK;IACZ,OAAO,EAAE,kBAAkB;IAC3B,YAAY,EAAE,sBAAsB;IACpC,MAAM,EAAE;QACN,QAAQ,EAAE,kBAA6E;QACvF,SAAS,EAAE,mBAA2D;QACtE,OAAO,EAAE,iBAA2D;QACpE,OAAO,EAAE,iBAAiD;QAC1D,MAAM,EAAE,gBAA4D;KACrE;CACF,CAAC,CAAC;AAIH;;;GAGG;AACH,MAAM,UAAU,mBAAmB,CAAC,OAAuB;IAIzD,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAuB,IAAI,CAAC,CAAC;IACrD,IAAI,GAAG,CAAC,OAAO,KAAK,IAAI;QAAE,GAAG,CAAC,OAAO,GAAG,mBAAmB,CAAC,OAAO,CAAC,CAAC;IACrE,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAC;IAC5B,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAC1D,MAAM,KAAK,GAAG,KAAK,CAAC,oBAAoB,CACtC,CAAC,QAAQ,EAAE,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC,QAAQ,EAAE,CAAC,EACjD,GAAG,EAAE,CAAC,OAAO,CAAC,QAAQ,EAAE,EACxB,GAAG,EAAE,CAAC,OAAO,CAAC,QAAQ,EAAE,CACzB,CAAC;IACF,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AAC5B,CAAC"}

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@sealpixel/react",
+  "version": "1.0.0-rc.0",
+  "description": "React bindings for the Sealpixel image editor: <SealpixelEditor> with controlled and uncontrolled edit logs, and useSealpixelSession for headless use.",
+  "license": "BUSL-1.1",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/9feet/sealpixel.git",
+    "directory": "packages/react"
+  },
+  "homepage": "https://docs.sealpixel.dev",
+  "bugs": "https://github.com/9feet/sealpixel/issues",
+  "type": "module",
+  "sideEffects": false,
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "typecheck": "tsc -p tsconfig.json --noEmit"
+  },
+  "dependencies": {
+    "@lit/react": "^1.0.8",
+    "@sealpixel/core": "workspace:*",
+    "@sealpixel/element": "workspace:*",
+    "@sealpixel/ui": "workspace:*"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0"
+  },
+  "devDependencies": {
+    "@sealpixel/config": "workspace:*",
+    "@types/node": "^24.0.0",
+    "@types/react": "^19.0.0",
+    "react": "^19.0.0",
+    "typescript": "^5.9.0"
+  }
+}