@realsee/dnalogel 0.1.3 → 0.1.7-alpha.2

package/components/GLTFView/index.d.ts

@@ -0,0 +1,104 @@
+import * as React from 'react';
+import { GLTFViewer, GLTFViewerConfig } from '../../libs/gltf-viewer';
+export declare type GLTFViewPropTypes = {
+    url: string;
+    className?: string;
+    refs?: (gltfViewer: GLTFViewer) => void;
+} & GLTFViewerConfig;
+/**
+ * **GLTFViewer** 预览 `glTF` 模型文件（支持.gltf和.glb格式），附带光照等效果。
+ *
+ * ### Usage
+ *
+ * 基础用法：
+ *
+ * ```jsx
+ * import { GLTFViewer } from '@realsee/dnalogel/libs/gltf-viewer'
+ *
+ * // 创建实例
+ * const gltfViewer = new GLTFViewer({
+ *  pixelRatio: 1,
+ * })
+ *
+ * // 挂载至 DOM 节点
+ * gltfViewer.appendTo(ref.current)
+ *
+ * // 加载模型文件
+ * await gltfViewer.load(glbCDNUrl)
+ *
+ * // 输出当前模型状态数据
+ * console.log(gltfViewer.state)
+ * // { longitude: 0, latitude: -0.3, fov: 35 }
+ *
+ * // 设置当前模型状态：直接给状态对象赋值（立即生效）
+ * gltfViewer.state = { longitude: 0, latitude: -0.3, fov: 35 }
+ *
+ * // 设置当前模型状态：直接给状态对象单个属性赋值（立即生效）
+ * gltfViewer.state.fov = 50
+ *
+ * ```
+ *
+ * 事件监听：
+ *
+ * ```jsx
+ * gltfViewer.on('stateChange', (state: GLTFViewerState) => {
+ *  // 事件：模型状态变化
+ * })
+ * gltfViewer.on('willLoad', () => {
+ *  // 即将加载
+ * })
+ * gltfViewer.on('progressing', (progressing: number) => {
+ *  // 加载进度
+ * })
+ * gltfViewer.on('loaded', (gltf: GLTF) => {
+ *  // 加载完成
+ * })
+ * gltfViewer.on('loadError', (error) => {
+ *  // 加载异常
+ * })
+ * ```
+ *
+ * React 组件：
+ *
+ * ```jsx
+ * import { GLTFView } from '@realsee/dnalogel/components/GLTFView'
+ *
+ * <GLTFView
+ *  url="//vrlab-static.ljcdn.com/release/web/demo.435f5fa2.glb"
+ *  ref={(gltfViewer) => gltfViewer.on('stateChange', (state) => console.log(state))} />
+ * ```
+ *
+ * ### 动画
+ *
+ * `GLTFViewer` 默认不提供动画实现，但是你可以配合 [TWEEN.js](http://tweenjs.github.io/tween.js/docs/user_guide.html) 通过修改 `state` 来得到你想要的动画效果，比如：
+ *
+ * ```jsx
+ * import TWEEN from '@tweenjs/tween.js'
+ *
+ * function animate(time: number) {
+ *   requestAnimationFrame(animate)
+ *   TWEEN.update(time)
+ * }
+ *
+ * requestAnimationFrame(animate)
+ *
+ * const tween = new TWEEN.Tween({ fov: 35, longitude: 0, latitude: -0.3 })
+ *  .to({fov: 60, latitude: -1.1496852156837822, longitude: 2.4468501085409855 }, 2000 )
+ *  .easing(TWEEN.Easing.Quadratic.Out)
+ *  .onUpdate((newState) => gltfViewer.state = newState)
+ *  .start()
+ *
+ * ```
+ *
+ * ### 光照配置
+ *
+ * ```ts
+ * pointLight?: THREE.PointLight | false
+ * directionalLight?: THREE.DirectionalLight | false
+ * ambientLight?: THREE.AmbientLight | false
+ * ```
+ * 自带三种默认光照配置，你可以提供自己的光照实例。如果设置 `pointLight: false` 则禁用该光照效果。
+ *
+ */
+export declare const GLTFView: React.FC<GLTFViewPropTypes>;
+export default GLTFView;

