turbograft 0.4.8 → 0.5.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: fba255993ff4ba3b193a70109a4635ebe5c672b2baa82e788f9e94f8d1d79fe5
-  data.tar.gz: 024e4089a512cfcaf3f3c1233eb58a44535f67be2a99257f7575c7880861fac5
+  metadata.gz: be4f37c2b602a9900e822397af3c01ed23d1467bc2571728824b7b7c5737b126
+  data.tar.gz: e3ea401831228506abb4d2c51dec872095f1a06c3ced6c8550a4a4d5950a4dd3
 SHA512:
-  metadata.gz: e638743501bff1821d16afca2ee426081e85ff70d69b15647568c6fe2a766b089ee85f43d7138a60afe1cad2a235cdfeb25afb04c7d6dac92a42767bc125eb35
-  data.tar.gz: f6a539ce14d10aefb28f500a2e9834a8a888851762ffa143667a6c1bc54a22948609c6498a7f611ab3208065e3e7680370de41f9ad79e038177f4a54de1a0c8b
+  metadata.gz: 7f637bf121bde59d9fb009595a588b6b520bf1128cd4beab8b94c28ab2196485cdeb0805290b21ab79ec6ad641c4a8ff95e20f88a9833eea051361257fe38f49
+  data.tar.gz: f852bf2519485f847f3f45b1f475f15296bab053b4369da8b8a503d0cc2c7884484b6030cc7a27ebc9cde4dbb4753e0c20dfb16643298a683341a40d0b945700

data/README.md

