free-fe-core-modules 0.0.2 → 0.0.4

package/free-fields/Droppable.js

@@ -1,114 +0,0 @@
-import { defineComponent, h, ref } from 'vue';
-
-export default defineComponent({
-  name: "FreeFieldDroppable",
-  props: {
-    exact: Boolean,
-    dataName: [String, Array],
-    notToDraggable: Boolean,
-    enterClass: String,
-    enterStyle: {
-      type: Object,
-      default: () => ({})
-    }
-  },
-  emits: ['freeTrigger', 'drop'],
-  setup(props, { emit, slots }){
-    const selfRef = ref(null);
-    const originalStyle = {};
-
-    const getTransferData = (e) => {
-      let dropData;
-      if(typeof props.dataName === 'string') {
-        dropData = e.dataTransfer.getData(props.dataName);
-      } else if(Array.isArray(props.dataName)) {
-        dropData = {};
-        for(let dn of props.dataName) {
-          const dd = e.dataTransfer.getData(dn);
-
-          if(dd) {
-            dropData = `{"${dn}": ${dd}}`
-
-            break;
-          }
-        }
-      } else {
-        dropData = e.dataTransfer.getData('data')
-      }
-
-      return dropData || "";
-    }
-
-    const onDragenter =  (e) => {
-      if(props.exact && e.target !== selfRef.value) {
-        return;
-      }
-
-      Object.keys(props.enterStyle).forEach(sk => {
-        originalStyle[sk] = e.target.style[sk];
-      });
-
-      if (props.notToDraggable && e.target.draggable === true) {
-        return;
-      }
-
-      e.target.classList.add(props.enterClass);
-      Object.keys(originalStyle).forEach(sk => {
-        e.target.style[sk] = props.enterStyle[sk];
-      });
-    }
-
-    const onDragleave =  (e) => {
-      if(props.exact && e.target !== selfRef.value) {
-        return;
-      }
-
-      e.target.classList.remove(props.enterClass);
-      Object.keys(originalStyle).forEach(sk => {
-        e.target.style[sk] = originalStyle[sk];
-      });
-    }
-
-    const onDragover =  (e) => {
-      e.preventDefault()
-    }
-
-    const onDrop =  (e) => {
-      if(props.exact && e.target !== selfRef.value) {
-        return;
-      }
-
-      e.preventDefault()
-
-      // don't drop on other draggables
-      if (props.notToDraggable && e.target.draggable === true) {
-        return;
-      }
-
-      let dropData = getTransferData(e);
-
-      try{
-        dropData = dropData &&  JSON.parse(dropData);
-      } catch(_) {
-        dropData = "";
-      }
-
-      if(dropData) {
-        emit('drop', dropData);
-      }
-
-      e.target.classList.remove(props.enterClass);
-      Object.keys(originalStyle).forEach(sk => {
-        e.target.style[sk] = originalStyle[sk];
-      });
-    }
-
-    return () => h('div', {
-      ref: selfRef,
-      onDragenter,
-      onDragleave,
-      onDragover,
-      onDrop,
-    }, slots.default ? slots.default() : undefined)
-  }
-})

package/free-fields/EditableString.js

@@ -1,63 +0,0 @@
-import {
-  defineComponent,
-  h,
-  ref,
-  computed,
-  nextTick,
-} from "vue";
-
-export default defineComponent({
-  name: "FreeFieldEditableString",
-  props: {
-    modelValue: [String, Number],
-    debounce: Number
-  },
-  emits: ["update:modelValue"],
-  setup(props, { emit }) {
-    const editable = ref(false);
-    const inputRef = ref(null);
-
-    const inputEvent = (e) => {
-      const vv = typeof props.modelValue === 'number' ? (Number(e.target.value) || 0) : e.target.value;
-      emit("update:modelValue", vv);
-      editable.value = false;
-    };
-
-    const renderH = computed(() => {
-      if(editable.value) {
-        return h("input", {
-          style: "outline: none; border: none;padding: 0;margin:0;width: 100%;",
-          ref: inputRef,
-          value: props.modelValue || '',
-          onKeydown: (e) => e.code === 'Enter' && inputRef.value.blur(),
-          onBlur: inputEvent,
-          onClick: (e) => {
-            e.cancelBubble = true;
-            e.preventDefault();
-          },
-        });
-      }
-
-      return h(
-          "div",
-          {
-            class: "",
-            style: "min-width: 4px; min-height: 12px;",
-            onClick: (e) => {
-              e.cancelBubble = true;
-              e.preventDefault();
-              editable.value = true;
-              nextTick(() => {
-                inputRef.value.focus();
-              });
-            },
-          },
-          [
-            props.modelValue
-          ]
-        );
-    })
-
-    return () => renderH.value;
-  },
-});

