@startinblox/core 0.19.0-beta.1 → 0.19.0-beta.3

package/dist/new-widgets/templatesDependencies/formFileMixin.js

@@ -1,82 +0,0 @@
-import { store } from "../../libs/store/store.js";
-const FormFileMixin = {
-  name: 'form-file-mixin',
-  attributes: {
-    uploadUrl: {
-      type: String,
-      default: ''
-    }
-  },
-  initialState: {
-    initialValue: ''
-  },
-  created() {
-    this.listAttributes['output'] = '';
-    this.listAttributes['resetButtonHidden'] = true;
-    this.listAttributes['selectFile'] = this.selectFile.bind(this);
-    this.listAttributes['resetFile'] = this.resetFile.bind(this);
-  },
-  attached() {
-    document.addEventListener('reset', e => {
-      if (e.target && e.target.contains(this.element)) {
-        this.value = this.initialValue;
-        this.listAttributes['resetButtonHidden'] = true;
-        this.planRender();
-        const dataHolder = this.element.querySelector('input[data-holder]');
-        dataHolder.value = this.value;
-        dataHolder.dispatchEvent(new Event('change'));
-      }
-    });
-  },
-  selectFile() {
-    if (this.uploadUrl === null) return;
-    if (this.initialValue === '') {
-      this.initialValue = this.value;
-    }
-    const filePicker = this.element.querySelector('input[type="file"]');
-    if (filePicker.files.length < 1) return;
-    const dataHolder = this.element.querySelector('input[data-holder]');
-    this.listAttributes['output'] = '⏳';
-    this.planRender();
-    const file = filePicker.files[0];
-    const formData = new FormData();
-    formData.append('file', file);
-    store.fetchAuthn(this.uploadUrl, {
-      method: 'POST',
-      body: formData
-    }).then(response => this.updateFile(dataHolder, response)).catch(error => {
-      this.listAttributes['fileValue'] = '';
-      this.listAttributes['output'] = 'upload error';
-      this.planRender();
-      console.error(error);
-    });
-  },
-  updateFile(dataHolder, response) {
-    const location = response.headers.get('location');
-    if (location == null) {
-      this.listAttributes['output'] = 'header location not found!';
-    } else {
-      this.value = location;
-      this.listAttributes['output'] = '';
-      this.listAttributes['resetButtonHidden'] = false;
-      dataHolder.value = location;
-      dataHolder.dispatchEvent(new Event('change'));
-      this.planRender();
-    }
-  },
-  resetFile(event) {
-    event.preventDefault();
-    this.value = '';
-    const filePicker = this.element.querySelector('input[type="file"]');
-    const dataHolder = this.element.querySelector('input[data-holder]');
-    if (filePicker && dataHolder) {
-      filePicker.value = dataHolder.value = '';
-    }
-    this.listAttributes['fileValue'] = '';
-    this.listAttributes['output'] = '';
-    this.listAttributes['resetButtonHidden'] = true;
-    dataHolder.dispatchEvent(new Event('change'));
-    this.planRender();
-  }
-};
-export { FormFileMixin };

package/dist/new-widgets/templatesDependencies/formLengthMixin.js

@@ -1,18 +0,0 @@
-const FormLengthMixin = {
-  name: 'form-length-mixin',
-  attributes: {
-    maxlength: {
-      type: Number,
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'maxlength');
-      }
-    },
-    minlength: {
-      type: Number,
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'minlength');
-      }
-    }
-  }
-};
-export { FormLengthMixin };

package/dist/new-widgets/templatesDependencies/formMinMaxMixin.js

@@ -1,18 +0,0 @@
-const FormMinMaxMixin = {
-  name: 'form-min-max-mixin',
-  attributes: {
-    min: {
-      type: Number,
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'min');
-      }
-    },
-    max: {
-      type: Number,
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'max');
-      }
-    }
-  }
-};
-export { FormMinMaxMixin };

package/dist/new-widgets/templatesDependencies/formMixin.js

