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

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

@@ -1,21 +0,0 @@
-import { unsafeHTML } from '../../_snowpack/pkg/lit-html/directives/unsafe-html.js';
-const OembedMixin = {
-  name: 'oembed-mixin',
-  initialState: {
-    existingOembed: null
-  },
-  created() {
-    this.listValueTransformations.push(this.transformValue.bind(this));
-  },
-  async transformValue(value, listValueTransformations) {
-    if (!value) return;
-    if (this.existingOembed == null) {
-      const response = await fetch(this.value);
-      this.existingOembed = await response.json();
-    }
-    const newValue = unsafeHTML(this.existingOembed.html);
-    const nextProcessor = listValueTransformations.shift();
-    if (nextProcessor) nextProcessor(newValue, listValueTransformations);
-  }
-};
-export { OembedMixin };

package/dist/solid-template-element.js

@@ -1,144 +0,0 @@
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-///@ts-nocheck
-
-export default class SolidTemplateElement extends HTMLElement {
-  constructor() {
-    super();
-    _defineProperty(this, "renderPlanned", false);
-    _defineProperty(this, "strings", {});
-    _defineProperty(this, "translationsPath", null);
-    _defineProperty(this, "translationsFetched", false);
-    _defineProperty(this, "props", {});
-    this.initProps();
-  }
-  static get observedAttributes() {
-    return Object.values(this.propsDefinition);
-  }
-  static get propsDefinition() {
-    return {};
-  }
-  initProps() {
-    this.props = {};
-    for (let key in this.constructor.propsDefinition) {
-      this.props[key] = undefined;
-    }
-  }
-  updateProps() {
-    const declaredAttributes = [];
-
-    // Get props values
-    for (let key in this.constructor.propsDefinition) {
-      const def = this.constructor.propsDefinition[key];
-      if (typeof def === "string") {
-        this.props[key] = this.hasAttribute(def) ? this.getAttribute(def) : undefined;
-        declaredAttributes.push(def);
-      } else if (typeof def === "object" && def.attribute && typeof def.attribute === "string") {
-        this.props[key] = this.hasAttribute(def.attribute) ? this.getAttribute(def.attribute) : def.default || undefined;
-        declaredAttributes.push(def.attribute);
-      }
-    }
-
-    // Add attributes to props
-    for (let attr of this.attributes) {
-      if (!declaredAttributes.includes(attr.name)) {
-        // if attribute not in propsDefinition
-        this.props[this._camelize(attr.name)] = attr.value || undefined; // add it to props
-      }
-    }
-  }
-
-  /**
-   * Define the path folder of translations files
-   * @param path
-   */
-  setTranslationsPath(path) {
-    this.translationsPath = path;
-  }
-
-  /**
-   * Fetch all localized strings
-   */
-  async fetchLocaleStrings() {
-    if (this.translationsFetched) return;
-    const filesToFetch = [];
-    if (this.translationsPath)
-      // fetch component translations
-      filesToFetch.push(this.fetchTranslationFile(this.translationsPath));
-    const extraTranslationsPath = this.getAttribute('extra-translations-path');
-    if (extraTranslationsPath)
-      // fetch developer translations
-      filesToFetch.push(this.fetchTranslationFile(extraTranslationsPath));
-
-    // merge all translations
-    return Promise.all(filesToFetch).then(res => {
-      this.translationsFetched = true;
-      this.strings = Object.assign({}, ...res);
-    });
-  }
-
-  /**
-   * Fetch the translation file from [path]
-   */
-  async fetchTranslationFile(path) {
-    const ln = this.getLocale();
-    const fullPath = `${path}/${ln}.json`;
-    return fetch(fullPath).then(result => {
-      if (result.ok) {
-        return result.json() // parse content
-        .catch(e => console.error(`Error while parsing the translation file: ${fullPath}`));
-      }
-    }).catch(e => console.error(`Error while retrieving the translation file: ${fullPath}`));
-  }
-
-  /**
-   * Returns current locale of app
-   */
-  getLocale() {
-    return localStorage.getItem('language') || window.navigator.language.slice(0, 2);
-  }
-
-  /**
-   * Return localized string for [key]
-   * @param key
-   */
-  localize(key) {
-    return this.strings[key] || key;
-  }
-  attributeChangedCallback() {
-    this.updateProps();
-    this.planRender();
-  }
-  connectedCallback() {
-    this.updateProps();
-    this.planRender();
-  }
-
-  /**
-   * Plan a render if none is already waiting to prevent multi re-renders
-   */
-  planRender() {
-    if (!this.renderPlanned) {
-      this.renderPlanned = true;
-      setTimeout(() => {
-        this.render();
-        this.renderPlanned = false;
-      });
-    }
-  }
-  renderCallback() {}
-  render() {
-    this.fetchLocaleStrings().finally(() => {
-      // render even if some errors occurred
-      this.innerHTML = this.template(this.props);
-      this.renderCallback();
-    });
-  }
-  template() {
-    return '';
-  }
-  _camelize(str) {
-    return str.replace(/\W+(.)/g, (match, chr) => chr.toUpperCase());
-  }
-}