package/free-fields/FieldCategory.js

@@ -1,83 +0,0 @@
-import {
-  defineComponent,
-  h,
-  ref,
-  computed,
-  nextTick,
-} from "vue";
-import { QSpace, QSeparator } from 'quasar';
-
-export default defineComponent({
-  name: "FreeFieldCategory",
-  props: {
-    hide: Boolean,
-    hidden: Boolean,
-    line: Boolean,
-    title: String,
-    titleClass: String,
-    titleStyle: String,
-    showLabel: {
-      type: String,
-      default: 'Show'
-    },
-    hideLabel: {
-      type: String,
-      default: 'Hide'
-    },
-    titleClickable: Boolean,
-    showLabelWhenHidden: Boolean
-  },
-  setup(props, { slots }) {
-    const hidden = ref(props.hidden || false);
-    const hovered = ref(false);
-    const titleClickable = props.titleClickable && props.hide;
-
-    return () => h('div',{
-      class: 'free-field-category',
-      style: 'font-size: 16px;'
-    },[
-      h('div', {
-        class: `free-field-category-title row no-wrap text-grey-9 ${titleClickable ? 'cursor-pointer' : ''}`,
-        onMouseenter: () => {
-          nextTick(() => {
-            hovered.value = true
-          })
-        },
-        onMouseleave: () => {
-          nextTick(() => {
-            hovered.value = false
-          })
-        },
-        onClick: () => {
-          if(!titleClickable) return;
-
-          nextTick(() => {
-            hidden.value = !hidden.value;
-          })
-        }
-      },
-      [
-        h('div', {
-          class: props.titleClass || 'q-mb-sm',
-          style: props.titleStyle,
-        } ,props.title || ''),
-        h(QSpace),
-        props.hide ? ((hovered.value || (props.showLabelWhenHidden && hidden.value)) ? h('div', {
-          class: `free-field-category-hide-btn cursor-pointer ${props.titleClass}`,
-          style: props.titleStyle,
-          onClick: () => {
-            if(props.titleClickable) return;
-
-            nextTick(() => {
-              hidden.value = !hidden.value;
-            })
-          }
-        } ,(hidden.value ? props.showLabel : props.hideLabel) || '') : undefined) : undefined,
-      ]),
-      slots.default ? (hidden.value ? undefined : slots.default()) : undefined,
-      props.line ? h(QSeparator, {
-        class: 'free-field-category-line q-my-sm'
-      }) : undefined,
-    ]);
-  },
-});

package/free-fields/FieldTypeSelect.js

