@finema/core 3.23.2 → 3.25.0

package/dist/runtime/components/Table/Base.vue

@@ -1,131 +1,121 @@
 <template>
-  <div
+  <div
     :class="
   theme.rootWrapper({
     class: [ui?.rootWrapper]
   })
-"
-  >
-    <Pagination
-      v-if="!options.isHidePagination && !options.isHidePaginationTop"
-      :options="options"
-      :ui="ui"
-      :page="page"
-      :page-limit="pageLimit"
-      class="border-b border-[#EAECF0]"
-      @pageChange="onPageChange"
-      @search="emits('search')"
-      @pageLimitChange="changePageLimit"
-    />
-    <UTable
-      :loading="options.status.isLoading"
-      :columns="uTableCompatibleColumns"
-      :data="options.rawData"
-      v-bind="$attrs"
-      :ui="ui"
-    >
-      <template #loading>
-        <Loader :loading="true" />
-      </template>
-      <template #empty>
-        <slot
-          v-if="options.status.isLoading"
-          name="loading"
-        >
-          <Loader :loading="true" />
-        </slot>
-        <slot
-          v-else-if="options.status.isError"
-          name="error"
-        >
-          <div
-            class="text-error-400 flex h-[200px] items-center justify-center text-2xl"
-          >
-            {{ StringHelper.getError(options.status.errorData) }}
-          </div>
-        </slot>
-
-        <slot
-          v-else
-          name="error"
-        >
-          <Empty />
-        </slot>
-      </template>
-      <template
-        v-for="column in options.columns"
-        #[`${column.accessorKey}-cell`]="slotProps"
-        :key="column.accessorKey"
-      >
-        <NuxtLink
-          v-if="to && column.accessorKey !== 'actions'"
-          :to="resolveTo(slotProps.row.original)"
-          :target="resolveTarget(slotProps.row.original)"
-          :rel="
-  resolveTarget(slotProps.row.original) === '_blank' ? 'noopener noreferrer' : void 0
-"
-          class="absolute inset-0"
-          tabindex="-1"
-          aria-hidden="true"
-        />
-        <div
-          :class="
-  to && column.accessorKey !== 'actions' ? 'pointer-events-none relative z-10' : 'relative z-10'
-"
-        >
-          <slot
-            :name="`${column.accessorKey}-cell`"
-            v-bind="slotProps"
-          >
-            <component
-              :is="column.component"
-              v-if="column.type === COLUMN_TYPES.COMPONENT && column.component"
-              :value="transformValue(column, slotProps.row)"
-              :column="column"
-              :row="slotProps.row"
-            />
-            <component
-              :is="columnTypeComponents[column.type]"
-              v-else-if="
-  column.type !== COLUMN_TYPES.COMPONENT && columnTypeComponents[column.type]
-"
-              :value="transformValue(column, slotProps.row)"
-              :column="column"
-              :row="slotProps.row"
-            />
-            <VNodeRenderer
-              v-else-if="typeof column.cell === 'function'"
-              :vnode="transformValue(column, slotProps.row)"
-            />
-            <template v-else>
-              {{ transformValue(column, slotProps.row) }}
-            </template>
-          </slot>
-        </div>
-      </template>
-      <template
-        v-for="slotName in forwardedSlotNames"
-        :key="slotName"
-        #[slotName]="slotProps"
-      >
-        <slot
-          :name="slotName"
-          v-bind="slotProps || {}"
-        />
-      </template>
-    </UTable>
-    <Pagination
-      v-if="!options.isHidePagination && !options.isHidePaginationBottom"
-      :options="options"
-      :ui="ui"
-      :page="page"
-      :page-limit="pageLimit"
-      class="rounded-b-lg border-t border-[#EAECF0]"
-      @pageChange="onPageChange"
-      @search="emits('search')"
-      @pageLimitChange="changePageLimit"
-    />
-  </div>
+"
+  >
+    <Pagination
+      v-if="!options.isHidePagination && !options.isHidePaginationTop"
+      :options="options"
+      :ui="ui"
+      :page="page"
+      :page-limit="pageLimit"
+      class="border-b border-[#EAECF0]"
+      @pageChange="onPageChange"
+      @search="emits('search')"
+      @pageLimitChange="changePageLimit"
+    />
+    <UTable
+      :loading="options.status.isLoading"
+      :columns="uTableCompatibleColumns"
+      :data="options.rawData"
+      v-bind="$attrs"
+      :ui="ui"
+    >
+      <template #loading>
+        <Loader :loading="true" />
+      </template>
+      <template #empty>
+        <slot
+          v-if="options.status.isLoading"
+          name="loading"
+        >
+          <Loader :loading="true" />
+        </slot>
+        <slot
+          v-else-if="options.status.isError"
+          name="error"
+        >
+          <div class="flex h-[200px] items-center justify-center text-2xl text-error-400">
+            {{ StringHelper.getError(options.status.errorData) }}
+          </div>
+        </slot>
+
+        <slot
+          v-else
+          name="error"
+        >
+          <Empty />
+        </slot>
+      </template>
+      <template
+        v-for="column in options.columns"
+        #[`${column.accessorKey}-cell`]="slotProps"
+        :key="column.accessorKey"
+      >
+        <NuxtLink
+          v-if="to && column.accessorKey !== 'actions'"
+          :to="resolveTo(slotProps.row.original)"
+          :target="resolveTarget(slotProps.row.original)"
+          :rel="resolveTarget(slotProps.row.original) === '_blank' ? 'noopener noreferrer' : void 0"
+          class="absolute inset-0"
+          tabindex="-1"
+          aria-hidden="true"
+        />
+        <div :class="to && column.accessorKey !== 'actions' ? 'pointer-events-none relative z-10' : 'relative z-10'">
+          <slot
+            :name="`${column.accessorKey}-cell`"
+            v-bind="slotProps"
+          >
+            <component
+              :is="column.component"
+              v-if="column.type === COLUMN_TYPES.COMPONENT && column.component"
+              :value="transformValue(column, slotProps.row)"
+              :column="column"
+              :row="slotProps.row"
+            />
+            <component
+              :is="columnTypeComponents[column.type]"
+              v-else-if="column.type !== COLUMN_TYPES.COMPONENT && columnTypeComponents[column.type]"
+              :value="transformValue(column, slotProps.row)"
+              :column="column"
+              :row="slotProps.row"
+            />
+            <VNodeRenderer
+              v-else-if="typeof column.cell === 'function'"
+              :vnode="transformValue(column, slotProps.row)"
+            />
+            <template v-else>
+              {{ transformValue(column, slotProps.row) }}
+            </template>
+          </slot>
+        </div>
+      </template>
+      <template
+        v-for="slotName in forwardedSlotNames"
+        :key="slotName"
+        #[slotName]="slotProps"
+      >
+        <slot
+          :name="slotName"
+          v-bind="slotProps || {}"
+        />
+      </template>
+    </UTable>
+    <Pagination
+      v-if="!options.isHidePagination && !options.isHidePaginationBottom"
+      :options="options"
+      :ui="ui"
+      :page="page"
+      :page-limit="pageLimit"
+      class="rounded-b-lg border-t border-[#EAECF0]"
+      @pageChange="onPageChange"
+      @search="emits('search')"
+      @pageLimitChange="changePageLimit"
+    />
+  </div>
 </template>
 
 <script setup>
