sprintify-ui 0.0.191 → 0.0.193

package/src/assets/main.css

@@ -11,19 +11,25 @@
   justify-content: center;
   margin: 0 -0.5rem;
 
-  & .btn:first-child:not(:last-child) {
+  & > *:not(:first-child) .btn,
+  & > .btn:not(:first-child) {
+    margin-left: -1px;
+  }
+
+  & > *:first-child:not(:last-child) .btn,
+  & > .btn:first-child:not(:last-child) {
     border-bottom-right-radius: 0;
     border-top-right-radius: 0;
   }
 
-  & .btn:last-child:not(:first-child) {
+  & > *:last-child:not(:first-child) .btn,
+  & > .btn:last-child:not(:first-child) {
     border-bottom-left-radius: 0;
     border-top-left-radius: 0;
-    border-left: 0;
   }
 
-  & .btn:not(:first-child):not(:last-child) {
+  & > *:not(:first-child):not(:last-child) .btn,
+  & > .btn:not(:first-child):not(:last-child) {
     border-radius: 0;
-    border-left: 0;
   }
 }

package/src/components/BaseDataIterator.vue

@@ -287,6 +287,7 @@ const emit = defineEmits([
   'check',
   'update:query',
   'will-scroll-top',
+  'fetch',
 ]);
 
 const dataIteratorNode = ref<null | HTMLElement>(null);
@@ -593,6 +594,7 @@ function fetch(force = false, showLoading = true) {
       loading.value = false;
       error.value = false;
       firstLoad.value = true;
+      emit('fetch', data.value);
     })
     .catch(() => {
       data.value = null;

package/src/components/BaseDataTable.stories.js

@@ -38,7 +38,9 @@ const templateComponents = {
 };
 
 const template = `
-<BaseDataTable v-bind="args" @cell-click="onCellClick">
+<div>Last fetch: {{ lastFetch?.getTime() }} (should update on each fetch)</div>
+<br/>
+<BaseDataTable v-bind="args" @cell-click="onCellClick" @fetch="onFetch">
   <BaseTableColumn
     v-slot="{ row }"
     label="Titre"
@@ -181,7 +183,13 @@ const templateSetup = (args) => {
     alert('cell click!');
   }
 
-  return { args, onCellClick, ownerIsVisible: true };
+  const lastFetch = ref(null);
+
+  function onFetch() {
+    lastFetch.value = new Date();
+  }
+
+  return { args, onCellClick, ownerIsVisible: true, onFetch, lastFetch };
 };
 
 const Template = (args) => ({

package/src/components/BaseDataTable.vue

@@ -10,6 +10,7 @@
     :layout="layout"
     :sections="sectionsInternal"
     :scroll-top-on-fetch="maxHeight ? false : scrollTopOnFetch"
+    @fetch="onFetch"
     @will-scroll-top="onWillScrollTop"
   >
     <template
@@ -107,18 +108,10 @@
                     v-if="showRowActionMenu"
                     :items="rowActionMenuItems(row)"
                     size="sm"
+                    button-class="btn flex h-8 w-8 p-0 items-center justify-center"
                   >
-                    <template #button="{ open }">
-                      <div
-                        class="flex h-8 w-8 items-center justify-center rounded-r border border-l-0 border-slate-300 bg-white duration-150 hover:bg-slate-50"
-                        :class="[
-                          open
-                            ? 'ring-2 ring-primary-500 ring-offset-2'
-                            : false,
-                        ]"
-                      >
-                        <BaseIcon icon="heroicons-solid:dots-vertical" />
-                      </div>
+                    <template #button>
+                      <BaseIcon icon="heroicons-solid:dots-vertical" />
                     </template>
                   </BaseMenu>
                 </div>
@@ -200,10 +193,13 @@
 <script lang="ts" setup>
 import { PropType } from 'vue';
 import {
+  Collection,
   CollectionItem,
   DataIteratorSection,
   DataTableQuery,
   MenuItemInterface,
+  PaginatedCollection,
+  ResourceCollection,
   RowAction,
 } from '@/types';
 import { useDialogsStore } from '@/stores/dialogs';
@@ -427,7 +423,12 @@ const props = defineProps({
   },
 });
 
-const emit = defineEmits(['cell-click', 'delete', 'update:checked-rows']);
+const emit = defineEmits([
+  'cell-click',
+  'delete',
+  'update:checked-rows',
+  'fetch',
+]);
 
 const dataIterator = ref<null | InstanceType<typeof BaseDataIterator>>(null);
 
@@ -679,6 +680,18 @@ function onWillScrollTop() {
   }
 }
 
+/*
+|--------------------------------------------------------------------------
+| On fetch
+|--------------------------------------------------------------------------
+*/
+
+function onFetch(
+  payload: null | ResourceCollection | PaginatedCollection | Collection
+) {
+  emit('fetch', payload);
+}
+
 /*
 |--------------------------------------------------------------------------
 | Exposed functions

package/src/components/BaseMenu.vue

@@ -6,7 +6,7 @@
     :class="[position == 'custom' ? 'static' : 'relative']"
   >
     <div>
-      <MenuButton class="flex">
+      <MenuButton :class="buttonClass">
         <slot name="button" :open="open" />
       </MenuButton>
     </div>
@@ -21,7 +21,7 @@
     >
       <MenuItems
         :class="[menuClass, menuPositionClass]"
-        class="absolute z-menu mt-2 rounded-md bg-white p-1 shadow-lg ring-1 ring-black ring-opacity-10 focus:outline-none"
+        class="absolute z-menu mt-2 rounded-md bg-white p-1 shadow-lg outline-none ring-1 ring-black ring-opacity-10 focus:outline-none"
       >
         <slot name="items" :items="items">
           <template v-for="item in items" :key="item.label + 'link'">
@@ -119,6 +119,10 @@ const props = defineProps({
     default: 'sm',
     type: String as PropType<'xs' | 'sm' | 'md'>,
   },
+  buttonClass: {
+    default: 'flex',
+    type: [String, Array, Object],
+  },
 });
 
 const menuPositionClass = computed(() => {