@smplrspace/smplr-loader 0.0.1-beta.1 → 2.4.1-beta.10

package/dist/generated/smplr.d.ts

@@ -0,0 +1,313 @@
+declare interface BaseDataLayer<T, D extends UnknownData> {
+    tooltip?: (dataElement: T & D) => string;
+    onClick?: (dataElement: T & D) => void;
+    onHover?: (dataElement: T & D) => void;
+    onHoverOut?: (dataElement: T & D) => void;
+}
+
+declare type CameraMode = '2d' | '3d'
+
+declare type DataLayer<D extends UnknownData = NoData> = PointDataLayer<D> | IconDataLayer<D> | PolygonDataLayer<D> | PolylineDataLayer<D> | FurnitureDataLayer<D>;
+
+declare interface DeprecatedPreviewProps {
+    mode: CameraMode;
+    onViewerReady: () => void;
+    onError: () => void;
+}
+
+declare interface Filter {
+    background: {
+        clearColor: string;
+    };
+    directionalLight: {
+        distance: number;
+        intensity: number;
+    };
+    hemisphericLight: {
+        diffuseColor: string;
+        specularColor: string;
+        groundColor: string;
+        intensity: number;
+    };
+    whiteMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    indoorMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    grassMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    waterMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    darkGreyMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    glassMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    metalMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    compassMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    placeholderMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    hoveredMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    selectedMaterial: {
+        baseColor: string;
+        metallicRatio: number;
+        roughnessRatio: number;
+        alphaRatio: number;
+    };
+    dataElement: {
+        defaultColor: string;
+    };
+}
+
+declare type FurnitureData = {
+    furnitureId: string | string[];
+};
+
+declare interface FurnitureDataLayer<D extends UnknownData = NoData> extends BaseDataLayer<FurnitureData, D> {
+    id: string;
+    type: 'furniture';
+    data: (FurnitureData & D)[];
+    color?: string | ((dataElement: FurnitureData & D) => string);
+}
+
+declare type IconData = {
+    position: SmplrCoord3d;
+};
+
+declare interface IconDataLayer<D extends UnknownData = NoData> extends BaseDataLayer<IconData, D> {
+    id: string;
+    type: 'icon';
+    data: (IconData & D)[];
+    icon: {
+        url: string;
+        width: number;
+        height: number;
+    };
+    width?: number | ((dataElement: IconData & D) => number);
+    onDrag?: (dragged: {
+        data: IconData & D;
+    }) => void;
+    onDrop?: (dropped: {
+        data: IconData & D;
+        position: SmplrCoord3d;
+    }) => void;
+}
+
+declare type NoData = Record<string, never>;
+
+declare type OnPickFn = (args: { coordinates: SmplrCoord3d; furnitureId?: string }) => void
+
+declare interface OrbitCameraPlacement {
+    alpha: number;
+    beta: number;
+    radius: number;
+    target: Vector3Coord;
+}
+
+declare type PointData = {
+    position: SmplrCoord3d;
+};
+
+declare interface PointDataLayer<D extends UnknownData = NoData> extends BaseDataLayer<PointData, D> {
+    id: string;
+    type: 'point';
+    data: (PointData & D)[];
+    diameter?: number | ((dataElement: PointData & D) => number);
+    anchor?: 'bottom' | 'center' | 'top';
+    color?: string | ((dataElement: PointData & D) => string);
+    alpha?: number;
+    onDrag?: (dragged: {
+        data: PointData & D;
+    }) => void;
+    onDrop?: (dropped: {
+        data: PointData & D;
+        position: SmplrCoord3d;
+    }) => void;
+}
+
+declare type PolygonData = {
+    coordinates: SmplrCoord2d[];
+};
+
+declare interface PolygonDataLayer<D extends UnknownData = NoData> extends BaseDataLayer<PolygonData, D> {
+    id: string;
+    type: 'polygon';
+    data: (PolygonData & D)[];
+    baseHeight?: number | ((dataElement: PolygonData & D) => number);
+    height?: number | ((dataElement: PolygonData & D) => number);
+    color?: string | ((dataElement: PolygonData & D) => string);
+    alpha?: number;
+    onDrag?: (dragged: {
+        data: PolygonData & D;
+    }) => void;
+    onDrop?: (dropped: {
+        data: PolygonData & D;
+        coordinates: SmplrCoord2d[];
+    }) => void;
+    disableReshape?: boolean;
+    reshapeBoxColor?: string;
+}
+
+declare type PolylineData = {
+    coordinates: SmplrCoord3d[];
+};
+
+declare interface PolylineDataLayer<D extends UnknownData = NoData> extends BaseDataLayer<PolylineData, D> {
+    id: string;
+    type: 'polyline';
+    data: (PolylineData & D)[];
+    shape?: 'circle' | 'triangle' | 'square' | 'pentagon' | 'hexagon' | [number, number][];
+    cap?: boolean;
+    scale?: number | ((scaled: {
+        data: PolylineData & D;
+        stepIndex: number;
+        distance: number;
+    }) => number);
+    stepSize?: number;
+    color?: string | ((dataElement: PolylineData & D) => string);
+    alpha?: number;
+    onDrag?: (dragged: {
+        data: PolylineData & D;
+    }) => void;
+    onDrop?: (dropped: {
+        data: PolylineData & D;
+        coordinates: SmplrCoord3d[];
+    }) => void;
+    disableReshape?: boolean;
+    reshapeBoxColor?: string;
+}
+
+declare interface RenderOptions {
+    compass?: boolean
+    annotations?: boolean
+    skybox?: boolean
+    backgroundColor?: string
+    filter?: Partial<Filter>
+    walls?: {
+        render?: boolean
+        alpha?: number
+        maxHeightCm?: number
+        showStructuralWalls?: boolean
+    }
+    doors?: boolean
+    windows?: boolean
+    flip?: boolean
+    objects?: boolean
+    floorplan?: {
+        render?: boolean
+        alpha?: number
+        elevationInCm?: number
+    }
+}
+
+declare interface SmplrCoord2d {
+    levelIndex: number;
+    x: number;
+    z: number;
+}
+
+declare interface SmplrCoord3d extends SmplrCoord2d {
+    elevation: number;
+}
+
+export declare class Space {
+    private options;
+    private viewerStarted;
+    private scene;
+    private container;
+    private setPickHandler;
+    private dispatchDataLayersDefinition;
+    constructor(options: SpaceOptions);
+    private checkOptions;
+    private prepareContainer;
+    remove: () => void;
+    preview({ mode, onViewerReady, onError }: DeprecatedPreviewProps): void;
+    startViewer(options: ViewerOptions): void;
+    addDataLayer<D extends UnknownData>(dataLayer: DataLayer<D>): void;
+    updateDataLayer<D extends UnknownData>(dataLayer: Partial<DataLayer<D>>): void;
+    removeDataLayer(id: string): void;
+    enablePickingMode({ onPick }: {
+        onPick: OnPickFn;
+    }): void;
+    disablePickingMode(): void;
+    getCameraPlacement(): OrbitCameraPlacement;
+    setCameraPlacement(placement: OrbitCameraPlacement): void;
+}
+
+declare interface SpaceOptions {
+    spaceId: string;
+    clientToken: string;
+    containerId: string;
+}
+
+declare type UnknownData = Record<string, unknown>;
+
+declare interface Vector2Coord {
+    x: number;
+    y: number;
+}
+
+declare interface Vector3Coord extends Vector2Coord {
+    z: number;
+}
+
+export declare const version = "2.4.1-beta.10";
+
+declare interface ViewerOptions {
+    mode?: CameraMode;
+    preview?: boolean;
+    allowModeChange?: boolean;
+    cameraPlacement?: OrbitCameraPlacement;
+    disableCameraControls?: boolean;
+    hideNavigationButtons?: boolean;
+    compass?: boolean;
+    annotations?: boolean;
+    renderOptions?: RenderOptions;
+    onReady?: () => void;
+    onError?: (error: unknown) => void;
+    onModeChange?: (mode: CameraMode) => void;
+    loadingMessage?: string;
+}
+
+export { }

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+import { Smplr } from './types';
+export type { Smplr } from './types';
+declare type BundleType = 'esm' | 'umd';
+declare type Env = 'prod' | 'dev' | 'local';
+export declare function loadSmplrJs(bundle?: BundleType, env?: Env): Promise<Smplr>;