@@ -1,56 +0,0 @@
-const FormMixin = {
-  name: 'form-mixin',
-  attributes: {
-    required: {
-      type: Boolean,
-      default: false,
-      callback: function () {
-        this.listAttributes['required'] = true;
-      }
-    },
-    autocomplete: {
-      type: String,
-      default: '',
-      callback: function (value) {
-        this.addToAttributes(value, "autocomplete");
-      }
-    }
-  },
-  attached() {
-    this.listAttributes['onChange'] = this.onChange.bind(this);
-  },
-  onChange(e) {
-    e.preventDefault();
-    e.stopPropagation();
-    this.element.dispatchEvent(new Event('change', {
-      bubbles: true
-    }));
-  },
-  getValue() {
-    if (!this.dataHolder || this.dataHolder.length === 0) return this.value;
-    if (this.dataHolder.length > 1) this.showDataHolderError(1, this.dataHolder.length);
-    return this.getValueFromElement(this.dataHolder[0]);
-  },
-  get type() {
-    return 'string';
-  },
-  get multiple() {
-    return false;
-  },
-  get dataHolder() {
-    const dataHolders = Array.from(this.element.querySelectorAll('[data-holder]'));
-    const widgetDataHolders = dataHolders.filter(element => {
-      const dataHolderAncestor = element.parentElement ? element.parentElement.closest('[data-holder]') : null;
-      // get the dataHolder of the widget only if no dataHolder ancestor in the current widget
-      return dataHolderAncestor === this.element || !dataHolderAncestor || !this.element.contains(dataHolderAncestor);
-    });
-    return widgetDataHolders.length ? widgetDataHolders : null;
-  },
-  getValueFromElement(element) {
-    return element.component ? element.component.getValue() : element.value;
-  },
-  showDataHolderError(expected, found) {
-    console.warn(`Expected ${expected} data-holder element in ${this.element.tagName}. Found ${found}`);
-  }
-};
-export { FormMixin };

package/dist/new-widgets/templatesDependencies/formNumberMixin.js

@@ -1,10 +0,0 @@
-const FormNumberMixin = {
-  name: 'form-number-mixin',
-  getValueFromElement(element) {
-    return element.value ? Number(element.value) : '';
-  },
-  get type() {
-    return 'number';
-  }
-};
-export { FormNumberMixin };

package/dist/new-widgets/templatesDependencies/formRadioMixin.js

@@ -1,12 +0,0 @@
-import { uniqID } from '../../libs/helpers.js';
-const FormRadioMixin = {
-  name: 'form-radio-mixin',
-  created() {
-    this.listAttributes['id'] = uniqID();
-  },
-  getValue() {
-    const checkedElement = this.element.querySelector('input[type=radio]:checked');
-    return checkedElement ? checkedElement.value : '';
-  }
-};
-export { FormRadioMixin };

package/dist/new-widgets/templatesDependencies/formStepMixin.js

@@ -1,12 +0,0 @@
-const FormStepMixin = {
-  name: 'form-time-mixin',
-  attributes: {
-    step: {
-      type: Number,
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'step');
-      }
-    }
-  }
-};
-export { FormStepMixin };

package/dist/new-widgets/templatesDependencies/linkTextMixin.js

@@ -1,13 +0,0 @@
-const LinkTextMixin = {
-  name: 'link-text-mixin',
-  attributes: {
-    linkText: {
-      type: String,
-      default: '',
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'linkText');
-      }
-    }
-  }
-};
-export { LinkTextMixin };

package/dist/new-widgets/templatesDependencies/multipleFormMixin.js

