@venite/components 0.16.7 → 0.16.13

package/dist/collection/components/liturgical-document/liturgical-document.js

@@ -0,0 +1,465 @@
+import { Component, Prop, Watch, State, Host, Listen, Event, Element, h } from '@stencil/core';
+import { LiturgicalDocument, Responsive } from '@venite/ldf';
+import { getComponentClosestLanguage } from '../../utils/locale';
+import EN from './liturgical-document.i18n.en.json';
+const LOCALE = {
+  'en': EN
+};
+import { ConditionNode } from './condition-node';
+import { LookupNode } from './lookup-node';
+export class LiturgicalDocumentComponent {
+  constructor() {
+    this.hasFocus = false;
+    this.buttonsSelected = false;
+    this.interrupt = false;
+    /** Type of the parent `LiturgicalDocument`, if any */
+    this.parentType = null;
+    /** Documents in `preview` mode will display as if they're not editable, unless the user explicitly chooses to edit them */
+    this.preview = false;
+    /** CSS padding to add around element, if any. */
+    this.padding = undefined;
+  }
+  async docChanged(newDoc) {
+    let provisionalObj;
+    try {
+      if (typeof newDoc == 'string') {
+        provisionalObj = new LiturgicalDocument(JSON.parse(newDoc));
+      }
+      else {
+        provisionalObj = new LiturgicalDocument(newDoc);
+      }
+    }
+    catch (e) {
+      console.warn(e);
+      provisionalObj = new LiturgicalDocument();
+    }
+    this.obj = provisionalObj || new LiturgicalDocument();
+  }
+  // Listeners
+  onDragOver() {
+    if (this.path !== "/") {
+      this.hasFocus = true;
+      this.focusPath.emit(this.path);
+      this.focusObj.emit({ obj: this.obj, path: this.path });
+      console.log("dragged over", this.path);
+    }
+  }
+  selectionChangeHandler(ev) {
+    var _a, _b;
+    // stop iOS from taking over 
+    ev.preventDefault();
+    // handle the selection
+    const selection = document.getSelection(), anchorNode = selection.anchorNode, citation = (_b = (_a = anchorNode === null || anchorNode === void 0 ? void 0 : anchorNode.parentElement) === null || _a === void 0 ? void 0 : _a.closest('ldf-string')) === null || _b === void 0 ? void 0 : _b.citation;
+    if (this.element.contains(anchorNode)) {
+      const text = selection.toString();
+      this.ldfSelectionChange.emit({
+        target: this.element,
+        text,
+        citation,
+        fragment: this.path
+      });
+    }
+  }
+  // Lifecycle events
+  componentWillLoad() {
+    this.loadLocaleStrings();
+    this.docChanged(this.doc);
+  }
+  /** On hover, display Add Block buttons */
+  onMouseOver() {
+    this.hasFocus = true;
+    this.focusPath.emit(this.path);
+  }
+  onMouseOut(ev) {
+    const elDiv = this.element.querySelector('div.container');
+    if (ev.relatedTarget == elDiv) {
+      setTimeout(() => {
+        this.hasFocus = false;
+        this.focusPath.emit(this.path);
+      }, 500);
+    }
+  }
+  // Firing the event during the capture phase the most specific LiturgicalDocument will
+  // be handled last, i.e., the `Liturgy` won't override subdocuments
+  onClick() {
+    this.hasFocus = true;
+    this.focusPath.emit(this.path);
+    this.focusObj.emit({ obj: this.obj, path: this.path });
+  }
+  async loadLocaleStrings() {
+    try {
+      this.localeStrings = LOCALE[getComponentClosestLanguage(this.element)];
+    }
+    catch (e) {
+      console.warn(e);
+    }
+  }
+  /** Gives a loading view, a description of the document (if editing and has a lookup), or the component of the correct type */
+  nodeFromDoc(doc, forceEditable = undefined) {
+    if (doc == undefined) {
+      return (customElements === null || customElements === void 0 ? void 0 : customElements.get('ion-skeleton-text')) ? h("ion-skeleton-text", null) : h("p", null, "...");
+    }
+    else if (this.editable || forceEditable) {
+      return this.editableNode(doc);
+    }
+    else {
+      return this.chooseComponent(doc);
+    }
+  }
+  editableNode(doc) {
+    var _a;
+    const localeStrings = this.localeStrings || {};
+    if (((_a = doc.value) === null || _a === void 0 ? void 0 : _a.length) > 0 && Boolean(doc.value[0])) {
+      if (doc.condition) {
+        return h(ConditionNode, { doc: doc, localeStrings: localeStrings }, this.chooseComponent(doc));
+      }
+      else {
+        return this.chooseComponent(doc);
+      }
+    }
+    else {
+      if (doc.condition && !doc.lookup) {
+        return h(ConditionNode, { doc: doc, localeStrings: localeStrings }, this.chooseComponent(doc));
+      }
+      else if (doc.condition && doc.lookup) {
+        return h(ConditionNode, { doc: doc, localeStrings: localeStrings },
+          h(LookupNode, { doc: doc, localeStrings: localeStrings }));
+      }
+      else if (!doc.condition && doc.lookup) {
+        return h(LookupNode, { doc: doc, localeStrings: localeStrings });
+      }
+      else if (doc.type === "bible-reading") {
+        return h(LookupNode, { doc: doc, localeStrings: localeStrings });
+      }
+      else {
+        return this.chooseComponent(doc);
+      }
+    }
+  }
+  /** Processes generic LiturgicalDocument into component of the appropriate type */
+  //@Method()
+  chooseComponent(doc) {
+    var _a, _b;
+    let node;
+    const editable = this.editable && !this.preview;
+    switch (doc === null || doc === void 0 ? void 0 : doc.type) {
+      case 'liturgy':
+        node = h("ldf-liturgy", { path: this.path, editable: editable, preview: this.preview, doc: doc });
+        break;
+      case 'heading':
+        node = h("ldf-heading", { path: this.path, editable: editable, doc: doc });
+        break;
+      case 'image':
+        node = h("ldf-image", { path: this.path, editable: editable, doc: doc });
+        break;
+      case 'meditation':
+        const color = (_b = (_a = this.obj) === null || _a === void 0 ? void 0 : _a.day) === null || _b === void 0 ? void 0 : _b.color, colorValue = (color === null || color === void 0 ? void 0 : color.hasOwnProperty('hex')) ? color.hex : color || '#3489eb';
+        node = h("ldf-meditation", { path: this.path, editable: this.editable || this.preview, doc: doc, color: colorValue });
+        break;
+      case 'option':
+        node = h("ldf-option", { path: this.path, editable: editable, preview: this.preview, doc: doc });
+        break;
+      case 'refrain':
+        node = h("ldf-refrain", { path: this.path, editable: editable, doc: doc });
+        break;
+      case 'rubric':
+        node = h("ldf-rubric", { path: this.path, editable: editable, doc: doc });
+        break;
+      case 'text':
+        node = h("ldf-text", { path: this.path, editable: editable, doc: doc });
+        break;
+      case 'responsive':
+        node = h("ldf-responsive-prayer", { path: this.path, editable: editable, doc: doc });
+        break;
+      case 'bible-reading':
+        node = h("ldf-bible-reading", { path: this.path, editable: editable, doc: doc });
+        break;
+      case 'psalm':
+        node = h("ldf-psalm", { path: this.path, editable: editable, doc: doc });
+        break;
+      default:
+        console.warn('invalid type for document', doc);
+        break;
+    }
+    return node;
+  }
+  setPreview(preview) {
+    this.preview = preview;
+    this.editable = true;
+  }
+  // Render
+  render() {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    const node = this.nodeFromDoc(this.obj);
+    return (node && h(Host, { lang: ((_a = this.obj) === null || _a === void 0 ? void 0 : _a.language) || 'en' },
+      h("div", { class: {
+          container: true,
+          editable: this.editable || this.preview,
+          "small-only": !this.editable && !this.preview && ((_b = this.obj) === null || _b === void 0 ? void 0 : _b.responsive) !== undefined && ((_c = this.obj) === null || _c === void 0 ? void 0 : _c.responsive) == Responsive.SmallOnly,
+          "small-hidden": !this.editable && !this.preview && ((_d = this.obj) === null || _d === void 0 ? void 0 : _d.responsive) !== undefined && ((_e = this.obj) === null || _e === void 0 ? void 0 : _e.responsive) == Responsive.SmallHidden,
+        } },
+        (this.editable || this.preview) && h("ldf-editable-metadata-buttons", { visible: this.hasFocus, base: this.base, index: this.index, obj: this.obj, parentType: this.parentType, preview: this.preview, onLdfTogglePreview: (e) => this.setPreview(e.detail), class: { 'top-level': ((_f = this.obj) === null || _f === void 0 ? void 0 : _f.type) === 'liturgy' || ((_g = this.obj) === null || _g === void 0 ? void 0 : _g.type) === 'option' } }),
+        (this.editable || this.preview) && (((_h = this.obj) === null || _h === void 0 ? void 0 : _h.responsive) === Responsive.SmallHidden || ((_j = this.obj) === null || _j === void 0 ? void 0 : _j.responsive) === Responsive.SmallOnly) && h("ion-chip", { class: "responsive-banner" },
+          h("ion-icon", { name: "phone-portrait-outline" }),
+          ((_k = this.obj) === null || _k === void 0 ? void 0 : _k.responsive) === Responsive.SmallOnly && h("ion-label", null, this.localeStrings.smallOnly),
+          ((_l = this.obj) === null || _l === void 0 ? void 0 : _l.responsive) === Responsive.SmallHidden && h("ion-label", null, this.localeStrings.smallHidden)),
+        h("div", { id: (this.path || '').replace(/\//g, '-'), class: {
+            doc: true,
+            editable: this.editable || this.preview
+          }, style: { padding: this.padding } }, node))));
+  }
+  static get is() { return "ldf-liturgical-document"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() { return {
+    "$": ["liturgical-document.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["liturgical-document.css"]
+  }; }
+  static get properties() { return {
+    "doc": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "LiturgicalDocument | string",
+        "resolved": "LiturgicalDocument | string",
+        "references": {
+          "LiturgicalDocument": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "An LDF LiturgicalDocument object."
+      },
+      "attribute": "doc",
+      "reflect": false
+    },
+    "path": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "A JSON Pointer that points to the LiturgicalDocument being edited"
+      },
+      "attribute": "path",
+      "reflect": true
+    },
+    "base": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "A JSON Pointer that points to the array within which the item is nested"
+      },
+      "attribute": "base",
+      "reflect": true
+    },
+    "index": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "number",
+        "resolved": "number",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Index within a larger array, if any"
+      },
+      "attribute": "index",
+      "reflect": false
+    },
+    "parentType": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "'liturgy' | 'cycle' | 'heading' | 'option' | 'refrain' | 'rubric' | 'text' | 'responsive' | 'bible-reading' | 'psalm' | 'meditation' | null",
+        "resolved": "\"bible-reading\" | \"cycle\" | \"heading\" | \"liturgy\" | \"meditation\" | \"option\" | \"psalm\" | \"refrain\" | \"responsive\" | \"rubric\" | \"text\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Type of the parent `LiturgicalDocument`, if any"
+      },
+      "attribute": "parent-type",
+      "reflect": true,
+      "defaultValue": "null"
+    },
+    "editable": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Whether the object is editable"
+      },
+      "attribute": "editable",
+      "reflect": false
+    },
+    "preview": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Documents in `preview` mode will display as if they're not editable, unless the user explicitly chooses to edit them"
+      },
+      "attribute": "preview",
+      "reflect": false,
+      "defaultValue": "false"
+    },
+    "padding": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string | undefined",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "CSS padding to add around element, if any."
+      },
+      "attribute": "padding",
+      "reflect": false,
+      "defaultValue": "undefined"
+    }
+  }; }
+  static get states() { return {
+    "obj": {},
+    "localeStrings": {},
+    "hasFocus": {}
+  }; }
+  static get events() { return [{
+      "method": "focusPath",
+      "name": "focusPath",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      }
+    }, {
+      "method": "focusObj",
+      "name": "focusObj",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "{obj: LiturgicalDocument; path: string;}",
+        "resolved": "{ obj: LiturgicalDocument; path: string; }",
+        "references": {
+          "LiturgicalDocument": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      }
+    }, {
+      "method": "ldfSelectionChange",
+      "name": "ldfSelectionChange",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "{ target: HTMLElement; text: string; citation: SelectableCitation; fragment: string; }",
+        "resolved": "{ target: HTMLElement; text: string; citation: SelectableCitation; fragment: string; }",
+        "references": {
+          "HTMLElement": {
+            "location": "global"
+          },
+          "SelectableCitation": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      }
+    }]; }
+  static get elementRef() { return "element"; }
+  static get watchers() { return [{
+      "propName": "doc",
+      "methodName": "docChanged"
+    }]; }
+  static get listeners() { return [{
+      "name": "dragover",
+      "method": "onDragOver",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }, {
+      "name": "selectionchange",
+      "method": "selectionChangeHandler",
+      "target": "document",
+      "capture": false,
+      "passive": false
+    }, {
+      "name": "mouseover",
+      "method": "onMouseOver",
+      "target": undefined,
+      "capture": true,
+      "passive": true
+    }, {
+      "name": "mouseout",
+      "method": "onMouseOut",
+      "target": undefined,
+      "capture": true,
+      "passive": true
+    }, {
+      "name": "click",
+      "method": "onClick",
+      "target": undefined,
+      "capture": true,
+      "passive": false
+    }]; }
+}

