glib-web 4.39.3 → 4.39.5

package/actions/sheets/open.js

@@ -10,7 +10,7 @@ export default class {
     if (loaderViews) {
       vueApp.sheet = {
         show: true,
-        spec: { childViews: loaderViews },
+        body: { childViews: loaderViews },
         placement
       };
     }
@@ -21,14 +21,14 @@ export default class {
       component,
       (response) => {
         vueApp.sheet = {
-          spec: Object.assign({}, response.body, { key: strandom() }),
+          body: Object.assign({}, response.body, { key: strandom() }),
           show: true,
           placement
         };
       },
       () => {
         vueApp.sheet = {
-          spec: {
+          body: {
             childViews: [
               { view: 'p', text: 'Failed to load' },
               { view: 'spacer', height: 8 },

package/app.vue

@@ -43,6 +43,7 @@
         <!-- <glib-component v-for="(rbSpec, index) in sheet.spec.childViews" :spec="rbSpec"
           :key="`${vueApp.sheet.spec.key}-${index}`"></glib-component> -->
 
+        <!-- TODO: fix this -->
         <panels-responsive :spec="sheet.body"></panels-responsive>
       </v-sheet>
     </Transition>

package/components/p.vue

@@ -25,6 +25,9 @@ p.muted {
   opacity: 0.7;
 }
 
+</style>
+
+<style lang="scss">
 .tooltip {
   padding: 4px 8px;
   color: white;

package/components/panels/horizontal.vue

@@ -15,8 +15,8 @@
 
 
     <!-- :disabled="!$type.isObject(dragSupport)" -->
-    <draggable :style="childStyles" :class="childClasses" handle=".handle" v-model="spec.childViews" ghost-class="ghost"
-      :group="dragSupport ? dragSupport.groupId || 'common' : 'common'" :data-dragPanelId="spec.id"
+    <draggable v-if="dragEnabled" :style="childStyles" :class="childClasses" handle=".handle" v-model="spec.childViews"
+      ghost-class="ghost" :group="dragSupport ? dragSupport.groupId || 'common' : 'common'" :data-dragPanelId="spec.id"
       :disabled="!dragEnabled" @start="onDragStart" @end="onDragEnd" item-key="id">
       <!--
         * Wrap `glib-component` with `div` to prevent errors when `glib-component` doesn't resolve to a
@@ -33,11 +33,24 @@
         </div>
       </template>
 
+
+
       <!-- <glib-component :spec="element" /> -->
       <!-- <div :data-dragItemId="element.id">
           <glib-component :spec="element" />
         </div> -->
     </draggable>
+
+    <!-- The radio button becomes unclickable when wrapped in a draggable component, so we conditionally remove the wrapper using v-if when dragging is not required. -->
+    <!-- page: http://localhost:3000/glib/json_ui_garage?path=forms%2Fshow_hide -->
+    <div v-else :style="childStyles" :class="childClasses">
+      <template v-for="(element, index) in spec.childViews" :key="element.id || index">
+        <div :data-dragItemId="element.id">
+          <!-- Keep your inner component -->
+          <glib-component :spec="element" />
+        </div>
+      </template>
+    </div>
   </component>
 </template>
 

package/components/panels/split.vue

@@ -53,7 +53,10 @@ export default {
   /* Make the side panels take full height */
   display: flex;
 }
+</style>
 
+<!-- Overridable -->
+<style>
 .layouts-split__right {
   /* Prevent unnecessary squashing, i.e. text broken into multiple lines */
   flex-shrink: 0;

package/nav/appBar.vue

@@ -71,8 +71,12 @@ export default {
     //   }
     // },
     isPermanent() {
-      const display = this.$vuetify.display.name;
-      return display == "lg" || display == "xl";
+      if (this.navBar.collapseButtonsOnMobile) {
+        // const display = this.$vuetify.display.name;
+        // return display == "lg" || display == "xl";
+        return !this.$vuetify.display.smAndDown;
+      }
+      return true;
     },
     showDrawerMenu() {
       return this.page.leftDrawer && !this.isPermanent;

package/nav/drawer.vue

@@ -89,6 +89,12 @@ export default {
       openedGroups: openedGroups
     };
   },
+  mounted() {
+    this.registerDrawerToggleListener();
+  },
+  beforeUnmount() {
+    this.unregisterDrawerToggleListener();
+  },
   computed: {
     cssClasses() {
       // To make sure a css class name is assigned to this component
@@ -123,16 +129,29 @@ export default {
     trigger: function (val, oldVal) {
       this.state = !this.state;
     },
+    spec: {
+      handler() {
+        // When the page reloads reactively, the event bus listeners are cleared.
+        // Re-register the drawer toggle so future events still work.
+        if (bus.hasListener("glib-drawers/toggle", this.handleDrawerToggle)) {
+          // Listener is still active; skip re-registering to avoid duplicate toggles.
+          return;
+        }
+        this.registerDrawerToggleListener();
+      }
+    }
   },
   methods: {
-    $mounted() {
-      bus.$on("glib-drawers/toggle", (bool) => {
-        const data = isPresent(bool) ? bool : !this.state;
-        this.updateState(data);
-      });
+    registerDrawerToggleListener() {
+      this.unregisterDrawerToggleListener();
+      bus.$on("glib-drawers/toggle", this.handleDrawerToggle);
     },
-    $unmounted() {
-      bus.$off("glib-drawers/toggle");
+    unregisterDrawerToggleListener() {
+      bus.$off("glib-drawers/toggle", this.handleDrawerToggle);
+    },
+    handleDrawerToggle(bool) {
+      const data = isPresent(bool) ? bool : !this.state;
+      this.updateState(data);
     },
     updateState(state) {
       this.state = state;
@@ -172,7 +191,6 @@ export default {
   align-items: center;
   background-color: white;
 }
-
 </style>
 
 <style lang="scss">

package/nav/snackbar.vue

@@ -48,6 +48,8 @@ export default {
       this.vertical = [this.spec.styleClasses].flat().includes('vertical');
     },
     click: function (spec) {
+      const { onClick } = spec;
+      Action.execute(onClick, this);
       this.show = false;
     }
   }

package/package.json

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

package/utils/eventBus.js

@@ -9,5 +9,6 @@ export default {
     $off: (...args) => emitter.off(...args),
     $emit: (...args) => emitter.emit(...args),
     $removeAllListener: (...args) => emitter.removeAllListeners(...args),
-    currentListenerCount: () => emitter.listeners().length
-};
+    currentListenerCount: () => emitter.listeners().length,
+    hasListener: (event, listener) => emitter.listeners(event).includes(listener)
+};