@@ -1,116 +0,0 @@
-import { StoreMixin } from '../../mixins/storeMixin.js';
-const MultipleFormMixin = {
-  name: 'multiple-form-mixin',
-  use: [StoreMixin],
-  attributes: {
-    widget: {
-      type: String,
-      default: 'solid-form-text'
-    },
-    addLabel: {
-      type: String,
-      default: '+',
-      callback: function (value) {
-        if (value !== this.listAttributes['addLabel']) this.listAttributes['addLabel'] = value;
-        this.planRender();
-      }
-    },
-    removeLabel: {
-      type: String,
-      default: '×',
-      callback: function (value) {
-        if (value !== this.listAttributes['removeLabel']) this.listAttributes['removeLabel'] = value;
-        this.planRender();
-      }
-    },
-    range: {
-      type: String,
-      default: ''
-    },
-    addClass: {
-      type: String,
-      default: undefined,
-      callback: function (value) {
-        if (value !== this.listAttributes['addClass']) this.listAttributes['addClass'] = value;
-        this.planRender();
-      }
-    },
-    removeClass: {
-      type: String,
-      default: undefined,
-      callback: function (value) {
-        if (value !== this.listAttributes['removeClass']) this.listAttributes['removeClass'] = value;
-        this.planRender();
-      }
-    }
-  },
-  created() {
-    this.listValueTransformations.push(this.setDataSrc.bind(this));
-    this.listAttributes['children'] = [];
-    this.listAttributes['addLabel'] = this.addLabel;
-    this.listAttributes['removeLabel'] = this.removeLabel;
-    this.listAttributes['addClass'] = this.addClass;
-    this.listAttributes['removeClass'] = this.removeClass;
-    this.listAttributes['addItem'] = () => {
-      this.insertWidget();
-      this.planRender();
-    };
-    this.listAttributes['removeItem'] = index => {
-      this.element.querySelector(`[data-index="${this.name + index}"]`).remove();
-      this.element.dispatchEvent(new Event('change', {
-        bubbles: true
-      }));
-    };
-  },
-  setDataSrc(value, listValueTransformations) {
-    if (value && value !== this.dataSrc) this.dataSrc = value;
-    const nextProcessor = listValueTransformations.shift();
-    if (nextProcessor) nextProcessor(value, listValueTransformations);
-  },
-  populate() {
-    if (!this.resource || !this.resource['ldp:contains']) return;
-    this.listAttributes['children'] = []; // reset list
-
-    // set value in form
-    for (let resource of this.resource['ldp:contains']) {
-      // for each resource
-      this.insertWidget(resource['@id']); // create a widget
-    }
-
-    this.planRender();
-  },
-  insertWidget(value = '') {
-    if (!this.widget) return;
-    const widget = document.createElement(this.widget);
-    const attributes = {
-      'data-holder': true,
-      'name': this.name,
-      'value': value,
-      'range': this.range
-    };
-    for (let name of Object.keys(attributes)) {
-      if (typeof attributes[name] === "boolean") widget.toggleAttribute(name, attributes[name]);else widget.setAttribute(name, attributes[name]);
-    }
-    this.listAttributes['children'].push(widget);
-  },
-  empty() {
-    this.listAttributes['children'] = [];
-    this.planRender();
-  },
-  getValue() {
-    if (!this.dataHolder) return [];
-    // Was returning an array of functions, now returns an array of values.
-    // Not sure about the tests results in that context
-    return Array.from(this.dataHolder).map(element => {
-      let elValue = this.getValueFromElement(element);
-      return elValue;
-    });
-  },
-  get type() {
-    return 'resource';
-  },
-  get multiple() {
-    return true;
-  }
-};
-export { MultipleFormMixin };

package/dist/new-widgets/templatesDependencies/multipleselectFormMixin.js

@@ -1,74 +0,0 @@
-import { StoreMixin } from '../../mixins/storeMixin.js';
-const MultipleselectFormMixin = {
-  name: 'multipleselect-form-mixin',
-  use: [StoreMixin],
-  attributes: {
-    range: {
-      // range attribute is passed to the solid-dropdown
-      type: String,
-      default: '',
-      callback: function (value) {
-        if (value && value !== this.listAttributes['range']) this.listAttributes['range'] = value;
-      }
-    },
-    enum: {
-      // enum attribute is passed to the solid-dropdown
-      type: String,
-      default: '',
-      callback: function (value) {
-        if (value && value !== this.listAttributes['enum']) this.listAttributes['enum'] = value;
-      }
-    },
-    orderAsc: {
-      type: String,
-      default: 'name',
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'orderAsc');
-      }
-    },
-    orderDesc: {
-      type: String,
-      default: 'name',
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'orderDesc');
-      }
-    }
-  },
-  created() {
-    this.listValueTransformations.push(this.setDataSrc.bind(this));
-  },
-  setDataSrc(value, listValueTransformations) {
-    if (value && value !== this.dataSrc) {
-      try {
-        if (Array.isArray(JSON.parse(value))) {
-          this.setValue(JSON.parse(value));
-        }
-      } catch (ex) {
-        this.dataSrc = value;
-        console.log('Not an array', ex);
-      }
-    }
-    const nextProcessor = listValueTransformations.shift();
-    if (nextProcessor) nextProcessor(value, listValueTransformations);
-  },
-  populate() {
-    if (!this.resource || !this.resource['ldp:contains'] && !Array.isArray(this.resource)) return;
-    this.setValue(this.resource['ldp:contains']);
-    this.planRender();
-  },
-  setValue(values) {
-    // set the values to the dropdown
-    this.listAttributes['values'] = JSON.stringify(values.map(r => r['@id']));
-  },
-  empty() {
-    this.listAttributes['values'] = [];
-    this.planRender();
-  },
-  get type() {
-    return this.enum === '' ? 'resource' : 'string';
-  },
-  get multiple() {
-    return true;
-  }
-};
-export { MultipleselectFormMixin };

package/dist/new-widgets/templatesDependencies/patternMixin.js

@@ -1,18 +0,0 @@
-const PatternMixin = {
-  name: 'pattern-mixin',
-  attributes: {
-    pattern: {
-      type: String,
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'pattern');
-      }
-    },
-    title: {
-      type: String,
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'title');
-      }
-    }
-  }
-};
-export { PatternMixin };

