@venite/components 0.16.7 → 0.16.13

package/dist/collection/components/editable-metadata-metadata-fields/editable-metadata-metadata-fields.js

@@ -0,0 +1,438 @@
+import { Component, Element, Prop, Event, State, h, Watch, Method } from '@stencil/core';
+import { Change, LiturgicalDocument, specificClass, versionToString } from '@venite/ldf';
+import { getComponentClosestLanguage } from '../../utils/locale';
+import EN from './editable-metadata-metadata-fields.i18n.en.json';
+const LOCALE = {
+  'en': EN
+};
+var Field;
+(function (Field) {
+  Field[Field["Alignment"] = 0] = "Alignment";
+  Field[Field["String"] = 1] = "String";
+  Field[Field["Bool"] = 2] = "Bool";
+  Field[Field["Number"] = 3] = "Number";
+  Field[Field["StringList"] = 4] = "StringList";
+  Field[Field["BibleReadingIntro"] = 5] = "BibleReadingIntro";
+  Field[Field["TimeInSeconds"] = 6] = "TimeInSeconds";
+  Field[Field["HeadingLevel"] = 7] = "HeadingLevel";
+  Field[Field["Gloria"] = 8] = "Gloria";
+  Field[Field["Antiphon"] = 9] = "Antiphon";
+})(Field || (Field = {}));
+export class EditableMetadataMetadataFieldsComponent {
+  constructor() {
+    this.currentBibleReadingIntros = new Array();
+    /** Options for introductions to a Bible reading */
+    this.bibleReadingIntros = new Array();
+  }
+  docChanged(newDoc) {
+    var _a;
+    try {
+      if (typeof newDoc == 'string') {
+        this.obj = specificClass(JSON.parse(newDoc));
+      }
+      else {
+        this.obj = specificClass(newDoc);
+      }
+      this.fields = this.fieldsFromType((_a = this.obj) === null || _a === void 0 ? void 0 : _a.type);
+      // if necessary, ask for Bible reading intros
+      const hasBibleReadingIntroField = !!this.fields.find(field => field.type == Field.BibleReadingIntro);
+      if (hasBibleReadingIntroField) {
+        this.ldfAskForBibleIntros.emit();
+      }
+    }
+    catch (e) {
+      console.warn(e);
+      this.obj = new LiturgicalDocument();
+    }
+  }
+  introsChanged() {
+    this.currentBibleReadingIntros = [...this.bibleReadingIntros];
+  }
+  /** Set the list of Bible reading introductions */
+  async setBibleReadingIntros(intros) {
+    if (typeof intros === 'string') {
+      this.currentBibleReadingIntros = JSON.parse(intros);
+    }
+    else {
+      this.currentBibleReadingIntros = intros;
+    }
+  }
+  // Lifecycle events
+  async componentWillLoad() {
+    this.docChanged(this.doc);
+    this.loadLocaleStrings();
+  }
+  // Methods
+  async loadLocaleStrings() {
+    try {
+      this.localeStrings = LOCALE[getComponentClosestLanguage(this.element)];
+    }
+    catch (e) {
+      console.warn(e);
+    }
+  }
+  // Given a `type`, returns an array of metadata types
+  fieldsFromType(type) {
+    switch (type) {
+      case 'bible-reading':
+        return [
+          { field: 'response', type: Field.String },
+          { field: 'intro', type: Field.BibleReadingIntro }
+        ];
+      case 'heading':
+        return [
+          { field: 'level', type: Field.HeadingLevel },
+        ];
+      case 'image':
+        return [
+          { field: 'height', type: Field.Number, unit: 'px' },
+          { field: 'width', type: Field.Number, unit: 'px' },
+          { field: 'align', type: Field.Alignment }
+        ];
+      case 'liturgy':
+        return [
+          { field: 'label', type: Field.String },
+          { field: 'slug', type: Field.String },
+          { field: 'liturgyversions', type: Field.StringList },
+          { field: 'supplement', type: Field.Bool },
+          { field: 'evening', type: Field.Bool },
+          { field: 'pronouns', type: Field.StringList },
+        ];
+      case 'meditation':
+        return [
+          { field: 'length', type: Field.TimeInSeconds },
+          { field: 'delay', type: Field.TimeInSeconds }
+        ];
+      case 'psalm':
+        return [
+          { field: 'number', type: Field.Number },
+          { field: 'localname', type: Field.String },
+          { field: 'latinname', type: Field.String },
+          { field: 'omit_antiphon', type: Field.Bool },
+          { field: 'omit_gloria', type: Field.Bool },
+          { field: 'insert_seasonal_antiphon', type: Field.Bool },
+          { field: 'antiphon', type: Field.Antiphon },
+          { field: 'gloria', type: Field.Gloria },
+          { field: 'changeable', type: Field.Bool }
+        ];
+      case 'responsive':
+        return [{ field: 'response', type: Field.String }];
+      case 'option':
+      case 'refrain':
+      case 'rubric':
+        return [];
+      case 'text':
+        return [
+          { field: 'response', type: Field.String },
+          { field: 'omit_response', type: Field.Bool },
+          { field: 'omit_label', type: Field.Bool },
+          { field: 'rollup', type: Field.Bool }
+        ];
+      default:
+        console.warn('(ldf-editable-metadata-metadata-fields)', type, 'is not a recognized type');
+    }
+  }
+  fieldToNodes(field, localeStrings) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    const nodes = new Array(), currentValue = (((_a = this.obj) === null || _a === void 0 ? void 0 : _a.metadata) || {})[field.field], path = `${this.path}/metadata/${field.field}`, placeholder = localeStrings[field.field];
+    let wrapInItem = true, labelStacked = true;
+    switch (field.type) {
+      case Field.BibleReadingIntro:
+        nodes.push(h("ldf-editable-select", { path: `${this.path}/metadata`, property: field.field, options: [
+            { label: localeStrings.none, value: null },
+            ...this.currentBibleReadingIntros.map(intro => {
+              var _a;
+              return ({
+                label: intro.type === 'responsive' ? (_a = intro.value[0].text) === null || _a === void 0 ? void 0 : _a.toString() : intro.value[0].toString(),
+                value: intro
+              });
+            })
+          ], value: currentValue }));
+        break;
+      // Done
+      case Field.Bool:
+        nodes.push(h("ldf-editable-boolean", { path: `${this.path}/metadata`, property: field.field, value: currentValue }));
+        labelStacked = false;
+        break;
+      case Field.Number:
+        nodes.push(h("ldf-editable-text", { short: true, inputType: "number", path: path, placeholder: placeholder, text: currentValue, unit: field.unit }));
+        break;
+      case Field.String:
+        nodes.push(h("ldf-editable-text", { short: true, path: path, placeholder: placeholder, text: currentValue }));
+        break;
+      case Field.StringList:
+        nodes.push({
+          node: h("ldf-editable-string-list", { path: `${this.path}/metadata`, property: field.field, value: currentValue }),
+          size: 12
+        });
+        wrapInItem = false;
+        break;
+      case Field.HeadingLevel:
+        nodes.push(h("ldf-editable-select", { path: `${this.path}/metadata`, property: field.field, options: [
+            { label: localeStrings.heading1, value: 1 },
+            { label: localeStrings.heading2, value: 2 },
+            { label: localeStrings.heading3, value: 3 },
+            { label: localeStrings.heading4, value: 4 }
+          ], value: currentValue }));
+        break;
+      case Field.TimeInSeconds:
+        nodes.push(h("ldf-editable-text", { inputType: "number", short: true, path: path, placeholder: placeholder, text: currentValue }));
+        break;
+      case Field.Gloria:
+        wrapInItem = false;
+        nodes.push({
+          node: h("ion-item", { lines: "none" },
+            h("ion-label", null, localeStrings.insert_gloria),
+            h("ion-checkbox", { checked: Boolean((_c = (_b = this.obj) === null || _b === void 0 ? void 0 : _b.metadata) === null || _c === void 0 ? void 0 : _c.gloria), onIonChange: (e) => {
+                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+                if (e.detail.checked) {
+                  this.ldfShouldAddGloriaPatri.emit({
+                    path: this.path,
+                    language: (_a = this.obj) === null || _a === void 0 ? void 0 : _a.language,
+                    version: versionToString((_b = this.obj) === null || _b === void 0 ? void 0 : _b.version),
+                    oldValue: (_d = (_c = this.obj) === null || _c === void 0 ? void 0 : _c.metadata) === null || _d === void 0 ? void 0 : _d.gloria
+                  });
+                  if (((_f = (_e = this.obj) === null || _e === void 0 ? void 0 : _e.metadata) === null || _f === void 0 ? void 0 : _f.omit_gloria) !== false) {
+                    this.ldfDocShouldChange.emit(new Change({
+                      path: `${this.path}/metadata`,
+                      op: [{
+                          type: 'set',
+                          index: 'omit_gloria',
+                          oldValue: (_h = (_g = this.obj) === null || _g === void 0 ? void 0 : _g.metadata) === null || _h === void 0 ? void 0 : _h.omit_gloria,
+                          value: false
+                        }]
+                    }));
+                  }
+                }
+                else {
+                  this.ldfDocShouldChange.emit(new Change({
+                    path: `${this.path}/metadata`,
+                    op: [{
+                        type: 'deleteAt',
+                        index: 'gloria',
+                        oldValue: (_k = (_j = this.obj) === null || _j === void 0 ? void 0 : _j.metadata) === null || _k === void 0 ? void 0 : _k.gloria
+                      }]
+                  }));
+                  if (((_m = (_l = this.obj) === null || _l === void 0 ? void 0 : _l.metadata) === null || _m === void 0 ? void 0 : _m.omit_gloria) !== true) {
+                    this.ldfDocShouldChange.emit(new Change({
+                      path: `${this.path}/metadata`,
+                      op: [{
+                          type: 'set',
+                          index: 'omit_gloria',
+                          oldValue: (_p = (_o = this.obj) === null || _o === void 0 ? void 0 : _o.metadata) === null || _p === void 0 ? void 0 : _p.omit_gloria,
+                          value: true
+                        }]
+                    }));
+                  }
+                }
+              } })),
+          size: 12
+        });
+        break;
+      case Field.Antiphon:
+        wrapInItem = false;
+        nodes.push({
+          node: h("ldf-editable-antiphon-field", { path: this.path, antiphon: (_e = (_d = this.obj) === null || _d === void 0 ? void 0 : _d.metadata) === null || _e === void 0 ? void 0 : _e.antiphon, omit_antiphon: (_g = (_f = this.obj) === null || _f === void 0 ? void 0 : _f.metadata) === null || _g === void 0 ? void 0 : _g.omit_antiphon, insert_antiphon: (_j = (_h = this.obj) === null || _h === void 0 ? void 0 : _h.metadata) === null || _j === void 0 ? void 0 : _j.insert_seasonal_antiphon }),
+          size: 12
+        });
+        break;
+      case Field.Alignment:
+        nodes.push(h("ldf-editable-select", { path: `${this.path}/metadata`, property: field.field, options: [
+            { label: localeStrings.left, value: 'left' },
+            { label: localeStrings.center, value: 'center' },
+            { label: localeStrings.right, value: 'right' },
+          ], value: currentValue }));
+        break;
+      default:
+        ((type) => console.warn('(ldf-editable-metadata-metadata-fields)', type, 'is not a recognized FieldType'))(field.type);
+        break;
+    }
+    if (wrapInItem) {
+      return [
+        h("ion-item", { lines: "none" },
+          labelStacked
+            ? h("ion-label", { position: "stacked" }, localeStrings[field.field])
+            : h("ion-label", null, localeStrings[field.field]),
+          nodes.map(field => field.hasOwnProperty('size') ?
+            h("ion-col", { size: field['size'] }, field['node']) :
+            h("ion-col", null, field)))
+      ];
+    }
+    else {
+      return nodes;
+    }
+  }
+  render() {
+    const localeStrings = this.localeStrings || {}, fieldNodes = this.fields.map(field => this.fieldToNodes(field, localeStrings));
+    return ((fieldNodes === null || fieldNodes === void 0 ? void 0 : fieldNodes.length) > 0 && h("ion-card", null,
+      h("ion-card-header", null,
+        h("ion-card-title", null,
+          localeStrings[this.obj.type],
+          " ",
+          localeStrings.title)),
+      h("ion-card-content", null, fieldNodes.map((fields) => fields.map(field => {
+        return field.hasOwnProperty('size') ?
+          h("div", null, field['node']) :
+          h("div", null, field);
+      })))));
+  }
+  static get is() { return "ldf-editable-metadata-metadata-fields"; }
+  static get encapsulation() { return "scoped"; }
+  static get properties() { return {
+    "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 document"
+      },
+      "attribute": "path",
+      "reflect": true
+    },
+    "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
+    },
+    "bibleReadingIntros": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "LiturgicalDocument[]",
+        "resolved": "LiturgicalDocument[]",
+        "references": {
+          "LiturgicalDocument": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Options for introductions to a Bible reading"
+      },
+      "defaultValue": "new Array()"
+    }
+  }; }
+  static get states() { return {
+    "localeStrings": {},
+    "fields": {},
+    "obj": {},
+    "currentBibleReadingIntros": {}
+  }; }
+  static get events() { return [{
+      "method": "ldfDocShouldChange",
+      "name": "ldfDocShouldChange",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "Change",
+        "resolved": "Change",
+        "references": {
+          "Change": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      }
+    }, {
+      "method": "ldfAskForBibleIntros",
+      "name": "ldfAskForBibleIntros",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "void",
+        "resolved": "void",
+        "references": {}
+      }
+    }, {
+      "method": "ldfShouldAddGloriaPatri",
+      "name": "ldfShouldAddGloriaPatri",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "{ path: string; language: string; version: string; oldValue: LiturgicalDocument | undefined; }",
+        "resolved": "{ path: string; language: string; version: string; oldValue: LiturgicalDocument; }",
+        "references": {
+          "LiturgicalDocument": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      }
+    }]; }
+  static get methods() { return {
+    "setBibleReadingIntros": {
+      "complexType": {
+        "signature": "(intros: LiturgicalDocument[] | string) => Promise<void>",
+        "parameters": [{
+            "tags": [],
+            "text": ""
+          }],
+        "references": {
+          "Promise": {
+            "location": "global"
+          },
+          "LiturgicalDocument": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "Set the list of Bible reading introductions",
+        "tags": []
+      }
+    }
+  }; }
+  static get elementRef() { return "element"; }
+  static get watchers() { return [{
+      "propName": "doc",
+      "methodName": "docChanged"
+    }, {
+      "propName": "bibleReadingIntros",
+      "methodName": "introsChanged"
+    }]; }
+}

