string-tune-3d 0.0.1

package/dist/index.d.ts

@@ -0,0 +1,341 @@
+import { StringModule, StringContext, StringObject, StringData } from '@fiddle-digital/string-tune';
+
+interface I3DVector3 {
+    x: number;
+    y: number;
+    z: number;
+    set(x: number, y: number, z: number): this;
+    copy(v: I3DVector3): this;
+    clone(): I3DVector3;
+    setFromMatrixPosition(m: I3DMatrix4): this;
+    lengthSq(): number;
+}
+interface I3DVector2 {
+    x: number;
+    y: number;
+    set(x: number, y: number): this;
+    copy(v: I3DVector2): this;
+    clone(): I3DVector2;
+}
+interface I3DQuaternion {
+    x: number;
+    y: number;
+    z: number;
+    w: number;
+    copy(q: I3DQuaternion): this;
+    clone(): I3DQuaternion;
+}
+interface I3DEuler {
+    x: number;
+    y: number;
+    z: number;
+    order: string;
+    copy(e: I3DEuler): this;
+    clone(): I3DEuler;
+}
+interface I3DMatrix4 {
+    decompose(position: I3DVector3, quaternion: I3DQuaternion, scale: I3DVector3): void;
+    clone(): I3DMatrix4;
+}
+interface I3DBox3 {
+    min: I3DVector3;
+    max: I3DVector3;
+    setFromObject(object: I3DObject): this;
+    getSize(target: I3DVector3): I3DVector3;
+    clone(): I3DBox3;
+}
+interface I3DObject {
+    position: I3DVector3;
+    rotation: I3DEuler;
+    quaternion: I3DQuaternion;
+    scale: I3DVector3;
+    matrix: I3DMatrix4;
+    matrixWorld: I3DMatrix4;
+    visible?: boolean;
+    add(object: I3DObject): this;
+    remove(object: I3DObject): this;
+    updateMatrix(): void;
+    updateMatrixWorld(force?: boolean): void;
+    traverse?(callback: (object: any) => void): void;
+}
+interface I3DMesh extends I3DObject {
+    geometry: I3DGeometry;
+    material: I3DMaterial | I3DMaterial[];
+}
+interface I3DGeometry {
+    dispose(): void;
+    computeBoundingBox(): void;
+    boundingBox: I3DBox3 | null;
+}
+interface I3DMaterial {
+    dispose(): void;
+    opacity?: number;
+    transparent?: boolean;
+}
+interface I3DLight extends I3DObject {
+    color: any;
+    intensity: number;
+}
+interface I3DCamera extends I3DObject {
+    aspect: number;
+    updateProjectionMatrix(): void;
+    lookAt(x: number, y: number, z: number): void;
+}
+interface I3DPerspectiveCamera extends I3DCamera {
+    fov: number;
+    near: number;
+    far: number;
+}
+interface I3DOrthographicCamera extends I3DCamera {
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+    near: number;
+    far: number;
+}
+interface I3DScene extends I3DObject {
+    background: any;
+}
+interface I3DRenderer {
+    domElement: HTMLElement;
+    setSize(width: number, height: number): void;
+    setPixelRatio(ratio: number): void;
+    render(scene: I3DScene, camera: I3DCamera): void;
+    dispose(): void;
+}
+interface I3DTextureLoader {
+    load(url: string, onLoad?: (texture: any) => void): any;
+}
+interface I3DModelLoader {
+    load(url: string, onLoad?: (model: any) => void, onProgress?: (progress: any) => void, onError?: (error: any) => void): void;
+}
+interface I3DEngine {
+    createVector3(x?: number, y?: number, z?: number): I3DVector3;
+    createVector2(x?: number, y?: number): I3DVector2;
+    createQuaternion(x?: number, y?: number, z?: number, w?: number): I3DQuaternion;
+    createEuler(x?: number, y?: number, z?: number, order?: string): I3DEuler;
+    createMatrix4(): I3DMatrix4;
+    createBox3(min?: I3DVector3, max?: I3DVector3): I3DBox3;
+    createScene(): I3DScene;
+    createRenderer(options?: {
+        antialias?: boolean;
+        alpha?: boolean;
+        logarithmicDepthBuffer?: boolean;
+    }): I3DRenderer;
+    createPerspectiveCamera(fov?: number, aspect?: number, near?: number, far?: number): I3DPerspectiveCamera;
+    createOrthographicCamera(left: number, right: number, top: number, bottom: number, near?: number, far?: number): I3DOrthographicCamera;
+    createGroup(): I3DObject;
+    createMesh(geometry: I3DGeometry, material: I3DMaterial): I3DMesh;
+    createBoxGeometry(width: number, height: number, depth: number): I3DGeometry;
+    createSphereGeometry(radius: number, widthSegments?: number, heightSegments?: number): I3DGeometry;
+    createPlaneGeometry(width: number, height: number): I3DGeometry;
+    createCylinderGeometry(radiusTop: number, radiusBottom: number, height: number, segments?: number): I3DGeometry;
+    createMeshBasicMaterial(params?: any): I3DMaterial;
+    createMeshStandardMaterial(params?: any): I3DMaterial;
+    createPointLight(color?: string | number, intensity?: number, distance?: number, decay?: number): I3DLight;
+    createAmbientLight(color?: string | number, intensity?: number): I3DLight;
+    createDirectionalLight(color?: string | number, intensity?: number): I3DLight;
+    createTextureLoader(): I3DTextureLoader;
+    createModelLoader(type: string): I3DModelLoader;
+    degToRad(degrees: number): number;
+    radToDeg(radians: number): number;
+    computeBoundingBoxRecursively(object: I3DObject): I3DBox3;
+}
+
+interface I3DEngineProvider {
+    getEngine(): I3DEngine;
+    getName(): string;
+}
+
+interface String3DOptions {
+    hideHTML?: boolean;
+    container?: string | HTMLElement;
+    zIndex?: number;
+}
+declare class String3D extends StringModule {
+    private static provider;
+    private renderer;
+    private camera;
+    private scene;
+    private synchronizer;
+    private engine;
+    private canvasContainer;
+    private isLoading;
+    private options;
+    static setProvider(provider: I3DEngineProvider): void;
+    constructor(context: StringContext, options?: String3DOptions);
+    canConnect(object: StringObject): boolean;
+    initializeObject(globalId: number, object: StringObject, element: HTMLElement, attributes: Record<string, any>): void;
+    onResize(): void;
+    onInit(): void;
+    private createOrGetContainer;
+    private applyContainerStyles;
+    onObjectConnected(object: StringObject): void;
+    onFrame(data: StringData): void;
+    private syncRecursive;
+    private injectCSS;
+    destroy(): void;
+}
+
+type CameraMode = "orthographic" | "perspective";
+declare class String3DCamera {
+    private scaleCache;
+    private _camera;
+    private _position;
+    private _width;
+    private _height;
+    private engine;
+    private mode;
+    private perspectiveFov;
+    constructor(engine: I3DEngine, mode?: CameraMode, fov?: number, near?: number, far?: number);
+    get camera(): I3DCamera;
+    resize(width: number, height: number): void;
+    setPosition(x: number, y: number, z: number): void;
+    lookAt(x: number, y: number, z: number): void;
+    update(): void;
+    screenToWorld(screenX: number, screenY: number, z?: number): I3DVector3;
+    getFrustumSizeAt(z: number): {
+        width: number;
+        height: number;
+    };
+    getScaleAtZ(z: number, viewportHeight: number): number;
+    clearScaleCache(): void;
+    getMode(): CameraMode;
+}
+
+declare class String3DObject {
+    id: string;
+    type: string;
+    private _object;
+    private _material?;
+    private _geometry?;
+    private _texture?;
+    private _uniforms;
+    private _originalBoundingBox?;
+    private _quaternion;
+    private _originalSize;
+    private _bbox;
+    el: any;
+    private _children;
+    private engine;
+    get children(): String3DObject[];
+    constructor(id: string, type: string, object: I3DObject, engine: I3DEngine);
+    get object(): I3DObject;
+    get material(): I3DMaterial | undefined;
+    get originalSize(): I3DVector3;
+    get boundingBox(): I3DBox3;
+    addChild(child: String3DObject): void;
+    getWorldMatrix(): I3DMatrix4;
+    getWorldPosition(): I3DVector3;
+    getOriginalBoundingBox(): I3DBox3;
+    syncTransformFromMatrix(matrix: I3DMatrix4): void;
+    applyWorldTransform(position: I3DVector3, quaternion: I3DQuaternion, scale: I3DVector3): void;
+    set quaternion(quaternion: I3DQuaternion);
+    set position(position: I3DVector3);
+    set scale(scale: I3DVector3);
+    set rotation(euler: I3DEuler);
+    set opacity(value: number);
+    set metalness(value: number);
+    set roughness(value: number);
+    set texture(texture: any);
+    updateBoundingBox(): void;
+    destroy(): void;
+}
+
+declare class String3DScene {
+    private _scene;
+    private _objects;
+    private _rootObjects;
+    private _elementMap;
+    private engine;
+    private _modelLoader;
+    get rootObjects(): String3DObject[];
+    constructor(engine: I3DEngine, modelLoader?: any);
+    getScene(): I3DScene;
+    getObject(id: string): String3DObject | undefined;
+    hasObject(id: string): boolean;
+    deleteObject(id: string): boolean;
+    createFromElement(object: StringObject): void;
+    private createGroup;
+    private createLight;
+    private createBox;
+    private createSphere;
+    private createPlane;
+    private createCylinder;
+    private createModel;
+    private createMaterialFromObject;
+    private loadTexture;
+    destroy(): void;
+}
+
+declare class String3DRenderer {
+    private _container;
+    private _renderer;
+    private _width;
+    private _height;
+    private engine;
+    constructor(container: HTMLElement, engine: I3DEngine);
+    attach(): void;
+    render(scene: String3DScene, camera: String3DCamera): void;
+    resize(camera: String3DCamera): void;
+    get width(): number;
+    get height(): number;
+    get renderer(): I3DRenderer;
+    destroy(): void;
+}
+
+declare class String3DSynchronizer {
+    camera: String3DCamera;
+    viewportWidth: number;
+    viewportHeight: number;
+    engine: I3DEngine;
+    private strategies;
+    constructor(camera: String3DCamera, viewportWidth: number, viewportHeight: number, engine: I3DEngine);
+    syncElement(el: HTMLElement, object: String3DObject, parentData: any): any;
+    updateViewportSize(width: number, height: number): void;
+}
+
+declare class ThreeJSEngine implements I3DEngine {
+    private THREE;
+    private loaders;
+    constructor(THREE: any, loaders?: Record<string, any>);
+    createVector3(x?: number, y?: number, z?: number): I3DVector3;
+    createVector2(x?: number, y?: number): I3DVector2;
+    createQuaternion(x?: number, y?: number, z?: number, w?: number): I3DQuaternion;
+    createEuler(x?: number, y?: number, z?: number, order?: string): I3DEuler;
+    createMatrix4(): I3DMatrix4;
+    createBox3(min?: I3DVector3, max?: I3DVector3): I3DBox3;
+    createScene(): I3DScene;
+    createRenderer(options?: {
+        antialias?: boolean;
+        alpha?: boolean;
+        logarithmicDepthBuffer?: boolean;
+    }): I3DRenderer;
+    createPerspectiveCamera(fov?: number, aspect?: number, near?: number, far?: number): I3DPerspectiveCamera;
+    createOrthographicCamera(left: number, right: number, top: number, bottom: number, near?: number, far?: number): I3DOrthographicCamera;
+    createGroup(): I3DObject;
+    createMesh(geometry: I3DGeometry, material: I3DMaterial): I3DMesh;
+    createBoxGeometry(width: number, height: number, depth: number): I3DGeometry;
+    createSphereGeometry(radius: number, widthSegments?: number, heightSegments?: number): I3DGeometry;
+    createPlaneGeometry(width: number, height: number): I3DGeometry;
+    createCylinderGeometry(radiusTop: number, radiusBottom: number, height: number, segments?: number): I3DGeometry;
+    createMeshBasicMaterial(params?: any): I3DMaterial;
+    createMeshStandardMaterial(params?: any): I3DMaterial;
+    createPointLight(color?: string | number, intensity?: number, distance?: number, decay?: number): I3DLight;
+    createAmbientLight(color?: string | number, intensity?: number): I3DLight;
+    createDirectionalLight(color?: string | number, intensity?: number): I3DLight;
+    createTextureLoader(): I3DTextureLoader;
+    createModelLoader(type: string): I3DModelLoader;
+    degToRad(degrees: number): number;
+    radToDeg(radians: number): number;
+    computeBoundingBoxRecursively(object: I3DObject): I3DBox3;
+}
+declare class ThreeJSProvider implements I3DEngineProvider {
+    private engine;
+    constructor(THREE: any, loaders?: Record<string, any>);
+    getEngine(): I3DEngine;
+    getName(): string;
+}
+
+export { type CameraMode, type I3DBox3, type I3DCamera, type I3DEngine, type I3DEngineProvider, type I3DEuler, type I3DGeometry, type I3DLight, type I3DMaterial, type I3DMatrix4, type I3DMesh, type I3DModelLoader, type I3DObject, type I3DOrthographicCamera, type I3DPerspectiveCamera, type I3DQuaternion, type I3DRenderer, type I3DScene, type I3DTextureLoader, type I3DVector2, type I3DVector3, String3D, String3DCamera, String3DObject, type String3DOptions, String3DRenderer, String3DScene, String3DSynchronizer, ThreeJSEngine, ThreeJSProvider };

