@doki-land/live2d 0.0.8 → 0.0.10

package/dist/live2d.css

@@ -1 +1 @@
-.live2d-icon-panel{position:fixed;right:10px;bottom:150px;z-index:10000;display:flex;flex-direction:column;gap:10px;opacity:0;transition:opacity .3s ease}.live2d-icon-panel.visible{opacity:1}.live2d-icon{width:40px;height:40px;background-color:#fffc;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 2px 5px #0003;transition:transform .2s ease}.live2d-icon:hover{transform:scale(1.1)}.live2d-icon svg{width:24px;height:24px;fill:#666}
+.live2d-icon-panel{position:fixed;right:10px;bottom:150px;z-index:10000;display:flex;flex-direction:column;gap:10px;opacity:0;transition:opacity .3s ease}.live2d-icon-panel.visible{opacity:1}.live2d-icon{width:40px;height:40px;background-color:#fffc;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 2px 5px #0003;transition:transform .2s ease}.live2d-icon:hover{transform:scale(1.1)}.live2d-icon svg{width:24px;height:24px;fill:#666}.live2d-canvas{position:absolute;z-index:9999;display:block}

package/package.json

@@ -1,28 +1,24 @@
 {
     "name": "@doki-land/live2d",
-    "version": "0.0.8",
+    "version": "0.0.10",
     "keywords": [
         "live2d",
         "pixi",
         "typescript"
     ],
-    "description": "Live2D TypeScript runtime based on pixi-live2d-display",
+    "description": "Live2D TypeScript runtime based on pixi",
     "author": "Aster <192608617@qq.com>",
     "license": "LGPL-3.0-or-later",
     "type": "module",
     "exports": {
         ".": {
             "types": "./src/index.ts",
-            "require": "./dist/l2d.umd.js",
-            "import": "./src/index.ts"
+            "import": "./src/index.ts",
+            "require": "./dist/l2d.umd.js"
         },
-        "./fs": {
-            "types": "./src/fs/index.ts",
-            "import": "./src/fs/index.ts"
-        },
-        "./types": {
-            "types": "./src/types/index.ts",
-            "import": "./src/types/index.ts"
+        "./*": {
+            "types": "./src/*/index.ts",
+            "import": "./src/*/index.ts"
         }
     },
     "files": [

package/readme.md

@@ -1,19 +1,60 @@
-## Doki land live2d renderer
+# Live2D Core Adapter (Unofficial)
 
+## Usage
 
+This is the core library for rendering Live2D models in web applications.
 
-## Using in html by module
+It provides essential functionalities to load and display Live2D models with interactive capabilities.
+
+
+
+### In HTML via Module
 
 ```html
+<script src="https://cdn.jsdelivr.net/npm/@doki-land/live2d@latest/dist/l2d.umd.js">
 <script type="module">
-  const cdn = 'https://cdn.jsdelivr.net/npm/@doki-land/live2d@latest/dist/l2d.esm.js';
-  const { createLive2dModel, initializeLive2D } = await import(cdn);
-  initializeLive2D();
-  await createLive2dModel({
+l2d.initializeLive2D();
+l2d.createLive2D({
     element_id: 'live2d-canvas',
     models: [
-      {}
+        {}
     ]
-  });
+})
 </script>
-```
+```
+
+
+### In Node via npm
+
+- installation
+
+```bash
+npm install @doki-land/live2d-core
+```
+
+- usage
+
+```javascript
+
+
+
+
+
+```
+
+### In Other Frameworks
+
+- [VitePress]()
+- [VuePress]()
+- [Hexo]()
+
+## Features
+
+- Render Live2D Cubism™ v1, v2 (`*.model.json`). 
+- Render Live2D Cubism™ v3, v4, v5 (`*.model3.json`).
+
+
+
+### API Documentation
+- `initializeLive2D()`: Initializes the Live2D environment
+- `createLive2dModel(options)`: Creates and renders a Live2D model with specified options

package/src/fs/index.ts

@@ -1,5 +1,5 @@
 import { minimatch } from 'minimatch';
-import { ModelOptions } from '@/types/index.js';
+import { ModelOptions } from '@doki-land/live2d/types';
 import path from 'node:path';
 import fs from 'node:fs';
 

package/src/helper/index.ts

@@ -0,0 +1,25 @@
+import {findAllModels, mergeModels} from "@doki-land/live2d/fs";
+import {ResolveCdn, ResolveElementId, ResolveModels} from "@doki-land/live2d/types";
+
+export function generateModelList(options: ResolveModels) {
+    const models = mergeModels(options.domain || 'https://localhost:8080', findAllModels(options.models_folder || 'public/live2d'), options.models || []);
+    if (models.length == 0) {
+        throw new Error('At least one live2d model is required');
+    }
+    delete options.domain;
+    delete options.models;
+    delete options.models_folder;
+    return models;
+}
+
+export function generateElementId(options: ResolveElementId) {
+    const element_id = options.element_id || 'live2d-canvas';
+    delete options.element_id;
+    return element_id
+}
+
+export function generateCdn(options: ResolveCdn) {
+    const cdn = options.cdn || 'https://cdn.jsdelivr.net/npm/@doki-land/live2d@latest/dist/l2d.umd.js';
+    delete options.cdn;
+    return cdn
+}

package/src/icons/style.css

@@ -35,4 +35,10 @@
     width: 24px;
     height: 24px;
     fill: #666;
+}
+
+.live2d-canvas {
+    position: absolute;
+    z-index: 9999;
+    display: block;
 }

package/src/index.ts

@@ -1,16 +1,11 @@
 import '../lib/cubism2.min.js';
 import '../lib/cubism5.min.js';
 import * as PIXI from 'pixi.js';
-
-import { Ticker, TickerPlugin } from '@pixi/ticker';
-import {
-    Live2DModel,
-    MotionManager,
-    SoundManager
-} from 'pixi-live2d-display-lipsyncpatch';
-import { Application,  } from 'pixi.js';
+import {Application} from 'pixi.js';
+import {Ticker} from '@pixi/ticker';
+import {Live2DModel, MotionManager, SoundManager} from 'pixi-live2d-display-lipsyncpatch';
 import './icons/style.css';
-import { Live2dOptions } from '@/types/index.js';
+import {Live2dOptions} from '@doki-land/live2d/types';
 
 export {MotionManager, SoundManager, Live2DModel, PIXI};
 
@@ -50,7 +45,7 @@ export async function createLive2D(options: Live2dOptions): Promise<Live2DModel>
     });
 
     // 加载模型
-    const model = await Live2DModel.from(models[0].model_url,  {
+    const model = await Live2DModel.from(models[0].model_url, {
         ticker: Ticker.system,
     });
     // 添加模型到舞台
@@ -76,7 +71,7 @@ export async function createLive2D(options: Live2dOptions): Promise<Live2DModel>
     if (auto_motion) {
         await startIdleAnimation(model);
     }
-    
+
     // 创建右侧图标栏
     // createIconPanel(model, element);
 
@@ -88,15 +83,10 @@ function findOrCreateCanvas(id: string, options: Live2dOptions): HTMLCanvasEleme
     if (!canvas) {
         canvas = document.createElement('canvas');
         canvas.id = id;
-        document.body.appendChild(canvas);
-        canvas.style.display = 'none';
-        canvas.style.position = 'fixed';
-        // 设置画布样式
-        canvas.style.display = 'block';
-        canvas.style.position = 'absolute';
+        canvas.classList.add('live2d-canvas')
         canvas.style.bottom = `${options.spacing_y || 0}px`;
         canvas.style[options.position === 'left' ? 'left' : 'right'] = `${options.spacing_x || 0}px`;
-        canvas.style.zIndex = '9999';
+        document.body.appendChild(canvas);
     }
     return canvas;
 }
@@ -124,7 +114,7 @@ function enableMouseTracking(model: Live2DModel, canvas: any) {
             model.internalModel.focusController?.focus(mouseX, mouseY);
         }
     });
-    
+
     // 添加点击模型触发动作的交互
     canvas.addEventListener('click', () => {
         // 尝试播放tap_body动作，如果没有则尝试其他可用动作

package/src/types/Live2dOptions.ts

@@ -1,4 +1,4 @@
-import { ModelOptions } from './ModelOptions.js';
+import { ModelOptions } from './ModelOptions.ts';
 
 /**
  * Live2D模型配置选项

package/src/types/Resolve.ts

@@ -0,0 +1,16 @@
+import {ModelOptions} from "./ModelOptions.ts";
+
+
+export type ResolveModels = {
+    domain?: string,
+    models?: ModelOptions[]
+    models_folder?: string
+}
+
+export type ResolveElementId = {
+    element_id?: string
+}
+
+export type ResolveCdn = {
+    cdn?: string
+}

package/src/types/index.ts

@@ -1,2 +1,3 @@
-export  * from './Live2dOptions.js';
-export  * from './ModelOptions.js';
+export  * from './Live2dOptions.ts';
+export  * from './ModelOptions.ts';
+export  * from './Resolve.ts';