package/components/GLTFView/index.js

@@ -0,0 +1,181 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.GLTFView = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _gltfViewer = require("../../libs/gltf-viewer");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/**
+ * **GLTFViewer** 预览 `glTF` 模型文件（支持.gltf和.glb格式），附带光照等效果。
+ *
+ * ### Usage
+ *
+ * 基础用法：
+ *
+ * ```jsx
+ * import { GLTFViewer } from '@realsee/dnalogel/libs/gltf-viewer'
+ *
+ * // 创建实例
+ * const gltfViewer = new GLTFViewer({
+ *  pixelRatio: 1,
+ * })
+ *
+ * // 挂载至 DOM 节点
+ * gltfViewer.appendTo(ref.current)
+ *
+ * // 加载模型文件
+ * await gltfViewer.load(glbCDNUrl)
+ *
+ * // 输出当前模型状态数据
+ * console.log(gltfViewer.state)
+ * // { longitude: 0, latitude: -0.3, fov: 35 }
+ *
+ * // 设置当前模型状态：直接给状态对象赋值（立即生效）
+ * gltfViewer.state = { longitude: 0, latitude: -0.3, fov: 35 }
+ *
+ * // 设置当前模型状态：直接给状态对象单个属性赋值（立即生效）
+ * gltfViewer.state.fov = 50
+ *
+ * ```
+ *
+ * 事件监听：
+ *
+ * ```jsx
+ * gltfViewer.on('stateChange', (state: GLTFViewerState) => {
+ *  // 事件：模型状态变化
+ * })
+ * gltfViewer.on('willLoad', () => {
+ *  // 即将加载
+ * })
+ * gltfViewer.on('progressing', (progressing: number) => {
+ *  // 加载进度
+ * })
+ * gltfViewer.on('loaded', (gltf: GLTF) => {
+ *  // 加载完成
+ * })
+ * gltfViewer.on('loadError', (error) => {
+ *  // 加载异常
+ * })
+ * ```
+ *
+ * React 组件：
+ *
+ * ```jsx
+ * import { GLTFView } from '@realsee/dnalogel/components/GLTFView'
+ *
+ * <GLTFView
+ *  url="//vrlab-static.ljcdn.com/release/web/demo.435f5fa2.glb"
+ *  ref={(gltfViewer) => gltfViewer.on('stateChange', (state) => console.log(state))} />
+ * ```
+ *
+ * ### 动画
+ *
+ * `GLTFViewer` 默认不提供动画实现，但是你可以配合 [TWEEN.js](http://tweenjs.github.io/tween.js/docs/user_guide.html) 通过修改 `state` 来得到你想要的动画效果，比如：
+ *
+ * ```jsx
+ * import TWEEN from '@tweenjs/tween.js'
+ *
+ * function animate(time: number) {
+ *   requestAnimationFrame(animate)
+ *   TWEEN.update(time)
+ * }
+ *
+ * requestAnimationFrame(animate)
+ *
+ * const tween = new TWEEN.Tween({ fov: 35, longitude: 0, latitude: -0.3 })
+ *  .to({fov: 60, latitude: -1.1496852156837822, longitude: 2.4468501085409855 }, 2000 )
+ *  .easing(TWEEN.Easing.Quadratic.Out)
+ *  .onUpdate((newState) => gltfViewer.state = newState)
+ *  .start()
+ *
+ * ```
+ *
+ * ### 光照配置
+ *
+ * ```ts
+ * pointLight?: THREE.PointLight | false
+ * directionalLight?: THREE.DirectionalLight | false
+ * ambientLight?: THREE.AmbientLight | false
+ * ```
+ * 自带三种默认光照配置，你可以提供自己的光照实例。如果设置 `pointLight: false` 则禁用该光照效果。
+ *
+ */
+var GLTFView = function GLTFView(props) {
+  var ref = React.useRef(null);
+  React.useEffect(function () {
+    if (!ref.current) return;
+    var gltfViewer = new _gltfViewer.GLTFViewer(props);
+    gltfViewer.appendTo(ref.current);
+
+    var callback = /*#__PURE__*/function () {
+      var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
+        return _regenerator["default"].wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                _context.next = 2;
+                return gltfViewer.load(props.url);
+
+              case 2:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee);
+      }));
+
+      return function callback() {
+        return _ref.apply(this, arguments);
+      };
+    }();
+
+    callback(); // 实例
+
+    if (props.refs) {
+      props.refs(gltfViewer);
+    }
+
+    return function () {
+      gltfViewer.dispose();
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement("div", {
+    className: 'GLTFView ' + (props.className || ''),
+    ref: ref
+  });
+};
+
+exports.GLTFView = GLTFView;
+GLTFView.defaultProps = {};
+var _default = GLTFView;
+exports["default"] = _default;

