@merkaly/nuxt 0.7.7 → 0.7.8

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.14.0"
   },
-  "version": "0.7.7",
+  "version": "0.7.8",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/input/InputSearch.d.vue.ts

@@ -1,11 +1,27 @@
-declare const search: import("vue").ModelRef<string, string, string, string>;
-type __VLS_ModelProps = {
-    modelValue?: typeof search['value'];
-};
-declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    debounce: {
+        type: NumberConstructor;
+        default: () => number;
+    };
+    modelValue: {
+        type: import("vue").PropType<string>;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: () => any;
     "update:modelValue": (value: string) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    debounce: {
+        type: NumberConstructor;
+        default: () => number;
+    };
+    modelValue: {
+        type: import("vue").PropType<string>;
+    };
+}>> & Readonly<{
+    onChange?: (() => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {
+    debounce: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/input/InputSearch.vue

@@ -1,6 +1,14 @@
 <script setup>
+import { watch } from "vue";
+import { useDebounceFn } from "@vueuse/core";
 import FormatIcon from "../format/FormatIcon.vue";
+const props = defineProps({
+  debounce: { type: Number, default: () => 300 }
+});
 const search = defineModel({ type: String, default: () => String() });
+const emit = defineEmits(["change"]);
+const emitChange = useDebounceFn(() => emit("change"), props.debounce);
+watch(search, () => emitChange());
 </script>
 
 <template>

package/dist/runtime/components/input/InputSearch.vue.d.ts

@@ -1,11 +1,27 @@
-declare const search: import("vue").ModelRef<string, string, string, string>;
-type __VLS_ModelProps = {
-    modelValue?: typeof search['value'];
-};
-declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    debounce: {
+        type: NumberConstructor;
+        default: () => number;
+    };
+    modelValue: {
+        type: import("vue").PropType<string>;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: () => any;
     "update:modelValue": (value: string) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    debounce: {
+        type: NumberConstructor;
+        default: () => number;
+    };
+    modelValue: {
+        type: import("vue").PropType<string>;
+    };
+}>> & Readonly<{
+    onChange?: (() => any) | undefined;
     "onUpdate:modelValue"?: ((value: string) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {
+    debounce: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/input/InputSelect.vue

@@ -22,7 +22,7 @@ const props = defineProps({
   selectedItem: { type: Object, default: void 0 },
   size: { type: String, default: () => void 0 }
 });
-const model = defineModel({ type: [String, Object, Number, Boolean, Array], default: null });
+const model = defineModel({ type: [String, Object, Number, Boolean, Array], default: void 0 });
 onBeforeMount(() => {
   if (props.selectedItem) return;
   if (model.value) {

package/dist/runtime/components/table/TableDatagrid.vue

@@ -107,10 +107,10 @@ function getRowAttrs(item, idx) {
 
 <template>
   <BCard no-body>
-    <BCardHeader v-if="!props.hideHeader" class="align-items-center p-4 position-relative">
+    <BCardHeader v-if="!props.hideHeader" class="align-items-center position-relative">
       <BCardTitle>
         <div v-if="hasBulkSlot && !props.hideSelect && selectionState.selectedCount" class="w-35px">
-          <DropdownIcon icon="caret-down" size="sm" toggle-class="p-2">
+          <DropdownIcon icon="caret-down" toggle-class="p-2">
             <slot name="bulk" v-bind="{ items: selectionState.selectedItems, count: selectionState.selectedCount }" />
           </DropdownIcon>
         </div>
@@ -187,10 +187,10 @@ function getRowAttrs(item, idx) {
       hover
       responsive="lg"
       small
-      table-class="align-middle table-row-dashed gy-3 h-100">
-      <BThead class="sticky-top z-index-1">
-        <BTr class="text-start text-body-secondary fw-bold fs-7 text-uppercase gs-0">
-          <BTh v-if="hasDetailsSlot" class="p-0 w-25px" />
+      table-class="align-middle table-row-dashed h-100">
+      <BThead class="sticky-top z-index-1 align-middle">
+        <BTr class="text-start text-body-secondary fw-bold text-uppercase">
+          <BTh v-if="hasDetailsSlot" class="w-25px" style="padding: unset !important;" />
 
           <BTh v-if="!props.hideSelect" class="w-40px px-0">
             <div class="form-check form-check-sm form-check-custom cell-checkbox">
@@ -226,13 +226,14 @@ function getRowAttrs(item, idx) {
       <BTbody v-else class="fw-semibold text-nowrap">
         <template v-for="(item, idx) in visibleItems" :key="getRowKey(item, idx)">
           <BTr v-bind="getRowAttrs(item, idx)">
-            <BTd v-if="hasDetailsSlot" class="p-0 w-25px">
+            <BTd v-if="hasDetailsSlot" class="w-25px" style="padding: unset !important;">
               <BButton
                 class="w-25px h-100 rounded-0 p-0 border-end border-dashed"
                 size="sm"
                 variant="none"
                 @click="toggleDetails(item)">
-                <FormatIcon :name="item._showDetails ? 'chevron-down' : 'chevron-right'" size="sm" variant="primary" />
+                <FormatIcon :name="item._showDetails ? 'chevron-down' : 'chevron-right'" class="p-0" size="sm"
+                            variant="primary" />
               </BButton>
             </BTd>
 
@@ -251,7 +252,7 @@ function getRowAttrs(item, idx) {
             </template>
 
             <BTd v-if="hasActionsSlot" class="text-end px-3">
-              <DropdownIcon icon="caret-down" :text="t('actions')" toggle-class="py-1 px-3" variant="light-dark">
+              <DropdownIcon :text="t('actions')" icon="caret-down" toggle-class="py-1 px-3" variant="light-dark">
                 <slot :index="idx" :item="item" name="actions" />
               </DropdownIcon>
             </BTd>
@@ -275,7 +276,7 @@ function getRowAttrs(item, idx) {
 
     </BTableSimple>
 
-    <BCardFooter v-if="!props.hideFooter" class="p-4">
+    <BCardFooter v-if="!props.hideFooter">
       <slot name="footer" />
 
       <template v-if="!props.hidePagination">
@@ -297,7 +298,7 @@ function getRowAttrs(item, idx) {
               @update:model-value="emit('fetch', 'paginate')" />
           </BCol>
 
-          <BCol class="fs-7 text-muted" cols="auto">
+          <BCol class="text-muted" cols="auto">
             <span v-if="$datagrid.loading">Loading...</span>
             <FormatText v-else :template="paginationText.template" :values="paginationText.values" />
           </BCol>
@@ -318,16 +319,23 @@ function getRowAttrs(item, idx) {
   cursor: pointer;
 }
 
-thead {
+table thead {
+  font-size: 0.8rem;
   background: var(--bs-body-bg);
 }
-thead:before {
+table thead:before {
   content: "";
   position: absolute;
   inset: 0;
   z-index: -1;
   background: rgb(var(--bs-primary-rgb), 0.05);
 }
+table thead tr th:is(:first-child, :last-child) {
+  padding: 0 0.75rem !important;
+}
+table tbody tr td:is(:first-child, :last-child) {
+  padding: 0 0.75rem !important;
+}
 </style>
 
 <i18n lang="json">

package/dist/runtime/composables/useDatagrid.js

@@ -11,12 +11,14 @@ export function useDatagrid(params) {
         } else if (mode === "append") {
           state.items.push(item);
         }
+        state.total += 1;
         return state.items;
       },
       removeItem(predicate) {
         const index = state.items.findIndex(predicate);
         if (index !== -1) {
           state.items.splice(index, 1);
+          state.total = Math.max(0, state.total - 1);
         }
         return index;
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@merkaly/nuxt",
-  "version": "0.7.7",
+  "version": "0.7.8",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/merkaly-io/nuxt.git"
@@ -38,7 +38,7 @@
     "@nuxt/kit": "^4.4.8",
     "@nuxtjs/i18n": "^10.4.0",
     "@nuxtjs/plausible": "^3.0.2",
-    "@sentry/nuxt": "^10.57.0",
+    "@sentry/nuxt": "^10.59.0",
     "@types/node": "latest",
     "@types/vue-select": "^3.16.8",
     "@vueuse/components": "^14.3.0",