@@ -20,7 +20,7 @@ Turbograft was built with simplicity in mind. It intends to offer the smallest a
 
 ## Status
 [![Gem Version](https://badge.fury.io/rb/turbograft.svg)](http://badge.fury.io/rb/turbograft)
-[![Build Status](https://travis-ci.org/Shopify/turbograft.svg?branch=master)](http://travis-ci.org/Shopify/turbograft)
+[![Build](https://github.com/Shopify/turbograft/actions/workflows/build.yml/badge.svg)](https://github.com/Shopify/turbograft/actions/workflows/build.yml)
 
 ## Installation
 
@@ -189,9 +189,10 @@ There is an example app that you can boot to play with TurboGraft.  Open the con
 
 When turbograft replaces or removes a node it uses native DOM API to do so. If any objects use jQuery to listen to events on a node then these objects will leak when the node is replaced because jQuery will still have references to it. To clean these up you'll need to tell jQuery that they're removed. This can be done with something like:
 
-```coffeescript
-document.addEventListener 'page:after-node-removed', (event) ->
-  $(event.data).remove()
+```js
+document.addEventListener('page:after-node-removed', function(event) {
+  $(event.data).remove();
+});
 ```
 
 ## Contributing

data/lib/assets/javascripts/turbograft/click.js

@@ -0,0 +1,44 @@
+// The Click class handles clicked links, verifying if Turbolinks should
+// take control by inspecting both the event and the link. If it should,
+// the page change process is initiated. If not, control is passed back
+// to the browser for default functionality.
+window.Click = class Click {
+  static installHandlerLast(event) {
+    if (!event.defaultPrevented) {
+      document.removeEventListener('click', Click.handle, false);
+      document.addEventListener('click', Click.handle, false);
+    }
+  }
+
+  static handle(event) {
+    return new Click(event);
+  }
+
+  constructor(event) {
+    this.event = event;
+    if (this.event.defaultPrevented) { return; }
+    this._extractLink();
+    if (this._validForTurbolinks()) {
+      Turbolinks.visit(this.link.href);
+      this.event.preventDefault();
+    }
+  }
+
+  _extractLink() {
+    let link = this.event.target;
+    while (!!link.parentNode && (link.nodeName !== 'A')) { link = link.parentNode; }
+    if ((link.nodeName === 'A') && (link.href.length !== 0)) { this.link = new Link(link); }
+  }
+
+  _validForTurbolinks() {
+    return (this.link != null) && !this.link.shouldIgnore() && !this._nonStandardClick();
+  }
+
+  _nonStandardClick() {
+    return (this.event.which > 1) ||
+      this.event.metaKey ||
+      this.event.ctrlKey ||
+      this.event.shiftKey ||
+      this.event.altKey;
+  }
+};

data/lib/assets/javascripts/turbograft/component_url.js

@@ -0,0 +1,53 @@
+/* The ComponentUrl class converts a basic URL string into an object
+ * that behaves similarly to document.location.
+ *
+ * If an instance is created from a relative URL, the current document
+ * is used to fill in the missing attributes (protocol, host, port).
+ */
+window.ComponentUrl = class ComponentUrl {
+  constructor(original, link) {
+    if (original == null) {
+      original = document.location.href;
+    }
+    if (link == null) {
+      link = document.createElement('a');
+    }
+    if (original.constructor === ComponentUrl) {
+      return original;
+    }
+    this.original = original;
+    this.link = link;
+    this._parse();
+  }
+
+  withoutHash() {
+    return this.href.replace(this.hash, '');
+  };
+
+  // Intention revealing function alias
+  withoutHashForIE10compatibility() {
+    return this.withoutHash();
+  };
+
+  hasNoHash() {
+    return this.hash.length === 0;
+  };
+
+  _parse() {
+    this.link.href = this.original;
+    this.href = this.link.href;
+    this.protocol = this.link.protocol;
+    this.host = this.link.host;
+    this.hostname = this.link.hostname
+    this.port = this.link.port;
+    this.pathname = this.link.pathname;
+    this.search = this.link.search;
+    this.hash = this.link.hash;
+    this.origin = [this.protocol, '//', this.hostname].join('');
+    if (this.port.length !== 0) {
+      this.origin += ":" + this.port;
+    }
+    this.relative = [this.pathname, this.search, this.hash].join('');
+    return this.absolute = this.href;
+  };
+};

data/lib/assets/javascripts/turbograft/csrf_token.js

@@ -0,0 +1,23 @@
+window.CSRFToken = class CSRFToken {
+  static get(doc) {
+    if (!doc) { doc = document; }
+    const tag = doc.querySelector('meta[name="csrf-token"]');
+
+    const object = {
+      node: tag
+    };
+
+    if (tag) {
+      object.token = tag.getAttribute('content');
+    }
+
+    return object;
+  }
+
+  static update(latest) {
+    const current = this.get();
+    if ((current.token != null) && (latest != null) && (current.token !== latest)) {
+      current.node.setAttribute('content', latest);
+    }
+  }
+};

data/lib/assets/javascripts/turbograft/document.js

@@ -0,0 +1,20 @@
+/*
+ * decaffeinate suggestions:
+ * DS102: Remove unnecessary code created because of implicit returns
+ * Full docs: https://github.com/decaffeinate/decaffeinate/blob/main/docs/suggestions.md
+ */
+TurboGraft.Document = {
+  create(html) {
+    let doc;
+    if (/<(html|body)/i.test(html)) {
+      doc = document.documentElement.cloneNode();
+      doc.innerHTML = html;
+    } else {
+      doc = document.documentElement.cloneNode(true);
+      doc.querySelector('body').innerHTML = html;
+    }
+    doc.head = doc.querySelector('head');
+    doc.body = doc.querySelector('body');
+    return doc;
+  }
+};

data/lib/assets/javascripts/turbograft/initializers.js

@@ -0,0 +1,83 @@
+/*
+ * decaffeinate suggestions:
+ * DS102: Remove unnecessary code created because of implicit returns
+ * DS207: Consider shorter variations of null checks
+ * Full docs: https://github.com/decaffeinate/decaffeinate/blob/main/docs/suggestions.md
+ */
+const hasClass = (node, search) => node.classList.contains(search);
+
+const nodeIsDisabled = node => node.getAttribute('disabled') || hasClass(node, 'disabled');
+
+const setupRemoteFromTarget = function(target, httpRequestType, form = null) {
+  const httpUrl = target.getAttribute('href') || target.getAttribute('action');
+
+  if (!httpUrl) { throw new Error(`Turbograft developer error: You did not provide a URL ('${urlAttribute}' attribute) for data-tg-remote`); }
+
+  if (TurboGraft.getTGAttribute(target, "remote-once")) {
+    TurboGraft.removeTGAttribute(target, "remote-once");
+    TurboGraft.removeTGAttribute(target, "tg-remote");
+  }
+
+  const options = {
+    httpRequestType,
+    httpUrl,
+    fullRefresh: (TurboGraft.getTGAttribute(target, 'full-refresh') != null),
+    refreshOnSuccess: TurboGraft.getTGAttribute(target, 'refresh-on-success'),
+    refreshOnSuccessExcept: TurboGraft.getTGAttribute(target, 'full-refresh-on-success-except'),
+    refreshOnError: TurboGraft.getTGAttribute(target, 'refresh-on-error'),
+    refreshOnErrorExcept: TurboGraft.getTGAttribute(target, 'full-refresh-on-error-except')
+  };
+
+  return new TurboGraft.Remote(options, form, target);
+};
+
+TurboGraft.handlers.remoteMethodHandler = function(ev) {
+  const target = ev.clickTarget;
+  const httpRequestType = TurboGraft.getTGAttribute(target, 'tg-remote');
+
+  if (!httpRequestType) { return; }
+  ev.preventDefault();
+
+  const remote = setupRemoteFromTarget(target, httpRequestType);
+  remote.submit();
+};
+
+TurboGraft.handlers.remoteFormHandler = function(ev) {
+  const {
+    target
+  } = ev;
+  const method = target.getAttribute('method');
+
+  if (!TurboGraft.hasTGAttribute(target, 'tg-remote')) { return; }
+  ev.preventDefault();
+
+  const remote = setupRemoteFromTarget(target, method, target);
+  remote.submit();
+};
+
+const documentListenerForButtons = function(eventType, handler, useCapture) {
+  if (useCapture == null) { useCapture = false; }
+  return document.addEventListener(eventType, function(ev) {
+    let {
+      target
+    } = ev;
+
+    while ((target !== document) && (target != null)) {
+      if ((target.nodeName === "A") || (target.nodeName === "BUTTON")) {
+        var isNodeDisabled = nodeIsDisabled(target);
+        if (isNodeDisabled) { ev.preventDefault(); }
+        if (!isNodeDisabled) {
+          ev.clickTarget = target;
+          handler(ev);
+          return;
+        }
+      }
+
+      target = target.parentNode;
+    }
+  });
+};
+
+documentListenerForButtons('click', TurboGraft.handlers.remoteMethodHandler, true);
+
+document.addEventListener("submit", ev => TurboGraft.handlers.remoteFormHandler(ev));

data/lib/assets/javascripts/turbograft/link.js

@@ -0,0 +1,58 @@
+/* The Link class derives from the ComponentUrl class, but is built from an
+* existing link element.  Provides verification functionality for Turbolinks
+* to use in determining whether it should process the link when clicked.
+*/
+window.Link = class Link extends ComponentUrl {
+    static initClass() {
+      this.HTML_EXTENSIONS = ['html'];
+    }
+
+    static allowExtensions() {
+      var extension, extensions, i, len;
+      extensions = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
+      for (i = 0, len = extensions.length; i < len; i++) {
+        extension = extensions[i];
+        Link.HTML_EXTENSIONS.push(extension);
+      }
+      return Link.HTML_EXTENSIONS;
+    };
+
+    constructor(link) {
+      if (link.constructor === Link) {
+        return link;
+      }
+      super(link.href, link);
+    }
+
+    shouldIgnore() {
+      return this._crossOrigin() || this._anchored() || this._nonHtml() || this._optOut() || this._target();
+    };
+
+    _crossOrigin() {
+      return this.origin !== (new ComponentUrl).origin;
+    };
+
+    _anchored() {
+      var current;
+      return ((this.hash && this.withoutHash()) === (current = new ComponentUrl).withoutHash()) || (this.href === current.href + '#');
+    };
+
+    _nonHtml() {
+      return this.pathname.match(/\.[a-z]+$/g) && !this.pathname.match(new RegExp("\\.(?:" + (Link.HTML_EXTENSIONS.join('|')) + ")?$", 'g'));
+    };
+
+    _optOut() {
+      var ignore, link;
+      link = this.link;
+      while (!(ignore || link === document || link === null)) {
+        ignore = link.getAttribute('data-no-turbolink') != null;
+        link = link.parentNode;
+      }
+      return ignore;
+    };
+
+    _target() {
+      return this.link.target.length !== 0;
+    };
+};
+window.Link.initClass();

data/lib/assets/javascripts/turbograft/page.js

@@ -0,0 +1,105 @@
+/*
+ * decaffeinate suggestions:
+ * DS101: Remove unnecessary use of Array.from
+ * DS102: Remove unnecessary code created because of implicit returns
+ * DS205: Consider reworking code to avoid use of IIFEs
+ * DS207: Consider shorter variations of null checks
+ * Full docs: https://github.com/decaffeinate/decaffeinate/blob/main/docs/suggestions.md
+ */
+if (!window.Page) { window.Page = {}; }
+
+Page.visit = function(url, opts) {
+  if (opts == null) { opts = {}; }
+  if (opts.reload) {
+    return window.location = url;
+  } else {
+    return Turbolinks.visit(url);
+  }
+};
+
+Page.refresh = function(options, callback) {
+  let xhr;
+  if (options == null) { options = {}; }
+  const newUrl = (() => {
+    if (options.url) {
+    return options.url;
+  } else if (options.queryParams) {
+    let paramString = $.param(options.queryParams);
+    if (paramString) { paramString = `?${paramString}`; }
+    return location.pathname + paramString;
+  } else {
+    return location.href;
+  }
+  })();
+
+  const turboOptions = {
+    partialReplace: true,
+    exceptKeys: options.exceptKeys,
+    onlyKeys: options.onlyKeys,
+    updatePushState: options.updatePushState,
+    callback
+  };
+
+  if ((xhr = options.response)) {
+    return Turbolinks.loadPage(null, xhr, turboOptions);
+  } else {
+    return Turbolinks.visit(newUrl, turboOptions);
+  }
+};
+
+Page.open = function() {
+  return window.open(...arguments);
+};
+
+// Providing hooks for objects to set up destructors:
+let onReplaceCallbacks = [];
+
+// e.g., Page.onReplace(node, unbindListenersFnc)
+// unbindListenersFnc will be called if the node in question is partially replaced
+// or if a full replace occurs.  It will be called only once
+Page.onReplace = function(node, callback) {
+  if (!node || !callback) { throw new Error("Page.onReplace: Node and callback must both be specified"); }
+  if (!isFunction(callback)) { throw new Error("Page.onReplace: Callback must be a function"); }
+  return onReplaceCallbacks.push({node, callback});
+};
+
+// option C from http://jsperf.com/alternative-isfunction-implementations
+var isFunction = object => !!(object && object.constructor && object.call && object.apply);
+
+// roughly based on http://davidwalsh.name/check-parent-node (note, OP is incorrect)
+const contains = function(parentNode, childNode) {
+  if (parentNode.contains) {
+    return parentNode.contains(childNode);
+  } else { // old browser compatability
+    return !!((parentNode === childNode) || (parentNode.compareDocumentPosition(childNode) & Node.DOCUMENT_POSITION_CONTAINED_BY));
+  }
+};
+
+document.addEventListener('page:before-partial-replace', function(event) {
+  const replacedNodes = event.data;
+
+  const unprocessedOnReplaceCallbacks = [];
+  for (var entry of Array.from(onReplaceCallbacks)) {
+    var fired = false;
+    for (var replacedNode of Array.from(replacedNodes)) {
+      if (contains(replacedNode, entry.node)) {
+        entry.callback();
+        fired = true;
+        break;
+      }
+    }
+
+    if (!fired) {
+      unprocessedOnReplaceCallbacks.push(entry);
+    }
+  }
+
+  return onReplaceCallbacks = unprocessedOnReplaceCallbacks;
+});
+
+document.addEventListener('page:before-replace', function(event) {
+  for (var entry of Array.from(onReplaceCallbacks)) {
+    entry.callback();
+  }
+  return onReplaceCallbacks = [];
+});

data/lib/assets/javascripts/turbograft/remote.js

@@ -0,0 +1,248 @@
+/*
+ * decaffeinate suggestions:
+ * DS101: Remove unnecessary use of Array.from
+ * DS102: Remove unnecessary code created because of implicit returns
+ * DS205: Consider reworking code to avoid use of IIFEs
+ * DS207: Consider shorter variations of null checks
+ * Full docs: https://github.com/decaffeinate/decaffeinate/blob/main/docs/suggestions.md
+ */
+TurboGraft.Remote = class Remote {
+  constructor(opts, form, target) {
+
+    this.onSuccess = this.onSuccess.bind(this);
+    this.onError = this.onError.bind(this);
+    this.opts = opts;
+    this.initiator = form || target;
+
+    this.actualRequestType = (this.opts.httpRequestType != null ? this.opts.httpRequestType.toLowerCase() : undefined) === 'get' ? 'GET' : 'POST';
+    this.useNativeEncoding = this.opts.useNativeEncoding;
+
+    this.formData = this.createPayload(form);
+
+    if (this.opts.refreshOnSuccess) { this.refreshOnSuccess       = this.opts.refreshOnSuccess.split(" "); }
+    if (this.opts.refreshOnSuccessExcept) { this.refreshOnSuccessExcept = this.opts.refreshOnSuccessExcept.split(" "); }
+    if (this.opts.refreshOnError) { this.refreshOnError         = this.opts.refreshOnError.split(" "); }
+    if (this.opts.refreshOnErrorExcept) { this.refreshOnErrorExcept   = this.opts.refreshOnErrorExcept.split(" "); }
+
+    const xhr = new XMLHttpRequest;
+    if (this.actualRequestType === 'GET') {
+      const url = this.formData ? this.opts.httpUrl + `?${this.formData}` : this.opts.httpUrl;
+      xhr.open(this.actualRequestType, url, true);
+    } else {
+      xhr.open(this.actualRequestType, this.opts.httpUrl, true);
+    }
+    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+    xhr.setRequestHeader('Accept', 'text/html, application/xhtml+xml, application/xml');
+    if (this.contentType) { xhr.setRequestHeader("Content-Type", this.contentType); }
+    xhr.setRequestHeader('X-XHR-Referer', document.location.href);
+
+    const csrfToken = CSRFToken.get().token;
+    if (csrfToken) { xhr.setRequestHeader('X-CSRF-Token', csrfToken); }
+
+    triggerEventFor('turbograft:remote:init', this.initiator, {xhr, initiator: this.initiator});
+
+    xhr.addEventListener('loadstart', () => {
+      return triggerEventFor('turbograft:remote:start', this.initiator,
+        {xhr});
+    });
+
+    xhr.addEventListener('error', this.onError);
+    xhr.addEventListener('load', event => {
+      if (xhr.status < 400) {
+        return this.onSuccess(event);
+      } else {
+        return this.onError(event);
+      }
+    });
+
+    xhr.addEventListener('loadend', () => {
+      if (typeof this.opts.done === 'function') {
+        this.opts.done();
+      }
+      return triggerEventFor('turbograft:remote:always', this.initiator, {
+        initiator: this.initiator,
+        xhr
+      }
+      );
+    });
+
+    this.xhr = xhr;
+  }
+
+  submit() {
+    return this.xhr.send(this.formData);
+  }
+
+  createPayload(form) {
+    let formData;
+    if (form) {
+      if (this.useNativeEncoding || (form.querySelectorAll("[type='file'][name]").length > 0)) {
+        formData = this.nativeEncodeForm(form);
+      } else { // for much smaller payloads
+        formData = this.uriEncodeForm(form);
+      }
+    } else {
+      formData = '';
+    }
+
+    if (!(formData instanceof FormData)) {
+      this.contentType = "application/x-www-form-urlencoded; charset=UTF-8";
+      if ((formData.indexOf("_method") === -1) && this.opts.httpRequestType && (this.actualRequestType !== 'GET')) { formData = this.formAppend(formData, "_method", this.opts.httpRequestType); }
+    }
+
+    return formData;
+  }
+
+  formAppend(uriEncoded, key, value) {
+    if (uriEncoded.length) { uriEncoded += "&"; }
+    return uriEncoded += `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;
+  }
+
+  uriEncodeForm(form) {
+    let formData = "";
+    this._iterateOverFormInputs(form, input => {
+      return formData = this.formAppend(formData, input.name, input.value);
+    });
+    return formData;
+  }
+
+  formDataAppend(formData, input) {
+    if (input.type === 'file') {
+      for (var file of Array.from(input.files)) {
+        formData.append(input.name, file);
+      }
+    } else {
+      formData.append(input.name, input.value);
+    }
+    return formData;
+  }
+
+  nativeEncodeForm(form) {
+    let formData = new FormData;
+    this._iterateOverFormInputs(form, input => {
+      return formData = this.formDataAppend(formData, input);
+    });
+    return formData;
+  }
+
+  _iterateOverFormInputs(form, callback) {
+    const inputs = this._enabledInputs(form);
+    return (() => {
+      const result = [];
+      for (var input of Array.from(inputs)) {
+        var inputEnabled = !input.disabled;
+        var radioOrCheck = ((input.type === 'checkbox') || (input.type === 'radio'));
+
+        if (inputEnabled && input.name) {
+          if ((radioOrCheck && input.checked) || !radioOrCheck) {
+            result.push(callback(input));
+          } else {
+            result.push(undefined);
+          }
+        } else {
+          result.push(undefined);
+        }
+      }
+      return result;
+    })();
+  }
+
+  _enabledInputs(form) {
+    const selector = "input:not([type='reset']):not([type='button']):not([type='submit']):not([type='image']), select, textarea";
+    const inputs = Array.prototype.slice.call(form.querySelectorAll(selector));
+    const disabledNodes = Array.prototype.slice.call(TurboGraft.querySelectorAllTGAttribute(form, 'tg-remote-noserialize'));
+
+    if (!disabledNodes.length) { return inputs; }
+
+    let disabledInputs = disabledNodes;
+    for (var node of Array.from(disabledNodes)) {
+      disabledInputs = disabledInputs.concat(Array.prototype.slice.call(node.querySelectorAll(selector)));
+    }
+
+    const enabledInputs = [];
+    for (var input of Array.from(inputs)) {
+      if (disabledInputs.indexOf(input) < 0) {
+        enabledInputs.push(input);
+      }
+    }
+    return enabledInputs;
+  }
+
+  onSuccess(ev) {
+    let redirect;
+    if (typeof this.opts.success === 'function') {
+      this.opts.success();
+    }
+
+    const xhr = ev.target;
+    triggerEventFor('turbograft:remote:success', this.initiator, {
+      initiator: this.initiator,
+      xhr
+    }
+    );
+
+    if (redirect = xhr.getResponseHeader('X-Next-Redirect')) {
+      Page.visit(redirect, {reload: true});
+      return;
+    }
+
+    if (!TurboGraft.hasTGAttribute(this.initiator, 'tg-remote-norefresh')) {
+      if (this.opts.fullRefresh && this.refreshOnSuccess) {
+        return Page.refresh({onlyKeys: this.refreshOnSuccess});
+      } else if (this.opts.fullRefresh) {
+        return Page.refresh();
+      } else if (this.refreshOnSuccess) {
+        return Page.refresh({
+          response: xhr,
+          onlyKeys: this.refreshOnSuccess
+        });
+      } else if (this.refreshOnSuccessExcept) {
+        return Page.refresh({
+          response: xhr,
+          exceptKeys: this.refreshOnSuccessExcept
+        });
+      } else {
+        return Page.refresh({
+          response: xhr
+        });
+      }
+    }
+  }
+
+  onError(ev) {
+    if (typeof this.opts.fail === 'function') {
+      this.opts.fail();
+    }
+
+    const xhr = ev.target;
+    triggerEventFor('turbograft:remote:fail', this.initiator, {
+      initiator: this.initiator,
+      xhr
+    }
+    );
+
+    if (TurboGraft.hasTGAttribute(this.initiator, 'tg-remote-norefresh')) {
+      return triggerEventFor('turbograft:remote:fail:unhandled', this.initiator,
+        {xhr});
+    } else {
+      if (this.opts.fullRefresh && this.refreshOnError) {
+        return Page.refresh({onlyKeys: this.refreshOnError});
+      } else if (this.opts.fullRefresh) {
+        return Page.refresh();
+      } else if (this.refreshOnError) {
+        return Page.refresh({
+          response: xhr,
+          onlyKeys: this.refreshOnError
+        });
+      } else if (this.refreshOnErrorExcept) {
+        return Page.refresh({
+          response: xhr,
+          exceptKeys: this.refreshOnErrorExcept
+        });
+      } else {
+        return triggerEventFor('turbograft:remote:fail:unhandled', this.initiator,
+          {xhr});
+      }
+    }
+  }
+};