glib-web 0.6.1 → 0.6.2

package/components/_dropdownMenu.vue

@@ -1,76 +1,76 @@
-<template>
-  <v-menu left bottom>
-    <template v-slot:activator="{ on, attrs }">
-      <v-btn
-        :icon="iconStyling"
-        :text="textStyling"
-        v-bind="attrs"
-        style="color: inherit;"
-        v-on="on"
-        @click.stop.prevent=""
-      >
-        <span v-if="spec.icon" :class="[textStyling ? 'padder' : '']"
-          ><common-icon :spec="spec.icon || {}"
-        /></span>
-        {{ spec.text }}
-      </v-btn>
-    </template>
-
-    <v-list>
-      <v-list-item
-        v-for="(childItem, childIndex) in spec.childButtons"
-        :key="childIndex"
-      >
-        <common-button
-          :spec="buttonSpec(childItem)"
-          :disabled="childItem.disabled || $isBusy"
-        />
-      </v-list-item>
-    </v-list>
-  </v-menu>
-</template>
-
-<script>
-export default {
-  props: {
-    spec: { type: Object, required: true }
-  },
-  data: function() {
-    return {
-      iconStyling: false,
-      textStyling: false
-    };
-  },
-  methods: {
-    $ready() {
-      if (this.spec.text) {
-        this.textStyling = true;
-      } else {
-        this.iconStyling = true;
-      }
-    },
-    buttonSpec(item) {
-      return Object.assign({}, item, {
-        view: "button-v1",
-        styleClasses: ["text"]
-      });
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.v-list-item {
-  padding: 0 8px 0 8px;
-
-  > a,
-  > button {
-    width: 100%;
-    min-height: 48px;
-    justify-content: flex-start;
-  }
-}
-.padder {
-  margin-right: 8px;
-}
-</style>
+<template>
+  <v-menu left bottom>
+    <template v-slot:activator="{ on, attrs }">
+      <v-btn
+        :icon="iconStyling"
+        :text="textStyling"
+        v-bind="attrs"
+        style="color: inherit;"
+        v-on="on"
+        @click.stop.prevent=""
+      >
+        <span v-if="spec.icon" :class="[textStyling ? 'padder' : '']"
+          ><common-icon :spec="spec.icon || {}"
+        /></span>
+        {{ spec.text }}
+      </v-btn>
+    </template>
+
+    <v-list>
+      <v-list-item
+        v-for="(childItem, childIndex) in spec.childButtons"
+        :key="childIndex"
+      >
+        <common-button
+          :spec="buttonSpec(childItem)"
+          :disabled="childItem.disabled || $isBusy"
+        />
+      </v-list-item>
+    </v-list>
+  </v-menu>
+</template>
+
+<script>
+export default {
+  props: {
+    spec: { type: Object, required: true }
+  },
+  data: function() {
+    return {
+      iconStyling: false,
+      textStyling: false
+    };
+  },
+  methods: {
+    $ready() {
+      if (this.spec.text) {
+        this.textStyling = true;
+      } else {
+        this.iconStyling = true;
+      }
+    },
+    buttonSpec(item) {
+      return Object.assign({}, item, {
+        view: "button-v1",
+        styleClasses: ["text"]
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.v-list-item {
+  padding: 0 8px 0 8px;
+
+  > a,
+  > button {
+    width: 100%;
+    min-height: 48px;
+    justify-content: flex-start;
+  }
+}
+.padder {
+  margin-right: 8px;
+}
+</style>

package/components/_icon.vue

@@ -1,50 +1,50 @@
-<template>
-  <v-badge v-if="badge.text" :color="badge.backgroundColor" overlap>
-    <template v-slot:badge>{{ badge.text }}</template>
-    <v-icon :style="genericStyles()" :size="size">{{ value }}</v-icon>
-  </v-badge>
-  <v-icon v-else :style="genericStyles()" :size="size" :color="color">{{
-    value
-  }}</v-icon>
-</template>
-
-<script>
-export default {
-  props: {
-    spec: { type: Object, required: true },
-    isBusy: { type: Boolean }
-  },
-  data() {
-    return {
-      badge: {},
-      color: null,
-      name: null,
-      size: null
-    };
-  },
-  computed: {
-    value() {
-      return this.isBusy || this.$isBusy ? "autorenew" : this.name;
-    }
-  },
-  methods: {
-    $ready() {
-      this.badge = this.spec.badge || {};
-      this.color =
-        this.spec.color || this.$builtinColor(this.spec.styleClasses);
-
-      Utils.type.ifObject(this.spec.fa, fa => {
-        this.name = `fab fa-${fa.name}`;
-        this.size = fa.size;
-      });
-
-      Utils.type.ifObject(this.spec.material, material => {
-        this.name = material.name;
-        this.size = material.size;
-      });
-    }
-  }
-};
-</script>
-
-<style scoped></style>
+<template>
+  <v-badge v-if="badge.text" :color="badge.backgroundColor" overlap>
+    <template v-slot:badge>{{ badge.text }}</template>
+    <v-icon :style="genericStyles()" :size="size">{{ value }}</v-icon>
+  </v-badge>
+  <v-icon v-else :style="genericStyles()" :size="size" :color="color">{{
+    value
+  }}</v-icon>
+</template>
+
+<script>
+export default {
+  props: {
+    spec: { type: Object, required: true },
+    isBusy: { type: Boolean }
+  },
+  data() {
+    return {
+      badge: {},
+      color: null,
+      name: null,
+      size: null
+    };
+  },
+  computed: {
+    value() {
+      return this.isBusy || this.$isBusy ? "autorenew" : this.name;
+    }
+  },
+  methods: {
+    $ready() {
+      this.badge = this.spec.badge || {};
+      this.color =
+        this.spec.color || this.$builtinColor(this.spec.styleClasses);
+
+      Utils.type.ifObject(this.spec.fa, fa => {
+        this.name = `fab fa-${fa.name}`;
+        this.size = fa.size;
+      });
+
+      Utils.type.ifObject(this.spec.material, material => {
+        this.name = material.name;
+        this.size = material.size;
+      });
+    }
+  }
+};
+</script>
+
+<style scoped></style>

package/components/avatar.vue

@@ -1,18 +1,18 @@
-<template>
-  <v-avatar :style="genericStyles()" :class="$classes()" :size="spec.size">
-    <v-img :src="spec.url || spec.base64Data" @click="$onClick()"> </v-img>
-  </v-avatar>
-
-  <!-- <v-avatar :width="genericStyles().remove('width')" :height="genericStyles().remove('height')">
-    <v-img :src="spec.url || spec.base64Data" :style="genericStyles()" @click='$onClick()'>
-    </v-img>
-  </v-avatar> -->
-</template>
-
-<script>
-export default {
-  props: {
-    spec: { type: Object, required: true }
-  }
-};
-</script>
+<template>
+  <v-avatar :style="genericStyles()" :class="$classes()" :size="spec.size">
+    <v-img :src="spec.url || spec.base64Data" @click="$onClick()"> </v-img>
+  </v-avatar>
+
+  <!-- <v-avatar :width="genericStyles().remove('width')" :height="genericStyles().remove('height')">
+    <v-img :src="spec.url || spec.base64Data" :style="genericStyles()" @click='$onClick()'>
+    </v-img>
+  </v-avatar> -->
+</template>
+
+<script>
+export default {
+  props: {
+    spec: { type: Object, required: true }
+  }
+};
+</script>

package/components/banners/select.vue

@@ -1,82 +1,82 @@
-<template>
-  <v-banner
-    :id="spec.id"
-    :style="genericStyles()"
-    :class="$classes()"
-    :color="spec.color || color"
-    :dark="dark"
-    single-line
-    :outlined="!$classes().includes('frameless')"
-  >
-    <common-icon v-if="spec.icon" slot="icon" :spec="spec.icon" />
-
-    <common-message :spec="spec" />
-
-    <template v-slot:actions>
-      <template v-for="(item, index) in spec.buttons">
-        <common-dropdownMenu
-          v-if="item.childButtons"
-          :key="index"
-          :spec="item"
-          :disabled="$isBusy"
-        />
-        <common-button
-          v-else
-          :key="index"
-          :spec="buttonSpec(item)"
-          :disabled="$isBusy"
-          :hide-text-on-xs="true"
-        />
-      </template>
-    </template>
-  </v-banner>
-</template>
-
-<script>
-export default {
-  props: {
-    spec: { type: Object, required: true }
-  },
-  data() {
-    return {
-      color: null,
-      dark: false
-    };
-  },
-  methods: {
-    $ready() {
-      // const vm = this;
-      // this.$type.ifArray(this.spec.styleClasses, val => {
-      //   ["success", "info", "warning", "error"].forEach(color => {
-      //     if (val.remove(color)) {
-      //       vm.color = color;
-      //       vm.dark = true;
-      //     }
-      //   });
-      // });
-    },
-    buttonSpec(item) {
-      return Object.assign({}, item, {
-        view: "button-v1",
-        styleClasses: ["text"]
-      });
-    }
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-.frameless {
-  padding: 0;
-}
-.v-list-item {
-  padding: 0 8px 0 8px;
-
-  > a,
-  > button {
-    width: 100%;
-    min-height: 48px;
-    justify-content: flex-start;
-  }
-}
-</style>
+<template>
+  <v-banner
+    :id="spec.id"
+    :style="genericStyles()"
+    :class="$classes()"
+    :color="spec.color || color"
+    :dark="dark"
+    single-line
+    :outlined="!$classes().includes('frameless')"
+  >
+    <common-icon v-if="spec.icon" slot="icon" :spec="spec.icon" />
+
+    <common-message :spec="spec" />
+
+    <template v-slot:actions>
+      <template v-for="(item, index) in spec.buttons">
+        <common-dropdownMenu
+          v-if="item.childButtons"
+          :key="index"
+          :spec="item"
+          :disabled="$isBusy"
+        />
+        <common-button
+          v-else
+          :key="index"
+          :spec="buttonSpec(item)"
+          :disabled="$isBusy"
+          :hide-text-on-xs="true"
+        />
+      </template>
+    </template>
+  </v-banner>
+</template>
+
+<script>
+export default {
+  props: {
+    spec: { type: Object, required: true }
+  },
+  data() {
+    return {
+      color: null,
+      dark: false
+    };
+  },
+  methods: {
+    $ready() {
+      // const vm = this;
+      // this.$type.ifArray(this.spec.styleClasses, val => {
+      //   ["success", "info", "warning", "error"].forEach(color => {
+      //     if (val.remove(color)) {
+      //       vm.color = color;
+      //       vm.dark = true;
+      //     }
+      //   });
+      // });
+    },
+    buttonSpec(item) {
+      return Object.assign({}, item, {
+        view: "button-v1",
+        styleClasses: ["text"]
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.frameless {
+  padding: 0;
+}
+.v-list-item {
+  padding: 0 8px 0 8px;
+
+  > a,
+  > button {
+    width: 100%;
+    min-height: 48px;
+    justify-content: flex-start;
+  }
+}
+</style>

package/components/button.vue

@@ -1,40 +1,33 @@
-<template>
-  <div>
-    <v-tooltip
-      v-if="spec.tooltip"
-      :top="tooltipClasses('top')"
-      :right="tooltipClasses('right')"
-      :bottom="tooltipClasses('bottom')"
-      :left="tooltipClasses('left')"
-    >
-      <template v-slot:activator="{ on }">
-        <div v-on="on">
-          <common-button :spec="spec" :disabled="$isBusy" />
-        </div>
-      </template>
-      <span> {{ spec.tooltip.text }} </span>
-    </v-tooltip>
-    <div v-else>
-      <common-button :spec="spec" :disabled="$isBusy" />
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    spec: { type: Object, required: true }
-  },
-  methods: {
-    tooltipClasses(position) {
-      if (this.spec.tooltip.position) {
-        return position == this.spec.tooltip.position;
-      } else {
-        return position == "bottom";
-      }
-    }
-  }
-};
-</script>
-
-<style scoped></style>
+<template>
+  <div>
+    <v-tooltip
+      v-if="spec.tooltip"
+      :top="tooltipPositionMatches('top')"
+      :right="tooltipPositionMatches('right')"
+      :bottom="tooltipPositionMatches('bottom')"
+      :left="tooltipPositionMatches('left')"
+    >
+      <template v-slot:activator="{ on }">
+        <div v-on="on">
+          <common-button :spec="spec" :disabled="$isBusy" />
+        </div>
+      </template>
+      <span> {{ spec.tooltip.text }} </span>
+    </v-tooltip>
+    <div v-else>
+      <common-button :spec="spec" :disabled="$isBusy" />
+    </div>
+  </div>
+</template>
+
+<script>
+import TooltipMixins from "./mixins/tooltip";
+export default {
+  mixins: [TooltipMixins],
+  props: {
+    spec: { type: Object, required: true }
+  }
+};
+</script>
+
+<style scoped></style>

package/components/charts/column.vue

@@ -1,47 +1,47 @@
-<template>
-  <column-chart
-    :data="groups"
-    :stacked="spec.stacked"
-    :library="options"
-  ></column-chart>
-</template>
-
-<script>
-// https://chartkick.com/vue
-
-import annotation from "../mixins/chart/annotation.js";
-import tooltip from "../mixins/chart/tooltip.js";
-
-export default {
-  mixins: [annotation, tooltip],
-  props: {
-    spec: { type: Object, required: true }
-  },
-  data: function() {
-    return {
-      groups: [],
-      dataName: "dataGroups"
-    };
-  },
-  methods: {
-    $ready() {
-      this.groups = this.spec.dataGroups.map(element => {
-        let data;
-        if (Array.isArray(element.points)) {
-          data = element.points.reduce((prev, curr) => {
-            let obj = {};
-            obj[curr.x] = curr.y;
-            return Object.assign(prev, obj);
-          }, {});
-        } else {
-          // Support for legacy code
-          data = element.points;
-        }
-        return { name: element.title, data: data };
-      });
-    }
-  }
-};
-</script>
-
-<style scoped></style>
+<template>
+  <column-chart
+    :data="groups"
+    :stacked="spec.stacked"
+    :library="options"
+  ></column-chart>
+</template>
+
+<script>
+// https://chartkick.com/vue
+
+import annotation from "../mixins/chart/annotation.js";
+import tooltip from "../mixins/chart/tooltip.js";
+
+export default {
+  mixins: [annotation, tooltip],
+  props: {
+    spec: { type: Object, required: true }
+  },
+  data: function() {
+    return {
+      groups: [],
+      dataName: "dataGroups"
+    };
+  },
+  methods: {
+    $ready() {
+      this.groups = this.spec.dataGroups.map(element => {
+        let data;
+        if (Array.isArray(element.points)) {
+          data = element.points.reduce((prev, curr) => {
+            let obj = {};
+            obj[curr.x] = curr.y;
+            return Object.assign(prev, obj);
+          }, {});
+        } else {
+          // Support for legacy code
+          data = element.points;
+        }
+        return { name: element.title, data: data };
+      });
+    }
+  }
+};
+</script>
+
+<style scoped></style>