@startinblox/core 0.18.1 → 0.19.0-beta.10

package/dist/new-widgets/templates/formTemplatesDirectory.js

@@ -1,432 +0,0 @@
-import { FormMixin } from '../templatesDependencies/formMixin.js';
-import { FormCheckboxMixin } from '../templatesDependencies/formCheckboxMixin.js';
-import { FormMinMaxMixin } from '../templatesDependencies/formMinMaxMixin.js';
-import { FormNumberMixin } from '../templatesDependencies/formNumberMixin.js';
-import { FormDropdownMixin } from '../templatesDependencies/formDropdownMixin.js';
-import { FormCheckboxesMixin } from '../templatesDependencies/formCheckboxesMixin.js';
-import { FormRadioMixin } from '../templatesDependencies/formRadioMixin.js';
-import { FormFileMixin } from '../templatesDependencies/formFileMixin.js';
-import { MultipleFormMixin } from '../templatesDependencies/multipleFormMixin.js';
-import { MultipleselectFormMixin } from '../templatesDependencies/multipleselectFormMixin.js';
-import { RangeMixin } from '../templatesDependencies/rangeMixin.js';
-import { FilterRangeFormMixin } from '../templatesDependencies/filterRangeFormMixin.js';
-import { ValueRichtextMixin } from '../templatesDependencies/valueRichtextMixin.js';
-import { PatternMixin } from '../templatesDependencies/patternMixin.js';
-import { FormStepMixin } from '../templatesDependencies/formStepMixin.js';
-import { FormLengthMixin } from '../templatesDependencies/formLengthMixin.js';
-import { html } from '../../_snowpack/pkg/lit-html.js';
-import { ifDefined } from '../../_snowpack/pkg/lit-html/directives/if-defined.js';
-export const formTemplates = {
-  text: {
-    template: (value, attributes) => html`
-      <input
-        type="text"
-        placeholder=${ifDefined(attributes.placeholder)}
-        name=${ifDefined(attributes.name)}
-        id=${ifDefined(attributes.id)}
-        value=${value || ''}
-        pattern=${ifDefined(attributes.pattern)}
-        title=${ifDefined(attributes.title)}
-        ?required=${attributes.required}
-        autocomplete=${ifDefined(attributes.autocomplete)}
-        data-holder
-        maxlength=${ifDefined(attributes.maxlength)}
-        minlength=${ifDefined(attributes.minlength)}
-        @change=${attributes.onChange}
-      />
-    `,
-    dependencies: [FormMixin, PatternMixin, FormLengthMixin]
-  },
-  textarea: {
-    template: (value, attributes) => html`
-      <textarea
-        name=${ifDefined(attributes.name)}
-        id=${ifDefined(attributes.id)}
-        placeholder=${ifDefined(attributes.placeholder)}
-        data-holder
-        ?required=${attributes.required}
-        autocomplete=${ifDefined(attributes.autocomplete)}
-        maxlength=${ifDefined(attributes.maxlength)}
-        minlength=${ifDefined(attributes.minlength)}
-        @change=${attributes.onChange}
-      >${value}</textarea>
-    `,
-    dependencies: [FormMixin, FormLengthMixin]
-  },
-  checkbox: {
-    template: (value, attributes) => html`
-      <label>
-        <input
-          data-holder
-          type="checkbox"
-          name=${ifDefined(attributes.name)}
-          ?required=${attributes.required}
-          ?checked=${value === 'true'}
-          @change=${attributes.onChange}
-        >
-        <div>${attributes.label || attributes.name}</div>
-      </label>
-    `,
-    dependencies: [FormCheckboxMixin, FormMixin]
-  },
-  date: {
-    template: (_value, attributes) => html`
-      <input
-        type="date"
-        placeholder=${ifDefined(attributes.placeholder)}
-        name=${ifDefined(attributes.name)}
-        id=${ifDefined(attributes.id)}
-        ?required=${attributes.required}
-        value=${ifDefined(attributes.originalValue)}
-        data-holder
-        @change=${attributes.onChange}
-      />
-    `,
-    dependencies: [FormMixin]
-  },
-  rangedate: {
-    template: (_value, attributes) => html`
-      <input
-        data-holder
-        type="date"
-        name="${attributes.name || ''}-start"
-        @change=${attributes.onChange}
-        value=${ifDefined(attributes.startValue)}
-        />
-        <input
-        data-holder
-        type="date"
-        name="${attributes.name || ''}-end"
-        @change=${attributes.onChange}
-        value=${ifDefined(attributes.endValue)}
-      />
-    `,
-    dependencies: [FilterRangeFormMixin, FormMixin]
-  },
-  number: {
-    template: (value, attributes) => html`
-      <input
-        type="number"
-        placeholder=${ifDefined(attributes.placeholder)}
-        name=${ifDefined(attributes.name)}
-        id=${ifDefined(attributes.id)}
-        value=${value}
-        min=${ifDefined(attributes.min)}
-        max=${ifDefined(attributes.max)}
-        step=${ifDefined(attributes.step)}
-        ?required=${attributes.required}
-        data-holder
-        @change=${attributes.onChange}
-      />
-    `,
-    dependencies: [FormNumberMixin, FormMinMaxMixin, FormMixin, FormStepMixin]
-  },
-  rangenumber: {
-    template: (_value, attributes) => html`
-      <input
-        data-holder
-        type="number"
-        name="${attributes.name || ''}-start"
-        @change=${attributes.onChange}
-        value=${ifDefined(attributes.startValue)}
-      />
-      <input
-        data-holder
-        type="number"
-        name="${attributes.name || ''}-end"
-        @change=${attributes.onChange}
-        value=${ifDefined(attributes.endValue)}
-      />
-    `,
-    dependencies: [FilterRangeFormMixin, FormNumberMixin, FormMixin]
-  },
-  hidden: {
-    template: (value, attributes) => html`
-      <input
-        type="hidden"
-        name=${ifDefined(attributes.name)}
-        value=${value}
-        data-holder
-        @change=${attributes.onChange}
-      />
-    `,
-    dependencies: [FormMixin]
-  },
-  dropdown: {
-    template: (value, attributes) => html`
-      <select
-        name=${ifDefined(attributes.name)}
-        id=${ifDefined(attributes.id)}
-        data-holder
-        ?required=${attributes.required}
-        ?multiple=${attributes.multiple}
-        autocomplete=${ifDefined(attributes.autocomplete)}
-        @change=${attributes.onChange}
-      >
-        ${!(attributes.multiple || attributes.autocomplete) ? html`
-        <option value="" ?selected=${value === ""}>
-          ${attributes.placeholder || '-'}
-        </option>
-        ` : ''}
-        ${(attributes.range || []).map(el => html`
-          <option
-            value=${el.value}
-            ?selected=${!attributes.multiple ? value === el.selectedValue : attributes.values.includes(el.selectedValue)}
-          >
-            ${el.label}
-          </option>
-        `)}
-        ${Object.entries(attributes.enum || []).map(_ref => {
-      let [key, val] = _ref;
-      return html`
-          <option
-            value="${key}"
-            ?selected=${!attributes.multiple ? value === key : attributes.values.includes(key)}
-          >
-            ${val}
-          </option>
-        `;
-    })}
-      </select>
-    `,
-    dependencies: [FormDropdownMixin, FormMixin, RangeMixin]
-  },
-  radio: {
-    template: (value, attributes) => html`
-      <div
-        name=${ifDefined(attributes.name)}
-      >
-        ${(attributes.range || []).map(el => html`
-          <label>
-            <input
-              type="radio"
-              name=${ifDefined(attributes.id)}
-              value=${el.value}
-              ?required=${attributes.required}
-              ?checked=${value === el.selectedValue}
-            > <span>${el.label}</span>
-          </label>
-        `)}
-        ${Object.entries(attributes.enum || []).map(_ref2 => {
-      let [key, val] = _ref2;
-      return html`
-          <label>
-            <input
-              type="radio"
-              value="${key}"
-              name=${ifDefined(attributes.id)}
-              ?required=${attributes.required}
-              ?checked=${value === key}
-            > <span>${val}</span>
-          </label>
-        `;
-    })}
-    `,
-    dependencies: [FormRadioMixin, FormMixin, RangeMixin]
-  },
-  multicheckbox: {
-    template: (_value, attributes) => html`
-      <div
-        name=${ifDefined(attributes.name)}
-      >
-        ${(attributes.range || []).map(el => html`
-          <label>
-            <input
-              type="checkbox"
-              value=${el.value}
-              ?checked=${attributes.values.includes(el.selectedValue)}
-            /> <span>${el.label}</span>
-          </label>
-        `)}
-        ${Object.entries(attributes.enum || []).map(_ref3 => {
-      let [key, val] = _ref3;
-      return html`
-          <label>
-            <input type="checkbox"
-              value="${key}"
-            /> <span>${val}</span>
-          </label>
-        `;
-    })}
-      </select>
-    `,
-    dependencies: [FormCheckboxesMixin, FormMixin, RangeMixin]
-  },
-  checkboxes: {
-    template: (_value, attributes) => html`
-      <solid-form-multicheckbox
-        data-holder
-        name=${ifDefined(attributes.name)}
-        range=${ifDefined(attributes.range)}
-        enum=${ifDefined(attributes.enum)}
-        values=${ifDefined(attributes.values)}
-        order-asc=${ifDefined(attributes.orderAsc)}
-        order-desc=${ifDefined(attributes.orderDesc)}
-        ?required=${attributes.required}
-      ></solid-form-multicheckbox>
-    `,
-    dependencies: [MultipleselectFormMixin, FormMixin]
-  },
-  multiple: {
-    template: (_value, attributes) => html`
-      ${(attributes.children || []).map((child, index) => html`
-        <div data-index=${attributes.name + index}>
-          ${child}
-          <button type="button" class=${ifDefined(attributes.removeClass)} @click=${() => attributes.removeItem(index)}>${attributes.removeLabel}</button>
-        </div>
-      `)}
-      <button type="button" class=${ifDefined(attributes.addClass)} @click=${attributes.addItem}>${attributes.addLabel}</button>
-    `,
-    dependencies: [MultipleFormMixin, FormMixin]
-  },
-  multipleselect: {
-    template: (_value, attributes) => html`
-      <solid-form-dropdown
-        data-holder
-        name=${ifDefined(attributes.name)}
-        data-id=${ifDefined(attributes.id)}
-        range=${ifDefined(attributes.range)}
-        values=${ifDefined(attributes.values)}
-        order-asc=${ifDefined(attributes.orderAsc)}
-        order-desc=${ifDefined(attributes.orderDesc)}
-        ?required=${attributes.required}
-        multiple
-      ></solid-form-dropdown>
-    `,
-    dependencies: [MultipleselectFormMixin, FormMixin]
-  },
-  file: {
-    template: (value, attributes) => html`
-      <div>
-        <input
-          data-holder
-          type="text"
-          ?required=${attributes.required}
-          name=${ifDefined(attributes.name)}
-          value=${value || ''}
-        >
-        <input
-          type="file"
-          id=${ifDefined(attributes.id)}
-          value=${ifDefined(attributes.fileValue)}
-          @change=${attributes.selectFile}
-        />
-        <button
-          ?hidden=${attributes.resetButtonHidden}
-          @click=${attributes.resetFile}
-        >×</button>
-        <span>${attributes.output}</span>
-      </div>
-    `,
-    dependencies: [FormFileMixin, FormMixin]
-  },
-  image: {
-    template: (value, attributes) => html`
-      <div>
-        <input
-          data-holder
-          type="text"
-          name=${ifDefined(attributes.name)}
-          value=${value || ''}
-          ?required=${attributes.required}
-        >
-        <input
-          type="file"
-          accept="image/*"
-          id=${ifDefined(attributes.id)}
-          value=${ifDefined(attributes.fileValue)}
-          @change=${attributes.selectFile}
-        />
-        <img
-          src=${value || ''}
-          ?hidden=${value === ''}
-        />
-        <button
-          ?hidden=${attributes.resetButtonHidden}
-          @click=${attributes.resetFile}
-        >×</button>
-        <span>${attributes.output}</span>
-      </div>
-    `,
-    dependencies: [FormFileMixin, FormMixin]
-  },
-  richtext: {
-    template: (_value, attributes) => html`
-      <div 
-        data-richtext
-        name=${ifDefined(attributes.name)}
-        data-holder
-      ></div>
-    `,
-    dependencies: [ValueRichtextMixin, FormMixin]
-  },
-  color: {
-    template: (_value, attributes) => html`
-      <input
-        type="color"
-        placeholder=${ifDefined(attributes.placeholder)}
-        id=${ifDefined(attributes.id)}
-        name=${ifDefined(attributes.name)}
-        ?required=${attributes.required}
-        value=${ifDefined(attributes.originalValue)}
-        data-holder
-        @change=${attributes.onChange}
-      />
-    `,
-    dependencies: [FormMixin]
-  },
-  email: {
-    template: (value, attributes) => html`
-      <input
-        type="email"
-        placeholder=${ifDefined(attributes.placeholder)}
-        id=${ifDefined(attributes.id)}
-        name=${ifDefined(attributes.name)}
-        value=${value || ''}
-        ?required=${attributes.required}
-        data-holder
-        maxlength=${ifDefined(attributes.maxlength)}
-        minlength=${ifDefined(attributes.minlength)}
-        @change=${attributes.onChange}
-      />
-    `,
-    dependencies: [FormMixin, FormLengthMixin]
-  },
-  password: {
-    template: (value, attributes) => html`
-      <input
-        type="password"
-        placeholder=${ifDefined(attributes.placeholder)}
-        id=${ifDefined(attributes.id)}
-        name=${ifDefined(attributes.name)}
-        value=${value || ''}
-        ?required=${attributes.required}
-        pattern=${ifDefined(attributes.pattern)}
-        title=${ifDefined(attributes.title)}
-        data-holder
-        maxlength=${ifDefined(attributes.maxlength)}
-        minlength=${ifDefined(attributes.minlength)}
-        @change=${attributes.onChange}
-      />
-    `,
-    dependencies: [FormMixin, PatternMixin, FormLengthMixin]
-  },
-  time: {
-    template: (value, attributes) => html`
-      <input
-        type="time"
-        placeholder=${ifDefined(attributes.placeholder)}
-        name=${ifDefined(attributes.name)}
-        id=${ifDefined(attributes.id)}
-        value=${value || ''}
-        min=${ifDefined(attributes.min)}
-        max=${ifDefined(attributes.max)}
-        step=${ifDefined(attributes.step)}
-        ?required=${attributes.required}
-        data-holder
-        @change=${attributes.onChange}
-      />
-    `,
-    dependencies: [FormMixin, FormMinMaxMixin, FormStepMixin]
-  }
-};