package/dist/index.js

@@ -0,0 +1,67 @@
+const c = (r) => new Promise((o, s) => {
+  try {
+    const e = document.createElement("script");
+    e.type = "text/javascript", e.async = !0, e.src = r, e.addEventListener("load", () => {
+      o("ok");
+    }), e.addEventListener("error", () => {
+      s(`Failed to load the script from ${r}`);
+    }), document.body.appendChild(e);
+  } catch (e) {
+    s(e);
+  }
+}), p = (r) => import(
+  r
+  /* @vite-ignore */
+), a = (r) => new Promise((o, s) => {
+  try {
+    const e = document.createElement("link");
+    e.type = "text/css", e.href = r, e.rel = "stylesheet", e.addEventListener("load", () => {
+      o("ok");
+    }), e.addEventListener("error", () => {
+      const l = new Error(`Failed to load the stylesheet from ${r}`);
+      console.error(l), s(l);
+    }), document.head.appendChild(e);
+  } catch (e) {
+    console.error(e), s(e);
+  }
+}), t = {
+  umd: {
+    prod: "https://app.smplrspace.com/lib/smplr.js",
+    dev: "https://dev.smplrspace.com/lib/smplr.js",
+    local: "http://localhost:3000/lib/smplr.umd.js"
+  },
+  esm: {
+    prod: "https://app.smplrspace.com/lib/smplr.mjs",
+    dev: "https://dev.smplrspace.com/lib/smplr.mjs",
+    local: "http://localhost:3000/lib/smplr.mjs"
+  },
+  css: {
+    prod: "https://app.smplrspace.com/lib/smplr.css",
+    dev: "https://dev.smplrspace.com/lib/smplr.css",
+    local: "http://localhost:3000/lib/style.css"
+  }
+};
+async function d(r = "esm", o = "prod") {
+  try {
+    a(t.css[o]);
+  } catch {
+    console.warn("oops");
+  }
+  try {
+    if (r === "esm") {
+      const s = await p(t.esm[o]);
+      return console.log("loaded esm", s), s;
+    } else {
+      await c(t.umd[o]);
+      const s = window.smplr;
+      if (!s)
+        throw new Error("Failed to load smplr.js");
+      return console.log("loaded umd", s), s;
+    }
+  } catch (s) {
+    throw console.error(s), new Error("Failed to load smplr.js");
+  }
+}
+export {
+  d as loadSmplrJs
+};