package/dist/collection/components/liturgical-document/lookup-node.js

@@ -0,0 +1,80 @@
+import { h } from "@stencil/core";
+const valueOrPreference = (x, localeStrings) => {
+  if (typeof x === 'object') {
+    return h("span", null,
+      localeStrings.definedByPreference,
+      " ",
+      h("code", null, x.preference));
+  }
+  else {
+    return h("code", null, x);
+  }
+};
+export const LookupNode = ({ doc, localeStrings }) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4;
+  let desc;
+  if (doc.lookup) {
+    switch ((_a = doc.lookup) === null || _a === void 0 ? void 0 : _a.type) {
+      case 'lectionary':
+        desc = [
+          localeStrings.lectionaryReading,
+          valueOrPreference((_b = doc.lookup) === null || _b === void 0 ? void 0 : _b.item, localeStrings),
+          localeStrings.fromLectionary,
+          valueOrPreference((_c = doc.lookup) === null || _c === void 0 ? void 0 : _c.table, localeStrings),
+          "."
+        ];
+        break;
+      case 'canticle':
+        desc = [
+          localeStrings[`canticle-${(_d = doc.lookup) === null || _d === void 0 ? void 0 : _d.item}`],
+          localeStrings.fromCanticleTable,
+          valueOrPreference((_e = doc.lookup) === null || _e === void 0 ? void 0 : _e.table, localeStrings),
+          "."
+        ];
+        break;
+      case 'category':
+        desc = [
+          localeStrings.category,
+          doc.category.map(category => h("code", null, category)),
+          ((_f = doc.lookup) === null || _f === void 0 ? void 0 : _f.filter) && ((_g = doc.lookup) === null || _g === void 0 ? void 0 : _g.filter) == 'seasonal' && localeStrings['filter-seasonal'],
+          ((_h = doc.lookup) === null || _h === void 0 ? void 0 : _h.filter) && ((_j = doc.lookup) === null || _j === void 0 ? void 0 : _j.filter) == 'evening' && localeStrings[`filter-evening-${((_k = doc.lookup) === null || _k === void 0 ? void 0 : _k.item) || true}`],
+          ((_l = doc.lookup) === null || _l === void 0 ? void 0 : _l.filter) && ((_m = doc.lookup) === null || _m === void 0 ? void 0 : _m.filter) == 'day' && localeStrings[`filter-day`],
+          ((_o = doc.lookup) === null || _o === void 0 ? void 0 : _o.filter) && ((_p = doc.lookup) === null || _p === void 0 ? void 0 : _p.filter) == 'day' && h("code", null, (_q = doc.lookup) === null || _q === void 0 ? void 0 : _q.item),
+          ((_r = doc.lookup) === null || _r === void 0 ? void 0 : _r.hasOwnProperty('rotate')) && localeStrings[`rotate-${(_s = doc.lookup) === null || _s === void 0 ? void 0 : _s.rotate}`],
+          "."
+        ];
+        break;
+      case 'slug':
+        desc = [
+          localeStrings.slug,
+          h("code", null, doc.slug),
+          ((_t = doc.lookup) === null || _t === void 0 ? void 0 : _t.filter) && ((_u = doc.lookup) === null || _u === void 0 ? void 0 : _u.filter) == 'seasonal' && localeStrings['filter-seasonal'],
+          ((_v = doc.lookup) === null || _v === void 0 ? void 0 : _v.filter) && ((_w = doc.lookup) === null || _w === void 0 ? void 0 : _w.filter) == 'evening' && localeStrings[`filter-evening-${((_x = doc.lookup) === null || _x === void 0 ? void 0 : _x.item) || true}`],
+          ((_y = doc.lookup) === null || _y === void 0 ? void 0 : _y.filter) && ((_z = doc.lookup) === null || _z === void 0 ? void 0 : _z.filter) == 'day' && localeStrings[`filter-day`],
+          ((_0 = doc.lookup) === null || _0 === void 0 ? void 0 : _0.filter) && ((_1 = doc.lookup) === null || _1 === void 0 ? void 0 : _1.filter) == 'day' && h("code", null, (_2 = doc.lookup) === null || _2 === void 0 ? void 0 : _2.item),
+          ((_3 = doc.lookup) === null || _3 === void 0 ? void 0 : _3.hasOwnProperty('rotate')) && localeStrings[`rotate-${(_4 = doc.lookup) === null || _4 === void 0 ? void 0 : _4.rotate}`],
+          "."
+        ];
+        break;
+      case 'collect':
+        desc = h("code", null, localeStrings.collect);
+        break;
+      default:
+        desc = JSON.stringify(doc.lookup);
+        break;
+    }
+  }
+  else if (doc.type === "bible-reading" && doc.citation) {
+    desc = [
+      h("code", null, doc.citation),
+      localeStrings.bible_version,
+      ...typeof doc.version === "string"
+        ? [h("code", null, doc.version)]
+        : [
+          localeStrings.the_preference_specified,
+          h("code", null, "bibleVersion")
+        ]
+    ];
+  }
+  return (h("article", { class: "lookup" }, desc));
+};

