lunchboxjs 2.1.14 → 2.1.15

package/package.json

@@ -13,7 +13,7 @@
       "types": "./src/types.d.ts"
     }
   },
-  "version": "2.1.14",
+  "version": "2.1.15",
   "type": "module",
   "types": "./src/types.d.ts",
   "scripts": {

package/src/html-anchor.ts

@@ -54,7 +54,7 @@ export class HtmlAnchor extends LitElement {
   }
 
   // Setup - save local parent and try adding update
-  connectedCallback() {
+  override connectedCallback() {
     super.connectedCallback();
 
     const parent = this.parentNode as Lunchbox<THREE.Object3D>;
@@ -73,16 +73,16 @@ export class HtmlAnchor extends LitElement {
   }
 
   // Teardown
-  disconnectedCallback(): void {
+  override disconnectedCallback(): void {
     if (this.frame !== -1) cancelAnimationFrame(this.frame);
   }
 
 
-  protected render(): unknown {
+  override render(): unknown {
     return html`<slot></slot>`
   }
 
-  protected createRenderRoot() {
+  override createRenderRoot() {
     return this;
   }
 }

package/src/index.ts

@@ -2,8 +2,8 @@ import { autoComponents } from './auto-components';
 import { buildClass } from './three-base';
 import { ThreeLunchbox } from './three-lunchbox';
 import { IsClass } from './utils';
-import * as THREE from '../node_modules/@types/three';
 import { HtmlAnchor } from './html-anchor';
+import type { Intersection, Object3DEventMap, Scene, Object3D } from 'three';
 
 export * from './three-lunchbox';
 export * from './html-anchor';
@@ -29,9 +29,9 @@ export { ThreeBase } from './three-base';
  * mesh?.instance.position.set(0, 1, 0); // - or anything else you can do with a mesh
  * ```
  */
-export type Lunchbox<T = THREE.Object3D> = Element & LunchboxProperties<T>
+export type Lunchbox<T = Object3D> = Element & LunchboxProperties<T>
 
-export type LunchboxProperties<T = THREE.Object3D> = {
+export type LunchboxProperties<T = Object3D> = {
     instance: T;
 }
 
@@ -65,7 +65,7 @@ export const initLunchbox = ({
             return;
         }
 
-        const result = buildClass(className as keyof typeof THREE);
+        const result = buildClass(className as any);
         if (result) {
             customElements.define(kebabCase, result);
         }
@@ -111,14 +111,14 @@ export const THREE_CLICK_EVENT_NAME = 'threeclick';
 export const BEFORE_RENDER_EVENT_NAME = 'beforerender';
 export const AFTER_RENDER_EVENT_NAME = 'afterrender';
 export type ThreeIntersectEvent = {
-    intersect: THREE.Intersection<THREE.Object3D<THREE.Object3DEventMap>>;
+    intersect: Intersection<Object3D<Object3DEventMap>>;
     element: Element | null;
 }
 export interface InstanceEvent<T = unknown> {
     instance: T;
 }
 export type InstanceAddedEvent<T = unknown> = InstanceEvent<T> & {
-    parent: THREE.Scene | THREE.Object3D
+    parent: Scene | Object3D
 }
 export interface LoadedEvent<T = unknown> {
     loaded: T;

package/src/three-lunchbox.ts

@@ -101,7 +101,7 @@ export class ThreeLunchbox extends LitElement {
   }
 
   /** To run on start. */
-  connectedCallback(): void {
+  override connectedCallback(): void {
     super.connectedCallback();
     if (this.dpr === DEFAULT_DPR) {
       this.dpr = window.devicePixelRatio;
@@ -150,7 +150,7 @@ export class ThreeLunchbox extends LitElement {
     }
   }
 
-  disconnectedCallback(): void {
+  override disconnectedCallback(): void {
     this.three.renderer?.domElement.removeEventListener('pointermove', this.onPointerMove.bind(this));
     this.three.renderer?.domElement.removeEventListener('mousemove', this.onPointerMove.bind(this));
     this.three.renderer?.domElement.removeEventListener('click', this.onClick.bind(this));
@@ -245,7 +245,7 @@ export class ThreeLunchbox extends LitElement {
 
   /** Container styles */
   // TODO: fill window, fit-to-container
-  static styles = css`
+  static override styles = css`
     :host {
       width: 100%;
       height: 100%;
@@ -284,7 +284,7 @@ export class ThreeLunchbox extends LitElement {
     }
   }
 
-  render() {
+  override render() {
     // TODO: more robust slot changes
     return html`
       <slot @slotchange=${this.handleDefaultSlotChange}></slot>