@@ -1,94 +0,0 @@
-import {
-  defineComponent,
-  h,
-} from "vue";
-import { QIcon, QItem, QItemSection,QSelect } from 'quasar';
-
-const dataTypeIcons = {
-  String:"text_snippet",
-  Number:"looks_one",
-  Boolean:"toggle_on",
-  Date:"event",
-  Time:"schedule",
-  Array:"data_array",
-  Object:"data_object"
-}
-
-export default defineComponent({
-  name: "FreeFieldTypeSelect",
-  props: {
-    types: Array,
-    modelValue: String,
-    showLabel: Boolean,
-    dense: {
-      type: Boolean,
-      default: true
-    }
-  },
-  emits: ['update:modelValue'],
-  setup(props, { emit }) {
-    const options = props.types || [
-      {
-        value: "String",
-        label: "String",
-        icon: 'text_snippet'
-      },
-      {
-        value: "Number",
-        label: "Number",
-        icon: 'looks_one'
-      },
-      {
-        value: "Boolean",
-        label: "Boolean",
-        icon: 'toggle_on'
-      },
-      {
-        value: "Array",
-        label: "Array",
-        icon: 'data_array'
-      },
-      {
-        value: "Object",
-        label: "Object",
-        icon: 'data_object'
-      },
-    ];
-
-    return () => h(QSelect, {
-      dense: props.dense,
-      'options-dense': props.dense,
-      borderless: true,
-      rounded: true,
-      standout: true,
-      'hide-dropdown-icon': true,
-      'hide-bottom-space': true,
-      modelValue: props.modelValue,
-      class: '',
-      'popup-content-style': props.dense ? 'min-width: 60px; width: 60px; overflow: hidden;' : '',
-      options,
-      "onUpdate:modelValue": (e) => emit("update:modelValue", e.value),
-    },{
-      option: (op) => h(QItem, {
-        ...op.itemProps,
-      }, () => [
-        h(QItemSection, {
-          class: 'q-ma-none q-pa-none',
-          avatar: true
-        }, () => h(QIcon, {
-          name: op.opt.icon
-        })),
-        props.showLabel ? h(QItemSection, {
-          class: 'q-ma-none q-pa-none',
-          avatar: true
-        }, () => props.showLabel ? op.opt.label : '') : undefined]),
-      'selected-item': (op) => h(QIcon, {
-        class: 'bg-grey-3 q-pa-xs self-center',
-        style: 'border-radius: 50%; margin: 0 auto;',
-        size: props.dense ? 'xs' : 'sm',
-        dense: props.dense,
-        name: dataTypeIcons[op.opt],
-      }),
-    });
-  },
-});

package/free-fields/fieldEditors/arrayEditor.js

@@ -1,3 +0,0 @@
-import jsonEditor from "./jsonEditor";
-
-export default jsonEditor(true);

package/free-fields/fieldEditors/boolEditor.js

@@ -1,22 +0,0 @@
-
-import {
-  defineComponent,
-  h,
-} from "vue";
-import { QToggle } from 'quasar';
-
-export default defineComponent({
-  name: "FreeFieldBooleanEditor",
-  props: {
-    modelValue: Boolean
-  },
-  emits: ['update:modelValue'],
-  setup(props, { emit }) {
-    return () => h(QToggle,{
-      modelValue: props.modelValue,
-      'onUpdate:modelValue': (e) => {
-        emit('update:modelValue', Boolean(e) || false);
-      }
-    });
-  },
-});

package/free-fields/fieldEditors/dateEditor.js

@@ -1,23 +0,0 @@
-
-import {
-  defineComponent,
-  h,
-} from "vue";
-import { QInput } from 'quasar';
-
-export default defineComponent({
-  name: "FreeFieldDateEditor",
-  props: {
-    modelValue: String
-  },
-  emits: ['update:modelValue'],
-  setup(props, { emit }) {
-    return () => h(QInput,{
-      type: 'date',
-      modelValue: props.modelValue,
-      'onUpdate:modelValue': (e) => {
-        emit('update:modelValue', e);
-      }
-    });
-  },
-});

package/free-fields/fieldEditors/datetimeEditor.js

@@ -1,23 +0,0 @@
-
-import {
-  defineComponent,
-  h,
-} from "vue";
-import { QInput } from 'quasar';
-
-export default defineComponent({
-  name: "FreeFieldDateTimeEditor",
-  props: {
-    modelValue: String
-  },
-  emits: ['update:modelValue'],
-  setup(props, { emit }) {
-    return () => h(QInput,{
-      type: 'datetime',
-      modelValue: props.modelValue,
-      'onUpdate:modelValue': (e) => {
-        emit('update:modelValue', e);
-      }
-    });
-  },
-});

package/free-fields/fieldEditors/index.js

@@ -1,21 +0,0 @@
-import NumberEditor from "./numberEditor";
-import StringEditor from "./stringEditor";
-import BooleanEditor from "./boolEditor";
-import ArrayEditor from "./arrayEditor";
-import ObjectEditor from "./objectEditor";
-import DateEditor from './dateEditor';
-import TimeEditor from "./timeEditor";
-import TextEditor from "./textEditor";
-import LabeledField from "./labeledField";
-
-export default {
-  NumberEditor,
-  StringEditor,
-  BooleanEditor,
-  ArrayEditor,
-  ObjectEditor,
-  DateEditor,
-  TimeEditor,
-  TextEditor,
-  LabeledField,
-}