@cloudron/pankow 3.5.10 → 3.5.12

package/components/Checkbox.vue

@@ -17,7 +17,7 @@ const internalId = uuidv4();
 
 <template>
   <span class="pankow-checkbox">
-    <input :id="id || internalId" class="pankow-checkbox-input" type="checkbox" v-model="model" :disabled="disabled"/>
+    <input :id="id || internalId" class="pankow-checkbox-input" type="checkbox" v-model="model" :disabled="disabled" @input="$emit('update:modelValue', $event.target.checked)"/>
     <slot>
       <label :for="id || internalId" class="pankow-checkbox-input-label">
         {{ label }}

package/components/PasswordInput.vue

@@ -6,6 +6,7 @@ const svgEye = '<svg aria-hidden="true" focusable="false" data-prefix="fas" data
 const svgEyeSlash = '<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="eye-slash" class="svg-inline--fa fa-eye-slash fa-w-20" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path fill="currentColor" d="M320 400c-75.85 0-137.25-58.71-142.9-133.11L72.2 185.82c-13.79 17.3-26.48 35.59-36.72 55.59a32.35 32.35 0 0 0 0 29.19C89.71 376.41 197.07 448 320 448c26.91 0 52.87-4 77.89-10.46L346 397.39a144.13 144.13 0 0 1-26 2.61zm313.82 58.1l-110.55-85.44a331.25 331.25 0 0 0 81.25-102.07 32.35 32.35 0 0 0 0-29.19C550.29 135.59 442.93 64 320 64a308.15 308.15 0 0 0-147.32 37.7L45.46 3.37A16 16 0 0 0 23 6.18L3.37 31.45A16 16 0 0 0 6.18 53.9l588.36 454.73a16 16 0 0 0 22.46-2.81l19.64-25.27a16 16 0 0 0-2.82-22.45zm-183.72-142l-39.3-30.38A94.75 94.75 0 0 0 416 256a94.76 94.76 0 0 0-121.31-92.21A47.65 47.65 0 0 1 304 192a46.64 46.64 0 0 1-1.54 10l-73.61-56.89A142.31 142.31 0 0 1 320 112a143.92 143.92 0 0 1 144 144c0 21.63-5.29 41.79-13.9 60.11z"></path></svg>';
 
 const emit = defineEmits([ 'update:modelValue' ]);
+
 const props = defineProps({
   placeholder: String,
   modelValue: String,

package/components/TableView.vue

@@ -22,6 +22,10 @@ const props = defineProps({
     validator(value, props) {
       return [ 'asc', 'desc' ].includes(value);
     }
+  },
+  fixedLayout: {
+    type: Boolean,
+    default: false,
   }
 });
 
@@ -92,13 +96,13 @@ onMounted(() => {
 <template>
   <div class="pankow-table-scroll-wrapper">
     <div class="pankow-table-wrapper">
-      <table class="pankow-table">
+      <table class="pankow-table" :class="{ 'pankow-table-layout-fixed': fixedLayout }">
         <thead class="pankow-table-header" v-if="sortedItems.length !== 0">
           <tr>
             <th v-for="column in Object.keys(columns)"
               class="pankow-table-header-column"
               :class="{ 'pankow-table-header-column-sortable': columns[column].sort, 'pankow-table-cell-hide-mobile': columns[column].hideMobile }"
-              :style="{ 'text-align': columns[column].align || null }"
+              :style="{ 'text-align': columns[column].align || null, width: typeof columns[column].width === 'string' ? columns[column].width : 'auto' }"
               @click="toggleSort(column)"
             >
               <Icon v-if="columns[column].icon" :icon="columns[column].icon" />
@@ -154,6 +158,10 @@ onMounted(() => {
   border-spacing: 0px;
 }
 
+.pankow-table-layout-fixed {
+  table-layout: fixed;
+}
+
 .pankow-table-header {
   top: 0;
   position: sticky;
@@ -186,6 +194,7 @@ onMounted(() => {
 .pankow-table-cell {
   padding: 5px;
   height: 100%;
+  overflow: hidden;
 }
 
 .pankow-table-row-with-hover:hover {
@@ -199,6 +208,7 @@ onMounted(() => {
 
 .pankow-table-cell-nowrap {
   white-space: nowrap;
+  text-overflow: ellipsis;
 }
 
 @media (max-width: 576px) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudron/pankow",
   "private": false,
-  "version": "3.5.10",
+  "version": "3.5.12",
   "description": "",
   "main": "index.js",
   "types": "types/index.d.ts",
@@ -19,7 +19,7 @@
     "@fontsource/inter": "^5.2.8",
     "@fortawesome/fontawesome-free": "^7.1.0",
     "filesize": "^11.0.13",
-    "monaco-editor": "^0.54.0"
+    "monaco-editor": "^0.55.1"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^6.0.2",

package/style.css

@@ -23,7 +23,7 @@
 
   --pankow-color-light-dark: #ced4da;
 
-  --pankow-tooltip-background-color: rgba(0,0,0,0.5);
+  --pankow-tooltip-background-color: #333;
   --pankow-tooltip-text-color: white;
 
   --pankow-color-primary: #1a76bf;
@@ -100,9 +100,6 @@ input {
 
     --pankow-dialog-background-color: #32383e;
     --pankow-dialog-backdrop-color: rgba(0,0,0,.7);
-
-    --pankow-tooltip-background-color: rgba(255,255,255,0.5);
-    --pankow-tooltip-text-color: black;
   }
 }
 

package/tooltip.js

@@ -55,7 +55,7 @@ function update(target, value, modifiers, tooltip) {
     tooltip.innerText = value;
 
     // BOTTOM is default
-    const pos = modifiers.top ? TOP : (modifiers.left ? LEFT : (modifiers.RIGHT ? RIGHT : BOTTOM));
+    const pos = modifiers.top ? TOP : (modifiers.left ? LEFT : (modifiers.right ? RIGHT : BOTTOM));
 
     const targetRect = target.getBoundingClientRect();
     const tooltipRect = tooltip.getBoundingClientRect();