package/dist/index.js

@@ -0,0 +1,29 @@
+"use strict";var StringTune3D=(()=>{var V=Object.defineProperty;var U=Object.getOwnPropertyDescriptor;var Y=Object.getOwnPropertyNames;var G=Object.prototype.hasOwnProperty;var X=(o,e)=>{for(var t in e)V(o,t,{get:e[t],enumerable:!0})},K=(o,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of Y(e))!G.call(o,i)&&i!==t&&V(o,i,{get:()=>e[i],enumerable:!(r=U(e,i))||r.enumerable});return o};var Q=o=>K(V({},"__esModule",{value:!0}),o);var ie={};X(ie,{String3D:()=>N,String3DCamera:()=>D,String3DObject:()=>S,String3DRenderer:()=>k,String3DScene:()=>L,String3DSynchronizer:()=>T,ThreeJSEngine:()=>O,ThreeJSProvider:()=>H});var Z=class{constructor(){this.desktop={rebuild:{width:!0,height:!0,scrollHeight:!0}},this.mobile={rebuild:{width:!0,height:!0,scrollHeight:!0}}}},F=class{constructor(o){this.objectMapOnPage=new Map,this.objectsOnPage=[],this.objectMap=new Map,this.objects=[],this.htmlKey="",this._type=1,this.permissions=new Z,this.tools=o.tools,this.data=o.data,this.settings=o.settings,this.events=o.events,this.centers=o.centers,this.hover=o.hover,this.attributesToMap=[{key:"active",type:"boolean",fallback:this.settings.active},{key:"fixed",type:"boolean",fallback:this.settings.fixed},{key:"outside-container",type:"boolean",fallback:this.settings["outside-container"]},{key:"repeat",type:"boolean",fallback:this.settings.repeat},{key:"self-disable",type:"boolean",fallback:this.settings["self-disable"]},{key:"abs",type:"boolean",fallback:this.settings.abs},{key:"key",type:"string",fallback:this.settings.key},{key:"offset-top",type:"dimension",fallback:this.settings["offset-top"]},{key:"offset-bottom",type:"dimension",fallback:this.settings["offset-bottom"]},{key:"inview-top",type:"dimension",fallback:this.settings["inview-top"]},{key:"inview-bottom",type:"dimension",fallback:this.settings["inview-bottom"]},{key:"start",type:"number",fallback:(e,t,r)=>{let i=r.top;return Math.floor(i)+this.data.scroll.container.scrollTop*this.data.viewport.transformScale}},{key:"end",type:"number",fallback:(e,t,r)=>{let i=r.top,s=r.height;return i+s-this.data.scroll.transformedCurrent}},{key:"size",type:"number",fallback:(e,t,r)=>r.height},{key:"half-width",type:"number",fallback:(e,t,r)=>r.width/2},{key:"half-height",type:"number",fallback:(e,t,r)=>r.height/2},{key:"enter-el",type:"string",fallback:this.settings["enter-el"]},{key:"enter-vp",type:"string",fallback:this.settings["enter-vp"]},{key:"exit-el",type:"string",fallback:this.settings["exit-el"]},{key:"exit-vp",type:"string",fallback:this.settings["exit-vp"]}]}get type(){return this._type}initializeObject(o,e,t,r){let i=this.tools.boundingClientRect.process({element:t});for(let{key:s,type:n,fallback:a,transform:l}of this.attributesToMap){let h=typeof a=="function"?a(t,e,i):a,d=this.tools.domAttribute.process({element:t,key:s,fallback:r[s]??this.settings[s]??h}),u=this.parseAttribute(d,n,{element:t,boundingRect:i,viewportHeight:this.data.viewport.windowHeight,baseRem:this.data.viewport.baseRem});l&&(u=l(u)),e.setProperty(s,u)}}calculatePositions(o,e){let t=o.getProperty("start"),r=o.getProperty("size"),i=o.getProperty("offset-bottom"),s=o.getProperty("offset-top"),n=o.getProperty("enter-el"),a=o.getProperty("enter-vp"),l=o.getProperty("exit-el"),h=o.getProperty("exit-vp"),d=0,u=0,v=0,g=0;n==="top"&&a==="top"||n==="left"&&a==="left"?(v=-e+1,d=t-i):n==="top"&&a==="bottom"||n==="left"&&a==="right"?d=t-e-i:n==="bottom"&&a==="top"||n==="right"&&a==="left"?(v=-e-r+1,d=t+r-i):(n==="bottom"&&a==="bottom"||n==="right"&&a==="right")&&(v=-r+1,d=t-e+r-i),l==="top"&&h==="top"||l==="left"&&h==="left"?(g=-r+1,u=t+s):l==="top"&&h==="bottom"||l==="left"&&h==="right"?(g=-e-r+1,u=t-e+s):l==="bottom"&&h==="top"||l==="right"&&h==="left"?u=t+r+s:(l==="bottom"&&h==="bottom"||l==="right"&&h==="right")&&(g=-e+1,u=t-e+r+s),o.setProperty("start-bias",v),o.setProperty("end-bias",g),o.setProperty("start-position",d-this.data.scroll.topPosition),o.setProperty("end-position",u-this.data.scroll.topPosition),o.setProperty("difference-position",u-d);let x=o.getProperty("inview-top")??0,y=o.getProperty("inview-bottom")??0;o.setProperty("inview-start-position",o.getProperty("start-position")+x),o.setProperty("inview-end-position",o.getProperty("end-position")+y)}parseAttribute(o,e,t={}){if(o==null)return null;if(typeof e=="object"&&e.type==="enum")return e.values.includes(o)?o:e.values[0];switch(e){case"number":return parseFloat(o);case"boolean":return o===""||o==="true";case"json":try{return JSON.parse(o)}catch{return null}case"tuple":return o.trim().split(/\s+/);case"easing":return this.tools.easingFunction.process({easing:o});case"color":return this.tools.colorParser.process({value:o});case"dimension":return o=="0"?0:t.element!=null&&t.viewportHeight!=null&&t.baseRem!=null&&t.boundingRect!=null?this.tools.unitParser.process({value:o,element:t.element,viewportHeight:t.viewportHeight,boundingRect:t.boundingRect,baseRem:t.baseRem}):0;case"breakpoint-dimension":if(t.element!=null&&t.viewportHeight!=null&&t.baseRem!=null&&t.boundingRect!=null){let r=o.trim().split("|"),i=[];for(let s of r)if(s.includes(":")){let[n,a]=s.split(":");i.push({breakpoint:parseInt(n),value:this.tools.unitParser.process({value:`${a}|`,element:t.element,viewportHeight:t.viewportHeight,boundingRect:t.boundingRect,baseRem:t.baseRem})})}else i.push({breakpoint:0,value:this.tools.unitParser.process({value:s,element:t.element,viewportHeight:t.viewportHeight,boundingRect:t.boundingRect,baseRem:t.baseRem})});return i}default:return o}}canConnect(o){return o.keys.includes(this.htmlKey)}connectObject(o){o.connect(this),this.onObjectConnected(o)}enterObject(o,e){this.objectMap.has(o)||(this.objectMap.set(o,e),this.objects.push(e))}exitObject(o){let e=this.objectMap.get(o);if(!e)return;this.objectMap.delete(o);let t=this.objects.indexOf(e);t!==-1&&this.objects.splice(t,1)}addObject(o,e){this.objectMapOnPage.has(o)||(this.objectMapOnPage.set(o,e),this.objectsOnPage.push(e))}removeObject(o){let e=this.objectMapOnPage.get(o);if(!e)return;this.objectMapOnPage.delete(o);let t=this.objectsOnPage.indexOf(e);t!==-1&&this.objectsOnPage.splice(t,1),this.onObjectDisconnected(e)}onObjectConnected(o){}onObjectDisconnected(o){}applyToElementAndConnects(o,e,t=e){o.getProperty("self-disable")!==!0&&e(o.htmlElement),o.mirrorObjects.forEach(r=>t(r.htmlElement,r))}destroy(){this.objects=[],this.objectMap=new Map}onInit(){}onFrame(o){}onMutate(o){}onScrollMeasure(o){}onMouseMoveMeasure(o){}onResize(){}onResizeWidth(){}onScroll(o){}onDirectionChange(){}onScrollStart(){}onScrollStop(){}onScrollDirectionChange(){}onAxisChange(){}onDeviceChange(){}onScrollConfigChange(){}onSettingsChange(){}onDOMRebuild(){}onMouseMove(o){}onWheel(o){}onDOMMutate(o,e){}};var J=class{constructor(){this.pendingVars=new Map,this.pendingProps=new Map,this.isOpen=!1}begin(){this.isOpen||(this.isOpen=!0)}setVars(o,e){if(!this.isOpen){console.warn("StyleTxn: call begin() first to set custom properties.");return}let t=this.pendingVars.get(o)??{};for(let[r,i]of Object.entries(e))t[r]!==i&&(t[r]=i);this.pendingVars.set(o,t)}setProps(o,e){if(!this.isOpen){console.warn("StyleTxn: call begin() first to set standard properties.");return}let t=this.pendingProps.get(o)??{};for(let[r,i]of Object.entries(e))t[r]!==i&&(t[r]=i);this.pendingProps.set(o,t)}run(o){let e=this.isOpen;e||this.begin();try{o(),e||this.commit()}catch(t){throw e||this.cancel(),t}}commit(){if(this.isOpen){this.isOpen=!1;for(let[o,e]of this.pendingVars){let t=o.style;for(let[r,i]of Object.entries(e))t.setProperty(r,String(i))}this.pendingVars.clear();for(let[o,e]of this.pendingProps){let t=o.style;for(let[r,i]of Object.entries(e))t[r]=String(i)}this.pendingProps.clear()}}cancel(){this.pendingVars.clear(),this.pendingProps.clear(),this.isOpen=!1}},$=new J;var ne=1/240;var ee=class{constructor(){this.measureQueue=[],this.mutateQueue=[],this.scheduled=!1}measure(o){this.measureQueue.push(o),this.schedule()}mutate(o){this.mutateQueue.push(o),this.schedule()}schedule(){this.scheduled||(this.scheduled=!0,requestAnimationFrame(()=>{let o=this.measureQueue;this.measureQueue=[];for(let t=0;t<o.length;t++)try{o[t]()}catch(r){console.error("Error in frameDOM measure task:",r)}let e=this.mutateQueue;this.mutateQueue=[];for(let t=0;t<e.length;t++)try{e[t]()}catch(r){console.error("Error in frameDOM mutate task:",r)}this.scheduled=!1}))}},B=new ee;var oe=Math.PI*2,ae=180/Math.PI;var W=(o=>(o.ACTIVE="-active",o.ENTERING="-entering",o.LEAVING="-leaving",o.DISABLED="-disabled",o))(W||{}),te={PROGRESS:"--sequence-progress",DIRECTION:"--sequence-direction"},re=class q extends F{constructor(e){super(e),this.activeStep=new Map,this.leavingStep=new Map,this.transitions=new Map,this.elementIndex=new Map,this.triggerElements=new Map,this.globalSettings=new Map,this.initialized=!1,this.onTriggerClick=t=>{let r=this.triggerElements.get(t.currentTarget);if(!r)return;let i=this.activeStep.get(r.slider)??0,s=this.getMaxStep(r.slider),n,a;if(r.step==="next"){if(n=i+1,a=1,!this.elementIndex.has(`${r.slider}[${n}]`))if(r.loop&&s>=0)n=0;else return}else if(r.step==="prev"){if(n=i-1,a=-1,n<0)if(r.loop&&s>=0)n=s;else return;if(!this.elementIndex.has(`${r.slider}[${n}]`))return}else{if(n=r.step,i===n)return;a=n>i?1:-1}this.startTransition(r.slider,n,a)},this.htmlKey="sequence",this.defaultDuration=this.settings["sequence-duration"]??600,this.attributesToMap=[...this.attributesToMap,{key:"sequence",type:"string",fallback:""},{key:"sequence-trigger",type:"string",fallback:""},{key:"entering-easing",type:"string",fallback:""},{key:"leaving-easing",type:"string",fallback:""},{key:"entering-duration",type:"string",fallback:""},{key:"leaving-duration",type:"string",fallback:""},{key:"sequence-duration",type:"string",fallback:""},{key:"active-step",type:"string",fallback:""}]}onInit(){super.onInit(),this.events.on("sequence",this.onSequenceEvent.bind(this)),this.scanStandaloneTriggers()}scanStandaloneTriggers(){let e=document.querySelectorAll("[string-sequence-trigger]:not([string-inited])");for(let t of e){let r=t.getAttribute("string-sequence-trigger"),i=r?this.parseTriggerKey(r):null;i&&(this.triggerElements.set(t,i),t.addEventListener("click",this.onTriggerClick))}}parseGlobalSettingsFromObject(e){let t=i=>e.getProperty(i),r=t("sequence-duration");this.tryParseGlobalSetting(r,"enteringDuration"),this.tryParseGlobalSetting(r,"leavingDuration"),this.tryParseGlobalSetting(t("entering-duration"),"enteringDuration"),this.tryParseGlobalSetting(t("leaving-duration"),"leavingDuration"),this.tryParseGlobalSetting(t("entering-easing"),"enteringEasing"),this.tryParseGlobalSetting(t("leaving-easing"),"leavingEasing"),this.tryParseGlobalSetting(t("active-step"),"activeStep")}tryParseGlobalSetting(e,t){if(!e)return;let r=e.match(/^(.+)\[(.+)\]$/);if(!r)return;let[,i,s]=r,n=this.globalSettings.get(i)??{};this.globalSettings.set(i,n),n[t]=t==="enteringEasing"||t==="leavingEasing"?s:parseFloat(s),this.applyGlobalSettingsToExistingObjects(i)}applyGlobalSettingsToExistingObjects(e){let t=this.globalSettings.get(e);if(t){for(let[r,i]of this.elementIndex)if(this.parseSequenceKey(r)?.slider===e){t.enteringDuration!==void 0&&(i.enteringDuration=t.enteringDuration),t.leavingDuration!==void 0&&(i.leavingDuration=t.leavingDuration);for(let s of i.objects)this.resolveEasings(s,r)}}}initializeSliders(){let e=new Set;for(let t of this.elementIndex.keys()){let r=this.parseSequenceKey(t);r&&e.add(r.slider)}for(let t of e){if(this.activeStep.has(t))continue;let r=this.globalSettings.get(t)?.activeStep??0;this.elementIndex.has(`${t}[${r}]`)||(r=0),this.switchInstant(t,r,1)}}tryApplyPendingActiveStep(e){if(this.activeStep.has(e))return;let t=this.globalSettings.get(e)?.activeStep;t!==void 0&&this.elementIndex.has(`${e}[${t}]`)&&this.switchInstant(e,t,1)}canConnect(e){return e.keys.includes("sequence")||e.keys.includes("sequence-trigger")}onObjectConnected(e){super.onObjectConnected(e),this.parseGlobalSettingsFromObject(e);let t=e.getProperty("sequence"),r=e.getProperty("sequence-trigger");if(!t&&r){let i=this.parseTriggerKey(r);i&&typeof i.step=="number"&&(t=`${i.slider}[${i.step}]`,e.setProperty("sequence",t))}if(t){let i=this.parseSequenceKey(t);if(i){let s=this.elementIndex.get(t);if(!s){let{enteringDuration:a,leavingDuration:l}=this.resolveDurations(e,t);s={objects:[],enteringDuration:a,leavingDuration:l},this.elementIndex.set(t,s)}s.objects.push(e),this.resolveEasings(e,t);let n=this.activeStep.get(i.slider);this.setState(e,n===i.step?"-active":"-disabled",n===i.step?1:0,1),this.tryApplyPendingActiveStep(i.slider)}}if(r){let i=this.parseTriggerKey(r);i&&(this.triggerElements.set(e.htmlElement,i),e.htmlElement.addEventListener("click",this.onTriggerClick))}}parseTriggerKey(e){let t=e.match(/^(.+)\[(next|prev|\d+)(\|loop)?\]$/);if(!t)return null;let r=t[2]==="next"||t[2]==="prev"?t[2]:parseInt(t[2],10);return{slider:t[1],step:r,loop:t[3]==="|loop"}}getMaxStep(e){let t=-1;for(let r of this.elementIndex.keys()){let i=this.parseSequenceKey(r);i?.slider===e&&i.step>t&&(t=i.step)}return t}resolveDuration(e,t,r,i){let s=e.getProperty(i),n=e.getProperty("sequence-duration"),a=this.globalSettings.get(t)?.[r];if(s&&!s.includes("[")){let l=parseFloat(s);if(!isNaN(l))return l}if(n&&!n.includes("[")){let l=parseFloat(n);if(!isNaN(l))return l}return a??this.defaultDuration}resolveDurations(e,t){let r=this.parseSequenceKey(t)?.slider??"";return{enteringDuration:this.resolveDuration(e,r,"enteringDuration","entering-duration"),leavingDuration:this.resolveDuration(e,r,"leavingDuration","leaving-duration")}}resolveEasing(e,t,r,i){let s=e.getProperty(i);(!s||typeof s=="string"&&s.includes("["))&&(s=this.globalSettings.get(t)?.[r]??this.settings.easing??"ease-out"),typeof s=="string"&&e.setProperty(i,this.tools.easingFunction.process({easing:s}))}resolveEasings(e,t){let r=this.parseSequenceKey(t)?.slider;r&&(this.resolveEasing(e,r,"enteringEasing","entering-easing"),this.resolveEasing(e,r,"leavingEasing","leaving-easing"))}onObjectDisconnected(e){super.onObjectDisconnected(e);let t=e.getProperty("sequence");if(t){let r=this.elementIndex.get(t);if(r){let i=r.objects.indexOf(e);i!==-1&&r.objects.splice(i,1),r.objects.length||this.elementIndex.delete(t)}}this.triggerElements.has(e.htmlElement)&&(e.htmlElement.removeEventListener("click",this.onTriggerClick),this.triggerElements.delete(e.htmlElement))}parseSequenceKey(e){let t=e.match(/^(.+)\[(\d+)\]$/);return t?{slider:t[1],step:parseInt(t[2],10)}:null}onSequenceEvent(e){let{slider:t,step:r,transitionProgress:i,direction:s=1,duration:n,instant:a}=e;this.activeStep.get(t)===r&&i===void 0||(i!==void 0?this.handleScrub(t,r,i,s):a?this.switchInstant(t,r,s):this.startTransition(t,r,s,n))}startTransition(e,t,r,i){let s=this.activeStep.get(e),n=this.leavingStep.get(e);n!==void 0&&n!==s&&this.setStepState(e,n,"-disabled",0,r);let a=this.elementIndex.get(`${e}[${t}]`),l=s!==void 0?this.elementIndex.get(`${e}[${s}]`):null;s!==void 0&&this.leavingStep.set(e,s),this.activeStep.set(e,t),this.transitions.set(e,{fromStep:s??t,toStep:t,direction:r,startTime:this.data.time.now,enteringDuration:i??a?.enteringDuration??this.defaultDuration,leavingDuration:i??l?.leavingDuration??this.defaultDuration})}handleScrub(e,t,r,i){this.transitions.delete(e);let s=this.activeStep.get(e);if(s!==t){let n=this.leavingStep.get(e);n!==void 0&&this.setStepState(e,n,"-disabled",0,i),s!==void 0&&this.leavingStep.set(e,s),this.activeStep.set(e,t)}this.applyProgress(e,r,r,i)}switchInstant(e,t,r){this.transitions.delete(e);let i=this.activeStep.get(e),s=this.leavingStep.get(e);s!==void 0&&this.setStepState(e,s,"-disabled",0,r),i!==void 0&&i!==t&&this.setStepState(e,i,"-disabled",0,r),this.activeStep.set(e,t),this.leavingStep.delete(e),this.setStepState(e,t,"-active",1,r)}applyProgress(e,t,r,i){let s=this.activeStep.get(e),n=this.leavingStep.get(e);this.setStepState(e,s,t>=1?"-active":"-entering",t,i),n!==void 0&&n!==s&&(r>=1?(this.setStepState(e,n,"-disabled",0,i),this.leavingStep.delete(e)):this.setStepState(e,n,"-leaving",r,i))}setStepState(e,t,r,i,s){let n=this.elementIndex.get(`${e}[${t}]`);if(n)for(let a of n.objects)this.setState(a,r,i,s)}setState(e,t,r,i){let s=e.htmlElement,n=e.getProperty("_state"),a=e.getProperty("_direction"),l=e.getProperty(t==="-leaving"?"leaving-easing":"entering-easing"),h=typeof l=="function"?l(r):r;n!==t&&(s.classList.remove(...q.ALL_STATES),s.classList.add(t),e.setProperty("_state",t)),a!==i&&(e.setProperty("_direction",i),$.run(()=>$.setVars(s,{[te.DIRECTION]:i.toString()})))}onFrame(e){super.onFrame(e),this.initialized||(this.initialized=!0,this.initializeSliders());for(let[t,r]of this.transitions){let i=e.time.now-r.startTime,s=Math.min(1,i/r.enteringDuration),n=Math.min(1,i/r.leavingDuration);this.applyProgress(t,s,n,r.direction),s>=1&&n>=1&&this.transitions.delete(t)}}};re.ALL_STATES=Object.values(W);var z=class R extends F{constructor(e){super(e),this.htmlKey="form"}initializeObject(e,t,r,i){super.initializeObject(e,t,r,i);let s=t.getProperty("form-events")??[];s.forEach(d=>{d.eventElement.removeEventListener(d.eventType,d.eventCallback)}),s.length=0,t.setProperty("form-events",s),super.onObjectConnected(t);let n=t.htmlElement,a=[],l={};this.getInteractiveFields(n).forEach((d,u)=>this.registerField(d,n,a,l,s,u));let h=d=>{d.preventDefault();let u=!0,v={},g=new Set;for(let x of a){let y=x.field;if(!y.isConnected||!this.shouldValidateField(y))continue;if(this.isRadioField(y)){if(g.has(x.key))continue;g.add(x.key)}let{key:m,rules:f,needsContext:c}=x,b=this.getFieldValue(y);v[m]=b,l[m]=b;let{valid:p,errors:w}=this.tools.validation.process({rules:f,value:b,context:this.buildContext(c,m,l)});this.applyValidationState(n,y,m,p,w,"submit"),p||(u=!1)}if(u)this.events.emit(`form:submit:${t.id}`,v);else{let x=new Set,y=a.find(m=>{let f=m.field;if(!f.isConnected||!this.shouldValidateField(f))return!1;if(this.isRadioField(f)){if(x.has(m.key))return!1;x.add(m.key)}let{key:c,rules:b,needsContext:p}=m,w=this.getFieldValue(f);l[c]=w;let{valid:E}=this.tools.validation.process({rules:b,value:w,context:this.buildContext(p,c,l)});return!E});y?.field&&typeof y.field.focus=="function"&&y.field.focus(),this.events.emit(`form:invalid:${t.id}`)}};n.addEventListener("submit",h),s.push({eventElement:n,eventType:"submit",eventCallback:h}),t.setProperty("form-field-entries",a),t.setProperty("form-field-values",l)}onObjectConnected(e){}onDOMMutate(e,t){this.objects.length!==0&&(e.length>0&&this.handleMutationAdditions(e),t.length>0&&this.handleMutationRemovals(t))}applyValidationState(e,t,r,i,s,n){let a=e.querySelector(`[string-input="error[${r}]"]`),l=e.querySelector(`[string-input="group[${r}]"]`);a&&(a.innerHTML="",s.forEach(d=>{let u=document.createElement("span");u.textContent=d,a.appendChild(u)})),n==="live"?(t.classList.toggle("-invalid",!i),t.classList.remove("-error")):(t.classList.remove("-invalid"),t.classList.toggle("-error",!i)),t.classList.toggle("-valid",i),l&&(n==="live"?(l.classList.toggle("-invalid",!i),l.classList.remove("-error")):(l.classList.remove("-invalid"),l.classList.toggle("-error",!i)),l.classList.toggle("-valid",i));let h=i?"valid":n==="live"?"invalid":"error";this.events.emit(`form:field:${h}:${r}`,{key:r,field:t,errors:s,phase:n,valid:i})}getInteractiveFields(e){return Array.from(e.querySelectorAll("[string-input]")).filter(t=>!this.isServiceFieldAttribute(t.getAttribute("string-input")||"")).filter(t=>this.isFormFieldElement(t)).map(t=>t)}getFieldRules(e){let t=this.tools.domAttribute.process({element:e,key:"input"})??"";return this.tools.ruleParser.process({value:t})}registerField(e,t,r,i,s,n){if(!this.isFormFieldElement(e)||e.closest("form")!==t||r.some(y=>y.field===e))return;let a=this.registerFieldIndex(e,n??r.length),l=this.getInputKey(e,a),h=this.getFieldRules(e),d=this.supportsBeforeInputValidation(h),u=this.requiresContext(h),v=this.getInputEventType(e),g={field:e,key:l,rules:h,supportsRealtime:d,needsContext:u,inputEventType:v,inputHandler:()=>{}},x=y=>{let m=y.currentTarget||y.target;if(!m||!m.isConnected||!this.shouldValidateField(m))return;let f=this.getFieldValue(m);i[g.key]=f;let c=this.buildContext(g.needsContext,g.key,i),{valid:b,errors:p}=this.tools.validation.process({rules:g.rules,value:f,context:c});this.applyValidationState(t,m,g.key,b,p,"live")};if(g.inputHandler=x,e.addEventListener(v,x),s.push({eventElement:e,eventType:v,eventCallback:x}),d&&(e instanceof HTMLInputElement||e instanceof HTMLTextAreaElement)){let y=m=>{let f=m;if(f.isComposing||f.inputType?.startsWith("insertComposition"))return;let c=m.currentTarget||m.target;if(!c||!(c instanceof HTMLInputElement||c instanceof HTMLTextAreaElement)||!c.isConnected)return;let b=c.selectionStart??0,p=c.selectionEnd??0,w=c.value;switch(f.inputType){case"deleteContentBackward":w=b===p&&b>0?c.value.slice(0,b-1)+c.value.slice(p):c.value.slice(0,b)+c.value.slice(p);break;case"deleteContentForward":w=b===p&&b<c.value.length?c.value.slice(0,b)+c.value.slice(b+1):c.value.slice(0,b)+c.value.slice(p);break;case"insertFromPaste":case"insertFromDrop":case"insertReplacementText":w=c.value.slice(0,b)+(f.data||"")+c.value.slice(p);break;default:typeof f.data=="string"&&(w=c.value.slice(0,b)+f.data+c.value.slice(p))}let{errors:E}=this.tools.validation.process({rules:g.rules,value:w,type:"beforeinput",context:this.buildContext(g.needsContext,g.key,i,{applied:!0,value:w})});E.length>0&&m.cancelable&&m.preventDefault()};g.beforeInputHandler=y,e.addEventListener("beforeinput",y),s.push({eventElement:e,eventType:"beforeinput",eventCallback:y})}e.classList.add("-inited"),r.push(g),i[l]=this.getFieldValue(e)}unregisterField(e,t,r,i){let s=t.findIndex(a=>a.field===e);if(s===-1)return;let n=t[s];n.inputHandler&&e.removeEventListener(n.inputEventType,n.inputHandler),n.beforeInputHandler&&e.removeEventListener("beforeinput",n.beforeInputHandler),delete r[n.key],t.splice(s,1);for(let a=i.length-1;a>=0;a--){let l=i[a];l.eventElement===e&&(l.eventCallback===n.inputHandler||n.beforeInputHandler&&l.eventCallback===n.beforeInputHandler)&&i.splice(a,1)}e.classList.remove("-inited")}collectInteractiveFieldsFromNode(e){let t=[];return e instanceof Element?(e.hasAttribute("string-input")&&t.push(e),t.push(...Array.from(e.querySelectorAll("[string-input]")))):e instanceof DocumentFragment&&t.push(...Array.from(e.querySelectorAll("[string-input]"))),t.filter(r=>!this.isServiceFieldAttribute(r.getAttribute("string-input")||"")).filter(r=>this.isFormFieldElement(r))}isRadioField(e){return e instanceof HTMLInputElement&&e.type==="radio"}handleMutationAdditions(e){e.forEach(t=>{this.collectInteractiveFieldsFromNode(t).forEach(r=>{let i=this.getFormStateByContainment(r);i&&this.registerField(r,i.form,i.entries,i.values,i.events)})})}handleMutationRemovals(e){e.forEach(t=>{this.collectInteractiveFieldsFromNode(t).forEach(r=>{let i=this.getFormStateByReference(r);i&&this.unregisterField(r,i.entries,i.values,i.events)})})}getFormStateByContainment(e){let t=this.objects.find(r=>r.htmlElement instanceof HTMLFormElement&&r.htmlElement.contains(e));return t?this.buildFormState(t):null}getFormStateByReference(e){for(let t of this.objects){let r=t.getProperty("form-field-entries");if(r&&r.some(i=>i.field===e))return this.buildFormState(t,r)}return null}buildFormState(e,t){let r=e.htmlElement;if(!(r instanceof HTMLFormElement))return null;let i=t??e.getProperty("form-field-entries"),s=e.getProperty("form-field-values"),n=e.getProperty("form-events");return!i||!s||!n?null:{object:e,form:r,entries:i,values:s,events:n}}registerFieldIndex(e,t){let r=e.getAttribute("data-string-form-index");return r!==null?Number(r):(e.setAttribute("data-string-form-index",String(t)),t)}getFieldIndex(e,t){let r=e.getAttribute("data-string-form-index");if(r!==null){let i=Number(r);return Number.isNaN(i)?t:i}return this.registerFieldIndex(e,t)}shouldValidateField(e){return!(e.disabled||e instanceof HTMLInputElement&&e.type==="hidden")}supportsBeforeInputValidation(e){return e.some(t=>R.beforeInputRuleKeys.has(t.key))}requiresContext(e){return e.some(t=>R.crossFieldRuleKeys.has(t.key))}buildContext(e,t,r,i){if(!e)return{fieldKey:t};let s=!!i?.applied,n=s?{...r,[t]:i.value}:r;return{fieldKey:t,values:n,getValue:a=>s&&a===t?i.value:n[a]}}getInputKey(e,t){return this.tools.domAttribute.process({element:e,key:"id"})||e.getAttribute("name")||e.getAttribute("id")||`input-${t}`}getFieldValue(e){if(e instanceof HTMLInputElement){if(e.type==="checkbox"){if(e.name){let t=e.form||e.closest("form"),r=t?Array.from(t.querySelectorAll(`input[type="checkbox"][name="${e.name}"]:checked`)):[e];return r.length>1?r.map(i=>i.value):r.length===1?r[0].value:""}return e.checked}if(e.type==="radio"){if(e.name){let t=(e.form||e.closest("form"))?.querySelector(`input[type="radio"][name="${e.name}"]:checked`);return t?t.value:""}return e.checked?e.value:""}return e.type==="file"&&e.files&&e.files.length>0?e.multiple?Array.from(e.files):e.files[0]:e.value}return e instanceof HTMLSelectElement?e.multiple?Array.from(e.selectedOptions).map(t=>t.value):e.value:e instanceof HTMLTextAreaElement?e.value:""}isServiceFieldAttribute(e){return R.serviceAttributePrefixes.some(t=>e.startsWith(`${t}[`))}isFormFieldElement(e){return e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement}getInputEventType(e){return e instanceof HTMLSelectElement||e instanceof HTMLInputElement&&(e.type==="checkbox"||e.type==="radio")?"change":"input"}};z.beforeInputRuleKeys=new Set(["number","integer","email","phone","letters","lettersSpaces","lettersNumbers","alpha","alpha_num","alpha_dash","digits","url","pattern"]),z.crossFieldRuleKeys=new Set(["same","different","after","before"]),z.serviceAttributePrefixes=["error","group"];var D=class{constructor(e,t="orthographic",r=50,i=.1,s=1e4){this.scaleCache=new Map;this._width=1;this._height=1;this.engine=e,this.mode=t,this.perspectiveFov=r,t==="orthographic"?this._camera=e.createOrthographicCamera(-1,1,1,-1,i,s):this._camera=e.createPerspectiveCamera(r,1,i,s),this._position=e.createVector3(0,0,1e3),this.update()}get camera(){return this._camera}resize(e,t){if(this._width=e,this._height=t,this.mode==="orthographic"){let r=this._camera;r.left=-e/2,r.right=e/2,r.top=t/2,r.bottom=-t/2}else this._camera.aspect=e/t;this.update()}setPosition(e,t,r){this._position.set(e,t,r),this._camera.position.copy(this._position),this.update()}lookAt(e,t,r){this._camera.lookAt(e,t,r),this.update()}update(){this._camera.updateProjectionMatrix(),this._camera.updateMatrixWorld?.()}screenToWorld(e,t,r=0){if(this.mode==="orthographic"){let i=e-this._width/2,s=-(t-this._height/2);return this.engine.createVector3(i,s,r)}else{let{width:i,height:s}=this.getFrustumSizeAt(r),n=e/this._width,a=t/this._height,l=(n-.5)*i,h=-(a-.5)*s;return this.engine.createVector3(l,h,r)}}getFrustumSizeAt(e){if(this.mode==="orthographic")return{width:this._width,height:this._height};let t=this.engine.degToRad(this.perspectiveFov),r=Math.abs(e-this._camera.position.z),i=2*Math.tan(t/2)*r;return{width:i*this._camera.aspect,height:i}}getScaleAtZ(e,t){if(this.mode==="orthographic")return 1;let r=Math.round(e*1e3)/1e3;if(this.scaleCache.has(r))return this.scaleCache.get(r);let{height:i}=this.getFrustumSizeAt(e),s=i/t;return this.scaleCache.set(r,s),s}clearScaleCache(){this.scaleCache.clear()}getMode(){return this.mode}};var k=class{constructor(e,t){this.engine=t,this._container=e;let{width:r,height:i}=e.getBoundingClientRect();this._width=r,this._height=i,this._renderer=t.createRenderer({antialias:!0,alpha:!0,logarithmicDepthBuffer:!0}),this._renderer.setPixelRatio(window.devicePixelRatio),this._renderer.setSize(r,i)}attach(){this._container.appendChild(this._renderer.domElement)}render(e,t){this._renderer.render(e.getScene(),t.camera)}resize(e){let{width:t,height:r}=this._container.getBoundingClientRect();this._width=t,this._height=r,this._renderer.setSize(t,r),e.resize(t,r)}get width(){return this._width}get height(){return this._height}get renderer(){return this._renderer}destroy(){this._renderer.dispose()}};var S=class{constructor(e,t,r,i){this._uniforms={};this._children=[];this.id=e,this.type=t,this._object=r,this.engine=i,this._quaternion=i.createQuaternion(),this._originalSize=i.createVector3(),this._bbox=i.createBox3(),this.updateBoundingBox()}get children(){return this._children}get object(){return this._object}get material(){return this._material}get originalSize(){return this._originalSize.clone()}get boundingBox(){return this._bbox.clone()}addChild(e){this._children.push(e),this.object.add(e.object)}getWorldMatrix(){return this._object.matrixWorld.clone()}getWorldPosition(){return this.engine.createVector3().setFromMatrixPosition(this._object.matrixWorld)}getOriginalBoundingBox(){if(!this._originalBoundingBox){let e=this.object.scale.clone();this.object.scale.set(1,1,1),this.object.updateMatrixWorld(!0),this._originalBoundingBox=this.engine.computeBoundingBoxRecursively(this.object),this.object.scale.copy(e),this.object.updateMatrixWorld(!0)}return this._originalBoundingBox.clone()}syncTransformFromMatrix(e){let t=this.engine.createVector3(),r=this.engine.createQuaternion(),i=this.engine.createVector3();e.decompose(t,r,i),this._object.position.copy(t),this._object.quaternion.copy(r),this._object.scale.copy(i),this._object.updateMatrix(),this._object.updateMatrixWorld()}applyWorldTransform(e,t,r){this._object.position.copy(e),this._object.quaternion.copy(t),this._object.scale.copy(r),this._object.updateMatrix(),this._object.updateMatrixWorld()}set quaternion(e){this._quaternion.copy(e),this._object.quaternion.copy(this._quaternion),this._object.updateMatrixWorld()}set position(e){this._object.position.copy(e)}set scale(e){this._object.scale.copy(e)}set rotation(e){this._object.rotation.copy(e)}set opacity(e){let t=this._object;t.material&&"opacity"in t.material&&(t.material.opacity=e)}set metalness(e){let t=this._object;t.material&&"metalness"in t.material&&(t.material.metalness=e)}set roughness(e){let t=this._object;t.material&&"roughness"in t.material&&(t.material.roughness=e)}set texture(e){this._texture=e,this._object.isMesh&&e?.applyTexture&&e.applyTexture(this._object)}updateBoundingBox(){this._bbox.setFromObject(this._object),this._bbox.getSize(this._originalSize)}destroy(){this._texture?.dispose?.(),this._material?.dispose(),this._geometry?.dispose()}};var L=class{constructor(e,t){this._objects=new Map;this._rootObjects=[];this._elementMap=new Map;this.engine=e,this._modelLoader=t,this._scene=e.createScene()}get rootObjects(){return this._rootObjects}getScene(){return this._scene}getObject(e){return this._objects.get(e)}hasObject(e){return this._objects.has(e)}deleteObject(e){let t=this._objects.get(e);return t?(this._scene.remove(t.object),this._objects.delete(e),t.destroy(),!0):!1}createFromElement(e){let t=e.getProperty("3d");if(!t)return;let r=e.htmlElement;if(!r)return;let i=s=>{if(s){let n=e.getProperty("parentId");n==null?(this._scene.add(s.object),this._rootObjects.push(s)):this._objects.get(n)?.addChild(s),this._objects.set(e.id,s),this._elementMap.set(e.id,r),s.el=r}};switch(t){case"group":this.createGroup(e,i);break;case"pointLight":this.createLight(e,"point",i);break;case"ambientLight":this.createLight(e,"ambient",i);break;case"directionalLight":this.createLight(e,"directional",i);break;case"model":this.createModel(e,i);break;case"box":this.createBox(e,i);break;case"sphere":this.createSphere(e,i);break;case"plane":this.createPlane(e,i);break;case"cylinder":this.createCylinder(e,i);break}}createGroup(e,t){let r=this.engine.createGroup(),i=new S(e.id,"group",r,this.engine);return t(i),i}createLight(e,t,r){let i=e.getProperty("3d-color")||"#ffffff",s=e.getProperty("3d-intensity")??1,n;if(t==="point"){let l=e.getProperty("3d-distance")??1e3,h=e.getProperty("3d-decay")??0;n=this.engine.createPointLight(i,s,l,h)}else t==="directional"?n=this.engine.createDirectionalLight(i,s):n=this.engine.createAmbientLight(i,s);let a=new S(e.id,t+"Light",n,this.engine);return r(a),a}createBox(e,t){let r=this.engine.createBoxGeometry(1,1,1),i=this.createMaterialFromObject(e),s=this.engine.createMesh(r,i),n=new S(e.id,"box",s,this.engine);return t(n),n}createSphere(e,t){let r=e.getProperty("3d-segments-width")??32,i=e.getProperty("3d-segments-height")??32,s=this.engine.createSphereGeometry(.5,r,i),n=this.createMaterialFromObject(e),a=this.engine.createMesh(s,n),l=new S(e.id,"sphere",a,this.engine);return t(l),l}createPlane(e,t){let r=this.engine.createPlaneGeometry(1,1),i=this.createMaterialFromObject(e),s=this.engine.createMesh(r,i),n=new S(e.id,"plane",s,this.engine);return t(n),n}createCylinder(e,t){let r=e.getProperty("3d-segments")??32,i=this.engine.createCylinderGeometry(.5,.5,1,r),s=this.createMaterialFromObject(e),n=this.engine.createMesh(i,s),a=new S(e.id,"cylinder",n,this.engine);return t(a),a}createModel(e,t){if(!this._modelLoader){console.warn("[String3D] Model loader not configured");return}let r=e.getProperty("3d-model");if(!r)return;let i=this.createMaterialFromObject(e);this._modelLoader.load(r,n=>{let a=n.scene;a.traverse(h=>{h.isMesh&&(h.material=i)});let l=new S(e.id,"model",a,this.engine);t(l)},n=>{console.log(n.loaded/n.total*100+"% loaded")},n=>{console.error("[String3D] Model loading error:",n)})}createMaterialFromObject(e){let t=e.getProperty("3d-material")||"basic[#ffffff]",[r,i]=t.split(/\[|\]/),s=i||"#ffffff",n=e.getProperty("3d-opacity")??1,a={color:s,transparent:n<1,opacity:n},l=e.el,h=l?.getAttribute("string-3d-map"),d=l?.getAttribute("string-3d-normalMap"),u=l?.getAttribute("string-3d-roughnessMap"),v=l?.getAttribute("string-3d-aoMap");return r==="standard"?(h&&(a.map=this.loadTexture(h)),d&&(a.normalMap=this.loadTexture(d)),u&&(a.roughnessMap=this.loadTexture(u)),v&&(a.aoMap=this.loadTexture(v)),this.engine.createMeshStandardMaterial(a)):this.engine.createMeshBasicMaterial(a)}loadTexture(e){return this.engine.createTextureLoader().load(e)}destroy(){this._objects.forEach(e=>e.destroy()),this._objects.clear(),this._rootObjects=[]}};var _=class{sync(e,t,r,i){let s=e.getBoundingClientRect(),n=s.left+s.width/2,a=s.top+s.height/2,l=getComputedStyle(e),h=parseFloat(l.getPropertyValue("--translate-z")||"0"),d=r.camera.screenToWorld(n,a,h);t.position=d;let u=parseFloat(l.getPropertyValue("--scale"))||1;t.scale=r.engine.createVector3(u,u,u);let v=-r.engine.degToRad(parseFloat(l.getPropertyValue("--rotate-x")||"0")),g=r.engine.degToRad(parseFloat(l.getPropertyValue("--rotate-y")||"0")),x=-r.engine.degToRad(parseFloat(l.getPropertyValue("--rotate-z")||"0"));return t.rotation=r.engine.createEuler(v,g,x,"XYZ"),t.object.updateMatrixWorld(!0),{scale:u}}};var I=class{sync(e,t,r,i){let s=e.getBoundingClientRect(),n=s.left+s.width/2,a=s.top+s.height/2,l=parseFloat(getComputedStyle(e).getPropertyValue("--translate-z")||"0"),h=r.camera.screenToWorld(n,a,l);return t.position=h,null}};var M=class{sync(e,t,r,i){let s=getComputedStyle(e),n=e.offsetWidth,a=e.offsetHeight,l=e.getBoundingClientRect(),h=parseFloat(s.getPropertyValue("--translate-z")||"0"),d=parseFloat(s.getPropertyValue("--scale")||"1"),u=l.left+l.width/2,v=l.top+l.height/2,g=r.camera.screenToWorld(u,v,h);t.position=g;let x=-r.engine.degToRad(parseFloat(s.getPropertyValue("--rotate-x")||"0")),y=r.engine.degToRad(parseFloat(s.getPropertyValue("--rotate-y")||"0")),m=-r.engine.degToRad(parseFloat(s.getPropertyValue("--rotate-z")||"0"));t.rotation=r.engine.createEuler(x,y,m,"XYZ");let f=n*d,c=a*d,b=parseFloat(s.getPropertyValue("--scale-z")||"1"),p=i?.scale||1,w=t.type,E,A,j;switch(w){case"box":case"sphere":{let C=Math.min(f,c);E=C*p,A=C*p,j=C*b*p;break}case"cylinder":{let C=f;E=C*p,A=c*p,j=C*b*p;break}case"plane":default:E=f*p,A=c*p,j=Math.min(f,c)*.5*b*p;break}return t.scale=r.engine.createVector3(E,A,j),{scale:d*p}}};var T=class{constructor(e,t,r,i){this.camera=e;this.viewportWidth=t;this.viewportHeight=r;this.engine=i;this.strategies=new Map;this.strategies.set("box",new M),this.strategies.set("sphere",new M),this.strategies.set("plane",new M),this.strategies.set("cylinder",new M),this.strategies.set("model",new M),this.strategies.set("group",new _),this.strategies.set("pointLight",new I),this.strategies.set("ambientLight",new I),this.strategies.set("directionalLight",new I)}syncElement(e,t,r){let i=this.strategies.get(t.type);return i?i.sync(e,t,{camera:this.camera,viewportWidth:this.viewportWidth,viewportHeight:this.viewportHeight,engine:this.engine},r):(console.warn(`[String3D Sync] No strategy for type "${t.type}"`),null)}updateViewportSize(e,t){this.viewportWidth=e,this.viewportHeight=t}};var P=class P extends F{constructor(t,r={}){super(t);this.renderer=null;this.camera=null;this.scene=null;this.synchronizer=null;this.engine=null;this.canvasContainer=null;this.isLoading=new Map;this.htmlKey="3d",this.options={hideHTML:r.hideHTML??!1,container:r.container,zIndex:r.zIndex??1},this.attributesToMap=[...this.attributesToMap,{key:"3d",type:"string",fallback:"box"},{key:"3d-material",type:"string",fallback:"basic[#ffffff]"},{key:"3d-color",type:"string",fallback:"#ffffff"},{key:"3d-opacity",type:"number",fallback:1},{key:"3d-intensity",type:"number",fallback:1},{key:"3d-distance",type:"number",fallback:1e3},{key:"3d-decay",type:"number",fallback:0},{key:"3d-model",type:"string",fallback:""},{key:"3d-segments",type:"number",fallback:32},{key:"3d-segments-width",type:"number",fallback:32},{key:"3d-segments-height",type:"number",fallback:32}]}static setProvider(t){P.provider=t}canConnect(t){let r=super.canConnect(t);return console.log("[String3D] canConnect:",t.id,"keys:",t.keys,"htmlKey:",this.htmlKey,"result:",r),r}initializeObject(t,r,i,s){super.initializeObject(t,r,i,s),r.setProperty("parentId",null);let n=i.parentElement?.closest('[string-3d="group"]');if(n){let a=n.getAttribute("string-id");a&&(r.setProperty("parentId",a),r.setProperty("parent",n))}}onResize(){this.renderer&&this.camera&&this.synchronizer&&(this.renderer.resize(this.camera),this.synchronizer.updateViewportSize(this.renderer.width,this.renderer.height),this.camera.clearScaleCache())}onInit(){if(!P.provider){console.error("[String3D] No provider set. Call String3D.setProvider() before use.");return}this.engine=P.provider.getEngine(),this.canvasContainer=this.createOrGetContainer(),this.injectCSS(),this.renderer=new k(this.canvasContainer,this.engine),this.renderer.attach(),this.camera=new D(this.engine,"orthographic"),this.camera.setPosition(0,0,1e3),this.camera.resize(this.renderer.width,this.renderer.height),this.scene=new L(this.engine),this.scene.getScene().add(this.camera.camera),this.synchronizer=new T(this.camera,this.renderer.width,this.renderer.height,this.engine),console.info(`[String3D] Initialized with: ${P.provider.getName()}`)}createOrGetContainer(){if(this.options.container instanceof HTMLElement)return this.applyContainerStyles(this.options.container),this.options.container;if(typeof this.options.container=="string"){let r=document.getElementById(this.options.container);if(r)return this.applyContainerStyles(r),r}let t=document.createElement("div");return t.id="string-3d-canvas",this.applyContainerStyles(t),document.body.insertBefore(t,document.body.firstChild),t}applyContainerStyles(t){Object.assign(t.style,{position:"fixed",left:"0",top:"0",width:"100vw",height:"100lvh",zIndex:String(this.options.zIndex),pointerEvents:"none"})}onObjectConnected(t){this.isLoading.has(t.id)||!this.scene||(this.isLoading.set(t.id,!0),this.scene.createFromElement(t),this.options.hideHTML&&t.htmlElement&&(t.htmlElement.style.opacity="0",t.htmlElement.style.pointerEvents="none"))}onFrame(t){!this.renderer||!this.scene||!this.camera||!this.synchronizer||(B.measure(()=>{this.scene.rootObjects.forEach(r=>{this.syncRecursive(r.el,r,{scale:1})})}),B.mutate(()=>{this.renderer.render(this.scene,this.camera)}))}syncRecursive(t,r,i){if(!this.synchronizer||!t)return;let s=this.synchronizer.syncElement(t,r,i);r.children.forEach(n=>this.syncRecursive(n.el,n,s))}injectCSS(){if(document.getElementById("string-3d-styles"))return;let t=document.createElement("style");t.id="string-3d-styles",t.textContent=`
+      @property --translate-x { syntax: "<number>"; inherits: false; initial-value: 0; }
+      @property --translate-y { syntax: "<number>"; inherits: false; initial-value: 0; }
+      @property --translate-z { syntax: "<number>"; inherits: false; initial-value: 0; }
+      @property --rotate-x { syntax: "<number>"; inherits: false; initial-value: 0; }
+      @property --rotate-y { syntax: "<number>"; inherits: false; initial-value: 0; }
+      @property --rotate-z { syntax: "<number>"; inherits: false; initial-value: 0; }
+      @property --scale { syntax: "<number>"; inherits: false; initial-value: 1; }
+      @property --scale-x { syntax: "<number>"; inherits: false; initial-value: 1; }
+      @property --scale-y { syntax: "<number>"; inherits: false; initial-value: 1; }
+      @property --scale-z { syntax: "<number>"; inherits: false; initial-value: 1; }
+
+      [string-3d] {
+        --translate-x: 0; --translate-y: 0; --translate-z: 0;
+        --rotate-x: 0; --rotate-y: 0; --rotate-z: 0;
+        --scale: 1; --scale-x: 1; --scale-y: 1; --scale-z: 1;
+        transform-style: preserve-3d;
+      }
+
+      [string-3d-visual="true"] {
+        transform:
+          translate3d(calc(var(--translate-x) * 1px), calc(var(--translate-y) * 1px), calc(var(--translate-z) * 1px))
+          rotateX(calc(var(--rotate-x) * 1deg))
+          rotateY(calc(var(--rotate-y) * 1deg))
+          rotateZ(calc(var(--rotate-z) * 1deg))
+          scale3d(calc(var(--scale) * var(--scale-x)), calc(var(--scale) * var(--scale-y)), calc(var(--scale) * var(--scale-z)));
+      }
+    `,document.head.appendChild(t)}destroy(){this.renderer?.destroy(),this.scene?.destroy(),this.isLoading.clear(),document.getElementById("string-3d-styles")?.remove(),this.canvasContainer?.id==="string-3d-canvas"&&this.canvasContainer.remove(),super.destroy()}};P.provider=null;var N=P;var O=class{constructor(e,t={}){this.THREE=e,this.loaders=t}createVector3(e=0,t=0,r=0){return new this.THREE.Vector3(e,t,r)}createVector2(e=0,t=0){return new this.THREE.Vector2(e,t)}createQuaternion(e=0,t=0,r=0,i=1){return new this.THREE.Quaternion(e,t,r,i)}createEuler(e=0,t=0,r=0,i="XYZ"){return new this.THREE.Euler(e,t,r,i)}createMatrix4(){return new this.THREE.Matrix4}createBox3(e,t){return new this.THREE.Box3(e,t)}createScene(){return new this.THREE.Scene}createRenderer(e){let t=new this.THREE.WebGLRenderer(e);return t.outputEncoding=this.THREE.sRGBEncoding,t}createPerspectiveCamera(e=45,t=1,r=.1,i=2e3){return new this.THREE.PerspectiveCamera(e,t,r,i)}createOrthographicCamera(e,t,r,i,s=.1,n=1e4){return new this.THREE.OrthographicCamera(e,t,r,i,s,n)}createGroup(){return new this.THREE.Group}createMesh(e,t){return new this.THREE.Mesh(e,t)}createBoxGeometry(e,t,r){return new this.THREE.BoxGeometry(e,t,r)}createSphereGeometry(e,t=32,r=32){return new this.THREE.SphereGeometry(e,t,r)}createPlaneGeometry(e,t){return new this.THREE.PlaneGeometry(e,t)}createCylinderGeometry(e,t,r,i=32){return new this.THREE.CylinderGeometry(e,t,r,i)}createMeshBasicMaterial(e){return new this.THREE.MeshBasicMaterial(e)}createMeshStandardMaterial(e){return new this.THREE.MeshStandardMaterial(e)}createPointLight(e,t=1,r=0,i=2){return new this.THREE.PointLight(e,t,r,i)}createAmbientLight(e,t=1){return new this.THREE.AmbientLight(e,t)}createDirectionalLight(e,t=1){return new this.THREE.DirectionalLight(e,t)}createTextureLoader(){return new this.THREE.TextureLoader}createModelLoader(e){let t=this.loaders[e];if(!t)throw new Error(`[ThreeJSEngine] Model loader "${e}" not registered`);return new t}degToRad(e){return this.THREE.MathUtils.degToRad(e)}radToDeg(e){return this.THREE.MathUtils.radToDeg(e)}computeBoundingBoxRecursively(e){let t=new this.THREE.Box3,r=!1;return e.traverse&&e.traverse(i=>{if(i.visible&&i.geometry){typeof i.geometry.computeBoundingBox=="function"&&i.geometry.computeBoundingBox();let s=i.geometry.boundingBox;if(s){let n=s.clone().applyMatrix4(i.matrixWorld);t.union(n),r=!0}}}),r?t:new this.THREE.Box3}},H=class{constructor(e,t={}){this.engine=new O(e,t)}getEngine(){return this.engine}getName(){return"Three.js"}};return Q(ie);})();
+//# sourceMappingURL=index.js.map