package/dist/collection/components/liturgy/liturgy.js

@@ -0,0 +1,138 @@
+import { Component, Prop, Watch, State, Host, Listen, h } from '@stencil/core';
+import { Liturgy } from '@venite/ldf';
+export class LiturgyComponent {
+  constructor() {
+    /** Documents in `preview` mode will display as if they're not editable, unless the user explicitly chooses to edit them */
+    this.preview = false;
+  }
+  docChanged(newDoc) {
+    try {
+      if (typeof newDoc == 'string') {
+        this.obj = new Liturgy(JSON.parse(newDoc));
+      }
+      else {
+        this.obj = new Liturgy(newDoc);
+      }
+    }
+    catch (e) {
+      console.warn(e);
+      this.obj = new Liturgy();
+    }
+  }
+  // Lifecycle events
+  componentWillLoad() {
+    this.docChanged(this.doc);
+  }
+  // Listens for ldf-liturgical-document event indicating mouseover
+  onFocusPath(ev) {
+    this.hasFocus = ev.detail;
+  }
+  // Render
+  render() {
+    const basePath = this.path == '/' ? '' : `${this.path}/`, valuePath = `${basePath}/value`;
+    return (h(Host, { lang: this.obj.language },
+      (this.editable || this.preview) && h("ldf-editable-add-block", { visible: true, base: valuePath, index: 0 }),
+      this.obj.value.map((doc, docIndex) => {
+        var _a, _b, _c;
+        const path = `${valuePath}/${docIndex}`, buttonVisible = this.hasFocus == path // button appears if this doc is focused
+          || docIndex == ((((_b = (_a = this.obj) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.length) || 0) - 1) // or it it's the last doc in the liturgy
+          || ((doc === null || doc === void 0 ? void 0 : doc.type) === 'option' && ((_c = this.hasFocus) === null || _c === void 0 ? void 0 : _c.startsWith(path))); // or if it's an option and one of its children is focused
+        return (h("article", { style: { padding: this.editable ? '1em' : '0' } },
+          h("ldf-liturgical-document", { doc: doc, path: path, base: valuePath, index: docIndex, editable: this.editable, preview: this.preview, parentType: 'liturgy' }),
+          (this.editable || this.preview) && h("ldf-editable-add-block", { visible: buttonVisible, base: valuePath, index: docIndex + 1 })));
+      })));
+  }
+  static get is() { return "ldf-liturgy"; }
+  static get encapsulation() { return "scoped"; }
+  static get properties() { return {
+    "doc": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "Liturgy | string",
+        "resolved": "Liturgy | string",
+        "references": {
+          "Liturgy": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "An LDF Liturgy object."
+      },
+      "attribute": "doc",
+      "reflect": false
+    },
+    "path": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "A JSON Pointer that points to the Liturgy being edited"
+      },
+      "attribute": "path",
+      "reflect": true
+    },
+    "editable": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Whether the object is editable"
+      },
+      "attribute": "editable",
+      "reflect": false
+    },
+    "preview": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Documents in `preview` mode will display as if they're not editable, unless the user explicitly chooses to edit them"
+      },
+      "attribute": "preview",
+      "reflect": false,
+      "defaultValue": "false"
+    }
+  }; }
+  static get states() { return {
+    "obj": {},
+    "hasFocus": {}
+  }; }
+  static get watchers() { return [{
+      "propName": "doc",
+      "methodName": "docChanged"
+    }]; }
+  static get listeners() { return [{
+      "name": "focusPath",
+      "method": "onFocusPath",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }]; }
+}