@finema/core 2.18.3 → 2.20.0

package/dist/runtime/components/Form/InputUploadDropzoneAuto/FailedState.vue

@@ -11,12 +11,12 @@
         <h1 class="truncate font-bold">
           {{ selectedFile.name }}
         </h1>
-        <p class="truncate font-light text-error">
+        <p class="text-error truncate font-light">
           {{ uploadFailedLabel }}
         </p>
         <Button
           variant="link"
-          :icon="themeStatic.actionRetryIcon"
+          :icon="icons.actionRetryIcon"
           :class="theme.actionRetryBtnClass()"
           color="primary"
           @click="$emit('retry')"
@@ -25,7 +25,7 @@
         </Button>
       </div>
       <Icon
-        :name="themeStatic.actionDeleteIcon"
+        :name="icons.actionDeleteIcon"
         :class="theme.actionDeleteIconClass()"
         title="ลบไฟล์"
         @click="$emit('delete')"
@@ -36,7 +36,7 @@
 
 <script setup>
 import { isImage } from "#core/helpers/componentHelper";
-import { useUiConfigStatic } from "#imports";
+import { useUiIconConfig } from "#imports";
 const props = defineProps({
   theme: { type: null, required: true },
   selectedFile: { type: null, required: true },
@@ -44,11 +44,11 @@ const props = defineProps({
   retryLabel: { type: String, required: true }
 });
 defineEmits(["retry", "delete"]);
-const themeStatic = useUiConfigStatic("uploadFileDropzone");
+const icons = useUiIconConfig("uploadFileDropzone");
 const getFileIcon = (file) => {
   if (isImage(file)) {
-    return themeStatic.placeholderImgIcon;
+    return icons.placeholderImgIcon;
   }
-  return themeStatic.filePreviewIcon;
+  return icons.filePreviewIcon;
 };
 </script>

package/dist/runtime/components/Form/InputUploadDropzoneAuto/LoadingState.vue

@@ -17,7 +17,7 @@
       </div>
       <div>
         <Icon
-          :name="themeStatic.loadingIcon"
+          :name="icons.loadingIcon"
           :class="theme.onLoadingLoadingIconClass()"
         />
       </div>
@@ -27,19 +27,19 @@
 
 <script setup>
 import { isImage } from "#core/helpers/componentHelper";
-import { useUiConfigStatic } from "#imports";
+import { useUiIconConfig } from "#imports";
 const props = defineProps({
   theme: { type: null, required: true },
   selectedFile: { type: null, required: true },
   percent: { type: Number, required: true },
   uploadingLabel: { type: String, required: true }
 });
-const themeStatic = useUiConfigStatic("uploadFileDropzone");
+const icons = useUiIconConfig("uploadFileDropzone");
 const getFileIcon = (file) => {
   if (isImage(file)) {
-    return themeStatic.placeholderImgIcon;
+    return icons.placeholderImgIcon;
   }
-  return themeStatic.filePreviewIcon;
+  return icons.filePreviewIcon;
 };
 const getFileSize = (file) => {
   const size = file.size;

package/dist/runtime/components/Form/InputUploadDropzoneAuto/SuccessState.vue

@@ -13,7 +13,7 @@
       </div>
       <div v-else>
         <Icon
-          :name="themeStatic.filePreviewIcon"
+          :name="icons.filePreviewIcon"
           :class="theme.onPreviewPreviewFileClass()"
         />
       </div>
@@ -35,27 +35,27 @@
           class="flex"
         >
           <Icon
-            :name="themeStatic.actionPreviewIcon"
+            :name="icons.actionPreviewIcon"
             :class="theme.actionIconClass()"
             title="ดูตัวอย่าง"
           />
         </a>
         <Icon
           v-if="isImageFromPath(value.path) || isVideoFromPath(value.path)"
-          :name="themeStatic.actionPreviewIcon"
+          :name="icons.actionPreviewIcon"
           :class="theme.actionIconClass()"
           title="ดูตัวอย่าง"
           @click="$emit('preview')"
         />
         <Icon
-          :name="themeStatic.actionDownloadIcon"
+          :name="icons.actionDownloadIcon"
           :class="theme.actionIconClass()"
           title="ดาวน์โหลดไฟล์"
           @click="$emit('download')"
         />
         <Icon
           v-if="!disabled && !readonly"
-          :name="themeStatic.actionDeleteIcon"
+          :name="icons.actionDeleteIcon"
           :class="theme.actionIconClass()"
           title="ลบไฟล์"
           @click="$emit('delete')"
@@ -72,7 +72,7 @@ import {
   isVideoFromPath,
   useFileSize
 } from "#core/helpers/componentHelper";
-import { useUiConfigStatic } from "#imports";
+import { useUiIconConfig } from "#imports";
 defineProps({
   theme: { type: null, required: true },
   value: { type: Object, required: true },
@@ -80,7 +80,7 @@ defineProps({
   readonly: { type: Boolean, required: false }
 });
 defineEmits(["preview", "download", "delete"]);
-const themeStatic = useUiConfigStatic("uploadFileDropzone");
+const icons = useUiIconConfig("uploadFileDropzone");
 const getFileSizeFromValue = (fileValue) => {
   const allocate = useFileSize(fileValue.size || 0);
   return allocate.isSelectedFileUseMb.value ? `${allocate.selectedFileSizeMb.value} MB` : `${allocate.selectedFileSizeKb.value} KB`;

package/dist/runtime/components/Form/index.vue

@@ -1,5 +1,5 @@
-<template>
-  <form class="form">
-    <slot />
-  </form>
-</template>
+<template>
+  <form class="form">
+    <slot />
+  </form>
+</template>

package/dist/runtime/components/Form/types.d.ts

@@ -3,6 +3,7 @@ import type { FormContext } from 'vee-validate';
 import type { IUploadDropzoneAutoField } from './InputUploadDropzoneAuto/types.js';
 import type { IDateTimeRangeField } from './InputDateTimeRange/date_range_time_field.types.js';
 import type { ITextField } from '#core/components/Form/InputText/types';
+import type { ISearchField } from '#core/components/Form/InputSearch/types';
 import type { ITextareaField } from '#core/components/Form/InputTextarea/types';
 import type { IToggleField } from '#core/components/Form/InputToggle/types';
 import type { ISelectField } from '#core/components/Form/InputSelect/types';
@@ -14,6 +15,7 @@ import type { IRadioField } from '#core/components/Form/InputRadio/types';
 import type { IWYSIWYGField } from '#core/components/Form/InputWYSIWYG/types';
 export declare const enum INPUT_TYPES {
     TEXT = "TEXT",
+    SEARCH = "SEARCH",
     NUMBER = "NUMBER",
     TEXTAREA = "TEXTAREA",
     PASSWORD = "PASSWORD",
@@ -64,7 +66,7 @@ export interface IFormFieldBase<I extends INPUT_TYPES, P extends IFieldProps, O>
     props: P;
     on?: O;
 }
-export type IFormField = ITextField | INumberField | ITextareaField | IToggleField | ISelectField | ICheckboxField | ISelectMultipleField | IRadioField | IDateTimeField | IDateTimeRangeField | IUploadDropzoneAutoField | IWYSIWYGField | IFormFieldBase<INPUT_TYPES.COMPONENT, any, any>;
+export type IFormField = ITextField | ISearchField | INumberField | ITextareaField | IToggleField | ISelectField | ICheckboxField | ISelectMultipleField | IRadioField | IDateTimeField | IDateTimeRangeField | IUploadDropzoneAutoField | IWYSIWYGField | IFormFieldBase<INPUT_TYPES.COMPONENT, any, any>;
 export interface IFileValue {
     url: string;
     path?: string;

package/dist/runtime/components/Form/types.js

@@ -1,5 +1,6 @@
 export var INPUT_TYPES = /* @__PURE__ */ ((INPUT_TYPES2) => {
   INPUT_TYPES2["TEXT"] = "TEXT";
+  INPUT_TYPES2["SEARCH"] = "SEARCH";
   INPUT_TYPES2["NUMBER"] = "NUMBER";
   INPUT_TYPES2["TEXTAREA"] = "TEXTAREA";
   INPUT_TYPES2["PASSWORD"] = "PASSWORD";

package/dist/runtime/components/Image.vue

@@ -1,32 +1,32 @@
 <template>
-  <UseImage v-bind="$props">
-    <template #loading>
-      <slot name="loading">
-        <div
-          class="flex h-full w-full items-center justify-center"
-        >
-          <Loader
-            :loading="true"
-          />
-        </div>
-      </slot>
-    </template>
-
-    <template #error>
-      <slot name="error">
-        <div
-          class="flex h-full w-full items-center justify-center"
-        >
-          <p class="text-error-400">
-            <Icon
-              name="i-heroicons:exclamation-circle-solid"
-              class="size-8 text-error-400"
-            />
-          </p>
-        </div>
-      </slot>
-    </template>
-  </UseImage>
+  <UseImage v-bind="$props">
+    <template #loading>
+      <slot name="loading">
+        <div
+          class="flex h-full w-full items-center justify-center"
+        >
+          <Loader
+            :loading="true"
+          />
+        </div>
+      </slot>
+    </template>
+
+    <template #error>
+      <slot name="error">
+        <div
+          class="flex h-full w-full items-center justify-center"
+        >
+          <p class="text-error-400">
+            <Icon
+              name="i-heroicons:exclamation-circle-solid"
+              class="text-error-400 size-8"
+            />
+          </p>
+        </div>
+      </slot>
+    </template>
+  </UseImage>
 </template>
 
 <script setup>

package/dist/runtime/components/Log/index.vue

@@ -1,21 +1,21 @@
 <template>
-  <DevOnly>
-    <TeleportSafe
-      to="#dev-logs"
-    >
-      <LogItem
-        v-if="typeof data !== 'undefined'"
-        :data="data"
-        :title="title"
-      />
-      <LogItem
-        v-for="(item, index) in dataItems"
-        :key="index"
-        :data="item"
-        :title="`${title} #${index + 1}`"
-      />
-    </TeleportSafe>
-  </DevOnly>
+  <DevOnly>
+    <TeleportSafe
+      to="#dev-logs"
+    >
+      <LogItem
+        v-if="typeof data !== 'undefined'"
+        :data="data"
+        :title="title"
+      />
+      <LogItem
+        v-for="(item, index) in dataItems"
+        :key="index"
+        :data="item"
+        :title="`${title} #${index + 1}`"
+      />
+    </TeleportSafe>
+  </DevOnly>
 </template>
 
 <script setup>

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

@@ -18,7 +18,7 @@
       <div class="flex h-60 items-center justify-center">
         <Icon
           name="i-svg-spinners:180-ring-with-bg"
-          class="size-8 text-primary"
+          class="text-primary size-8"
         />
       </div>
     </template>

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/ColumnNumber.vue

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

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

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

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

@@ -32,7 +32,9 @@
           name="error"
         >
           <div
-            class="flex h-[200px] items-center justify-center text-2xl text-error-400"
+            class="
+              text-error-400 flex h-[200px] items-center justify-center text-2xl
+            "
           >
             {{ StringHelper.getError(options.status.errorData) }}
           </div>

package/dist/runtime/composables/useConfig.d.ts

@@ -1,5 +1,5 @@
 import type { core as Core } from '../../core.config.js';
 export declare const useCoreConfig: () => typeof Core;
 export declare const useUiConfig: (config: object, name: string) => any;
-export declare const useUiConfigStatic: (name: string) => any;
-export declare const useUiAllConfig: () => any;
+export declare const useUiIconConfig: (name: string) => any;
+export declare const useUiStaticConfig: (name: string) => any;

package/dist/runtime/composables/useConfig.js

@@ -9,9 +9,9 @@ export const useUiConfig = (config, name) => {
     ...appConfig.ui[name] || {}
   });
 };
-export const useUiConfigStatic = (name) => {
-  return appConfig.ui[name].slots;
+export const useUiIconConfig = (name) => {
+  return appConfig.ui[name].icons;
 };
-export const useUiAllConfig = () => {
-  return appConfig.ui;
+export const useUiStaticConfig = (name) => {
+  return appConfig.ui[name].slots;
 };

package/dist/runtime/server/tsconfig.json

@@ -1,3 +1,3 @@
-{
-  "extends": "../../../.nuxt/tsconfig.server.json",
-}
+{
+  "extends": "../../../.nuxt/tsconfig.server.json",
+}

package/dist/runtime/styles/main.css

@@ -1 +1 @@
-@import "tailwindcss";@import "@nuxt/ui";@plugin "@tailwindcss/typography";@source inline("prose");@theme static{--font-sans:"Noto Sans Thai","Noto Sans Thai Looped","Public Sans",sans-serif;--color-main:#232c5a;--color-main-50:#f4f4f7;--color-main-100:#e9eaef;--color-main-200:#c8cad6;--color-main-300:#a7abbd;--color-main-400:#656b8c;--color-main-500:#232c5a;--color-main-600:#202851;--color-main-700:#151a36;--color-main-800:#101429;--color-main-900:#0b0d1b;--color-main-950:#0b0d1b;--color-secondary:#ee8b36;--color-secondary-50:#fdf1e7;--color-secondary-100:#f9d6b8;--color-secondary-200:#f5bb89;--color-secondary-300:#f1a05a;--color-secondary-400:#ed852b;--color-secondary-500:#d46b12;--color-secondary-600:#a5540e;--color-secondary-700:#763c0a;--color-secondary-800:#472406;--color-secondary-900:#180c02;--color-info:#0d8cee;--color-info-50:#f3f9fe;--color-info-100:#e7f4fd;--color-info-200:#ebf6ff;--color-info-300:#9ed1f8;--color-info-400:#56aff3;--color-info-500:#0d8cee;--color-info-600:#0c7ed6;--color-info-700:#08548f;--color-info-800:#063f6b;--color-info-900:#042a47;--color-error:#f25555;--color-error-50:#fef7f7;--color-error-100:#feeeee;--color-error-200:#ffdfdf;--color-error-300:#fabbbb;--color-error-400:#f68888;--color-error-500:#f25555;--color-error-600:#da4d4d;--color-error-700:#913333;--color-error-800:#6d2626;--color-error-900:#491a1a;--color-success:#3fb061;--color-success-50:#f5fbf7;--color-success-100:#ecf7ef;--color-success-200:#daeee0;--color-success-300:#b2dfc0;--color-success-400:#79c890;--color-success-500:#3fb061;--color-success-600:#399e57;--color-success-700:#266a3a;--color-success-800:#1c4f2c;--color-success-900:#13351d;--color-warning:#ff9a35;--color-warning-50:#fffaf5;--color-warning-100:#fff5eb;--color-warning-200:#fef1cc;--color-warning-300:#ffd7ae;--color-warning-400:#ffb872;--color-warning-500:#ff9a35;--color-warning-600:#e68b30;--color-warning-700:#995c20;--color-warning-800:#734518;--color-warning-900:#4d2e10}::-webkit-scrollbar{-webkit-appearance:none;height:10px;width:10px}::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.3);border-radius:4px;box-shadow:0 0 1px hsla(0,0%,100%,.5)}:root{--dp-font-family:inherit!important}.dp__theme_light{--dp-primary-color:var(--color-main)!important;--dp-primary-disabled-color:var(--color-main-200)!important}#__nuxt,body,html{@apply w-full h-full}
+@import "tailwindcss";@import "@nuxt/ui";@plugin "@tailwindcss/typography";@source inline("prose");@theme{--font-sans:"Noto Sans Thai","Noto Sans Thai Looped","Public Sans",sans-serif}@theme static{--color-main:#232c5a;--color-main-50:#f4f4f7;--color-main-100:#e9eaef;--color-main-200:#c8cad6;--color-main-300:#a7abbd;--color-main-400:#656b8c;--color-main-500:#232c5a;--color-main-600:#202851;--color-main-700:#151a36;--color-main-800:#101429;--color-main-900:#0b0d1b;--color-main-950:#0b0d1b;--color-secondary:#ee8b36;--color-secondary-50:#fdf1e7;--color-secondary-100:#f9d6b8;--color-secondary-200:#f5bb89;--color-secondary-300:#f1a05a;--color-secondary-400:#ed852b;--color-secondary-500:#d46b12;--color-secondary-600:#a5540e;--color-secondary-700:#763c0a;--color-secondary-800:#472406;--color-secondary-900:#180c02;--color-info:#0d8cee;--color-info-50:#f3f9fe;--color-info-100:#e7f4fd;--color-info-200:#ebf6ff;--color-info-300:#9ed1f8;--color-info-400:#56aff3;--color-info-500:#0d8cee;--color-info-600:#0c7ed6;--color-info-700:#08548f;--color-info-800:#063f6b;--color-info-900:#042a47;--color-error:#f25555;--color-error-50:#fef7f7;--color-error-100:#feeeee;--color-error-200:#ffdfdf;--color-error-300:#fabbbb;--color-error-400:#f68888;--color-error-500:#f25555;--color-error-600:#da4d4d;--color-error-700:#913333;--color-error-800:#6d2626;--color-error-900:#491a1a;--color-success:#3fb061;--color-success-50:#f5fbf7;--color-success-100:#ecf7ef;--color-success-200:#daeee0;--color-success-300:#b2dfc0;--color-success-400:#79c890;--color-success-500:#3fb061;--color-success-600:#399e57;--color-success-700:#266a3a;--color-success-800:#1c4f2c;--color-success-900:#13351d;--color-warning:#ff9a35;--color-warning-50:#fffaf5;--color-warning-100:#fff5eb;--color-warning-200:#fef1cc;--color-warning-300:#ffd7ae;--color-warning-400:#ffb872;--color-warning-500:#ff9a35;--color-warning-600:#e68b30;--color-warning-700:#995c20;--color-warning-800:#734518;--color-warning-900:#4d2e10}::-webkit-scrollbar{-webkit-appearance:none;height:10px;width:10px}::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.3);border-radius:4px;box-shadow:0 0 1px hsla(0,0%,100%,.5)}:root{--dp-font-family:inherit!important}.dp__theme_light{--dp-primary-color:var(--color-main)!important;--dp-primary-disabled-color:var(--color-main-200)!important}#__nuxt,body,html{@apply w-full h-full}

package/dist/runtime/theme/dialog.d.ts

@@ -1,13 +1,15 @@
 export declare const dialogTheme: {
-    slots: {
-        base: string;
-        overlay: string;
-        icon: string;
+    icons: {
         iconSuccess: string;
         iconInfo: string;
         iconWarning: string;
         iconError: string;
         iconConfirm: string;
+    };
+    slots: {
+        base: string;
+        overlay: string;
+        icon: string;
         wrapper: string;
         confirmColor: string;
         title: string;

package/dist/runtime/theme/dialog.js

@@ -1,13 +1,15 @@
 export const dialogTheme = {
-  slots: {
-    base: "flex space-x-4 shadow-lg ring ring-default z-[100] text-sm fixed top-[50%] left-[50%] max-h-[85vh] w-[90vw] max-w-[500px] translate-x-[-50%] translate-y-[-50%] rounded-lg bg-white p-[25px] focus:outline-none",
-    overlay: "fixed inset-0 bg-elevated/75 backdrop-blur",
-    icon: "size-12",
+  icons: {
     iconSuccess: "i-heroicons-check-circle",
     iconInfo: "i-heroicons-information-circle",
     iconWarning: "i-heroicons-exclamation-circle",
     iconError: "i-heroicons-x-circle",
-    iconConfirm: "i-heroicons-information-circle",
+    iconConfirm: "i-heroicons-information-circle"
+  },
+  slots: {
+    base: "flex space-x-4 shadow-lg ring ring-default z-[100] text-sm fixed top-[50%] left-[50%] max-h-[85vh] w-[90vw] max-w-[500px] translate-x-[-50%] translate-y-[-50%] rounded-lg bg-white p-[25px] focus:outline-none",
+    overlay: "fixed inset-0 bg-elevated/75 backdrop-blur",
+    icon: "size-12",
     wrapper: "flex flex-col w-full",
     confirmColor: "info",
     title: "font-bold text-lg",

package/dist/runtime/theme/input.d.ts

@@ -1,6 +1,9 @@
 export declare const inputTheme: {
     slots: {
         root: string;
+        suggestionsContainer: string;
+        suggestionItem: string;
+        suggestionItemActive: string;
     };
     defaultVariants: {
         size: string;

package/dist/runtime/theme/input.js

@@ -1,6 +1,9 @@
 export const inputTheme = {
   slots: {
-    root: "w-full"
+    root: "w-full",
+    suggestionsContainer: "absolute z-50 w-full mt-1 bg-white border border-gray-200 rounded-md shadow max-h-60 overflow-y-auto",
+    suggestionItem: "px-3 py-3 text-sm cursor-pointer hover:bg-(--ui-color-primary-100) truncate",
+    suggestionItemActive: "bg-(--ui-color-primary-100)"
   },
   defaultVariants: {
     size: "lg"

package/dist/runtime/theme/uploadFileDropzone.d.ts

@@ -1,4 +1,15 @@
 export declare const uploadFileDropzoneTheme: {
+    icons: {
+        filePreviewIcon: string;
+        uploadIcon: string;
+        placeholderImgIcon: string;
+        failedImgIcon: string;
+        loadingIcon: string;
+        actionPreviewIcon: string;
+        actionDownloadIcon: string;
+        actionDeleteIcon: string;
+        actionRetryIcon: string;
+    };
     slots: {
         base: string;
         wrapper: string;
@@ -7,11 +18,6 @@ export declare const uploadFileDropzoneTheme: {
         placeholderWrapper: string;
         placeholder: string;
         labelWrapper: string;
-        filePreviewIcon: string;
-        uploadIcon: string;
-        placeholderImgIcon: string;
-        failedImgIcon: string;
-        loadingIcon: string;
         labelIcon: string;
         onLoadingWrapper: string;
         onLoadingPlaceholderWrapper: string;
@@ -30,10 +36,6 @@ export declare const uploadFileDropzoneTheme: {
         actionWrapper: string;
         actionIconClass: string;
         actionDeleteIconClass: string;
-        actionPreviewIcon: string;
-        actionDownloadIcon: string;
-        actionDeleteIcon: string;
-        actionRetryIcon: string;
         actionRetryBtnClass: string;
     };
     variants: {

package/dist/runtime/theme/uploadFileDropzone.js

@@ -1,4 +1,15 @@
 export const uploadFileDropzoneTheme = {
+  icons: {
+    filePreviewIcon: "i-heroicons:document-text-solid",
+    uploadIcon: "ri:upload-cloud-2-line",
+    placeholderImgIcon: "i-material-symbols:imagesmode-outline",
+    failedImgIcon: "i-material-symbols:imagesmode-outline",
+    loadingIcon: "i-svg-spinners:180-ring-with-bg",
+    actionPreviewIcon: "ic:outline-remove-red-eye",
+    actionDownloadIcon: "material-symbols:download",
+    actionDeleteIcon: "material-symbols:delete",
+    actionRetryIcon: "stash:arrow-retry"
+  },
   slots: {
     base: "relative w-full text-base p-4 transition rounded-md flex items-center justify-center ring-1 bg-white ring-gray-300",
     wrapper: "flex flex-col items-center w-full",
@@ -7,11 +18,6 @@ export const uploadFileDropzoneTheme = {
     placeholderWrapper: "py-4 flex flex-col items-center justify-center",
     placeholder: "text-gray-400 text-center font-light text-sm truncate",
     labelWrapper: "flex items-center space-x-2 text-gray-400 text-center",
-    filePreviewIcon: "i-heroicons:document-text-solid",
-    uploadIcon: "ri:upload-cloud-2-line",
-    placeholderImgIcon: "i-material-symbols:imagesmode-outline",
-    failedImgIcon: "i-material-symbols:imagesmode-outline",
-    loadingIcon: "i-svg-spinners:180-ring-with-bg",
     labelIcon: "size-6 text-gray-400 text-center mb-3",
     // Loading state
     onLoadingWrapper: "flex items-center space-x-4 w-full",
@@ -34,10 +40,6 @@ export const uploadFileDropzoneTheme = {
     actionWrapper: "flex items-center space-x-2",
     actionIconClass: "size-6 text-dimmed hover:text-dimmed-600 cursor-pointer transition-colors",
     actionDeleteIconClass: "size-6 text-(--ui-color-error-500) hover:text-(--ui-color-error-600) cursor-pointer transition-colors",
-    actionPreviewIcon: "ic:outline-remove-red-eye",
-    actionDownloadIcon: "material-symbols:download",
-    actionDeleteIcon: "material-symbols:delete",
-    actionRetryIcon: "stash:arrow-retry",
     actionRetryBtnClass: "px-0"
   },
   variants: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@finema/core",
-  "version": "2.18.3",
+  "version": "2.20.0",
   "repository": "https://gitlab.finema.co/finema/ui-kit",
   "license": "MIT",
   "author": "Finema Dev Core Team",
@@ -72,7 +72,6 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.26.0",
-    "@hyoban/eslint-plugin-tailwindcss": "^4.0.0-alpha.12",
     "@nuxt/devtools": "^2.4.1",
     "@nuxt/eslint-config": "^1.3.1",
     "@nuxt/module-builder": "^1.0.1",
@@ -81,11 +80,8 @@
     "@types/node": "latest",
     "changelogen": "^0.5.7",
     "eslint": "^9.26.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-import-resolver-typescript": "^3.7.0",
-    "eslint-plugin-prettier": "^5.2.1",
-    "eslint-plugin-tailwindcss": "^3.17.5",
     "eslint-plugin-unused-imports": "^4.1.4",
+    "eslint-plugin-better-tailwindcss": "^3.1.0",
     "husky": "^9.1.7",
     "lint-staged": "^16.0.0",
     "nuxt": "3.17.3",
@@ -97,4 +93,4 @@
   "lint-staged": {
     "*": "eslint --fix"
   }
-}
+}