package/dist/new-widgets/templates/groupTemplatesDirectory.js

@@ -1,11 +0,0 @@
-import { html } from '../../_snowpack/pkg/lit-html.js';
-import { SetMixin } from '../templatesDependencies/setMixin.js';
-export const groupTemplates = {
-  default: {
-    template: value => html`
-      <span>${value}</span>
-      <div data-content></div>
-    `,
-    dependencies: [SetMixin]
-  }
-};

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

@@ -1,6 +0,0 @@
-import { defaultTemplates } from './defaultTemplatesDirectory.js';
-import { displayTemplates } from './displayTemplatesDirectory.js';
-import { formTemplates } from './formTemplatesDirectory.js';
-import { setTemplates } from './setTemplatesDirectory.js';
-import { groupTemplates } from './groupTemplatesDirectory.js';
-export { defaultTemplates, displayTemplates, formTemplates, setTemplates, groupTemplates };

package/dist/new-widgets/templates/setTemplatesDirectory.js

@@ -1,16 +0,0 @@
-import { html } from '../../_snowpack/pkg/lit-html.js';
-import { SetMixin } from '../templatesDependencies/setMixin.js';
-export const setTemplates = {
-  default: {
-    template: () => html``,
-    dependencies: [SetMixin]
-  },
-  div: {
-    template: () => html`<div data-content></div>`,
-    dependencies: [SetMixin]
-  },
-  ul: {
-    template: () => html`<ul data-content></ul>`,
-    dependencies: [SetMixin]
-  }
-};

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