package/dist/index.umd.cjs

@@ -0,0 +1 @@
+(function(r,l){typeof exports=="object"&&typeof module<"u"?l(exports):typeof define=="function"&&define.amd?define(["exports"],l):(r=typeof globalThis<"u"?globalThis:r||self,l(r.SmplrLoader={}))})(this,function(r){"use strict";const l=o=>new Promise((t,s)=>{try{const e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src=o,e.addEventListener("load",()=>{t("ok")}),e.addEventListener("error",()=>{s(`Failed to load the script from ${o}`)}),document.body.appendChild(e)}catch(e){s(e)}}),c=o=>import(o),n=o=>new Promise((t,s)=>{try{const e=document.createElement("link");e.type="text/css",e.href=o,e.rel="stylesheet",e.addEventListener("load",()=>{t("ok")}),e.addEventListener("error",()=>{const d=new Error(`Failed to load the stylesheet from ${o}`);console.error(d),s(d)}),document.head.appendChild(e)}catch(e){console.error(e),s(e)}}),p={umd:{prod:"https://app.smplrspace.com/lib/smplr.js",dev:"https://dev.smplrspace.com/lib/smplr.js",local:"http://localhost:3000/lib/smplr.umd.js"},esm:{prod:"https://app.smplrspace.com/lib/smplr.mjs",dev:"https://dev.smplrspace.com/lib/smplr.mjs",local:"http://localhost:3000/lib/smplr.mjs"},css:{prod:"https://app.smplrspace.com/lib/smplr.css",dev:"https://dev.smplrspace.com/lib/smplr.css",local:"http://localhost:3000/lib/style.css"}};async function m(o="esm",t="prod"){try{n(p.css[t])}catch{console.warn("oops")}try{if(o==="esm"){const s=await c(p.esm[t]);return console.log("loaded esm",s),s}else{await l(p.umd[t]);const s=window.smplr;if(!s)throw new Error("Failed to load smplr.js");return console.log("loaded umd",s),s}}catch(s){throw console.error(s),new Error("Failed to load smplr.js")}}r.loadSmplrJs=m,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});