package/dist/collection/components/editable-preference/editable-preference.i18n.en.json

@@ -0,0 +1,8 @@
+{
+  "add": "Add an Option",
+  "category": "Category",
+  "description": "Description",
+  "label": "Label",
+  "option": "Option",
+  "preference": "Preference"
+}

package/dist/collection/components/editable-preference/editable-preference.js

@@ -0,0 +1,166 @@
+import { Component, Element, Prop, Event, h, State, Host, Watch } from '@stencil/core';
+import { Change, Preference, PreferenceOption } from '@venite/ldf';
+import { getComponentClosestLanguage } from '../../utils/locale';
+import EN from './editable-preference.i18n.en.json';
+const LOCALE = {
+  'en': EN
+};
+export class EditablePreferenceComponent {
+  optionChange() {
+    this.currentPreference = this.preference || new Preference();
+  }
+  componentWillLoad() {
+    this.currentPreference = this.preference || new Preference();
+    this.loadLocaleStrings();
+  }
+  async loadLocaleStrings() {
+    try {
+      this.localeStrings = LOCALE[getComponentClosestLanguage(this.element)];
+    }
+    catch (e) {
+      console.warn(e);
+    }
+  }
+  addOption(index) {
+    if (!this.currentPreference.options) {
+      this.currentPreference.options = new Array();
+      this.currentPreference.options.push(new PreferenceOption());
+      this.ldfDocShouldChange.emit(new Change({
+        path: this.path,
+        op: [{
+            type: 'set',
+            index: 'options',
+            value: [new PreferenceOption()]
+          }]
+      }));
+    }
+    else {
+      this.currentPreference.options.push(new PreferenceOption());
+      this.ldfDocShouldChange.emit(new Change({
+        path: `${this.path}/options`,
+        op: [{
+            type: 'insertAt',
+            index,
+            value: new PreferenceOption()
+          }]
+      }));
+    }
+    this.currentPreference = new Preference(Object.assign({}, this.currentPreference));
+  }
+  render() {
+    var _a, _b, _c, _d;
+    const localeStrings = this.localeStrings || {};
+    return (h(Host, null,
+      h("ion-list", null,
+        h("ion-item", null,
+          h("ion-label", { position: "stacked" }, localeStrings.label),
+          h("ldf-editable-text", { path: `${this.path}/label`, placeholder: localeStrings.label, short: true, text: (_a = this.currentPreference) === null || _a === void 0 ? void 0 : _a.label })),
+        h("ion-item", null,
+          h("ion-label", { position: "stacked" }, localeStrings.category),
+          h("ldf-editable-text", { path: `${this.path}/category`, placeholder: localeStrings.category, short: true, text: (_b = this.currentPreference) === null || _b === void 0 ? void 0 : _b.category })),
+        h("ion-item", null,
+          h("ion-label", { position: "stacked" }, localeStrings.description),
+          h("ldf-editable-text", { path: `${this.path}/description`, placeholder: localeStrings.description, short: true, text: (_c = this.currentPreference) === null || _c === void 0 ? void 0 : _c.description })),
+        (((_d = this.currentPreference) === null || _d === void 0 ? void 0 : _d.options) || []).map((option, index) => [
+          h("ion-toolbar", null,
+            h("ion-title", { slot: "start" },
+              localeStrings.option,
+              " ",
+              index + 1),
+            h("ion-buttons", { slot: "end" },
+              h("ldf-editable-delete", { slot: "end", base: `${this.path}/options`, index: index, obj: option }))),
+          h("ldf-editable-preference-option", { path: `${this.path}/options/${index}`, option: option })
+        ]),
+        h("ion-button", { onClick: () => { var _a, _b; return this.addOption((_b = (_a = this.currentPreference) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.length); }, size: "small" },
+          h("ion-icon", { slot: "start", name: "add" }),
+          h("ion-label", null, localeStrings.add)))));
+  }
+  static get is() { return "ldf-editable-preference"; }
+  static get encapsulation() { return "scoped"; }
+  static get properties() { return {
+    "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 object being edited"
+      },
+      "attribute": "path",
+      "reflect": true
+    },
+    "preference": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "Preference",
+        "resolved": "Preference",
+        "references": {
+          "Preference": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Starting value for editing"
+      }
+    },
+    "modal": {
+      "type": "any",
+      "mutable": false,
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Used to pass in the `IonModal` we will dismiss"
+      },
+      "attribute": "modal",
+      "reflect": false
+    }
+  }; }
+  static get states() { return {
+    "localeStrings": {},
+    "currentPreference": {}
+  }; }
+  static get events() { return [{
+      "method": "ldfDocShouldChange",
+      "name": "ldfDocShouldChange",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "Change",
+        "resolved": "Change",
+        "references": {
+          "Change": {
+            "location": "import",
+            "path": "@venite/ldf"
+          }
+        }
+      }
+    }]; }
+  static get elementRef() { return "element"; }
+  static get watchers() { return [{
+      "propName": "preference",
+      "methodName": "optionChange"
+    }]; }
+}

package/dist/collection/components/editable-preference-option/editable-preference-option.i18n.en.json

@@ -0,0 +1,9 @@
+{
+  "additional": "Advanced Settings",
+  "alternateYear": "“Alternate Year” Reading",
+  "default": "Default",
+  "fallback": "Fallback Value",
+  "label": "Label",
+  "option": "Option",
+  "value": "Value"
+}