package/components/GlassFilters/index.js

@@ -1,6 +1,20 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -8,6 +22,16 @@ Object.defineProperty(exports, "__esModule", {
 exports.GlassFilters = GlassFilters;
 exports["default"] = void 0;
 
+require("core-js/modules/es.array.reduce.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.array.includes.js");
+
+require("core-js/modules/es.array.concat.js");
+
 var React = _interopRequireWildcard(require("react"));
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

package/components/ModelView/ModelViewController.js

@@ -1,38 +1,54 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
 
-var THREE = _interopRequireWildcard(require("three"));
+require("core-js/modules/es.array.concat.js");
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+require("core-js/modules/es.array.for-each.js");
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+require("core-js/modules/web.dom-collections.for-each.js");
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-var ModelViewController = function ModelViewController() {
-  var _this = this;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-  _classCallCheck(this, ModelViewController);
-
-  _defineProperty(this, "needsRender", true);
-
-  _defineProperty(this, "scene", new THREE.Scene());
+var THREE = _interopRequireWildcard(require("three"));
 
-  _defineProperty(this, "camera", new THREE.PerspectiveCamera(60, 1, 0.1, 1000));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-  _defineProperty(this, "model", new THREE.Object3D());
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-  _defineProperty(this, "renderer", null);
+var ModelViewController = function ModelViewController() {
+  var _this = this;
 
-  _defineProperty(this, "initRendererIfNeeds", function () {
+  (0, _classCallCheck2["default"])(this, ModelViewController);
+  (0, _defineProperty2["default"])(this, "needsRender", true);
+  (0, _defineProperty2["default"])(this, "scene", new THREE.Scene());
+  (0, _defineProperty2["default"])(this, "camera", new THREE.PerspectiveCamera(60, 1, 0.1, 1000));
+  (0, _defineProperty2["default"])(this, "model", new THREE.Object3D());
+  (0, _defineProperty2["default"])(this, "renderer", null);
+  (0, _defineProperty2["default"])(this, "initRendererIfNeeds", function () {
     if (!_this.renderer) {
       _this.renderer = new THREE.WebGLRenderer({
         antialias: false,
@@ -46,8 +62,7 @@ var ModelViewController = function ModelViewController() {
 
     return _this.renderer;
   });
-
-  _defineProperty(this, "modelWillLoad", function () {
+  (0, _defineProperty2["default"])(this, "modelWillLoad", function () {
     _this.model.traverse(function (object) {
       if (object instanceof THREE.Mesh) {
         var materials = [].concat(object.material);
@@ -65,8 +80,7 @@ var ModelViewController = function ModelViewController() {
 
     _this.update();
   });
-
-  _defineProperty(this, "refresh", function () {
+  (0, _defineProperty2["default"])(this, "refresh", function () {
     var size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     if (!_this.renderer) return;
     var element = _this.renderer.domElement;
@@ -88,8 +102,7 @@ var ModelViewController = function ModelViewController() {
 
     _this.needsRender = true;
   });
-
-  _defineProperty(this, "cameraDistance", function () {// const bounding = five.model.bounding
+  (0, _defineProperty2["default"])(this, "cameraDistance", function () {// const bounding = five.model.bounding
     // const { fov, aspect } = this.camera
     // const radius = Math.pow(
     //   Math.pow(bounding.max.x - bounding.min.x + 2, 2) +
@@ -102,8 +115,7 @@ var ModelViewController = function ModelViewController() {
     // if (aspect < 1) distance = distance / aspect
     // return isNaN(distance) ? radius : distance
   });
-
-  _defineProperty(this, "update", function () {// const { longitude } = five.getLongitudeAndLatitude()
+  (0, _defineProperty2["default"])(this, "update", function () {// const { longitude } = five.getLongitudeAndLatitude()
     // const latitude = Math.PI / 4
     // const distance = cameraDistance()
     // const lookAt = five.model.bounding.getCenter(new THREE.Vector3())
@@ -116,8 +128,7 @@ var ModelViewController = function ModelViewController() {
     // camera.lookAt(lookAt)
     // needsRender = true
   });
-
-  _defineProperty(this, "render", function () {// if (needsRender !== true) return
+  (0, _defineProperty2["default"])(this, "render", function () {// if (needsRender !== true) return
     // if (!renderer) return
     // if (!renderer.domElement.parentNode) return
     // const parentNode = renderer.domElement.parentNode as HTMLElement
@@ -125,7 +136,6 @@ var ModelViewController = function ModelViewController() {
     // renderer.render(scene, camera)
     // needsRender = false
   });
-
   {
     var light = new THREE.DirectionalLight(0xffffff, 0.1);
     light.position.copy(new THREE.Vector3(1, 1, 1));

package/components/ModelView/index.js

@@ -1,5 +1,9 @@
 "use strict";
 
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -7,8 +11,6 @@ exports["default"] = ModelView;
 
 var _react = _interopRequireDefault(require("react"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 /**
  * 户型雷达图
  *

package/components/PaintBrush/index.js

@@ -1,6 +1,20 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
   value: true

package/components/PanoTag/index.js

@@ -1,5 +1,7 @@
 "use strict";
 
+require("core-js/modules/es.object.define-property.js");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });

package/data/1aGKl9JmrlXMXx8d.js

@@ -1,5 +1,7 @@
 "use strict";
 
+require("core-js/modules/es.object.define-property.js");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });

package/data/54djM0oR6ky3Ey8e.d.ts

@@ -0,0 +1,55 @@
+export declare const work: {
+    _signature: string;
+    allow_hosts: string[];
+    base_url: string;
+    certificate: string;
+    create_time: string;
+    expire_at: string;
+    initial: {
+        flag_position: number[];
+        fov: number;
+        heading: number;
+        latitude: number;
+        longitude: number;
+        pano: number;
+        pano_index: number;
+    };
+    model: {
+        file_url: string;
+        material_base_url: string;
+        material_textures: string[];
+        modify_time: string;
+        type: number;
+    };
+    observers: {
+        accessible_nodes: number[];
+        floor_index: number;
+        index: number;
+        offset_point_count: number;
+        position: number[];
+        quaternion: {
+            w: number;
+            x: number;
+            y: number;
+            z: number;
+        };
+        standing_position: number[];
+        visible_nodes: number[];
+    }[];
+    panorama: {
+        count: number;
+        list: {
+            back: string;
+            down: string;
+            front: string;
+            index: number;
+            left: string;
+            right: string;
+            up: string;
+        }[];
+    };
+    picture_url: string;
+    title_picture_url: string;
+    vr_code: string;
+    vr_type: string;
+};