package/dist/loadScript.d.ts

@@ -0,0 +1,2 @@
+export declare const loadUmdScript: (url: string) => Promise<unknown>;
+export declare const loadEsmModule: (url: string) => Promise<any>;

package/dist/loadStylesheet.d.ts

@@ -0,0 +1 @@
+export declare const loadStylesheet: (url: string) => Promise<unknown>;

package/package.json

@@ -1,9 +1,22 @@
 {
   "name": "@smplrspace/smplr-loader",
-  "version": "0.0.1-beta.1",
+  "version": "2.4.1-beta.10",
   "description": "NPM package to load a typed Smplr.js from CDN easily",
-  "main": "src/index.ts",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.umd.cjs",
+  "module": "./dist/index.js",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.umd.cjs"
+    }
+  },
+  "types": "./dist/index.d.ts",
   "scripts": {
+    "build": "yarn tsc && vite build",
     "dev": "echo 'No dev'",
     "serve": "echo 'No serve'",
     "libtest": "echo 'No libtest'",
@@ -28,7 +41,9 @@
     "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-prettier": "^4.2.1",
     "prettier": "^2.7.1",
-    "typescript": "4.7.4"
+    "typescript": "4.7.4",
+    "vite": "^4.1.1",
+    "vite-plugin-dts": "^1.7.1"
   },
   "homepage": "https://www.smplrspace.com",
   "keywords": [
@@ -37,4 +52,4 @@
     "digital twin"
   ],
   "packageManager": "yarn@3.2.4"
-}
+}

package/.eslintignore

@@ -1,3 +0,0 @@
-node_modules
-dist
-src/generated/smplr.d.ts

package/.eslintrc.js

@@ -1,42 +0,0 @@
-module.exports = {
-  env: {
-    browser: true,
-    es2021: true,
-    jest: true,
-    node: true,
-  },
-  parser: '@typescript-eslint/parser',
-  parserOptions: {
-    ecmaVersion: 'latest',
-    sourceType: 'module',
-  },
-  settings: {
-    'import/parsers': {
-      '@typescript-eslint/parser': ['.ts', '.tsx'],
-    },
-    'import/resolver': {
-      typescript: {},
-    },
-  },
-  extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:prettier/recommended',
-    'plugin:import/recommended',
-    'plugin:import/typescript',
-  ],
-  plugins: ['@typescript-eslint', 'simple-import-sort'],
-  rules: {
-    'prettier/prettier': [
-      'error',
-      {
-        singleQuote: true,
-        semi: false,
-        printWidth: 120,
-      },
-    ],
-    'import/newline-after-import': 'error',
-    'simple-import-sort/imports': 'error',
-    'simple-import-sort/exports': 'error',
-  },
-}

