@roomle/embedding-lib 5.25.0-alpha.1 → 5.25.0-alpha.10

package/docs/md/web/embedding/CHANGELOG.md

@@ -1,32 +1,6 @@
-## [5.25.0-alpha.1](https://github.com/roomle-dev/roomle-ui/compare/embedding-lib-v5.24.0...embedding-lib-v5.25.0-alpha.1) (2025-07-22)
-
-
-### Features
-
-* collection of light sources in component ([39d0c6d](https://github.com/roomle-dev/roomle-ui/commit/39d0c6d4457c7e36a6ab24146d4b6b2381145a7c))
-* COLOR parameter type ([5b5a656](https://github.com/roomle-dev/roomle-ui/commit/5b5a6564faa9a1cddb556979f2f6ac3f42066b7b))
-* component area light ([6ca94ab](https://github.com/roomle-dev/roomle-ui/commit/6ca94ab66f30d793b7a3e37be912388ac611e355))
-* component point light ([2d8ed76](https://github.com/roomle-dev/roomle-ui/commit/2d8ed76db76a313263df448934e55c278f4cc878))
-* core api - Editor3dChangedLightSource ([f83bb0c](https://github.com/roomle-dev/roomle-ui/commit/f83bb0ccb12dd5acc27d095743b21a5900958299))
-* core api - Editor3dChangedLightSource ([3cc6a47](https://github.com/roomle-dev/roomle-ui/commit/3cc6a47daa49626d3f22f2612e3bfd1762d22c9b))
-* core upgrade to version 2.57.0-alpha.1 ([7894089](https://github.com/roomle-dev/roomle-ui/commit/7894089e552d63d700deb44791d31bdcb1ea3772))
-* core upgrade to version 2.57.0-alpha.2 ([8ef08a9](https://github.com/roomle-dev/roomle-ui/commit/8ef08a90dda72f5d30d445badd97f4a77e2c27c1))
-* core upgrade to version 2.57.0-alpha.3 ([f6f1459](https://github.com/roomle-dev/roomle-ui/commit/f6f14594242c9c0d6a28bf27a0f7dfe1e3fa9583))
-* drag insert object animation ([180b17b](https://github.com/roomle-dev/roomle-ui/commit/180b17b640ae40a0c64f4ccb1815f576bd210b77))
-* migration of the light source implementation from innovation day ([c9b554b](https://github.com/roomle-dev/roomle-ui/commit/c9b554bc7cfa929affdb5f065237aa71a6b0813a))
-* update light source attributes ([b4f080c](https://github.com/roomle-dev/roomle-ui/commit/b4f080c059acfb21cedaf6e770b4301887770ad5))
-* **SDK:** upgrade to version 2.105.0 ([#1758](https://github.com/roomle-dev/roomle-ui/issues/1758)) ([d259718](https://github.com/roomle-dev/roomle-ui/commit/d2597182081e18dccaba8c8309c6ac371b317e1b))
-* **core:** upgrade to version 2.57.0-alpha.4 ([55d0d2e](https://github.com/roomle-dev/roomle-ui/commit/55d0d2edab851fe2da418907663ecf347272201b))
-* **core:** upgrade to version 2.57.0-alpha.5 ([7729b50](https://github.com/roomle-dev/roomle-ui/commit/7729b50ad6ebcb8265dd6f66f005206acb2b457c))
-* **core:** upgrade to version 2.57.0-alpha.5 ([b5f4127](https://github.com/roomle-dev/roomle-ui/commit/b5f412743d68be2640ecfebdeba27bbc4ecdd18b))
+## [5.25.0-alpha.10](https://github.com/roomle-dev/roomle-ui/compare/embedding-lib-v5.25.0-alpha.9...embedding-lib-v5.25.0-alpha.10) (2025-08-07)
 
 
 ### Bug Fixes
 
-* await mock setup for threejs utils ([4582f37](https://github.com/roomle-dev/roomle-ui/commit/4582f3762e1f2f606bac52fff901d7593ce032ae))
-* Build workers in sdk folder when running npm run dev ([8f717d6](https://github.com/roomle-dev/roomle-ui/commit/8f717d6b6fd01bac863873f8f2f9001ce55c8603))
-* lamp light intensity ([da960a0](https://github.com/roomle-dev/roomle-ui/commit/da960a0dbb8a6d0272a3172aff839d0e32ee7a20))
-* parse font json instead of loading it from url ([940e57e](https://github.com/roomle-dev/roomle-ui/commit/940e57e2ca86b73131de7578f4433065c40c81fc))
-* remove duplicate member (resolve merge conflict) ([4973406](https://github.com/roomle-dev/roomle-ui/commit/4973406c472f2572b9292cef13956ba267d64317))
-* remove tween object after completing or stopping the animation ([5e87d17](https://github.com/roomle-dev/roomle-ui/commit/5e87d17d26a9635ee60818fec67c26d0be2e68f9))
-* use import for tween.js instead of script loader ([c248fc3](https://github.com/roomle-dev/roomle-ui/commit/c248fc34c293f130cdd9b19d382c46eb66765b43))
+* release ([42400e9](https://github.com/roomle-dev/roomle-ui/commit/42400e95a2da8f299b8611c949897e9f28b7a798))

package/drag-in-DTA1FCDc.mjs

@@ -0,0 +1 @@
+class t{_mainDomElement;_instance;_mode="website";_viewName="main";constructor(t,e,s,a){this._instance=t,this._mainDomElement=e,this._mode=s,this._viewName=a}async init(){return Promise.resolve()}}const e="rml-drag-in-styles",s="rml-drag-in-drag-element",a="rml-drag-in-overlay",r="rml-drag-in-drag-ghost",i="rml-drag-in-fade-in",n="rml-drag-in-fade-out",o={DISPLAY_NONE:"rml-display-none"},d="250ms",m="forwards",g=`@keyframes ${i} {from{opacity: 0;}to {opacity: 0.5;}}`,l=`@keyframes ${n} {from{opacity: 0.5;}to {opacity: 0;}}`,c=`${i} ${d} ${m}`,h=`${n} ${d} ${m}`,u="https://res.cloudinary.com/roomle/image/upload/v1729679975/fallback_afpyqr.jpg",p=112,_=112,y=Object.freeze(Object.defineProperty({__proto__:null,DragIn:class extends t{options={};_customDragSignal=new AbortController;_injectStyles(){if(!document.getElementById(e)){const t=document.createElement("style");t.type="text/css",t.id=e,t.innerHTML=`\n        .${o.DISPLAY_NONE}{display:none}\n        .${a}{position:absolute;top:0;left:0;width:100%;height:100%;z-index:999;}\n        .${r}{position:absolute;top:0;left:0;width:1px;height:1px;z-index:999;pointer-events:none;background-color:transparent;}\n        ${g}\n        ${l}\n      `,document.head.appendChild(t)}}_initializeDragGhost(){const t=this._mainDomElement.parentNode;let e=t.querySelector("."+r);e||(e=document.createElement("div"),e.classList.add(r),e.innerText=" ",t.appendChild(e))}constructor(t,e,s,a){super(t,e,s,a),this._mainDomElement=e,this._injectStyles(),this._initializeDragGhost()}async init(){if(await super.init(),"website"===this._mode)try{const{DragInFromWebsiteStrategy:t}=await import("./from-website-CcDHgCCy.mjs");this._strategy=new t(this._instance,this._mainDomElement,{settings:this.options,mode:"website"})}catch(t){throw t}else{if("custom-view"!==this._mode)throw new Error("Unsupported mode");try{const{DragInFromCustomViewStrategy:t}=await import("./from-custom-view-DIYHP31u.mjs");this._strategy=new t(this._instance,this._mainDomElement,this.options,this._viewName)}catch(t){throw t}}}get isDragging(){return this._strategy.isDragging}dragStart(t,e,s="rml_id"){this._strategy.dragStart(t,e,s)}dragUpdate(t){this._strategy.dragUpdate(t)}dragEnd(){this._strategy.dragEnd()}touchStart(t,e,s="rml_id"){this._strategy.touchStart(t,e,s)}touchMove(t){this._strategy.touchMove(t)}touchEnd(){this._strategy.touchEnd()}dispose(){this._strategy.dispose()}beforeUpdateGhost(t){this._strategy.beforeUpdateGhost(t)}registerCustomDrag({customDragStart:t,customDragEnd:e,customDragUpdate:s,beforeUpdateGhost:a}){a&&this._strategy.beforeUpdateGhost(a);const r=this._customDragSignal.signal,i=e=>{"true"===e.target.getAttribute("data-rml-draggable")&&t(e)},n=t=>{this._strategy.releaseInput(t),this._strategy.isDragging&&e(t)},o=t=>{s(t)};document.querySelectorAll('[data-rml-draggable="true"]').forEach(t=>{t.draggable=!1}),document.addEventListener("mousedown",i,{signal:r}),document.addEventListener("mouseup",n,{signal:r}),document.addEventListener("mousemove",o,{signal:r}),document.addEventListener("mouseleave",n,{signal:r}),document.addEventListener("touchstart",i,{signal:r}),document.addEventListener("touchend",n,{signal:r}),document.addEventListener("touchmove",o,{signal:r})}unregisterCustomDrag(){this._customDragSignal.abort(),this._customDragSignal=new AbortController}releaseInput(t){this._strategy.releaseInput(t)}}},Symbol.toStringTag,{value:"Module"}));export{s as R,e as a,g as b,l as c,u as d,p as e,_ as f,c as g,h,a as i,o as j,r as k,y as l};

package/drag-in-DuufO5eB.mjs

@@ -0,0 +1,138 @@
+class D {
+  _mainDomElement;
+  _instance;
+  _mode = "website";
+  _viewName = "main";
+  constructor(t, e, s, o) {
+    this._instance = t, this._mainDomElement = e, this._mode = s, this._viewName = o;
+  }
+  async init() {
+    return Promise.resolve();
+  }
+}
+const g = "rml-drag-in-styles", N = "rml-drag-in-drag-element", y = "rml-drag-in-overlay", i = "rml-drag-in-drag-ghost", c = "rml-drag-in-fade-in", l = "rml-drag-in-fade-out", p = {
+  DISPLAY_NONE: "rml-display-none"
+}, m = 0.5, h = "250ms", u = "forwards", S = `@keyframes ${c} {from{opacity: 0;}to {opacity: ${m};}}`, I = `@keyframes ${l} {from{opacity: ${m};}to {opacity: 0;}}`, R = `${c} ${h} ${u}`, G = `${l} ${h} ${u}`, T = "https://res.cloudinary.com/roomle/image/upload/v1729679975/fallback_afpyqr.jpg", b = 112, f = 112;
+class E extends D {
+  options = {};
+  _customDragSignal = new AbortController();
+  _injectStyles() {
+    if (!!!document.getElementById(g)) {
+      const e = document.createElement("style");
+      e.type = "text/css", e.id = g, e.innerHTML = `
+        .${p.DISPLAY_NONE}{display:none}
+        .${y}{position:absolute;top:0;left:0;width:100%;height:100%;z-index:999;}
+        .${i}{position:absolute;top:0;left:0;width:1px;height:1px;z-index:999;pointer-events:none;background-color:transparent;}
+        ${S}
+        ${I}
+      `, document.head.appendChild(e);
+    }
+  }
+  _initializeDragGhost() {
+    const t = this._mainDomElement.parentNode;
+    let e = t.querySelector(
+      "." + i
+    );
+    e || (e = document.createElement("div"), e.classList.add(i), e.innerText = " ", t.appendChild(e));
+  }
+  constructor(t, e, s, o) {
+    super(t, e, s, o), this._mainDomElement = e, this._injectStyles(), this._initializeDragGhost();
+  }
+  async init() {
+    if (await super.init(), this._mode === "website")
+      try {
+        const { DragInFromWebsiteStrategy: t } = await import("./from-website-CktA6Icy.mjs");
+        this._strategy = new t(
+          this._instance,
+          this._mainDomElement,
+          { settings: this.options, mode: "website" }
+        );
+      } catch (t) {
+        throw console.error('Could not load Dragin strategy "FromWebsite"'), t;
+      }
+    else if (this._mode === "custom-view")
+      try {
+        const { DragInFromCustomViewStrategy: t } = await import("./from-custom-view-BdnViEhf.mjs");
+        this._strategy = new t(
+          this._instance,
+          this._mainDomElement,
+          this.options,
+          this._viewName
+        );
+      } catch (t) {
+        throw console.error('Could not load Dragin strategy "FromCustomView"'), t;
+      }
+    else
+      throw new Error("Unsupported mode");
+  }
+  get isDragging() {
+    return this._strategy.isDragging;
+  }
+  dragStart(t, e, s = "rml_id") {
+    this._strategy.dragStart(t, e, s);
+  }
+  dragUpdate(t) {
+    this._strategy.dragUpdate(t);
+  }
+  dragEnd() {
+    this._strategy.dragEnd();
+  }
+  touchStart(t, e, s = "rml_id") {
+    this._strategy.touchStart(t, e, s);
+  }
+  touchMove(t) {
+    this._strategy.touchMove(t);
+  }
+  touchEnd() {
+    this._strategy.touchEnd();
+  }
+  dispose() {
+    this._strategy.dispose();
+  }
+  beforeUpdateGhost(t) {
+    this._strategy.beforeUpdateGhost(t);
+  }
+  registerCustomDrag({
+    customDragStart: t,
+    customDragEnd: e,
+    customDragUpdate: s,
+    beforeUpdateGhost: o
+  }) {
+    o && this._strategy.beforeUpdateGhost(o);
+    const r = this._customDragSignal.signal, _ = (a) => {
+      a.target.getAttribute("data-rml-draggable") === "true" && t(a);
+    }, n = (a) => {
+      this._strategy.releaseInput(a), this._strategy.isDragging && e(a);
+    }, d = (a) => {
+      s(a);
+    };
+    document.querySelectorAll('[data-rml-draggable="true"]').forEach((a) => {
+      a.draggable = !1;
+    }), document.addEventListener("mousedown", _, { signal: r }), document.addEventListener("mouseup", n, { signal: r }), document.addEventListener("mousemove", d, { signal: r }), document.addEventListener("mouseleave", n, { signal: r }), document.addEventListener("touchstart", _, { signal: r }), document.addEventListener("touchend", n, { signal: r }), document.addEventListener("touchmove", d, { signal: r });
+  }
+  unregisterCustomDrag() {
+    this._customDragSignal.abort(), this._customDragSignal = new AbortController();
+  }
+  releaseInput(t) {
+    this._strategy.releaseInput(t);
+  }
+}
+const M = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  DragIn: E
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  N as R,
+  g as a,
+  S as b,
+  I as c,
+  T as d,
+  b as e,
+  f,
+  R as g,
+  G as h,
+  y as i,
+  p as j,
+  i as k,
+  M as l
+};

package/from-custom-view-BdnViEhf.mjs

@@ -0,0 +1,163 @@
+import { C as f, e as D, T as S, i as T, b as v, c as A, d as I } from "./touch-drag-DXJTOrk5.mjs";
+import { f as O, e as B, d as _ } from "./drag-in-DuufO5eB.mjs";
+const L = (a) => `[data-rml-custom-view="${a}"]`, c = (a) => {
+  a.preventDefault(), a.stopPropagation();
+}, Y = (a, t, s, e) => {
+  const r = s - a, i = e - t;
+  return Math.sqrt(r * r + i * i);
+};
+class X {
+  _startX = 0;
+  _startY = 0;
+  _lastX = 0;
+  _lastY = 0;
+  _epsilon;
+  _isWaiting = !1;
+  _onCustomDragStart;
+  constructor({ onCustomDragStart: t }, s = {}) {
+    this._epsilon = typeof s.epsilon == "number" ? s.epsilon : f, this._onCustomDragStart = t;
+  }
+  onMove(t) {
+    this._lastX = t.clientX, this._lastY = t.clientY, this._isWaiting && Y(
+      this._startX,
+      this._startY,
+      this._lastX,
+      this._lastY
+    ) > this._epsilon && (this._onCustomDragStart(t), this._isWaiting = !1);
+  }
+  onStart(t) {
+    this._startX = t.clientX, this._startY = t.clientY, this.onMove(t), this._isWaiting = !0;
+  }
+  onEnd() {
+    this._reset();
+  }
+  _reset() {
+    this._startX = 0, this._startY = 0, this._lastX = 0, this._lastY = 0, this._isWaiting = !1;
+  }
+}
+const l = "data-rml-old-draggable", G = void 0, p = (a, t) => {
+  const s = T(a), e = {
+    delay: s ? A : I,
+    epsilon: s ? v : f
+  };
+  if (!t)
+    return e;
+  if (!s && !(a instanceof MouseEvent))
+    return console.warn(
+      "Unsupported event! It is not TouchEvent and also not MouseEvent"
+    ), e;
+  const {
+    delayKey: r,
+    epsilonKey: i
+  } = s ? { delayKey: "touchDragDelay", epsilonKey: "touchDragEpsilon" } : { delayKey: "customDragDelay", epsilonKey: "customDragEpsilon" };
+  return typeof t[r] == "number" && (e.delay = t.touchDragDelay), typeof t[i] == "number" && (e.epsilon = t.touchDragEpsilon), e;
+}, w = (a) => {
+  let t = "", s = B, e = O;
+  if (!a)
+    return { url: _, width: s, height: e };
+  const r = a;
+  if (r instanceof HTMLElement) {
+    const i = r.getBoundingClientRect(), n = r.getAttribute("data-rml-ghost-url"), o = r.getAttribute("data-rml-ghost-width"), h = r.getAttribute("data-rml-ghost-height");
+    n ? t = n : !n && r instanceof HTMLImageElement && r.src && (t = r.src), t ? (s = i.width, e = i.height) : t = _, s = o ? parseInt(o, 10) : s, e = h ? parseInt(h, 10) : e;
+  }
+  return { url: t || _, width: s, height: e };
+};
+class M {
+  _options = {};
+  _instance;
+  _mainDomElement;
+  _viewName;
+  _currentCustomDrag = null;
+  _currentBb = null;
+  _startTarget = null;
+  _onBeforeUpdateDrag = () => ({});
+  isDragging = !1;
+  constructor(t, s, e) {
+    this._instance = t, this._options = s || {}, this._viewName = e, this._mainDomElement = mainDomElement, this._mainDomElement.parentElement?.addEventListener("dragleave", () => {
+      this._instance.cancelDragIn();
+    });
+  }
+  beforeUpdateGhost(t) {
+    this._onBeforeUpdateDrag = t;
+  }
+  async _dragStart(t, s, e = "rml_id") {
+    this._startTarget && (this._startTarget.style.pointerEvents = "none", this._startTarget.style.userSelect = "none", this._startTarget.setAttribute(
+      l,
+      this._startTarget.draggable.toString()
+    ), this._startTarget.draggable = !1, this._startTarget.removeEventListener("dragstart", c), this._startTarget.addEventListener("dragstart", c)), this._currentBb = await this._instance.getBoundingClientRect(
+      L(this._viewName)
+    );
+    const { clientX: r, clientY: i } = D(s), n = this._currentBb.x + r, o = this._currentBb.y + i;
+    this.isDragging = !0, this._instance.dragInObject(t, n, o, e);
+  }
+  _dragUpdate(t) {
+    if (document.body.focus(), this._currentCustomDrag && this._currentCustomDrag.onMove(t), !this._currentBb || !this.isDragging)
+      return;
+    const { clientX: s, clientY: e } = D(t), { url: r, width: i, height: n } = w(this._startTarget), o = this._currentBb.x + s, h = this._currentBb.y + e, g = this._options || {}, u = {
+      ghost: {
+        visibleIn: {
+          x: this._currentBb.x - (g.dragInOverlapX || 0),
+          y: this._currentBb.y + (g.dragInOverlapY || 0),
+          width: this._currentBb.width + (g.dragInOverlapX || 0),
+          height: this._currentBb.height + (g.dragInOverlapY || 0)
+        },
+        url: r,
+        width: i,
+        height: n
+      },
+      mode: "custom-view"
+    }, {
+      x: d,
+      y: m,
+      options: b
+    } = this._onBeforeUpdateDrag(o, h, u), E = typeof d == "number" ? d : o, y = typeof m == "number" ? m : h, C = b || u;
+    this._instance.updateDrag(E, y, C);
+  }
+  _dragEnd() {
+    this._currentCustomDrag && this._currentCustomDrag.onEnd(), this._currentCustomDrag = null, this.isDragging = !1, this._currentBb = null, this._resetStartTarget(), this._instance.enableEvents(), this._instance.dragInObjectEnd();
+  }
+  dragStart(t, s, e) {
+    this._instance.disableEvents(), this._startTarget = s.target;
+    const r = (i, n) => {
+      this._dragStart(t, n, e);
+    };
+    this._currentCustomDrag = T(s) ? new S(
+      G,
+      {
+        onTouchDragStart: r
+      },
+      p(s, this._options)
+    ) : new X(
+      {
+        onCustomDragStart: (i) => this._dragStart(t, i, e)
+      },
+      p(s, this._options)
+    ), this._currentCustomDrag.onStart(s);
+  }
+  dragEnd() {
+    this._dragEnd();
+  }
+  dragUpdate(t) {
+    this._dragUpdate(t);
+  }
+  touchStart(t, s, e = "rml_id") {
+    this.dragStart(t, s, e);
+  }
+  touchMove(t) {
+    this.dragUpdate(t);
+  }
+  touchEnd() {
+    this.dragEnd();
+  }
+  dispose() {
+  }
+  _resetStartTarget() {
+    this._startTarget && (this._startTarget.style.pointerEvents = "", this._startTarget.style.userSelect = "", this._startTarget.draggable = this._startTarget.getAttribute(l) === "true", this._startTarget.removeAttribute(l), this._startTarget.removeEventListener("dragstart", c));
+  }
+  releaseInput(t) {
+    this._currentCustomDrag && this._currentCustomDrag.onEnd(), this._resetStartTarget();
+  }
+}
+export {
+  M as DragInFromCustomViewStrategy
+};

package/from-custom-view-DIYHP31u.mjs

@@ -0,0 +1 @@
+import{C as t,e,T as r,i as s,b as a,c as i,d as n}from"./touch-drag-B5zCf87J.mjs";import{f as o,e as h,d as g}from"./drag-in-DTA1FCDc.mjs";const _=t=>{t.preventDefault(),t.stopPropagation()};class l{_startX=0;_startY=0;_lastX=0;_lastY=0;_epsilon;_isWaiting=!1;_onCustomDragStart;constructor({onCustomDragStart:e},r={}){this._epsilon="number"==typeof r.epsilon?r.epsilon:t,this._onCustomDragStart=e}onMove(t){this._lastX=t.clientX,this._lastY=t.clientY,this._isWaiting&&((t,e)=>{const r=this._lastX-t,s=this._lastY-e;return Math.sqrt(r*r+s*s)})(this._startX,this._startY)>this._epsilon&&(this._onCustomDragStart(t),this._isWaiting=!1)}onStart(t){this._startX=t.clientX,this._startY=t.clientY,this.onMove(t),this._isWaiting=!0}onEnd(){this._reset()}_reset(){this._startX=0,this._startY=0,this._lastX=0,this._lastY=0,this._isWaiting=!1}}const u="data-rml-old-draggable",c=(e,r)=>{const o=s(e),h={delay:o?i:n,epsilon:o?a:t};if(!r)return h;if(!(o||e instanceof MouseEvent))return h;const{delayKey:g,epsilonKey:_}=o?{delayKey:"touchDragDelay",epsilonKey:"touchDragEpsilon"}:{delayKey:"customDragDelay",epsilonKey:"customDragEpsilon"};return"number"==typeof r[g]&&(h.delay=r.touchDragDelay),"number"==typeof r[_]&&(h.epsilon=r.touchDragEpsilon),h};class d{_options={};_instance;_mainDomElement;_viewName;_currentCustomDrag=null;_currentBb=null;_startTarget=null;_onBeforeUpdateDrag=()=>({});isDragging=!1;constructor(t,e,r){this._instance=t,this._options=e||{},this._viewName=r,this._mainDomElement=mainDomElement,this._mainDomElement.parentElement?.addEventListener("dragleave",()=>{this._instance.cancelDragIn()})}beforeUpdateGhost(t){this._onBeforeUpdateDrag=t}async _dragStart(t,r,s="rml_id"){var a;this._startTarget&&(this._startTarget.style.pointerEvents="none",this._startTarget.style.userSelect="none",this._startTarget.setAttribute(u,this._startTarget.draggable.toString()),this._startTarget.draggable=!1,this._startTarget.removeEventListener("dragstart",_),this._startTarget.addEventListener("dragstart",_)),this._currentBb=await this._instance.getBoundingClientRect((a=this._viewName,`[data-rml-custom-view="${a}"]`));const{clientX:i,clientY:n}=e(r),o=this._currentBb.x+i,h=this._currentBb.y+n;this.isDragging=!0,this._instance.dragInObject(t,o,h,s)}_dragUpdate(t){if(document.body.focus(),this._currentCustomDrag&&this._currentCustomDrag.onMove(t),!this._currentBb||!this.isDragging)return;const{clientX:r,clientY:s}=e(t),{url:a,width:i,height:n}=(t=>{let e="",r=h,s=o;if(!t)return{url:g,width:r,height:s};const a=t;if(a instanceof HTMLElement){const t=a.getBoundingClientRect(),i=a.getAttribute("data-rml-ghost-url"),n=a.getAttribute("data-rml-ghost-width"),o=a.getAttribute("data-rml-ghost-height");i?e=i:!i&&a instanceof HTMLImageElement&&a.src&&(e=a.src),e?(r=t.width,s=t.height):e=g,r=n?parseInt(n,10):r,s=o?parseInt(o,10):s}return{url:e||g,width:r,height:s}})(this._startTarget),_=this._currentBb.x+r,l=this._currentBb.y+s,u=this._options||{},c={ghost:{visibleIn:{x:this._currentBb.x-(u.dragInOverlapX||0),y:this._currentBb.y+(u.dragInOverlapY||0),width:this._currentBb.width+(u.dragInOverlapX||0),height:this._currentBb.height+(u.dragInOverlapY||0)},url:a,width:i,height:n},mode:"custom-view"},{x:d,y:m,options:p}=this._onBeforeUpdateDrag(_,l,c),D="number"==typeof d?d:_,b="number"==typeof m?m:l,y=p||c;this._instance.updateDrag(D,b,y)}_dragEnd(){this._currentCustomDrag&&this._currentCustomDrag.onEnd(),this._currentCustomDrag=null,this.isDragging=!1,this._currentBb=null,this._resetStartTarget(),this._instance.enableEvents(),this._instance.dragInObjectEnd()}dragStart(t,e,a){this._instance.disableEvents(),this._startTarget=e.target,this._currentCustomDrag=s(e)?new r(void 0,{onTouchDragStart:(e,r)=>{this._dragStart(t,r,a)}},c(e,this._options)):new l({onCustomDragStart:e=>this._dragStart(t,e,a)},c(e,this._options)),this._currentCustomDrag.onStart(e)}dragEnd(){this._dragEnd()}dragUpdate(t){this._dragUpdate(t)}touchStart(t,e,r="rml_id"){this.dragStart(t,e,r)}touchMove(t){this.dragUpdate(t)}touchEnd(){this.dragEnd()}dispose(){}_resetStartTarget(){this._startTarget&&(this._startTarget.style.pointerEvents="",this._startTarget.style.userSelect="",this._startTarget.draggable="true"===this._startTarget.getAttribute(u),this._startTarget.removeAttribute(u),this._startTarget.removeEventListener("dragstart",_))}releaseInput(t){this._currentCustomDrag&&this._currentCustomDrag.onEnd(),this._resetStartTarget()}}export{d as DragInFromCustomViewStrategy};

package/from-website-CcDHgCCy.mjs

@@ -0,0 +1 @@
+import{g as t,e,a as n,i as s,T as i}from"./touch-drag-B5zCf87J.mjs";import{R as a,a as o,b as r,c as h,d as g,e as d,f as l,g as m,h as c,i as u,j as _,k as f}from"./drag-in-DTA1FCDc.mjs";const p=(t,e,n=0,s=0)=>{const i=e.x+e.width+n,a=e.x-n,o=e.y+e.height+s,r=e.y-s,{x:h,y:g}=t;return h>=a&&h<=i&&g>=r&&g<=o},D=(t,e,n,s=0,i=0)=>{if(n&&(n.hiddenIn||n.visibleIn))return n.visibleIn?p({x:t,y:e},n.visibleIn,s,i):!!n.hiddenIn&&!p({x:t,y:e},n.hiddenIn,-s,-i)};class y{_dragGhostAnimationFrameId=null;_dragGhostRemoveAnimationFrameId=null;_dragGhostElement=null;constructor(t=null){this._dragGhostElement=t}updateDragGhost(t,e,n){this._dragGhostRemoveAnimationFrameId&&(cancelAnimationFrame(this._dragGhostRemoveAnimationFrameId),this._dragGhostRemoveAnimationFrameId=null),!n.ghost?.external&&n.ghost&&(this._dragGhostAnimationFrameId||(this._dragGhostAnimationFrameId=requestAnimationFrame(()=>{(()=>{if(!document.getElementById(o)){const t=document.createElement("style");t.type="text/css",t.id=o,t.innerHTML=`\n    ${r}\n    ${h}\n  `,document.head.appendChild(t)}})();const s={x:t,y:e};!n.ghost&&this._dragGhostElement&&(n.ghost={}),n.ghost&&!n.ghost.element&&this._dragGhostElement&&(n.ghost.element=this._dragGhostElement),(({x:t,y:e},n)=>{let s=document.getElementById(a);if(!s){if(s=document.createElement("div"),n.ghost?.element)s.appendChild(n.ghost.element);else{const t=document.createElement("img");t.src=n.ghost?.url||g,t.width=n.ghost?.width||d,t.height=n.ghost?.height||l,s.appendChild(t)}s.id=a,s.style.position="fixed",s.style.top="0",s.style.left="0",s.style.willChange="transform",s.style.transform="translate3d(0, 0, 0)",s.style.zIndex="9999",s.style.opacity="0.5",D(t,e,n.ghost||{},n.settings?.dragInOverlapX,n.settings?.dragInOverlapY)||(s.style.display="none"),s.style.pointerEvents="none",document.body.appendChild(s)}})(s,n),(({x:t,y:e},n)=>{const s=document.getElementById(a);if(!s)return;let i=n.ghost?.width,o=n.ghost?.height;typeof i>"u"&&(i=s.getBoundingClientRect().width||d),typeof o>"u"&&(o=s.getBoundingClientRect().height||l);const r=t-i/2,h=e-o/2;s.style.transform=`translate3d(${r}px, ${h}px, 0)`,n.ghost&&(D(t,e,n.ghost,n.settings?.dragInOverlapX,n.settings?.dragInOverlapY)?s.style.animation!=m&&(s.style.animation=m):s.style.animation!=c&&(s.style.animation=c))})(s,n),this._dragGhostAnimationFrameId=null})))}removeDragGhost(){this._dragGhostAnimationFrameId&&(cancelAnimationFrame(this._dragGhostAnimationFrameId),this._dragGhostAnimationFrameId=null),this._dragGhostRemoveAnimationFrameId||(this._dragGhostRemoveAnimationFrameId=requestAnimationFrame(()=>{const t=document.getElementById(a);t&&document.body.removeChild(t),this._dragGhostRemoveAnimationFrameId=null}))}}class x{_options={};_instance;_mainDomElement;_currentDrag={};_currentTouch=null;_firefoxDragPosition={x:0,y:0};_onBeforeUpdateDrag=()=>({});isDragging=!1;_firefoxFallback=t=>{if(!this._currentDrag.event)return;t.preventDefault();const e=t||window.event;this._firefoxDragPosition.x=e.pageX||0,this._firefoxDragPosition.y=e.pageY||0};constructor(t,e,n){this._instance=t,this._mainDomElement=e,this._options=n||{},this._firefoxFallback=this._firefoxFallback.bind(this),document.addEventListener("dragover",this._firefoxFallback),this._mainDomElement.parentElement?.addEventListener("dragleave",()=>{this._instance.cancelDragIn()})}beforeUpdateGhost(t){this._onBeforeUpdateDrag=t}dragStart(s,i,a="rml_id"){const o=this._mainDomElement.parentNode;if("relative"!==t(o).position)return;this._mainDomElement.style.pointerEvents="none";let r=o.querySelector("."+u);r||(r=document.createElement("div"),r.classList.add(u),o.appendChild(r)),r.classList.remove(_.DISPLAY_NONE),i.target.getAttribute("draggable");const h=o.querySelector("."+f);this._currentDrag.event=i;const g=i.target,d=g.cloneNode(!0),l=g.getBoundingClientRect();d.style.width=`${l.width}px`,d.style.height=`${l.height}px`,this._currentDrag.ghost=new y(d),this._currentDrag.offset||(this._currentDrag.offset={x:0,y:0});const{clientX:m,clientY:c}=e(i,this._firefoxDragPosition);this._currentDrag.offset.x=m-l.left,this._currentDrag.offset.y=c-l.top,i instanceof DragEvent&&i.dataTransfer&&i.dataTransfer.setDragImage&&i.dataTransfer.setDragImage(h,0,0);const{x:p,y:D}=n(o,this._currentDrag.event||i,this._firefoxDragPosition),x=Math.max(1,p),v=Math.max(1,D);this.isDragging=!0,this._instance.dragInObject(s,x,v,a)}dragUpdate(t){const i=this._mainDomElement.parentNode,{x:a,y:o}=n(i,t,this._firefoxDragPosition);if(0===a&&0===o)return;const r=Math.max(1,a),h=Math.max(1,o);if(1===r&&1===h)return;let g=r,d=h;if(s(t)){const t=this._options.settings?.fingerSize||0;g=Math.max(2,r+t),d=Math.max(2,h-t)}const{x:l,y:m,options:c}=this._onBeforeUpdateDrag(g,d,{}),u=c||{settings:{},ghost:{}};u.ghost||(u.ghost={}),u.ghost.visibleIn&&u.ghost.hiddenIn||(u.ghost.hiddenIn=this._mainDomElement.getBoundingClientRect());const _="number"==typeof l?l:g,f="number"==typeof m?m:d;if(this._currentDrag.ghost){const{clientX:n,clientY:s}=e(t,this._firefoxDragPosition);this._currentDrag.ghost.updateDragGhost(n,s,u)}this._instance.updateDrag(_,f,{})}dragEnd(){this._mainDomElement.style.pointerEvents="all";const t=this._mainDomElement.parentNode;this.isDragging=!1,this._instance.dragInObjectEnd(),this._currentDrag.ghost&&(this._currentDrag.ghost.removeDragGhost(),this._currentDrag.ghost=null),this._currentDrag={},this._firefoxDragPosition={x:0,y:0};const e=t.querySelector("."+u);e&&e.classList.add(_.DISPLAY_NONE)}touchStart(t,e,n="rml_id"){e.preventDefault();const s={};"number"==typeof this._options?.settings?.touchDragDelay&&(s.delay=this._options.settings.touchDragDelay),this._options?.settings?.touchDragEpsilon&&(s.epsilon=this._options.settings.touchDragEpsilon),this._currentTouch=new i(void 0,{onTouchDragStart:(e,s)=>{this.dragStart(t,s,n)}},s),this._currentTouch.onStart(e)}touchMove(t){this._currentTouch&&this._currentTouch.onMove(t),this._currentDrag.event&&this.dragUpdate(t)}touchEnd(){this._currentTouch&&this._currentTouch.onEnd(),this._currentTouch=null,this.dragEnd()}dispose(){document.removeEventListener("dragover",this._firefoxFallback)}releaseInput(t){}}export{x as DragInFromWebsiteStrategy};

package/from-website-CktA6Icy.mjs

@@ -0,0 +1,201 @@
+import { g as b, e as I, a as A, i as F, T as M } from "./touch-drag-DXJTOrk5.mjs";
+import { R as m, a as E, b as C, c as N, d as O, e as R, f as T, g as G, h as p, i as y, j as x, k as w } from "./drag-in-DuufO5eB.mjs";
+const S = (r, n, t = 0, e = 0) => {
+  const s = n.x + n.width + t, i = n.x - t, a = n.y + n.height + e, o = n.y - e, { x: h, y: g } = r;
+  return h >= i && h <= s && g >= o && g <= a;
+}, v = (r, n, t, e = 0, s = 0) => {
+  if (!(!t || !t.hiddenIn && !t.visibleIn))
+    return t.visibleIn ? S(
+      { x: r, y: n },
+      t.visibleIn,
+      e,
+      s
+    ) : t.hiddenIn ? !S(
+      { x: r, y: n },
+      t.hiddenIn,
+      -e,
+      -s
+    ) : !1;
+}, B = () => {
+  if (!!!document.getElementById(E)) {
+    const n = document.createElement("style");
+    n.type = "text/css", n.id = E, n.innerHTML = `
+    ${C}
+    ${N}
+  `, document.head.appendChild(n);
+  }
+}, Y = ({ x: r, y: n }, t) => {
+  let e = document.getElementById(m);
+  if (!e) {
+    if (e = document.createElement("div"), t.ghost?.element)
+      e.appendChild(t.ghost.element);
+    else {
+      const s = document.createElement("img");
+      s.src = t.ghost?.url || O, s.width = t.ghost?.width || R, s.height = t.ghost?.height || T, e.appendChild(s);
+    }
+    e.id = m, e.style.position = "fixed", e.style.top = "0", e.style.left = "0", e.style.willChange = "transform", e.style.transform = "translate3d(0, 0, 0)", e.style.zIndex = "9999", e.style.opacity = "0.5", v(
+      r,
+      n,
+      t.ghost || {},
+      t.settings?.dragInOverlapX,
+      t.settings?.dragInOverlapY
+    ) || (e.style.display = "none"), e.style.pointerEvents = "none", document.body.appendChild(e);
+  }
+}, H = ({ x: r, y: n }, t) => {
+  const e = document.getElementById(m);
+  if (!e)
+    return;
+  let s = t.ghost?.width, i = t.ghost?.height;
+  typeof s > "u" && (s = e.getBoundingClientRect().width || R), typeof i > "u" && (i = e.getBoundingClientRect().height || T);
+  const a = r - s / 2, o = n - i / 2;
+  e.style.transform = `translate3d(${a}px, ${o}px, 0)`, t.ghost && (v(
+    r,
+    n,
+    t.ghost,
+    t.settings?.dragInOverlapX,
+    t.settings?.dragInOverlapY
+  ) ? e.style.animation != G && (e.style.animation = G) : e.style.animation != p && (e.style.animation = p));
+};
+class U {
+  _dragGhostAnimationFrameId = null;
+  _dragGhostRemoveAnimationFrameId = null;
+  _dragGhostElement = null;
+  constructor(n = null) {
+    this._dragGhostElement = n;
+  }
+  updateDragGhost(n, t, e) {
+    this._dragGhostRemoveAnimationFrameId && (cancelAnimationFrame(this._dragGhostRemoveAnimationFrameId), this._dragGhostRemoveAnimationFrameId = null), !e.ghost?.external && e.ghost && (this._dragGhostAnimationFrameId || (this._dragGhostAnimationFrameId = requestAnimationFrame(() => {
+      B();
+      const s = { x: n, y: t };
+      !e.ghost && this._dragGhostElement && (e.ghost = {}), e.ghost && !e.ghost.element && this._dragGhostElement && (e.ghost.element = this._dragGhostElement), Y(s, e), H(s, e), this._dragGhostAnimationFrameId = null;
+    })));
+  }
+  removeDragGhost() {
+    this._dragGhostAnimationFrameId && (cancelAnimationFrame(this._dragGhostAnimationFrameId), this._dragGhostAnimationFrameId = null), this._dragGhostRemoveAnimationFrameId || (this._dragGhostRemoveAnimationFrameId = requestAnimationFrame(() => {
+      const n = document.getElementById(m);
+      n && document.body.removeChild(n), this._dragGhostRemoveAnimationFrameId = null;
+    }));
+  }
+}
+class k {
+  _options = {};
+  _instance;
+  _mainDomElement;
+  _currentDrag = {};
+  _currentTouch = null;
+  _firefoxDragPosition = { x: 0, y: 0 };
+  _onBeforeUpdateDrag = () => ({});
+  isDragging = !1;
+  _firefoxFallback = (n) => {
+    if (!this._currentDrag.event)
+      return;
+    n.preventDefault();
+    const t = n || window.event;
+    this._firefoxDragPosition.x = t.pageX || 0, this._firefoxDragPosition.y = t.pageY || 0;
+  };
+  constructor(n, t, e) {
+    this._instance = n, this._mainDomElement = t, this._options = e || {}, this._firefoxFallback = this._firefoxFallback.bind(this), document.addEventListener("dragover", this._firefoxFallback), this._mainDomElement.parentElement?.addEventListener("dragleave", () => {
+      this._instance.cancelDragIn();
+    });
+  }
+  beforeUpdateGhost(n) {
+    this._onBeforeUpdateDrag = n;
+  }
+  dragStart(n, t, e = "rml_id") {
+    const s = this._mainDomElement.parentNode;
+    if (b(s).position !== "relative") {
+      console.warn(
+        "Parent of iframe should have position relative, otherwise drag-in can not detect the x/y coordinates correctly"
+      );
+      return;
+    }
+    this._mainDomElement.style.pointerEvents = "none";
+    let a = s.querySelector(
+      "." + y
+    );
+    a || (a = document.createElement("div"), a.classList.add(y), s.appendChild(a)), a.classList.remove(x.DISPLAY_NONE), t.target.getAttribute("draggable") || console.warn(
+      `Draggable not detected correctly! Did you add draggable="true" to the element? In Sarafi only 'draggable' is too less`
+    );
+    const h = s.querySelector(
+      "." + w
+    );
+    this._currentDrag.event = t;
+    const g = t.target, c = g.cloneNode(!0), l = g.getBoundingClientRect();
+    c.style.width = `${l.width}px`, c.style.height = `${l.height}px`, this._currentDrag.ghost = new U(c), this._currentDrag.offset || (this._currentDrag.offset = { x: 0, y: 0 });
+    const { clientX: d, clientY: u } = I(
+      t,
+      this._firefoxDragPosition
+    );
+    this._currentDrag.offset.x = d - l.left, this._currentDrag.offset.y = u - l.top, t instanceof DragEvent && t.dataTransfer && t.dataTransfer.setDragImage && t.dataTransfer.setDragImage(h, 0, 0);
+    const { x: f, y: _ } = A(
+      s,
+      this._currentDrag.event || t,
+      this._firefoxDragPosition
+    ), D = Math.max(1, f), L = Math.max(1, _);
+    this.isDragging = !0, this._instance.dragInObject(n, D, L, e);
+  }
+  dragUpdate(n) {
+    const t = this._mainDomElement.parentNode, { x: e, y: s } = A(t, n, this._firefoxDragPosition);
+    if (e === 0 && s === 0)
+      return;
+    const i = Math.max(1, e), a = Math.max(1, s);
+    if (i === 1 && a === 1)
+      return;
+    let o = i, h = a;
+    if (F(n)) {
+      const _ = this._options.settings?.fingerSize || 0;
+      o = Math.max(2, i + _), h = Math.max(2, a - _);
+    }
+    const {
+      x: g,
+      y: c,
+      options: l
+    } = this._onBeforeUpdateDrag(o, h, {}), d = l || { settings: {}, ghost: {} };
+    d.ghost || (d.ghost = {}), d.ghost.visibleIn && d.ghost.hiddenIn || (d.ghost.hiddenIn = this._mainDomElement.getBoundingClientRect());
+    const u = typeof g == "number" ? g : o, f = typeof c == "number" ? c : h;
+    if (this._currentDrag.ghost) {
+      const { clientX: _, clientY: D } = I(
+        n,
+        this._firefoxDragPosition
+      );
+      this._currentDrag.ghost.updateDragGhost(_, D, d);
+    }
+    this._instance.updateDrag(u, f, {});
+  }
+  dragEnd() {
+    this._mainDomElement.style.pointerEvents = "all";
+    const n = this._mainDomElement.parentNode;
+    this.isDragging = !1, this._instance.dragInObjectEnd(), this._currentDrag.ghost && (this._currentDrag.ghost.removeDragGhost(), this._currentDrag.ghost = null), this._currentDrag = {}, this._firefoxDragPosition = { x: 0, y: 0 };
+    const t = n.querySelector(
+      "." + y
+    );
+    t && t.classList.add(x.DISPLAY_NONE);
+  }
+  touchStart(n, t, e = "rml_id") {
+    t.preventDefault();
+    const s = (a, o) => {
+      this.dragStart(n, o, e);
+    }, i = {};
+    typeof this._options?.settings?.touchDragDelay == "number" && (i.delay = this._options.settings.touchDragDelay), this._options?.settings?.touchDragEpsilon && (i.epsilon = this._options.settings.touchDragEpsilon), this._currentTouch = new M(
+      void 0,
+      {
+        onTouchDragStart: s
+      },
+      i
+    ), this._currentTouch.onStart(t);
+  }
+  touchMove(n) {
+    this._currentTouch && this._currentTouch.onMove(n), this._currentDrag.event && this.dragUpdate(n);
+  }
+  touchEnd() {
+    this._currentTouch && this._currentTouch.onEnd(), this._currentTouch = null, this.dragEnd();
+  }
+  dispose() {
+    document.removeEventListener("dragover", this._firefoxFallback);
+  }
+  releaseInput(n) {
+  }
+}
+export {
+  k as DragInFromWebsiteStrategy
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@roomle/embedding-lib",
-  "version": "5.25.0-alpha.1",
+  "version": "5.25.0-alpha.10",
   "description": "This is a small library which can be used to communicate with the Roomle Configurator",
   "type": "module",
   "main": "./roomle-embedding-lib.umd.js",

package/packages/embedding-lib/src/examples/homag-intelligence-example.d.ts

@@ -0,0 +1,9 @@
+import { Example } from '../example';
+
+export default class DragInExample implements Example {
+    private _abortController;
+    setupHtml(parent: HTMLElement): Promise<void>;
+    closeExample(): Promise<void>;
+    private start;
+    runExample(): Promise<void>;
+}

package/packages/embedding-lib/src/examples/utils/homag-intelligence/create-catalog.d.ts

@@ -0,0 +1 @@
+export declare const createCatalog: (articleCatalog: HTMLElement, draggable?: boolean) => Promise<void>;

package/packages/embedding-lib/src/examples/utils/homag-intelligence/default-api-options.d.ts

@@ -0,0 +1,43 @@
+declare const _default: {
+    enableArrangementCorrection: boolean;
+    uiConfiguration: {
+        userRight: string;
+        materialAttributes: string[];
+        attributesVisibleInPlanner: string[];
+        attributeGroupsVisibleInPlanner: any[];
+        showPossibleSubModules: boolean;
+        animatedOpenClose: boolean;
+        showThumbnails: boolean;
+    };
+    materialConfiguration: {
+        defaultMaterial: string;
+        replaceUnmappedMaterialsWithDefault: boolean;
+        materialMapping: {
+            materialName: string;
+            materialId: string;
+        }[];
+    };
+    debugConfiguration: {
+        createDebugGeometry: boolean;
+    };
+    tecConfigInfo: {
+        baseUrlDebug: string;
+        /**
+         * If you do not want to use the proxy provided by Roomle
+         * uncomment the next three lines and comment the line
+         * which has the Roomle proxy URL in it.
+         * BE AWARE: That the example url dfteccdeveu01-app.azurewebsites.net
+         * only works if you requesting from localhost:3100 otherwise you
+         * will have CORS issues
+         */
+        /** comment this line if you do not want to use the Roomle proxy  */
+        baseUrl: string;
+        om: {
+            subscriptionId: string;
+            key: string;
+            importBaseUrl: string;
+        };
+        libraryId: string;
+    };
+};
+export default _default;

package/packages/embedding-lib/src/examples/utils/homag-intelligence/dom-helper.d.ts

@@ -0,0 +1,13 @@
+import { RoomDesignerApiType } from './overlay';
+
+export declare const GROUP_SELECTION_STR = "Group selection";
+export declare const getOverlayDomElement: () => HTMLElement;
+export declare const positionOverlay: (roomDesignerApi: RoomDesignerApiType) => Promise<void>;
+export declare const showOverlay: () => void;
+export declare const hideOverlay: () => void;
+export declare const addShadow: (roomDesignerApi: RoomDesignerApiType) => Promise<void>;
+export declare const removeShadow: () => void;
+export declare const currentSelectionType: (selectionPayload: any) => "Group selection" | "Unknown selection type" | "Root module selection" | "Sub module selection";
+export declare const showItemSelectionWarning: (roomDesignerApi: RoomDesignerApiType) => Promise<void>;
+export declare const showCustomItemSelectionView: (state: any, roomDesignerApi: RoomDesignerApiType) => Promise<void>;
+export declare const showCustomCatalogView: (roomDesignerApi: RoomDesignerApiType) => Promise<void>;

package/packages/embedding-lib/src/examples/utils/homag-intelligence/drag-in.d.ts

@@ -0,0 +1,3 @@
+import { RoomDesignerApiType } from './overlay';
+
+export declare const addDragEventListeners: (roomDesignerApi: RoomDesignerApiType, catalogElements: NodeListOf<Element> | Element[], signal: AbortSignal, element?: HTMLElement | null) => void;