@cloudron/pankow 3.6.2 → 3.6.4

package/components/Button.vue

@@ -71,7 +71,6 @@ function onClick(event) {
   user-select: none;
   white-space: nowrap;
   text-align: center;
-  border: none;
   padding: var(--pankow-input-vertial-padding) max(12px, var(--pankow-input-horizontal-padding));
   border-radius: var(--pankow-border-radius);
   text-decoration: none;

package/components/ProgressBar.vue

@@ -15,6 +15,10 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  showTrack: {
+    type: Boolean,
+    default: true,
+  },
   busy: {
     type: Boolean,
     default: false,
@@ -33,10 +37,12 @@ const normalizedValue = computed(() => {
 <template>
   <div class="pankow-progress-bar">
     <div class="pankow-progress-bar-label" v-show="showLabel"><slot>{{ value + ' %' }}</slot></div>
-    <div v-if="mode !== 'indeterminate'" class="pankow-progress-bar-filled" :style="{ width: normalizedValue+'%', height: slim ? '2px' : '6px' }">
-      <div v-if="busy" class="pankow-progress-bar-glow" :style="{ height: slim ? '2px' : '6px' }"></div>
+    <div :class="{ 'pankow-progress-bar-background': showTrack }">
+      <div v-if="mode !== 'indeterminate'" class="pankow-progress-bar-filled" :style="{ width: normalizedValue+'%', height: slim ? '2px' : '6px' }">
+        <div v-if="busy" class="pankow-progress-bar-glow" :style="{ height: slim ? '2px' : '6px' }"></div>
+      </div>
+      <div v-else class="pankow-progress-bar-indeterminate" :style="{ height: slim ? '2px' : '6px' }"></div>
     </div>
-    <div v-else class="pankow-progress-bar-indeterminate" :style="{ height: slim ? '2px' : '6px' }"></div>
   </div>
 </template>
 
@@ -54,6 +60,17 @@ const normalizedValue = computed(() => {
   padding-bottom: 3px;
 }
 
+.pankow-progress-bar-background {
+  border-radius: var(--pankow-border-radius);
+  background-color: var(--pankow-color-light-dark);
+}
+
+@media (prefers-color-scheme: dark) {
+  .pankow-progress-bar-background {
+    background-color: var(--pankow-input-background-color);
+  }
+}
+
 .pankow-progress-bar-filled {
   position: relative;
   background-color: var(--pankow-color-primary);
@@ -89,7 +106,6 @@ const normalizedValue = computed(() => {
   height: 6px;
   display: block;
   position: relative;
-  background: rgba(255, 255, 255, 0.15);
   overflow: hidden;
   border-radius: calc(var(--pankow-border-radius) / 1.5);
 }

package/components/TableView.vue

@@ -114,7 +114,7 @@ onMounted(() => {
         <tbody>
           <tr v-if="busy">
             <td :colspan="Object.keys(columns).length" style="text-align: center; padding: 20px;">
-              <ProgressBar mode="indeterminate" :show-label="false" :slim="true" v-show="finalBusy"/>
+              <ProgressBar mode="indeterminate" :show-track="false" :show-label="false" :slim="true" v-show="finalBusy"/>
             </td>
           </tr>
           <tr v-else-if="!busy && sortedItems.length === 0">

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudron/pankow",
   "private": false,
-  "version": "3.6.2",
+  "version": "3.6.4",
   "description": "",
   "main": "index.js",
   "types": "types/index.d.ts",

package/tooltip.js

@@ -38,6 +38,8 @@ function isElementHidden(element) {
 }
 
 function remove(key, target) {
+    if (!tooltips[key]) return;
+
     if (tooltips[key].element) tooltips[key].element.remove();
 
     tooltips[key].element = null;
@@ -77,6 +79,7 @@ function mounted(el, binding, vnode) {
     };
 
     el.addEventListener('mouseenter', () => {
+        if (!tooltips[key]) return;
         if (!tooltips[key].value) return;
 
         const element = document.createElement('div');
@@ -105,7 +108,8 @@ function mounted(el, binding, vnode) {
 }
 
 function updated(el, binding, vnode) {
-    if (!binding.value) remove(vnode.ctx.uid, el);
+    if (!tooltips[vnode.ctx.uid]) return;
+    if (!binding.value) return remove(vnode.ctx.uid, el);
 
     tooltips[vnode.ctx.uid].value = binding.value;