package/dist/new-widgets/templatesDependencies/rangeMixin.js

@@ -1,100 +0,0 @@
-import { StoreMixin } from '../../mixins/storeMixin.js';
-import { SorterMixin } from '../../mixins/sorterMixin.js';
-import { FederationMixin } from '../../mixins/federationMixin.js';
-const RangeMixin = {
-  name: 'range-mixin',
-  use: [StoreMixin, SorterMixin, FederationMixin],
-  attributes: {
-    range: {
-      type: String,
-      default: '',
-      callback: function (value) {
-        if (value !== this.dataSrc) this.dataSrc = value;
-      }
-    },
-    enum: {
-      type: String,
-      default: '',
-      callback: function (value) {
-        if (value !== null) {
-          const optional = value.trim().split(",");
-          let key;
-          let keyValue;
-          const list = {};
-          optional.forEach(element => {
-            if (element.includes("=")) {
-              const option = element.trim().split("=");
-              key = option[1].trim();
-              keyValue = option[0].trim();
-              list[key] = keyValue;
-            } else {
-              const elem = element.trim();
-              list[elem] = elem;
-            }
-          });
-          this.addToAttributes(list, 'enum');
-        }
-        ;
-      }
-    },
-    optionLabel: {
-      type: String,
-      default: 'name',
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'optionLabel');
-      }
-    },
-    optionValue: {
-      type: String,
-      default: '@id',
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'optionValue');
-      }
-    }
-  },
-  initialState: {
-    listPostProcessors: []
-  },
-  created() {
-    this.listPostProcessors = [];
-    this.listAttributes['optionLabel'] = this.optionLabel;
-    this.listAttributes['optionValue'] = this.optionValue;
-  },
-  async populate() {
-    const resources = this.resource ? this.resource['ldp:contains'] : [];
-    const listPostProcessors = [...this.listPostProcessors];
-    listPostProcessors.push(this.setRangeAttribute.bind(this));
-    const nextProcessor = listPostProcessors.shift();
-    await nextProcessor(resources, listPostProcessors, null, this.dataSrc);
-  },
-  async setRangeAttribute(resources) {
-    if (resources) {
-      // process resources to create the template
-      const getRangeValue = async resource => {
-        const selectedValue = await resource[this.optionValue]; // value used for selected options
-        const value = this.optionValue.includes('@id') || selectedValue['@id'] ?
-        // value of the option
-        `{"@id": "${selectedValue}"}` :
-        //  resource
-        selectedValue; // literal
-        const label = await resource[this.optionLabel]; // label of the option
-
-        return {
-          value,
-          label,
-          selectedValue
-        };
-      };
-      this.listAttributes['range'] = await Promise.all(resources.filter(el => el !== null).map(r => getRangeValue(r)));
-    }
-    this.planRender();
-  },
-  empty() {
-    this.listAttributes['range'] = [];
-    this.planRender();
-  },
-  get type() {
-    return this.enum === '' ? 'resource' : 'string';
-  }
-};
-export { RangeMixin };

package/dist/new-widgets/templatesDependencies/setMixin.js

@@ -1,9 +0,0 @@
-const SetMixin = {
-  name: 'set-mixin',
-  /**
-   * For sets and group widgets, remove auto rendering
-   * function to allow only manual renders
-   */
-  planRender() {}
-};
-export { SetMixin };

package/dist/new-widgets/templatesDependencies/valueRichtextMixin.js

@@ -1,9 +0,0 @@
-import qdtm from '../../_snowpack/pkg/quill-delta-to-markdown.js';
-const ValueRichtextMixin = {
-  name: 'valuerichtext-mixin',
-  getValue() {
-    const markdown = qdtm.deltaToMarkdown(this.quill.getContents().ops);
-    return markdown;
-  }
-};
-export { ValueRichtextMixin };

package/dist/new-widgets/valueTransformationMixins/autolinkMixin.js

@@ -1,14 +0,0 @@
-import { Autolinker } from '../../_snowpack/pkg/autolinker.js';
-const AutolinkMixin = {
-  name: 'autolink-mixin',
-  created() {
-    this.listValueTransformations.push(this.transformValue.bind(this));
-  },
-  transformValue(value, listValueTransformations) {
-    const template = document.createElement('template');
-    template.innerHTML = Autolinker.link(value);
-    const nextProcessor = listValueTransformations.shift();
-    if (nextProcessor) nextProcessor(template.content, listValueTransformations);
-  }
-};
-export { AutolinkMixin };

