@vc-shell/framework 1.0.310 → 1.0.312

package/ui/components/organisms/vc-app/_internal/vc-app-bar/vc-app-bar.vue

@@ -6,17 +6,22 @@
     <slot name="app-switcher"></slot>
 
     <template v-if="!$isMobile.value || quantity === 0">
-      <!-- Logo -->
-      <img
-        class="vc-app-bar__logo"
-        alt="logo"
-        :src="logo"
-        @click="$emit('logo:click')"
-      />
+      <div class="tw-w-auto">
+        <!-- Logo -->
+        <img
+          class="vc-app-bar__logo"
+          :class="{
+            'vc-app-bar__logo--mobile': $isMobile.value,
+          }"
+          alt="logo"
+          :src="logo"
+          @click="$emit('logo:click')"
+        />
+      </div>
 
       <!-- Title -->
       <div
-        v-if="title"
+        v-if="title && $isDesktop.value"
         class="vc-app-bar__title"
       >
         {{ title }}
@@ -144,6 +149,10 @@ watchDebounced(
 
 .vc-app-bar__logo {
   @apply tw-h-1/2 tw-cursor-pointer tw-mx-4;
+
+  &--mobile {
+    @apply tw-mx-1;
+  }
 }
 
 .vc-app-bar__title {

package/ui/components/organisms/vc-app/vc-app.vue

@@ -56,17 +56,15 @@
           <slot name="toolbar:notifications-dropdown">
             <NotificationDropdown />
           </slot>
-          <template v-if="$isDesktop.value">
-            <slot
-              name="toolbar:user-dropdown"
-              :user-dropdown="UserDropdownButton"
-            >
-              <UserDropdownButton
-                :avatar-url="avatar"
-                :role="role"
-              />
-            </slot>
-          </template>
+          <slot
+            name="toolbar:user-dropdown"
+            :user-dropdown="UserDropdownButton"
+          >
+            <UserDropdownButton
+              :avatar-url="avatar"
+              :role="role"
+            />
+          </slot>
         </slot>
       </template>
     </VcAppBar>
@@ -80,13 +78,6 @@
         :version="version"
         @item:click="onMenuItemClick"
       >
-        <template #mobile>
-          <UserDropdownButton
-            class="vc-app__user-dropdown-button"
-            :avatar-url="avatar"
-            :role="role"
-          />
-        </template>
       </VcAppMenu>
 
       <!-- Blade navigation -->

package/ui/components/organisms/vc-blade/vc-blade.vue

@@ -275,7 +275,8 @@ const { open } = usePopup({
   }
 
   &__error-button {
-    @apply tw-shrink-0 tw-opacity-80 tw-text-[color:var(--blade-text-color)] hover:tw-opacity-100 hover:tw-text-[color:var(--blade-text-color)];
+    @apply tw-shrink-0 tw-opacity-80  hover:tw-opacity-100 hover:tw-text-[color:var(--blade-text-color)];
+    @apply tw-text-[color:var(--blade-text-color)] #{!important};
   }
 
   &__unsaved-changes {

package/ui/components/organisms/vc-table/vc-table.vue

@@ -273,6 +273,7 @@
           </div>
           <div
             v-if="items && items.length && !columnsInit"
+            ref="tableBody"
             class="vc-table__body"
           >
             <div
@@ -426,7 +427,13 @@
           :pages="pages"
           :current-page="currentPage"
           :variant="paginationVariant"
-          @item-click="$emit('paginationClick', $event)"
+          @item-click="
+            (event) => {
+              //scroll table to top
+              tableBody?.scrollTo(0, 0);
+              $emit('paginationClick', event);
+            }
+          "
         ></VcPagination>
 
         <!-- Table counter -->
@@ -538,6 +545,7 @@ const props = withDefaults(
     paginationVariant?: ComponentProps<typeof VcPagination>["variant"];
     selectionItems?: T[];
     disableFilter?: boolean;
+    columnSelector?: "auto" | "defined" | MaybeRef<ITableColumns[]> | (() => ITableColumns[]);
   }>(),
   {
     items: () => [],
@@ -551,6 +559,7 @@ const props = withDefaults(
     resizableColumns: true,
     reorderableColumns: true,
     paginationVariant: "default",
+    columnSelector: "auto",
   },
 );
 
@@ -575,6 +584,7 @@ const slots = useSlots();
 // template refs
 const reorderRef = ref<HTMLElement | null>();
 const tableRef = ref<HTMLElement | null>();
+const tableBody = ref<HTMLElement | null>();
 
 // event listeners
 let columnResizeListener: ((...args: any[]) => any) | null = null;
@@ -763,32 +773,56 @@ watch(
 watch(
   [() => props.items, () => props.columns],
   ([newValItems, newValCols]) => {
-    let cols: ITableColumns[] = [];
     let predefinedCols: ITableColumns[] = [];
-    if (newValItems && newValItems.length) {
-      cols = Object.keys(newValItems[0]).map((key) => {
-        return {
+    let otherCols: ITableColumns[] = [];
+
+    // Helper function to process columns
+    const processColumns = (columns: ITableColumns[], predefined: boolean, defaultVisible: boolean) =>
+      columns.map((item) => ({
+        ...item,
+        predefined,
+        visible: typeof item.visible !== "undefined" ? item.visible : defaultVisible,
+      }));
+
+    // Process predefined columns
+    if (newValCols && newValCols.length) {
+      predefinedCols = processColumns(newValCols, true, true);
+    }
+
+    if (props.columnSelector === "auto") {
+      // Generate columns automatically from items
+      if (newValItems && newValItems.length) {
+        const itemKeys = Object.keys(newValItems[0]);
+        otherCols = itemKeys.map((key) => ({
           id: key,
-          // From camelCase to human readable with first letter capitalized
           title: key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase()),
           visible: false,
           predefined: false,
-        };
-      });
-    }
+        }));
+      }
 
-    if (newValCols && newValCols.length) {
-      // Update internal columns based on predefined columns
-      predefinedCols = newValCols.map((item) => ({
-        ...item,
-        predefined: true,
-        visible: typeof item.visible !== "undefined" ? item.visible : true,
-      }));
-    }
+      // Combine columns and restore state
+      allColumns.value = _.unionBy(predefinedCols, otherCols, "id");
+      restoreState(predefinedCols);
+    } else if (props.columnSelector === "defined") {
+      allColumns.value = predefinedCols;
+      restoreState(predefinedCols);
+    } else {
+      // Get columns from columnSelector
+      const getDefinedColumns = (): ITableColumns[] => {
+        if (typeof props.columnSelector === "function") {
+          return props.columnSelector();
+        }
+        return toValue(props.columnSelector) as ITableColumns[];
+      };
 
-    allColumns.value = _.unionBy(predefinedCols, cols, "id");
+      const definedCols = processColumns(getDefinedColumns(), false, false);
+
+      // Combine columns and restore state
+      allColumns.value = _.unionBy(predefinedCols, definedCols, "id");
+      restoreState(allColumns.value);
+    }
 
-    restoreState(predefinedCols);
     columnsInit.value = false;
   },
   { deep: true, immediate: true },
@@ -1211,10 +1245,25 @@ function restoreState(predefinedColumns: TableColPartial[] = []) {
   }
 
   const predefinedMap = new Map(predefinedColumns.map((col) => [col.id, col]));
+  const mergedColumns: TableColPartial[] = storedState
+    .map((storedCol) => {
+      const predefinedCol = predefinedMap.get(storedCol.id);
+      return mergeColumns(storedCol, predefinedCol);
+    })
+    .filter((col) => col.title);
+
+  // add predefined columns that are not in stored state
+  predefinedColumns.forEach((predefinedCol) => {
+    if (!mergedColumns.find((col) => col.id === predefinedCol.id)) {
+      mergedColumns.push({ ...predefinedCol, visible: true, predefined: true });
+    }
+  });
 
-  const mergedColumns = storedState.map((storedCol) => {
-    const predefinedCol = predefinedMap.get(storedCol.id);
-    return mergeColumns(storedCol, predefinedCol);
+  // add other columns to mergedColumns from allColumns array without duplicates
+  allColumns.value.forEach((col) => {
+    if (!mergedColumns.find((c) => c.id === col.id)) {
+      mergedColumns.push(col as TableColPartial);
+    }
   });
 
   resetRemovedColumns(storedState, predefinedMap, mergedColumns);

package/dist/external-providers-BjKh317l.js

@@ -1,4 +0,0 @@
-import { b as f } from "./index-BDN9lqET.js";
-export {
-  f as default
-};