package/dist/style/default-theme.css.proxy.js

@@ -1,10 +0,0 @@
-// [snowpack] add styles to the page (skip if no document exists)
-if (typeof document !== 'undefined') {
-  const code = "/*==== SOLID-MAP ====*/\n/* map custom marker */\n.sib-custom-marker {\n  position: absolute;\n  top: 40%;\n  left: 50%;\n  margin-left: 115px;\n  border-radius: 50%;\n  border: 8px solid #1c78c9;\n  width: 8px;\n  height: 8px;\n}\n.sib-custom-marker::after {\n  position: absolute;\n  content: '';\n  width: 0px;\n  height: 0px;\n  bottom: -30px;\n  left: -6px;\n  border: 10px solid transparent;\n  border-top-width: 17px;\n  border-top-style: solid;\n  border-top-color: inherit;\n}";
-
-  const styleEl = document.createElement("style");
-  const codeEl = document.createTextNode(code);
-  styleEl.type = 'text/css';
-  styleEl.appendChild(codeEl);
-  document.head.appendChild(styleEl);
-}

package/dist/widgets/baseWidget.js

@@ -1,267 +0,0 @@
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-import { evalTemplateString } from '../libs/helpers.js';
-import { store } from '../libs/store/store.js';
-export class BaseWidget extends HTMLElement {
-  constructor(...args) {
-    super(...args);
-    _defineProperty(this, "src", void 0);
-    _defineProperty(this, "multiple", void 0);
-    _defineProperty(this, "editable", void 0);
-    _defineProperty(this, "required", void 0);
-    _defineProperty(this, "resourceId", void 0);
-    _defineProperty(this, "_value", void 0);
-    _defineProperty(this, "_range", void 0);
-    _defineProperty(this, "_context", void 0);
-    _defineProperty(this, "_subscriptions", new Map());
-  }
-  connectedCallback() {
-    this.render();
-  }
-  disconnectedCallback() {
-    this._subscriptions.forEach(subscription => {
-      PubSub.unsubscribe(subscription);
-    });
-  }
-  async render() {
-    this.innerHTML = await evalTemplateString(this.template, {
-      src: this.src,
-      name: this.name,
-      label: this.label,
-      placeholder: this.placeholder,
-      value: this.value,
-      id: this._value && this._value['@id'] || '',
-      escapedValue: this.escapedValue,
-      range: await this.htmlRange,
-      multiple: this.multiple,
-      editable: this.editable === '' ? true : false,
-      required: this.required === '' ? true : false
-    });
-    this.addEditButtons();
-    this.initChangeEvents();
-  }
-  get label() {
-    return this.hasAttribute('label') ? this.getAttribute('label') : this.name;
-  }
-  set label(label) {
-    if (label != null) this.setAttribute('label', label);
-    this.render();
-  }
-  get placeholder() {
-    return this.hasAttribute('placeholder') ? this.getAttribute('placeholder') : this.label;
-  }
-  set placeholder(placeholder) {
-    if (placeholder != null) this.setAttribute('placeholder', placeholder);
-    this.render();
-  }
-  get name() {
-    return this.getAttribute('name');
-  }
-  set name(name) {
-    if (name) this.setAttribute('name', name);
-    this.render();
-  }
-  get value() {
-    if (this.dataHolder) {
-      let values = this.dataHolder.map(element => {
-        if (element instanceof HTMLInputElement && element.type == "checkbox") return element.checked;
-        // if value is defined, push it in the array
-        return this.getValueHolder(element).value;
-      });
-      // If only one value, do not return an array
-      return values.length === 1 ? values[0] : values;
-    }
-    return this._value || '';
-  }
-  set value(value) {
-    this._value = value; // ... store `value` in the widget
-    if (this._value == null || this._value == undefined) return;
-    if (this.dataHolder && this.dataHolder.length === 1) {
-      // if one dataHolder in the widget...
-      const element = this.getValueHolder(this.dataHolder[0]);
-      if (element.type == "checkbox") {
-        element.checked = value;
-      } else {
-        element.value = value; // ... set `value` to the dataHolder element
-      }
-      // remove when https://git.happy-dev.fr/startinblox/framework/sib-core/issues/426 fixed
-      if (element.dispatchEvent) element.dispatchEvent(new Event('change')); // trigger change manually
-    } else if (this.dataHolder && this.dataHolder.length > 1) {
-      // if multiple dataHolder in the widget ...
-      this.dataHolder.forEach((el, index) => {
-        const element = this.getValueHolder(el);
-        if (element.type == "checkbox") {
-          element.checked = value ? value[index] : '';
-        } else {
-          element.value = value ? value[index] : '';
-        }
-        element.dispatchEvent(new Event('change')); // trigger change manually
-      }); // ... set each `value` to each dataHolder element
-    }
-
-    this.render();
-  }
-  get ['each-label']() {
-    return this.getAttribute('each-label') || '';
-  }
-  set ['each-label'](label) {
-    this.setAttribute('each-label', label);
-  }
-  set ['add-label'](label) {
-    this.setAttribute('add-label', label);
-  }
-  set ['remove-label'](label) {
-    this.setAttribute('remove-label', label);
-  }
-  get dataHolder() {
-    const widgetDataHolders = Array.from(this.querySelectorAll('[data-holder]')).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 || !dataHolderAncestor || !this.contains(dataHolderAncestor);
-    });
-    return widgetDataHolders.length ? widgetDataHolders : null;
-  }
-  get template() {
-    return '';
-  }
-  get childTemplate() {
-    return '';
-  }
-  get escapedValue() {
-    return ('' + this.value).replace(/&/g, '&').replace(/'/g, ''').replace(/"/g, '"');
-  }
-  set context(value) {
-    this._context = value;
-  }
-  get context() {
-    return this._context || {};
-  }
-  get range() {
-    return this.fetchSources(this._range);
-  }
-  set range(range) {
-    (async () => {
-      this._listen(range, async () => this._range = await store.getData(range, this.context));
-      this._range = await store.getData(range, this.context);
-      this.render();
-    })();
-  }
-  async fetchSources(resource) {
-    if (!resource || !resource['ldp:contains']) return null;
-    let resources = [];
-    let index = 0;
-    for (let res of resource['ldp:contains']) {
-      if (!res) {
-        // child not in cache yet
-        try {
-          const resourceId = resource.getChildren('ldp:contains')[index]['@id'];
-          res = await store.getData(resourceId, this.context);
-        } catch (e) {
-          continue;
-        }
-      }
-      if (res.isContainer?.()) {
-        // if nested container
-        let resourcesFromContainer = await store.getData(res['@id'], this.context); // fetch the datas
-        this._listen(res['@id']);
-        if (resourcesFromContainer) resources.push(...resourcesFromContainer['ldp:contains']);
-      } else {
-        resources.push(res);
-      }
-      index++;
-    }
-    return resources;
-  }
-  get htmlRange() {
-    return (async () => {
-      let htmlRange = '';
-      const rangeResources = await this.range;
-      if (!rangeResources) return;
-      for await (let element of rangeResources) {
-        element = await store.getData(element['@id'], this.context); // fetch the resource to display the name
-        this._listen(element['@id']);
-        let selected;
-        if (this._value && this._value.isContainer && this._value.isContainer()) {
-          // selected options for multiple select
-          selected = false;
-          for await (let value of this._value["ldp:contains"]) {
-            if (value['@id'] == element['@id']) {
-              selected = true;
-              break;
-            }
-          }
-        } else {
-          // selected options for simple dropdowns
-          selected = this._value ? this._value['@id'] == element['@id'] : false;
-        }
-        htmlRange += await evalTemplateString(this.childTemplate, {
-          name: await element.name,
-          id: element['@id'],
-          selected: selected
-        });
-      }
-      return htmlRange || '';
-    })();
-  }
-  getValueHolder(element) {
-    return element.component ? element.component : element;
-  }
-  subscribe(event) {
-    this._listen(event);
-  }
-  _listen(id, callback = () => {}) {
-    if (!this._subscriptions.get(id)) {
-      this._subscriptions.set(id, PubSub.subscribe(id, async () => {
-        await callback();
-        this.render();
-      }));
-    }
-  }
-
-  // Editable widgets
-  addEditButtons() {
-    const editableField = this.querySelector('[data-editable]');
-    if (editableField) {
-      // Add edit button
-      const editButton = document.createElement('button');
-      editButton.innerText = "Modifier";
-      editButton.onclick = () => this.activateEditableField(editableField, editButton);
-      editableField.insertAdjacentElement('afterend', editButton);
-
-      // Save on focusout
-      editableField.addEventListener('focusout', () => this.save(editableField, editButton));
-    }
-  }
-  activateEditableField(editableField, editButton) {
-    editableField.setAttribute('contenteditable', 'true');
-    editableField.focus();
-    editButton.setAttribute("disabled", "disabled");
-  }
-  /**
-   * Dispatch change events of data holders from the current widget
-   */
-  initChangeEvents() {
-    if (this.dataHolder) {
-      const event = new Event('change', {
-        bubbles: true
-      });
-      this.dataHolder.forEach(element => {
-        element.addEventListener('change', e => {
-          e.preventDefault();
-          e.stopPropagation();
-          this.dispatchEvent(event);
-        });
-      });
-    }
-  }
-  save(editableField, editButton) {
-    editableField.setAttribute('contenteditable', 'false');
-    editButton.removeAttribute("disabled");
-    if (!this.name) return;
-    const resource = {};
-    resource[this.name] = editableField.innerText;
-    resource['@context'] = this.context;
-    if (this.resourceId && resource) store.patch(resource, this.resourceId);
-  }
-}

package/dist/widgets/widget-factory.js

@@ -1,20 +0,0 @@
-import { BaseWidget } from './baseWidget.js';
-import { defineComponent } from '../libs/helpers.js';
-export const widgetFactory = (tagName, customTemplate, childTemplate = '', callback) => {
-  const registered = customElements.get(tagName);
-  if (registered) return registered;
-  const cls = class extends BaseWidget {
-    async render() {
-      await super.render();
-      if (callback) callback(this);
-    }
-    get template() {
-      return customTemplate;
-    }
-    get childTemplate() {
-      return childTemplate;
-    }
-  };
-  defineComponent(tagName, cls);
-  return cls;
-};