spine-expo-usedom 0.1.0 → 0.1.1

package/README.md

@@ -12,8 +12,36 @@ Run **Spine Web Components** in React Native (iOS/Android) using Expo's **DOM Co
 
 ## 📦 Installation
 
+### 1. Install dependencies
+
 ```bash
-npm install spine-expo-usedom
+npm install spine-expo-usedom @esotericsoftware/spine-webcomponents
+```
+
+### 2. Configure `postinstall` script
+
+Add a `postinstall` script to your `package.json` to copy the Spine Web Components library to your `public` folder. This is required for the component to load the necessary scripts dynamically.
+
+```json
+{
+  "scripts": {
+    "postinstall": "cp node_modules/@esotericsoftware/spine-webcomponents/dist/iife/spine-webcomponents.min.js public/"
+  }
+}
+```
+
+Run the script manually to copy the file:
+
+```bash
+npm run postinstall
+```
+
+### 3. Update `.gitignore`
+
+Add the copied spine script to your `.gitignore` to avoid committing it.
+
+```
+public/spine-webcomponents.min.js
 ```
 
 ## 💻 Usage
@@ -68,6 +96,28 @@ export default function App() {
 | `preserveDrawingBuffer` | `boolean`                                     | `true`       | Whether to preserve the drawing buffer.                      |
 | `dom`                   | `DOMProps`                                    | `undefined`  | Props passed to the underlying Expo DOM Component container. |
 
-## 📝 License
+## �️ Development & Publishing
+
+### Build
+
+```bash
+npm run build
+```
+
+### Publish to npm
+
+1. Update version:
+
+```bash
+npm version patch # or minor, major
+```
+
+2. Publish (build runs automatically):
+
+```bash
+npm publish
+```
+
+## �📝 License
 
 This project is licensed under the MIT License.

package/lib/commonjs/index.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = SpineView;
 var _react = _interopRequireWildcard(require("react"));
-require("@esotericsoftware/spine-webcomponents");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function SpineView({
@@ -15,6 +14,7 @@ function SpineView({
   atlas,
   skin,
   preserveDrawingBuffer = true,
+  spineWebComponentSrc = '/spine-webcomponents.min.js',
   ...rest
 }) {
   // window.location.origin を使って絶対パスを生成
@@ -30,13 +30,26 @@ function SpineView({
   };
   const absoluteSkeleton = getAbsolutePath(skeleton);
   const absoluteAtlas = getAbsolutePath(atlas);
+  const absoluteSpineWebComponentSrc = getAbsolutePath(spineWebComponentSrc);
   (0, _react.useEffect)(() => {
     console.log('Current URL:', window.location.href);
     console.log('Spine assets paths (absolute):', {
       skeleton: absoluteSkeleton,
       atlas: absoluteAtlas
     });
-  }, []);
+    if (window.spine) return;
+
+    // Prevent duplicate script loading
+    if (document.querySelector(`script[src="${absoluteSpineWebComponentSrc}"]`)) return;
+    const script = document.createElement('script');
+    script.src = absoluteSpineWebComponentSrc;
+    script.async = true;
+    script.onload = () => {
+      console.log('Spine Web Components loaded');
+    };
+    script.onerror = e => console.error('Failed to load Spine script', e);
+    document.head.appendChild(script);
+  }, [absoluteSpineWebComponentSrc]);
 
   // skin="default" の場合、Spine Web Components でエラーになる場合があるため除外する
   // また、React 19以降ではCustom Elementのプロパティとして渡される際、文字列のままだと

package/lib/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["Object","defineProperty","exports","value","default","SpineView","_react","_interopRequireWildcard","require","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","dom","skeleton","atlas","skin","preserveDrawingBuffer","rest","origin","window","location","getAbsolutePath","path","startsWith","absoluteSkeleton","absoluteAtlas","useEffect","console","log","href","skinProp","undefined","split","jsx","style","width","height","display","justifyContent","alignItems","overflow","children"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Object","defineProperty","exports","value","default","SpineView","_react","_interopRequireWildcard","require","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","dom","skeleton","atlas","skin","preserveDrawingBuffer","spineWebComponentSrc","rest","origin","window","location","getAbsolutePath","path","startsWith","absoluteSkeleton","absoluteAtlas","absoluteSpineWebComponentSrc","useEffect","console","log","href","spine","document","querySelector","script","createElement","src","async","onload","onerror","error","head","appendChild","skinProp","undefined","split","jsx","style","width","height","display","justifyContent","alignItems","overflow","children"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/index.js

@@ -2,7 +2,6 @@
 'use dom';
 
 import React, { useEffect } from 'react';
-import '@esotericsoftware/spine-webcomponents';
 import { jsx as _jsx } from "react/jsx-runtime";
 export default function SpineView({
   dom,
@@ -10,6 +9,7 @@ export default function SpineView({
   atlas,
   skin,
   preserveDrawingBuffer = true,
+  spineWebComponentSrc = '/spine-webcomponents.min.js',
   ...rest
 }) {
   // window.location.origin を使って絶対パスを生成
@@ -25,13 +25,26 @@ export default function SpineView({
   };
   const absoluteSkeleton = getAbsolutePath(skeleton);
   const absoluteAtlas = getAbsolutePath(atlas);
+  const absoluteSpineWebComponentSrc = getAbsolutePath(spineWebComponentSrc);
   useEffect(() => {
     console.log('Current URL:', window.location.href);
     console.log('Spine assets paths (absolute):', {
       skeleton: absoluteSkeleton,
       atlas: absoluteAtlas
     });
-  }, []);
+    if (window.spine) return;
+
+    // Prevent duplicate script loading
+    if (document.querySelector(`script[src="${absoluteSpineWebComponentSrc}"]`)) return;
+    const script = document.createElement('script');
+    script.src = absoluteSpineWebComponentSrc;
+    script.async = true;
+    script.onload = () => {
+      console.log('Spine Web Components loaded');
+    };
+    script.onerror = e => console.error('Failed to load Spine script', e);
+    document.head.appendChild(script);
+  }, [absoluteSpineWebComponentSrc]);
 
   // skin="default" の場合、Spine Web Components でエラーになる場合があるため除外する
   // また、React 19以降ではCustom Elementのプロパティとして渡される際、文字列のままだと

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","jsx","_jsx","SpineView","dom","skeleton","atlas","skin","preserveDrawingBuffer","rest","origin","window","location","getAbsolutePath","path","startsWith","absoluteSkeleton","absoluteAtlas","console","log","href","skinProp","undefined","split","style","width","height","display","justifyContent","alignItems","overflow","children"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";AAAA,SAAS;;AAET,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AACxC,OAAO,uCAAuC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAwB/C,eAAe,SAASC,SAASA,CAAC;EAC9BC,GAAG;EACHC,QAAQ;EACRC,KAAK;EACLC,IAAI;EACJC,qBAAqB,GAAG,IAAI;EAC5B,GAAGC;AACS,CAAC,EAAE;EACf;EACA;EACA,MAAMC,MAAM,GAAG,OAAOC,MAAM,KAAK,WAAW,GAAGA,MAAM,CAACC,QAAQ,CAACF,MAAM,GAAG,EAAE;;EAE1E;EACA,MAAMG,eAAe,GAAIC,IAAY,IAAK;IACtC,IAAI,CAACA,IAAI,EAAE,OAAOA,IAAI;IACtB,IAAIA,IAAI,CAACC,UAAU,CAAC,MAAM,CAAC,EAAE,OAAOD,IAAI;IACxC,IAAIA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC,EAAE,OAAO,GAAGL,MAAM,GAAGI,IAAI,EAAE;IACnD,OAAO,GAAGJ,MAAM,IAAII,IAAI,EAAE;EAC9B,CAAC;EAED,MAAME,gBAAgB,GAAGH,eAAe,CAACR,QAAQ,CAAC;EAClD,MAAMY,aAAa,GAAGJ,eAAe,CAACP,KAAK,CAAC;EAE5CN,SAAS,CAAC,MAAM;IACZkB,OAAO,CAACC,GAAG,CAAC,cAAc,EAAER,MAAM,CAACC,QAAQ,CAACQ,IAAI,CAAC;IACjDF,OAAO,CAACC,GAAG,CAAC,gCAAgC,EAAE;MAAEd,QAAQ,EAAEW,gBAAgB;MAAEV,KAAK,EAAEW;IAAc,CAAC,CAAC;EACvG,CAAC,EAAE,EAAE,CAAC;;EAEN;EACA;EACA;EACA,MAAMI,QAAQ,GAAI,CAACd,IAAI,IAAIA,IAAI,KAAK,SAAS,GAAIe,SAAS,GAAGf,IAAI,CAACgB,KAAK,CAAC,GAAG,CAAC;EAE5E,oBACIrB,IAAA;IAAKsB,KAAK,EAAE;MAAEC,KAAK,EAAE,MAAM;MAAEC,MAAM,EAAE,OAAO;MAAEC,OAAO,EAAE,MAAM;MAAEC,cAAc,EAAE,QAAQ;MAAEC,UAAU,EAAE,QAAQ;MAAEC,QAAQ,EAAE;IAAS,CAAE;IAAAC,QAAA,eAEhI7B,IAAA;MACIG,QAAQ,EAAEW,gBAAiB;MAC3BV,KAAK,EAAEW,aAAc;MACrBV,IAAI,EAAEc,QAAS;MACf,2BAAyBb,qBAAsB;MAC/CgB,KAAK,EAAE;QAAEC,KAAK,EAAE,MAAM;QAAEC,MAAM,EAAE;MAAO,CAAE;MAAA,GACrCjB;IAAI,CACX;EAAC,CACD,CAAC;AAEd","ignoreList":[]}
+{"version":3,"names":["React","useEffect","jsx","_jsx","SpineView","dom","skeleton","atlas","skin","preserveDrawingBuffer","spineWebComponentSrc","rest","origin","window","location","getAbsolutePath","path","startsWith","absoluteSkeleton","absoluteAtlas","absoluteSpineWebComponentSrc","console","log","href","spine","document","querySelector","script","createElement","src","async","onload","onerror","e","error","head","appendChild","skinProp","undefined","split","style","width","height","display","justifyContent","alignItems","overflow","children"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";AAAA,SAAS;;AAET,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AA0BzC,eAAe,SAASC,SAASA,CAAC;EAC9BC,GAAG;EACHC,QAAQ;EACRC,KAAK;EACLC,IAAI;EACJC,qBAAqB,GAAG,IAAI;EAC5BC,oBAAoB,GAAG,6BAA6B;EACpD,GAAGC;AACS,CAAC,EAAE;EACf;EACA;EACA,MAAMC,MAAM,GAAG,OAAOC,MAAM,KAAK,WAAW,GAAGA,MAAM,CAACC,QAAQ,CAACF,MAAM,GAAG,EAAE;;EAE1E;EACA,MAAMG,eAAe,GAAIC,IAAY,IAAK;IACtC,IAAI,CAACA,IAAI,EAAE,OAAOA,IAAI;IACtB,IAAIA,IAAI,CAACC,UAAU,CAAC,MAAM,CAAC,EAAE,OAAOD,IAAI;IACxC,IAAIA,IAAI,CAACC,UAAU,CAAC,GAAG,CAAC,EAAE,OAAO,GAAGL,MAAM,GAAGI,IAAI,EAAE;IACnD,OAAO,GAAGJ,MAAM,IAAII,IAAI,EAAE;EAC9B,CAAC;EAED,MAAME,gBAAgB,GAAGH,eAAe,CAACT,QAAQ,CAAC;EAClD,MAAMa,aAAa,GAAGJ,eAAe,CAACR,KAAK,CAAC;EAC5C,MAAMa,4BAA4B,GAAGL,eAAe,CAACL,oBAAoB,CAAC;EAE1ET,SAAS,CAAC,MAAM;IACZoB,OAAO,CAACC,GAAG,CAAC,cAAc,EAAET,MAAM,CAACC,QAAQ,CAACS,IAAI,CAAC;IACjDF,OAAO,CAACC,GAAG,CAAC,gCAAgC,EAAE;MAAEhB,QAAQ,EAAEY,gBAAgB;MAAEX,KAAK,EAAEY;IAAc,CAAC,CAAC;IAEnG,IAAKN,MAAM,CAASW,KAAK,EAAE;;IAE3B;IACA,IAAIC,QAAQ,CAACC,aAAa,CAAC,eAAeN,4BAA4B,IAAI,CAAC,EAAE;IAE7E,MAAMO,MAAM,GAAGF,QAAQ,CAACG,aAAa,CAAC,QAAQ,CAAC;IAC/CD,MAAM,CAACE,GAAG,GAAGT,4BAA4B;IACzCO,MAAM,CAACG,KAAK,GAAG,IAAI;IACnBH,MAAM,CAACI,MAAM,GAAG,MAAM;MAClBV,OAAO,CAACC,GAAG,CAAC,6BAA6B,CAAC;IAC9C,CAAC;IACDK,MAAM,CAACK,OAAO,GAAIC,CAAC,IAAKZ,OAAO,CAACa,KAAK,CAAC,6BAA6B,EAAED,CAAC,CAAC;IACvER,QAAQ,CAACU,IAAI,CAACC,WAAW,CAACT,MAAM,CAAC;EACrC,CAAC,EAAE,CAACP,4BAA4B,CAAC,CAAC;;EAElC;EACA;EACA;EACA,MAAMiB,QAAQ,GAAI,CAAC7B,IAAI,IAAIA,IAAI,KAAK,SAAS,GAAI8B,SAAS,GAAG9B,IAAI,CAAC+B,KAAK,CAAC,GAAG,CAAC;EAE5E,oBACIpC,IAAA;IAAKqC,KAAK,EAAE;MAAEC,KAAK,EAAE,MAAM;MAAEC,MAAM,EAAE,OAAO;MAAEC,OAAO,EAAE,MAAM;MAAEC,cAAc,EAAE,QAAQ;MAAEC,UAAU,EAAE,QAAQ;MAAEC,QAAQ,EAAE;IAAS,CAAE;IAAAC,QAAA,eAEhI5C,IAAA;MACIG,QAAQ,EAAEY,gBAAiB;MAC3BX,KAAK,EAAEY,aAAc;MACrBX,IAAI,EAAE6B,QAAS;MACf,2BAAyB5B,qBAAsB;MAC/C+B,KAAK,EAAE;QAAEC,KAAK,EAAE,MAAM;QAAEC,MAAM,EAAE;MAAO,CAAE;MAAA,GACrC/B;IAAI,CACX;EAAC,CACD,CAAC;AAEd","ignoreList":[]}

package/lib/typescript/index.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import '@esotericsoftware/spine-webcomponents';
 export interface SpineViewProps {
     dom?: import('expo/dom').DOMProps;
     /** Path to the skeleton data file (.json or .skel) */
@@ -18,8 +17,10 @@ export interface SpineViewProps {
     preserveDrawingBuffer?: boolean;
     /** Raw assets data for embedding */
     rawData?: string;
+    /** Path to the spine-webcomponents.min.js file */
+    spineWebComponentSrc?: string;
     /** Any other attributes for spine-skeleton */
     [key: string]: any;
 }
-export default function SpineView({ dom, skeleton, atlas, skin, preserveDrawingBuffer, ...rest }: SpineViewProps): React.JSX.Element;
+export default function SpineView({ dom, skeleton, atlas, skin, preserveDrawingBuffer, spineWebComponentSrc, ...rest }: SpineViewProps): React.JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,uCAAuC,CAAC;AAE/C,MAAM,WAAW,cAAc;IAC3B,GAAG,CAAC,EAAE,OAAO,UAAU,EAAE,QAAQ,CAAC;IAClC,sDAAsD;IACtD,QAAQ,EAAE,MAAM,CAAC;IACjB,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oDAAoD;IACpD,GAAG,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;IAC/C,wCAAwC;IACxC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,6CAA6C;IAC7C,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8CAA8C;IAC9C,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACtB;AAED,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAC9B,GAAG,EACH,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,qBAA4B,EAC5B,GAAG,IAAI,EACV,EAAE,cAAc,qBAuChB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAEzC,MAAM,WAAW,cAAc;IAC3B,GAAG,CAAC,EAAE,OAAO,UAAU,EAAE,QAAQ,CAAC;IAClC,sDAAsD;IACtD,QAAQ,EAAE,MAAM,CAAC;IACjB,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oDAAoD;IACpD,GAAG,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;IAC/C,wCAAwC;IACxC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,6CAA6C;IAC7C,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,kDAAkD;IAClD,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,8CAA8C;IAC9C,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACtB;AAED,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAC9B,GAAG,EACH,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,qBAA4B,EAC5B,oBAAoD,EACpD,GAAG,IAAI,EACV,EAAE,cAAc,qBAsDhB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "spine-expo-usedom",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Spine player for Expo",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -94,4 +94,4 @@
   "dependencies": {
     "@esotericsoftware/spine-webcomponents": "^4.2.96"
   }
-}
+}

package/src/index.tsx

@@ -1,7 +1,6 @@
 'use dom';
 
 import React, { useEffect } from 'react';
-import '@esotericsoftware/spine-webcomponents';
 
 export interface SpineViewProps {
     dom?: import('expo/dom').DOMProps;
@@ -21,6 +20,8 @@ export interface SpineViewProps {
     preserveDrawingBuffer?: boolean;
     /** Raw assets data for embedding */
     rawData?: string;
+    /** Path to the spine-webcomponents.min.js file */
+    spineWebComponentSrc?: string;
     /** Any other attributes for spine-skeleton */
     [key: string]: any;
 }
@@ -31,6 +32,7 @@ export default function SpineView({
     atlas,
     skin,
     preserveDrawingBuffer = true,
+    spineWebComponentSrc = '/spine-webcomponents.min.js',
     ...rest
 }: SpineViewProps) {
     // window.location.origin を使って絶対パスを生成
@@ -47,11 +49,26 @@ export default function SpineView({
 
     const absoluteSkeleton = getAbsolutePath(skeleton);
     const absoluteAtlas = getAbsolutePath(atlas);
+    const absoluteSpineWebComponentSrc = getAbsolutePath(spineWebComponentSrc);
 
     useEffect(() => {
         console.log('Current URL:', window.location.href);
         console.log('Spine assets paths (absolute):', { skeleton: absoluteSkeleton, atlas: absoluteAtlas });
-    }, []);
+
+        if ((window as any).spine) return;
+
+        // Prevent duplicate script loading
+        if (document.querySelector(`script[src="${absoluteSpineWebComponentSrc}"]`)) return;
+
+        const script = document.createElement('script');
+        script.src = absoluteSpineWebComponentSrc;
+        script.async = true;
+        script.onload = () => {
+            console.log('Spine Web Components loaded');
+        };
+        script.onerror = (e) => console.error('Failed to load Spine script', e);
+        document.head.appendChild(script);
+    }, [absoluteSpineWebComponentSrc]);
 
     // skin="default" の場合、Spine Web Components でエラーになる場合があるため除外する
     // また、React 19以降ではCustom Elementのプロパティとして渡される際、文字列のままだと