package/dist/new-widgets/valueTransformationMixins/dateMixin.js

@@ -1,29 +0,0 @@
-const DateMixin = {
-  name: 'date-mixin',
-  created() {
-    this.listValueTransformations.push(this.transformValue.bind(this));
-  },
-  transformValue(value, listValueTransformations) {
-    try {
-      // workaround for giving a specific-formatted value to the form widget
-      this.listAttributes['originalValue'] = this.formatDateForInput(value);
-    } catch (e) {
-      console.warn('Invalid date format for widget', this.name);
-      this.listAttributes['originalValue'] = '';
-    }
-    const newValue = value ? new Date(value).toLocaleDateString() : value;
-    const nextProcessor = listValueTransformations.shift();
-    if (nextProcessor) nextProcessor(newValue, listValueTransformations);
-  },
-  formatDateForInput(date) {
-    let d = new Date(date);
-    if (isNaN(d.getTime())) throw new Error('Invalid date');
-    let month = `${d.getMonth() + 1}`;
-    let day = `${d.getDate()}`;
-    let year = d.getFullYear();
-    if (month.length < 2) month = `0${month}`;
-    if (day.length < 2) day = `0${day}`;
-    return [year, month, day].join('-');
-  }
-};
-export { DateMixin };

package/dist/new-widgets/valueTransformationMixins/dateTimeMixin.js

@@ -1,12 +0,0 @@
-const DateTimeMixin = {
-  name: 'date-time-mixin',
-  created() {
-    this.listValueTransformations.push(this.transformValue.bind(this));
-  },
-  transformValue(value, listValueTransformations) {
-    const newValue = value ? new Date(value).toLocaleString() : value;
-    const nextProcessor = listValueTransformations.shift();
-    if (nextProcessor) nextProcessor(newValue, listValueTransformations);
-  }
-};
-export { DateTimeMixin };

package/dist/new-widgets/valueTransformationMixins/index.js

@@ -1,15 +0,0 @@
-import { DateMixin } from './dateMixin.js';
-import { DateTimeMixin } from './dateTimeMixin.js';
-import { MultilineMixin } from './multilineMixin.js';
-import { MarkdownMixin } from './markdownMixin.js';
-import { OembedMixin } from './oembedMixin.js';
-import { AutolinkMixin } from './autolinkMixin.js';
-const valueTransformationDirectory = {
-  date: DateMixin,
-  datetime: DateTimeMixin,
-  multiline: MultilineMixin,
-  markdown: MarkdownMixin,
-  oembed: OembedMixin,
-  autolink: AutolinkMixin
-};
-export { valueTransformationDirectory, DateMixin, DateTimeMixin, MultilineMixin, MarkdownMixin, OembedMixin, AutolinkMixin };

package/dist/new-widgets/valueTransformationMixins/markdownMixin.js

@@ -1,30 +0,0 @@
-import { unsafeHTML } from '../../_snowpack/pkg/lit-html/directives/unsafe-html.js';
-import markdownit from '../../_snowpack/pkg/markdown-it.js';
-import mila from '../../_snowpack/pkg/markdown-it-link-attributes.js';
-const MarkdownMixin = {
-  name: 'markdown-mixin',
-  created() {
-    this.listValueTransformations.push(this.transformValue.bind(this));
-  },
-  transformValue(value, listValueTransformations) {
-    let newValue = '';
-    if (value) {
-      const md = markdownit({
-        breaks: true,
-        html: false,
-        linkify: true
-      });
-      md.use(mila, {
-        attrs: {
-          target: '_blank',
-          rel: 'noopener'
-        }
-      });
-      const html = md.render(value);
-      newValue = unsafeHTML(html);
-    }
-    const nextProcessor = listValueTransformations.shift();
-    if (nextProcessor) nextProcessor(newValue, listValueTransformations);
-  }
-};
-export { MarkdownMixin };

package/dist/new-widgets/valueTransformationMixins/multilineMixin.js

@@ -1,13 +0,0 @@
-import { unsafeHTML } from '../../_snowpack/pkg/lit-html/directives/unsafe-html.js';
-const MultilineMixin = {
-  name: 'multiline-mixin',
-  created() {
-    this.listValueTransformations.push(this.transformValue.bind(this));
-  },
-  transformValue(value, listValueTransformations) {
-    const newValue = value ? unsafeHTML(value.replace(/\n/g, "<br/>")) : value;
-    const nextProcessor = listValueTransformations.shift();
-    if (nextProcessor) nextProcessor(newValue, listValueTransformations);
-  }
-};
-export { MultilineMixin };