@@ -1,12 +0,0 @@
-const AltMixin = {
-  name: 'alt-mixin',
-  attributes: {
-    alt: {
-      type: String,
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'alt');
-      }
-    }
-  }
-};
-export { AltMixin };

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

@@ -1,60 +0,0 @@
-import { StoreMixin } from '../../mixins/storeMixin.js';
-import { store } from '../../libs/store/store.js';
-import { html } from '../../_snowpack/pkg/lit-html.js';
-const EditableMixin = {
-  name: 'editable-mixin',
-  use: [StoreMixin],
-  // used to get context
-  attributes: {
-    editable: {
-      type: Boolean,
-      default: null,
-      callback: function (newValue) {
-        if (newValue !== null) this.listAttributes['editable'] = true;
-      }
-    },
-    valueId: {
-      type: String,
-      default: ''
-    }
-  },
-  created() {
-    this.listTemplateAdditions.push(this.addEditButton.bind(this));
-  },
-  addEditButton(template, listTemplateAdditions) {
-    let newTemplate = null;
-    if (this.editable !== null) {
-      newTemplate = html`
-        ${template}
-        <button @click=${this.activateEditableField.bind(this)}>Modifier</button>
-      `;
-    }
-    const nextProcessor = listTemplateAdditions.shift();
-    if (nextProcessor) nextProcessor(newTemplate || template, listTemplateAdditions);
-  },
-  activateEditableField(e) {
-    const editableField = this.element.querySelector('[data-editable]');
-    const editButton = e.target;
-
-    // Set attributes
-    editableField.toggleAttribute('contenteditable', true);
-    editableField.focus();
-    editButton.toggleAttribute('disabled', true);
-
-    // Save on focusout
-    editableField.addEventListener('focusout', () => this.save(editableField, editButton));
-  },
-  save(editableField, editButton) {
-    editableField.toggleAttribute('contenteditable', false);
-    editButton.removeAttribute('disabled');
-    if (!this.name || !this.valueId) {
-      console.warn('Some attributes are missing to perform the update');
-      return;
-    }
-    const resource = {};
-    resource[this.name] = editableField.innerText;
-    resource['@context'] = this.context;
-    store.patch(resource, this.valueId);
-  }
-};
-export { EditableMixin };

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