@@ -135,13 +125,7 @@ import {
 } from "#core/components/Table/types";
 import ColumnNumber from "#core/components/Table/ColumnNumber.vue";
 import ColumnImage from "#core/components/Table/ColumnImage.vue";
-import {
-  useAppConfig,
-  useRoute,
-  useUiConfig,
-  useWatchChange,
-  StringHelper
-} from "#imports";
+import { useAppConfig, useRoute, useUiConfig, useWatchChange, StringHelper } from "#imports";
 import ColumnDateTime from "#core/components/Table/ColumnDateTime.vue";
 import Empty from "#core/components/Empty.vue";
 import ColumnDate from "#core/components/Table/ColumnDate.vue";
@@ -170,9 +154,7 @@ const VNodeRenderer = defineComponent({
 });
 const route = useRoute();
 const slots = useSlots();
-const forwardedSlotNames = computed(
-  () => Object.keys(slots).filter((name) => !name.endsWith("-cell"))
-);
+const forwardedSlotNames = computed(() => Object.keys(slots).filter((name) => !name.endsWith("-cell")));
 const columnTypeComponents = {
   [COLUMN_TYPES.NUMBER]: ColumnNumber,
   [COLUMN_TYPES.IMAGE]: ColumnImage,
@@ -183,9 +165,7 @@ const columnTypeComponents = {
 const theme = computed(() => useUiConfig(tableTheme, "table")());
 const config = useAppConfig();
 const page = ref(props.options.pageOptions?.currentPage || 1);
-const pageLimit = ref(
-  props.options.pageOptions?.limit || config.core.limit_per_page
-);
+const pageLimit = ref(props.options.pageOptions?.limit || config.core.limit_per_page);
 const uTableCompatibleColumns = computed(
   () => props.options.columns.map((col) => ({
     ...col,
@@ -216,7 +196,7 @@ const resolveTo = (rowOriginal) => {
     ...resolved,
     query: {
       ...route.query,
-      ...resolved.query || {}
+      ...resolved.query
     }
   };
 };

package/dist/runtime/components/Table/ColumnDate.vue

@@ -1,5 +1,5 @@
 <template>
-  {{ getValue || "-" }}
+  {{ getValue || "-" }}
 </template>
 
 <script setup>

package/dist/runtime/components/Table/ColumnDateTime.vue

@@ -1,5 +1,5 @@
 <template>
-  {{ getValue || "-" }}
+  {{ getValue || "-" }}
 </template>
 
 <script setup>

package/dist/runtime/components/Table/ColumnImage.vue

@@ -1,8 +1,8 @@
 <template>
-  <Image
-    class="h-12 rounded"
-    :src="getValue"
-  />
+  <Image
+    class="h-12 rounded"
+    :src="getValue"
+  />
 </template>
 
 <script setup>

package/dist/runtime/components/Table/ColumnText.vue

@@ -1,14 +1,14 @@
 <template>
-  <NuxtLink
-    v-if="column.meta?.link"
-    v-bind="column.meta.link"
-  >
-    {{ getValue }}
-  </NuxtLink>
-
-  <span v-else>
-    {{ getValue }}
-  </span>
+  <NuxtLink
+    v-if="column.meta?.link"
+    v-bind="column.meta.link"
+  >
+    {{ getValue }}
+  </NuxtLink>
+
+  <span v-else>
+    {{ getValue }}
+  </span>
 </template>
 
 <script setup>

package/dist/runtime/components/Table/Pagination.vue

@@ -1,100 +1,100 @@
 <template>
-  <div
+  <div
     :class="
   theme.paginationContainer({
     class: [ui?.paginationContainer]
   })
-"
-  >
-    <div
+"
+  >
+    <div
       :class="
   theme.paginationInfoWrapper({
     class: [ui?.paginationInfoWrapper]
   })
-"
-    >
-      <USelect
-        v-if="options.pageOptions && !options.isHideLimitSelect"
-        size="lg"
-        trailing
+"
+    >
+      <USelect
+        v-if="options.pageOptions && !options.isHideLimitSelect"
+        size="lg"
+        trailing
         :class="
   theme.paginationLimitSelect({
     class: [ui?.paginationLimitSelect, 'cursor-pointer']
   })
-"
-        :items="pageLimitItems"
-        :model-value="pageLimit"
-        @update:modelValue="emits('pageLimitChange', $event)"
-      >
-        <template #default="{ modelValue }">
-          <p
+"
+        :items="pageLimitItems"
+        :model-value="pageLimit"
+        @update:modelValue="emits('pageLimitChange', $event)"
+      >
+        <template #default="{ modelValue }">
+          <p
             :class="
   theme.paginationLimitSelectLabel({
     class: [ui?.paginationLimitSelectLabel]
   })
-"
-          >
-            {{ modelValue }}
-            {{ messages.pagination.items }}
-          </p>
-        </template>
-      </USelect>
-      <p
+"
+          >
+            {{ modelValue }}
+            {{ messages.pagination.items }}
+          </p>
+        </template>
+      </USelect>
+      <p
         :class="
   theme.paginationInfo({
     class: [ui?.paginationInfo, '']
   })
-"
-      >
-        <span v-if="options.pageOptions">{{ pageBetween }}
-          {{ messages.pagination.ofTotal }}
-          {{ totalCountWithComma }}</span>
-        <span v-else>{{ messages.pagination.total }}
-          {{ options.rawData.length }}
-          {{ messages.pagination.items }}</span>
-      </p>
-    </div>
-    <UPagination
-      v-if="options.pageOptions && options.pageOptions.totalPage > 1"
-      :page="page"
-      :default-page="options.pageOptions?.currentPage || 1"
-      :items-per-page="options.pageOptions.limit"
-      :total="options.pageOptions.totalCount"
-      :to="options.isRouteChange ? to : void 0"
-      show-edges
-      variant="outline"
-      color="neutral"
-      active-color="neutral"
-      active-variant="subtle"
-      @update:page="emits('pageChange', $event)"
-    >
-      <template #item="{ item, page }">
-        <Button
-          v-if="item.type === 'page'"
-          :variant="page === item.value ? 'subtle' : 'outline'"
-          :color="page === item.value ? 'neutral' : 'neutral'"
-          :label="String(NumberHelper.withComma(item.value))"
-          :ui="{ label: themePagination.label }"
-          square
-          :to="options.isRouteChange ? to?.(item.value) : void 0"
+"
+      >
+        <span v-if="options.pageOptions">
+          {{ pageBetween }}
+          {{ messages.pagination.ofTotal }}
+          {{ totalCountWithComma }}
+        </span>
+        <span v-else>
+          {{ messages.pagination.total }}
+          {{ options.rawData.length }}
+          {{ messages.pagination.items }}
+        </span>
+      </p>
+    </div>
+    <UPagination
+      v-if="options.pageOptions && options.pageOptions.totalPage > 1"
+      :page="page"
+      :default-page="options.pageOptions?.currentPage || 1"
+      :items-per-page="options.pageOptions.limit"
+      :total="options.pageOptions.totalCount"
+      :to="options.isRouteChange ? to : void 0"
+      show-edges
+      variant="outline"
+      color="neutral"
+      active-color="neutral"
+      active-variant="subtle"
+      @update:page="emits('pageChange', $event)"
+    >
+      <template #item="{ item, page }">
+        <Button
+          v-if="item.type === 'page'"
+          :variant="page === item.value ? 'subtle' : 'outline'"
+          :color="page === item.value ? 'neutral' : 'neutral'"
+          :label="String(NumberHelper.withComma(item.value))"
+          :ui="{ label: themePagination.label }"
+          square
+          :to="options.isRouteChange ? to?.(item.value) : void 0"
           :class="
   theme.buttonPagination({
     class: [ui?.buttonPagination]
   })
-"
-        />
-      </template>
-    </UPagination>
-  </div>
+"
+        />
+      </template>
+    </UPagination>
+  </div>
 </template>
 
 <script setup>
 import { useCoreMessages } from "#core/composables/useMessages";
-import {
-  computed,
-  NumberHelper,
-  useUiConfig
-} from "#imports";
+import { computed, NumberHelper, useUiConfig } from "#imports";
 import UPagination from "#ui/components/Pagination.vue";
 import USelect from "#ui/components/Select.vue";
 import { tableTheme } from "../../theme/table";
@@ -106,9 +106,7 @@ const props = defineProps({
   options: { type: Object, required: true },
   ui: { type: null, required: false }
 });
-const themePagination = computed(
-  () => useUiConfig(paginationTheme, "pagination")()
-);
+const themePagination = computed(() => useUiConfig(paginationTheme, "pagination")());
 const pageLimitItems = [
   {
     label: "10",
@@ -153,9 +151,7 @@ const totalCountWithComma = computed(() => {
 const to = (page) => {
   const params = props.options.pageOptions?.request?.params || {};
   const cleanParams = Object.fromEntries(
-    Object.entries(params).filter(
-      ([key, value]) => value !== null && value !== void 0 && value !== ""
-    )
+    Object.entries(params).filter(([key, value]) => value !== null && value !== void 0 && value !== "")
   );
   return {
     query: {
@@ -164,7 +160,5 @@ const to = (page) => {
     }
   };
 };
-const {
-  messages
-} = useCoreMessages();
+const { messages } = useCoreMessages();
 </script>

package/dist/runtime/components/Table/Simple.vue

@@ -1,28 +1,28 @@
 <template>
-  <Base
-    v-bind="$attrs"
+  <Base
+    v-bind="$attrs"
     :options="{
   ...options,
   pageOptions,
   isHideLimitSelect: true,
   rawData: itemsByPage
-}"
-    :ui="computedUi"
-    :to="to"
-    :target="target"
-    :preserve-query="preserveQuery"
-    @page-change="onPageChange"
-  >
-    <template
-      v-for="(_, slot) of $slots"
-      #[slot]="slotProps"
-    >
-      <slot
-        :name="slot"
-        v-bind="slotProps || {}"
-      />
-    </template>
-  </Base>
+}"
+    :ui="computedUi"
+    :to="to"
+    :target="target"
+    :preserve-query="preserveQuery"
+    @page-change="onPageChange"
+  >
+    <template
+      v-for="(_, slot) of $slots"
+      #[slot]="slotProps"
+    >
+      <slot
+        :name="slot"
+        v-bind="slotProps || {}"
+      />
+    </template>
+  </Base>
 </template>
 
 <script setup>