glib-web 4.34.5 → 4.35.1

package/README.md

@@ -76,6 +76,7 @@ view.chipGroup styleClasses: ['custom']
 
 - On your project's directory:
   - `rm -rf node_modules`
+  - `yarn link glib-web`
   - `yarn install`
   - `bin/vite clobber`
   - `bin/vite dev`

package/actions/windows/openWeb.js

@@ -1,5 +1,6 @@
 export default class {
   execute(properties) {
-    window.open(properties["url"]);
+    const target = properties["targetWindow"] || "_blank";
+    window.open(properties["url"], target);
   }
 }

package/app.vue

@@ -151,7 +151,7 @@ export default {
   },
   created() {
     console.debug(
-      `Version: ${Utils.settings.appVersion} (${Utils.settings.env})`
+      `Version12: ${Utils.settings.appVersion} (${Utils.settings.env})`
     );
     Utils.history.saveInitialContent(this.page);
     Utils.history.restoreOnBackOrForward({

package/components/_avatar.vue

@@ -1,7 +1,7 @@
 <template>
   <common-badge :spec="spec">
-    <v-avatar :size="spec.size" :color="spec.backgroundColor || 'surface-variant'" :class="$classes()">
-      <p v-if="spec.initials" :style="{ color: spec.initials.color || 'white' }">{{ spec.initials.text }}</p>
+    <v-avatar :size="spec.size" :color="spec.backgroundColor || 'surface-variant'" :class="cssClasses">
+      <p class="initials" v-if="spec.initials" :style="{ color: spec.initials.color || 'white' }">{{ spec.initials.text }}</p>
       <!-- Use `img` instead of `v-img` otherwise the rounded border will not work. -->
       <!-- <img :style="$styles()" :src="spec.url || spec.base64Data" @click="$onClick()" /> -->
       <v-img :style="$styles()" :class="$classes()" :src="spec.url || spec.base64Data" @click="$onClick()"
@@ -14,6 +14,22 @@
 export default {
   props: {
     spec: { type: Object, required: true }
-  }
+  },
+  computed: {
+    cssClasses() {
+      // Icons are nameless when used in other components, e.g. buttons
+      this.spec.view = this.spec.view || "avatar";
+
+      return this.$classes();
+    },
+  },
 };
 </script>
+
+<style lang="scss">
+.views {
+  .initials {
+    // To be overridden
+  }
+}
+</style>

package/components/_internal_button.vue

@@ -4,6 +4,8 @@
     :active="$classesInclude('active')" :icon="$classes().includes('icon') ? $vuetify : null" @click="onClick">
     <!-- <span v-if="spec.icon"><common-icon :spec="spec.icon || {}" /></span> -->
     <common-icon v-if="spec.icon" :spec="spec.icon || {}" />
+    <common-avatar v-if="spec.avatar" :spec="spec.avatar || {}" />
+
     <div :class="hideTextOnXs && spec.icon ? 'd-none d-sm-flex' : null">
       {{ spec.text }}
     </div>

package/components/fields/_select.vue

@@ -3,7 +3,7 @@
     <!-- Set `menu-props` so the menu will never be wider than the select field.
          See https://github.com/vuetifyjs/vuetify/issues/17751 -->
     <component :is="compName" :color="gcolor" v-model="fieldModel" :label="label" :items="normalizedOptions"
-      :chips="spec.multiple" :disabled="inputDisabled" :multiple="spec.multiple" :readonly="spec.readOnly"
+      :chips="useChips" :disabled="inputDisabled" :multiple="spec.multiple" :readonly="spec.readOnly"
       :clearable="spec.clearable" :placeholder="spec.placeholder" :rules="$validation()" persistent-hint
       :append-icon="append.icon" validate-on="blur" item-title='text' :variant="variant" :closable-chips="spec.multiple"
       :density="density" persistent-placeholder @update:modelValue="onChange" @focus="focused = true"
@@ -58,6 +58,8 @@ import inputVariant from '../mixins/inputVariant';
 import { determineDensity } from "../../utils/constant";
 import { triggerOnChange, triggerOnInput, useGlibInput } from "../composable/form";
 import Hash from '../../utils/hash';
+import { ifBoolean } from '../../utils/type';
+
 import { useGlibSelectable, watchNoneOfAbove } from '../composable/selectable';
 import { ref } from 'vue';
 import SelectItemDefault from "./_selectItemDefault.vue";
@@ -94,6 +96,12 @@ export default {
     };
   },
   computed: {
+    useChips() {
+      ifBoolean(this.spec.useChips, (val) => {
+        return val;
+      });
+      return this.spec.multiple;
+    },
     compName() {
       return this.spec.searchable ? 'v-autocomplete' : 'v-select';
     },

package/components/panels/table.vue

@@ -70,6 +70,21 @@
             </td>
           </tr>
         </tbody>
+
+        <tfoot>
+          <tr v-if="section.footer" :style="$styles(section.footer)">
+            <template v-if="section.footer.dataCells">
+              <th v-for="(cell, index) in section.footer.dataCells" :key="index"
+                :colSpan="colSpan(section.footer, index)">
+                {{ cell }}
+              </th>
+            </template>
+            <th v-for="(cell, index) in section.footer.cellViews" v-else :key="index"
+              :colSpan="colSpan(section.footer, index)">
+              <glib-component :spec="cell" />
+            </th>
+          </tr>
+        </tfoot>
       </template>
     </table>
 

package/nav/appBar.vue

@@ -19,6 +19,7 @@
     <v-toolbar-items :class="navBar.collapseButtonsOnMobile ? 'hidden-sm-and-down' : null">
       <template v-for="(btn, index) in navBar.rightButtons">
         <common-dropdownMenu v-if="btn.childButtons" :key="index" :spec="btn" />
+        <v-divider vertical thickness="1" v-else-if="btn.type == 'divider'" :key="`divider_${index}`"></v-divider>
         <common-button v-else :key="`right_${index}`" :spec="buttonSpec(btn)" />
       </template>
     </v-toolbar-items>
@@ -124,7 +125,7 @@ export default {
       });
     },
     triggerDrawer() {
-      eventBus.$emit("drawers/toggle");
+      eventBus.$emit("glib-drawers/toggle");
     },
     // viewSourceEnabled: function () {
     //   // return process.env.NODE_ENV === "development";
@@ -175,7 +176,7 @@ export default {
 -->
 
 <!-- Overridable -->
-<style lang="scss" scoped>
+<style lang="scss">
 .views-appBar {
   // box-shadow: none !important;
   // .v-app-bar-nav-icon {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "glib-web",
-  "version": "4.34.5",
+  "version": "4.35.1",
   "description": "",
   "main": "index.js",
   "scripts": {