@@ -1,34 +0,0 @@
-const FilterRangeFormMixin = {
-  name: 'filter-range-form-mixin',
-  attributes: {
-    startValue: {
-      type: String,
-      default: '',
-      callback: function (value) {
-        this.addToAttributes(this.getDefaultValue(value), "startValue");
-      }
-    },
-    endValue: {
-      type: String,
-      default: '',
-      callback: function (value) {
-        this.addToAttributes(this.getDefaultValue(value), "endValue");
-      }
-    }
-  },
-  getDefaultValue(value) {
-    if (value == "today") return new Date().toISOString().split("T")[0];
-    return value;
-  },
-  getValue() {
-    if (!this.dataHolder) return [];
-    if (this.dataHolder.length !== 2) this.showDataHolderError(2, this.dataHolder.length);
-    return [
-    // we expect 2 values, one min and one max
-    this.getValueFromElement(this.dataHolder[0]), this.getValueFromElement(this.dataHolder[1])];
-  },
-  get type() {
-    return 'range';
-  }
-};
-export { FilterRangeFormMixin };

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

@@ -1,10 +0,0 @@
-const FormCheckboxMixin = {
-  name: 'form-checkbox-mixin',
-  getValueFromElement(element) {
-    return element.checked;
-  },
-  get type() {
-    return 'boolean';
-  }
-};
-export { FormCheckboxMixin };

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