package/src/index.ts

@@ -1,55 +0,0 @@
-import { loadEsmModule, loadUmdScript } from './loadScript'
-import { loadStylesheet } from './loadStylesheet'
-import { Smplr } from './types'
-
-export type { Smplr } from './types'
-
-const SMPLR = {
-  umd: {
-    prod: 'https://app.smplrspace.com/lib/smplr.js',
-    dev: 'https://dev.smplrspace.com/lib/smplr.js',
-    local: 'http://localhost:3000/lib/smplr.umd.js',
-  },
-  esm: {
-    prod: 'https://app.smplrspace.com/lib/smplr.mjs',
-    dev: 'https://dev.smplrspace.com/lib/smplr.mjs',
-    local: 'http://localhost:3000/lib/smplr.mjs',
-  },
-  css: {
-    prod: 'https://app.smplrspace.com/lib/smplr.css',
-    dev: 'https://dev.smplrspace.com/lib/smplr.css',
-    local: 'http://localhost:3000/lib/style.css',
-  },
-}
-
-type BundleType = 'esm' | 'umd'
-type Env = 'prod' | 'dev' | 'local'
-
-export async function loadSmplrJs(bundle: BundleType = 'esm', env: Env = 'prod'): Promise<Smplr> {
-  try {
-    // we don't wait for the stylesheet, just start to load it
-    loadStylesheet(SMPLR.css[env])
-  } catch (e) {
-    console.warn('oops')
-    // ignore errors, they will be printed anyway
-  }
-  // load script
-  try {
-    if (bundle === 'esm') {
-      const smplr = (await loadEsmModule(SMPLR.esm[env])) as Smplr
-      console.log('loaded esm', smplr)
-      return smplr
-    } else {
-      await loadUmdScript(SMPLR.umd[env])
-      const smplr = window.smplr as Smplr
-      if (!smplr) {
-        throw new Error('Failed to load smplr.js')
-      }
-      console.log('loaded umd', smplr)
-      return smplr
-    }
-  } catch (error) {
-    console.error(error)
-    throw new Error('Failed to load smplr.js')
-  }
-}

package/src/loadScript.ts

@@ -1,21 +0,0 @@
-export const loadUmdScript = (url: string) => {
-  return new Promise((resolve, reject) => {
-    try {
-      const scriptElement = document.createElement('script')
-      scriptElement.type = 'text/javascript'
-      scriptElement.async = true
-      scriptElement.src = url
-      scriptElement.addEventListener('load', () => {
-        resolve('ok')
-      })
-      scriptElement.addEventListener('error', () => {
-        reject(`Failed to load the script from ${url}`)
-      })
-      document.body.appendChild(scriptElement)
-    } catch (error) {
-      reject(error)
-    }
-  })
-}
-
-export const loadEsmModule = (url: string) => import(url /* @vite-ignore */)

package/src/loadStylesheet.ts

@@ -1,22 +0,0 @@
-export const loadStylesheet = (url: string) => {
-  return new Promise((resolve, reject) => {
-    try {
-      const linkElement = document.createElement('link')
-      linkElement.type = 'text/css'
-      linkElement.href = url
-      linkElement.rel = 'stylesheet'
-      linkElement.addEventListener('load', () => {
-        resolve('ok')
-      })
-      linkElement.addEventListener('error', () => {
-        const error = new Error(`Failed to load the stylesheet from ${url}`)
-        console.error(error)
-        reject(error)
-      })
-      document.head.appendChild(linkElement)
-    } catch (error) {
-      console.error(error)
-      reject(error)
-    }
-  })
-}

package/tsconfig.json

@@ -1,17 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ESNext",
-    "lib": ["DOM", "DOM.Iterable", "ESNext"],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "strict": true,
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true
-  },
-  "include": ["src"]
-}