@thinkpixellab-public/px-vue 4.0.27 → 4.0.29

package/components/PxFloat.vue

@@ -55,7 +55,7 @@
 <script>
 import PxBaseVariants from '../bases/PxBaseVariants.vue';
 import { computePosition, autoUpdate, flip, shift, offset, size } from '@floating-ui/dom';
-import { disableBodyScroll, enableBodyScroll, clearAllBodyScrollLocks } from 'body-scroll-lock';
+import { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';
 
 const FOCUS_ELEMENTS = [
     'button',
@@ -400,7 +400,9 @@ export default {
 
                 if (nv) {
                     if (this.disablesScroll) {
-                        disableBodyScroll(this.$refs.popup, { reserveScrollBarGap: true });
+                        if (this.$refs.popup) {
+                            disableBodyScroll(this.$refs.popup, { reserveScrollBarGap: true });
+                        }
 
                         if (!globalClearLayerIndex) {
                             globalClearLayerIndex = globalLayerIndex;
@@ -424,7 +426,10 @@ export default {
         transitionVisible() {
             if (!this.transitionVisible) {
                 this.$emit('afterhide');
-                enableBodyScroll(this.$refs.popup, { reserveScrollBarGap: true });
+
+                if (this.$refs.popup) {
+                    enableBodyScroll(this.$refs.popup, { reserveScrollBarGap: true });
+                }
             }
         },
     },

package/components/PxQrCode.vue

@@ -32,7 +32,7 @@ export default {
         padding: { type: Number, default: 0 },
     },
     data() {
-        return { size: null };
+        return { size: 0 };
     },
     mounted() {
         this.size = Math.min(this.$el.clientWidth, this.$el.clientHeight);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thinkpixellab-public/px-vue",
-  "version": "4.0.27",
+  "version": "4.0.29",
   "description": "General purpose Vue components and helpers that can be used across projects.",
   "author": {
     "name": "Pixel Lab"

package/utils/balanceText.js

@@ -37,7 +37,13 @@ var balanceText = function (element, lineAdjust = ADJUST) {
 function squeezeContainer(headline, originalHeight, bottomRange, topRange, lineAdjust = ADJUST) {
     var mid;
     if (bottomRange >= topRange) {
-        headline.style.maxWidth = topRange * lineAdjust + 'px';
+        // need to handle the case where the headline is not wrapping and is just too wide for it's container
+        // this mainly seems to happen when in character based languages
+        if (headline.scrollWidth > topRange * lineAdjust) {
+            headline.style.maxWidth = headline.scrollWidth + 'px';
+        } else {
+            headline.style.maxWidth = topRange * lineAdjust + 'px';
+        }
         return;
     }
     mid = (bottomRange + topRange) / 2;