@@ -1,41 +0,0 @@
-const FormCheckboxesMixin = {
-  name: 'form-checkboxes-mixin',
-  attributes: {
-    values: {
-      type: String,
-      default: '',
-      callback: function (value) {
-        if (!value) return;
-        try {
-          this.listAttributes['values'] = JSON.parse(value);
-        } catch (e) {
-          console.error(e);
-          this.listAttributes['values'] = [];
-        }
-        this.render();
-        this.element.dispatchEvent(new Event('change'));
-      }
-    }
-  },
-  created() {
-    this.listAttributes['values'] = [];
-  },
-  getValue() {
-    const options = Array.from(this.element.querySelectorAll('input'));
-    return options.filter(el => el.checked).map(el => {
-      if (!el.value) return null;
-      let value = el.value;
-      try {
-        value = JSON.parse(el.value);
-      } catch (e) {}
-      return value;
-    });
-  },
-  get type() {
-    return this.enum === '' ? 'resource' : 'string';
-  },
-  get multiple() {
-    return true;
-  }
-};
-export { FormCheckboxesMixin };

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

@@ -1,56 +0,0 @@
-const FormDropdownMixin = {
-  name: 'form-dropdown-mixin',
-  attributes: {
-    values: {
-      // used to set more than 1 value, for multiple select
-      type: String,
-      default: '',
-      callback: function (value) {
-        if (value) {
-          try {
-            this.listAttributes['values'] = JSON.parse(value);
-          } catch (e) {
-            console.error(e);
-            this.listAttributes['values'] = [];
-          }
-          this.render(); // use render to make sure the dispatch always happen after
-          this.dispatchChange();
-        }
-      }
-    },
-    dataId: {
-      type: String,
-      default: '',
-      callback: function (newValue) {
-        this.addToAttributes(newValue, 'id');
-      }
-    }
-  },
-  created() {
-    this.listAttributes['values'] = [];
-    if (this.multiple) this.listAttributes['multiple'] = true;
-  },
-  dispatchChange() {
-    if (!this.element.querySelector('select')) return;
-    this.element.querySelector('select').dispatchEvent(new Event('change'));
-  },
-  getValue() {
-    if (!this.dataHolder) return ''; // no value
-    if (!this.multiple) {
-      // simple select
-      if (this.dataHolder.length > 1) this.showDataHolderError(1, this.dataHolder.length);
-      return this.getValueFromElement(this.dataHolder[0]);
-    }
-
-    // multiple select
-    const options = Array.from(this.element.querySelectorAll('option'));
-    return options.filter(el => el.selected).map(el => el.value ? JSON.parse(el.value) : null);
-  },
-  get type() {
-    return this.enum === '' ? 'resource' : 'string';
-  },
-  get multiple() {
-    return this.element.hasAttribute('multiple');
-  }
-};
-export { FormDropdownMixin };