rayyy-vue-table-components 2.0.22 → 2.0.25

package/dist/src/components/form/BaseSelector.vue.d.ts

@@ -0,0 +1,23 @@
+import { ElOptions } from '../../types/OptionDto.ts';
+export type Selection = string | string[];
+type __VLS_Props = {
+    modelValue?: Selection;
+    options?: ElOptions[];
+    placeholder?: string;
+    collapseTags?: boolean;
+    collapseTagsTooltip?: boolean;
+    multiple?: boolean;
+    disabled?: boolean;
+    class?: string;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:modelValue": (data?: Selection | undefined) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((data?: Selection | undefined) => any) | undefined;
+}>, {
+    class: string;
+    placeholder: string;
+    modelValue: Selection;
+    options: ElOptions[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/src/components/index.d.ts

@@ -1,9 +1,9 @@
 export { default as BaseTable } from './tables/BaseTable.vue';
 export { default as BaseBtn } from './items/BaseBtn.vue';
 export { default as BaseInput } from './form/BaseInput.vue';
+export { default as BaseSelector } from './form/BaseSelector.vue';
 export { default as BaseDialog } from './items/BaseDialog.vue';
 export { default as BaseWaringDialog } from './items/BaseWaringDialog.vue';
-export { default as BaseMultipleInput } from './form/BaseMultipleInput.vue';
 export { default as SortTable } from './tables/SortTable.vue';
 export { default as TitleTable } from './tables/TitleTable.vue';
 export { default as SearchBar } from './items/SearchBar.vue';
@@ -18,6 +18,7 @@ export type { BaseTableProps, BaseTableEmits, BaseTableInstance, BaseBtnProps, B
 export type { default as BaseTableType } from './tables/BaseTable.vue';
 export type { default as BaseBtnType } from './items/BaseBtn.vue';
 export type { default as BaseInputType } from './form/BaseInput.vue';
+export type { default as BaseSelectorType } from './form/BaseSelector.vue';
 export type { default as BaseDialogType } from './items/BaseDialog.vue';
 export type { default as BaseWaringDialogType } from './items/BaseWaringDialog.vue';
 export type { default as SortTableType } from './tables/SortTable.vue';
@@ -26,7 +27,6 @@ export type { default as SearchBarType } from './items/SearchBar.vue';
 export type { default as TransferDialogType } from './transfer/TransferDialog.vue';
 export type { default as TransferItemType } from './transfer/transferItem.vue';
 export type { default as SearchableListPanelType } from './layout/SearchableListPanel.vue';
-export type { default as BaseMultipleInputType } from './form/BaseMultipleInput.vue';
 export type { default as FunctionHeaderType } from './layout/FunctionHeader.vue';
 export type { default as MainPanelType } from './layout/MainPanel.vue';
 export type { default as DetailLayoutType } from './layout/DetailLayout.vue';

package/dist/src/index.d.ts

@@ -2,15 +2,24 @@ import { App } from 'vue';
 import { default as BaseTable } from './components/tables/BaseTable.vue';
 import { default as BaseBtn } from './components/items/BaseBtn.vue';
 import { default as BaseInput } from './components/form/BaseInput.vue';
+import { default as BaseSelector } from './components/form/BaseSelector.vue';
 import { default as BaseDialog } from './components/items/BaseDialog.vue';
+import { default as BaseWaringDialog } from './components/items/BaseWaringDialog.vue';
 import { default as SortTable } from './components/tables/SortTable.vue';
 import { default as TitleTable } from './components/tables/TitleTable.vue';
 import { default as SearchBar } from './components/items/SearchBar.vue';
+import { default as TransferDialog } from './components/transfer/TransferDialog.vue';
+import { default as TransferItem } from './components/transfer/transferItem.vue';
+import { default as FunctionHeader } from './components/layout/FunctionHeader.vue';
+import { default as MainPanel } from './components/layout/MainPanel.vue';
+import { default as SearchableListPanel } from './components/layout/SearchableListPanel.vue';
+import { default as DetailLayout } from './components/layout/DetailLayout.vue';
+import { default as FilterLayout } from './components/layout/FilterLayout.vue';
 export * from './types';
 export * from './utils/tableHelper';
 export { useI18n, setLocale, useComponentElementLocale } from './utils/i18n';
 export * from './locales';
-export { BaseTable, BaseBtn, BaseInput, BaseDialog, SortTable, TitleTable, SearchBar };
+export { BaseTable, BaseBtn, BaseInput, BaseSelector, BaseDialog, BaseWaringDialog, SortTable, TitleTable, SearchBar, TransferDialog, TransferItem, FunctionHeader, MainPanel, SearchableListPanel, DetailLayout, FilterLayout };
 export type { BaseTableProps, BaseTableEmits, BaseTableInstance, BaseBtnProps, BaseBtnEmits, BaseBtnInstance, BaseDialogProps, BaseDialogEmits, BaseDialogInstance, PluginOptions, VueTableComponentsPlugin, } from './types/components';
 export * from './components';
 export declare function install(app: App, options?: {

package/dist/src/router/constants.d.ts

@@ -5,10 +5,10 @@ export declare const ROUTES: {
     readonly INSTALL_GUIDE: "/install-guide";
     readonly DOCS_CENTER: "/docs-center";
     readonly SEARCHABLE_LIST_PANEL: "/demo/searchable-list-panel";
-    readonly BASE_MULTIPLE_INPUT: "/demo/base-multiple-input";
     readonly TRANSFER_DIALOG: "/demo/transfer-dialog";
     readonly BASE_BTN: "/demo/base-btn";
     readonly BASE_INPUT: "/demo/base-input";
+    readonly BASE_SELECTOR: "/demo/base-selector";
     readonly BASE_DIALOG: "/demo/base-dialog";
     readonly BASE_WARING_DIALOG: "/demo/base-waring-dialog";
     readonly BASE_FORM: "/demo/base-form";
@@ -28,10 +28,10 @@ export declare const ROUTE_NAMES: {
     readonly INSTALL_GUIDE: "InstallGuide";
     readonly DOCS_CENTER: "DocsCenter";
     readonly SEARCHABLE_LIST_PANEL: "SearchableListPanel";
-    readonly BASE_MULTIPLE_INPUT: "BaseMultipleInput";
     readonly TRANSFER_DIALOG: "TransferDialog";
     readonly BASE_BTN: "BaseBtn";
     readonly BASE_INPUT: "BaseInput";
+    readonly BASE_SELECTOR: "BaseSelector";
     readonly BASE_DIALOG: "BaseDialog";
     readonly BASE_WARING_DIALOG: "BaseWaringDialog";
     readonly TABLE: "Table";

package/dist/src/types/components.d.ts

@@ -369,34 +369,43 @@ export interface BaseInputInstance {
   $emit: BaseInputEmits
 }
 
-// ==================== BaseMultipleInput 組件類型 ====================
+// ==================== BaseSelector 組件類型 ====================
 
-/** BaseMultipleInput 組件 Props 類型 */
-export interface BaseMultipleInputProps {
-  /** 模型值（字符串數組） */
-  modelValue: string[]
-  /** 輸入框類型 */
-  type?: string
-  /** 驗證規則函數 */
-  validateRule?: (inputString: string) => boolean
+/** BaseSelector 組件 Props 類型 */
+export interface BaseSelectorProps {
+  /** 模型值 */
+  modelValue?: string | string[]
+  /** 選項數據 */
+  options?: Array<{ value: string; label: string }>
+  /** 佔位符 */
+  placeholder?: string
+  /** 是否折疊標籤 */
+  collapseTags?: boolean
+  /** 是否顯示折疊標籤提示 */
+  collapseTagsTooltip?: boolean
+  /** 是否多選 */
+  multiple?: boolean
+  /** 是否禁用 */
+  disabled?: boolean
+  /** 自定義 CSS 類名 */
+  class?: string
 }
 
-/** BaseMultipleInput 組件 Emits 類型 */
-export interface BaseMultipleInputEmits {
-  /** 更新模型值事件 */
-  (e: 'update:modelValue', val: string[]): void
-  /** 輸入錯誤事件 */
-  (e: 'inputError'): void
+/** BaseSelector 組件 Emits 類型 */
+export interface BaseSelectorEmits {
+  /** 模型值更新事件 */
+  'update:modelValue': (value?: string | string[]) => void
 }
 
-/** BaseMultipleInput 組件實例類型 */
-export interface BaseMultipleInputInstance {
+/** BaseSelector 組件實例類型 */
+export interface BaseSelectorInstance {
   /** 組件 Props */
-  $props: BaseMultipleInputProps
+  $props: BaseSelectorProps
   /** 組件 Emits */
-  $emit: BaseMultipleInputEmits
+  $emit: BaseSelectorEmits
 }
 
+
 // ==================== 搜尋相關組件類型 ====================
 
 // ==================== SearchBar 組件類型 ====================
@@ -774,9 +783,10 @@ export declare const BaseInput: DefineComponent<
   install: (app: App) => void
 }
 
-/** BaseMultipleInput 組件定義 */
-export declare const BaseMultipleInput: DefineComponent<
-  BaseMultipleInputProps,
+/** BaseSelector 組件定義 */
+export declare const BaseSelector: DefineComponent<
+  BaseSelectorProps,
+  {},
   {},
   {},
   {},
@@ -784,12 +794,13 @@ export declare const BaseMultipleInput: DefineComponent<
   {},
   {},
   {},
-  BaseMultipleInputEmits
+  BaseSelectorEmits
 > & {
   /** 安裝方法 */
   install: (app: App) => void
 }
 
+
 /** SearchBar 組件定義 */
 export declare const SearchBar: DefineComponent<
   SearchBarProps,
@@ -934,8 +945,8 @@ export interface VueTableComponentsPlugin {
   TransferDialog: typeof TransferDialog
   /** BaseInput 組件 */
   BaseInput: typeof BaseInput
-  /** BaseMultipleInput 組件 */
-  BaseMultipleInput: typeof BaseMultipleInput
+  /** BaseSelector 組件 */
+  BaseSelector: typeof BaseSelector
   /** SearchBar 組件 */
   SearchBar: typeof SearchBar
   /** SearchableListPanel 組件 */
@@ -964,7 +975,7 @@ declare module '@vue/runtime-core' {
     BaseWaringDialog: typeof BaseWaringDialog
     TransferDialog: typeof TransferDialog
     BaseInput: typeof BaseInput
-    BaseMultipleInput: typeof BaseMultipleInput
+    BaseSelector: typeof BaseSelector
     SearchBar: typeof SearchBar
     SearchableListPanel: typeof SearchableListPanel
     FunctionHeader: typeof FunctionHeader

package/dist/src/views/demo/{BaseMultipleInputDemo.vue.d.ts → BaseSelectorDemo.vue.d.ts}

@@ -1,2 +1,2 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rayyy-vue-table-components",
-  "version": "2.0.22",
+  "version": "2.0.25",
   "description": "Vue 3 + Element Plus 表格組件庫",
   "type": "module",
   "main": "./dist/index.umd.js",

package/src/assets/styles/_components.scss

@@ -46,3 +46,9 @@
   @apply w-fit;
   @apply text-blue-10;
 }
+
+
+
+.my-select-popper {
+  z-index: 4000 !important; /* 比 dialog 高即可 */
+}

package/src/components/form/BaseSelector.vue

@@ -1,29 +1,6 @@
-<template>
-  <el-select
-    v-bind="attrs"
-    :model-value="modelValue"
-    :class="props.class"
-    :placeholder="props.placeholder || t('common.select')"
-    :clearable="props.clearable"
-    :collapse-tags="props.collapseTags"
-    :collapse-tags-tooltip="props.collapseTagsTooltip"
-    :multiple="props.multiple"
-    :disabled="props.disabled"
-    :reserve-keyword="false"
-    filterable
-    @update:model-value="updateValue"
-  >
-    <el-option v-for="it in options" :key="it.label" :label="it.label" :value="it.value" />
-  </el-select>
-</template>
-
 <script lang="ts" setup>
-import { useAttrs } from 'vue'
-import { useI18n } from 'vue-i18n'
 import type { ElOptions } from '@/types/OptionDto.ts'
 
-const { t } = useI18n()
-
 export type Selection = string | string[]
 
 const props = withDefaults(
@@ -31,7 +8,6 @@ const props = withDefaults(
     modelValue?: Selection
     options?: ElOptions[]
     placeholder?: string
-    clearable?: boolean
     collapseTags?: boolean
     collapseTagsTooltip?: boolean
     multiple?: boolean
@@ -41,14 +17,11 @@ const props = withDefaults(
   {
     modelValue: () => '',
     options: () => [{ value: '', label: '' }],
-    placeholder: '',
+    placeholder: '請選擇',
     class: 'w-full',
   },
 )
 
-// 獲取所有非 props 屬性
-const attrs = useAttrs()
-
 const emits = defineEmits<{
   (e: 'update:modelValue', data?: Selection): void
 }>()
@@ -57,9 +30,29 @@ function updateValue(val: Selection) {
   let value: Selection | undefined = val
 
   if (typeof value === 'string' && !value) {
+    // el-select 元件裡包的是 input，所以當清空時預設會給 string，故把空字串轉成 undefined
     value = undefined
   }
 
   emits('update:modelValue', value)
 }
 </script>
+
+<template>
+  <el-select
+    :model-value="modelValue"
+    :class="props.class"
+    :placeholder="props.placeholder"
+    :clearable="true"
+    :collapse-tags="props.collapseTags"
+    :collapse-tags-tooltip="props.collapseTagsTooltip"
+    :multiple="props.multiple"
+    :disabled="props.disabled"
+    :reserve-keyword="false"
+    filterable
+    @update:model-value="updateValue"
+    popper-class="my-select-popper"
+  >
+    <el-option v-for="it in options" :key="it.label" :label="it.label" :value="it.value" />
+  </el-select>
+</template>

package/src/components/index.ts

@@ -2,9 +2,9 @@
 export { default as BaseTable } from './tables/BaseTable.vue'
 export { default as BaseBtn } from './items/BaseBtn.vue'
 export { default as BaseInput } from './form/BaseInput.vue'
+export { default as BaseSelector } from './form/BaseSelector.vue'
 export { default as BaseDialog } from './items/BaseDialog.vue'
 export { default as BaseWaringDialog } from './items/BaseWaringDialog.vue'
-export { default as BaseMultipleInput } from './form/BaseMultipleInput.vue'
 export { default as SortTable } from './tables/SortTable.vue'
 export { default as TitleTable } from './tables/TitleTable.vue'
 export { default as SearchBar } from './items/SearchBar.vue'
@@ -89,6 +89,7 @@ export type {
 export type { default as BaseTableType } from './tables/BaseTable.vue'
 export type { default as BaseBtnType } from './items/BaseBtn.vue'
 export type { default as BaseInputType } from './form/BaseInput.vue'
+export type { default as BaseSelectorType } from './form/BaseSelector.vue'
 export type { default as BaseDialogType } from './items/BaseDialog.vue'
 export type { default as BaseWaringDialogType } from './items/BaseWaringDialog.vue'
 export type { default as SortTableType } from './tables/SortTable.vue'
@@ -97,7 +98,6 @@ export type { default as SearchBarType } from './items/SearchBar.vue'
 export type { default as TransferDialogType } from './transfer/TransferDialog.vue'
 export type { default as TransferItemType } from './transfer/transferItem.vue'
 export type { default as SearchableListPanelType } from './layout/SearchableListPanel.vue'
-export type { default as BaseMultipleInputType } from './form/BaseMultipleInput.vue'
 export type { default as FunctionHeaderType } from './layout/FunctionHeader.vue'
 export type { default as MainPanelType } from './layout/MainPanel.vue'
 export type { default as DetailLayoutType } from './layout/DetailLayout.vue'

package/src/components/items/BaseBtn.vue

@@ -56,14 +56,15 @@ const buttonClass = computed(() => {
 
 <style scoped lang="scss">
 .el-button {
-  @apply text-sm;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
 
   :deep(span) {
-    @apply font-bold #{!important};
+    font-weight: 700 !important;
   }
 
   &:focus-visible {
-    @apply outline-none #{!important};
+    outline: none !important;
   }
 
   // 主要按钮样式
@@ -109,5 +110,136 @@ const buttonClass = computed(() => {
     --el-button-disabled-text-color: var(--el-text-color-placeholder);
     --el-button-text-color: var(--el-text-color-regular);
   }
+
+  // 成功按钮样式
+  &--success {
+    --el-button-bg-color: var(--el-fill-color-blank);
+    --el-button-border-color: var(--el-color-success);
+    --el-button-hover-bg-color: var(--el-color-success);
+    --el-button-hover-border-color: var(--el-color-success);
+    --el-button-hover-text-color: var(--el-fill-color-blank);
+    --el-button-active-bg-color: var(--el-color-success-dark-2);
+    --el-button-active-border-color: var(--el-color-success-dark-2);
+    --el-button-disabled-bg-color: var(--el-fill-color-blank);
+    --el-button-disabled-border-color: var(--el-color-success-light-7);
+    --el-button-disabled-text-color: var(--el-color-success-light-7);
+    --el-button-text-color: var(--el-color-success);
+
+    &.is-fill {
+      --el-button-bg-color: var(--el-color-success);
+      --el-button-border-color: var(--el-color-success);
+      --el-button-hover-bg-color: var(--el-color-success-dark-2);
+      --el-button-hover-border-color: var(--el-color-success-dark-2);
+      --el-button-active-bg-color: var(--el-color-success-dark-2);
+      --el-button-active-border-color: var(--el-color-success-dark-2);
+      --el-button-disabled-bg-color: var(--el-color-success-light-7);
+      --el-button-disabled-border-color: var(--el-color-success-light-7);
+      --el-button-text-color: var(--el-fill-color-blank);
+      --el-button-hover-text-color: var(--el-fill-color-blank);
+    }
+  }
+
+  // 警告按钮样式
+  &--warning {
+    --el-button-bg-color: var(--el-fill-color-blank);
+    --el-button-border-color: var(--el-color-warning);
+    --el-button-hover-bg-color: var(--el-color-warning);
+    --el-button-hover-border-color: var(--el-color-warning);
+    --el-button-hover-text-color: var(--el-fill-color-blank);
+    --el-button-active-bg-color: var(--el-color-warning-dark-2);
+    --el-button-active-border-color: var(--el-color-warning-dark-2);
+    --el-button-disabled-bg-color: var(--el-fill-color-blank);
+    --el-button-disabled-border-color: var(--el-color-warning-light-7);
+    --el-button-disabled-text-color: var(--el-color-warning-light-7);
+    --el-button-text-color: var(--el-color-warning);
+
+    &.is-fill {
+      --el-button-bg-color: var(--el-color-warning);
+      --el-button-border-color: var(--el-color-warning);
+      --el-button-hover-bg-color: var(--el-color-warning-dark-2);
+      --el-button-hover-border-color: var(--el-color-warning-dark-2);
+      --el-button-active-bg-color: var(--el-color-warning-dark-2);
+      --el-button-active-border-color: var(--el-color-warning-dark-2);
+      --el-button-disabled-bg-color: var(--el-color-warning-light-7);
+      --el-button-disabled-border-color: var(--el-color-warning-light-7);
+      --el-button-text-color: var(--el-fill-color-blank);
+      --el-button-hover-text-color: var(--el-fill-color-blank);
+    }
+  }
+
+  // 危险按钮样式
+  &--danger {
+    --el-button-bg-color: var(--el-fill-color-blank);
+    --el-button-border-color: var(--el-color-danger);
+    --el-button-hover-bg-color: var(--el-color-danger);
+    --el-button-hover-border-color: var(--el-color-danger);
+    --el-button-hover-text-color: var(--el-fill-color-blank);
+    --el-button-active-bg-color: var(--el-color-danger-dark-2);
+    --el-button-active-border-color: var(--el-color-danger-dark-2);
+    --el-button-disabled-bg-color: var(--el-fill-color-blank);
+    --el-button-disabled-border-color: var(--el-color-danger-light-7);
+    --el-button-disabled-text-color: var(--el-color-danger-light-7);
+    --el-button-text-color: var(--el-color-danger);
+
+    &.is-fill {
+      --el-button-bg-color: var(--el-color-danger);
+      --el-button-border-color: var(--el-color-danger);
+      --el-button-hover-bg-color: var(--el-color-danger-dark-2);
+      --el-button-hover-border-color: var(--el-color-danger-dark-2);
+      --el-button-active-bg-color: var(--el-color-danger-dark-2);
+      --el-button-active-border-color: var(--el-color-danger-dark-2);
+      --el-button-disabled-bg-color: var(--el-color-danger-light-7);
+      --el-button-disabled-border-color: var(--el-color-danger-light-7);
+      --el-button-text-color: var(--el-fill-color-blank);
+      --el-button-hover-text-color: var(--el-fill-color-blank);
+    }
+  }
+
+  // 信息按钮样式
+  &--info {
+    --el-button-bg-color: var(--el-fill-color-blank);
+    --el-button-border-color: var(--el-color-info);
+    --el-button-hover-bg-color: var(--el-color-info);
+    --el-button-hover-border-color: var(--el-color-info);
+    --el-button-hover-text-color: var(--el-fill-color-blank);
+    --el-button-active-bg-color: var(--el-color-info-dark-2);
+    --el-button-active-border-color: var(--el-color-info-dark-2);
+    --el-button-disabled-bg-color: var(--el-fill-color-blank);
+    --el-button-disabled-border-color: var(--el-color-info-light-7);
+    --el-button-disabled-text-color: var(--el-color-info-light-7);
+    --el-button-text-color: var(--el-color-info);
+
+    &.is-fill {
+      --el-button-bg-color: var(--el-color-info);
+      --el-button-border-color: var(--el-color-info);
+      --el-button-hover-bg-color: var(--el-color-info-dark-2);
+      --el-button-hover-border-color: var(--el-color-info-dark-2);
+      --el-button-active-bg-color: var(--el-color-info-dark-2);
+      --el-button-active-border-color: var(--el-color-info-dark-2);
+      --el-button-disabled-bg-color: var(--el-color-info-light-7);
+      --el-button-disabled-border-color: var(--el-color-info-light-7);
+      --el-button-text-color: var(--el-fill-color-blank);
+      --el-button-hover-text-color: var(--el-fill-color-blank);
+    }
+  }
+
+  // 通用禁用样式
+  &.is-disabled {
+    cursor: not-allowed;
+    opacity: 0.6;
+
+    &:hover {
+      transform: none;
+    }
+
+    &:active {
+      transform: none;
+    }
+  }
+
+  // 填充樣式的禁用狀態 - 使用白色文字
+  &.is-fill.is-disabled {
+    color: white !important;
+  }
 }
 </style>

package/src/components/layout/SearchableListPanel.vue

@@ -55,18 +55,13 @@ const showPager = computed(() => {
   }
 })
 
-// 在 computed 外部調用，保持引用穩定
-const fallbackLocale = useComponentElementLocale()
-
 // 優先使用 prop，沒有 prop 則使用 composable
 const elementLocale = computed(() => {
-  // 檢查 props.locale 是否為真正的 Language 對象（不是預設值）
-  if (props.locale && typeof props.locale === 'object' && 'name' in props.locale) {
+  if (props.locale) {
     return props.locale
   }
-
-  // 使用 fallbackLocale
-  return fallbackLocale.value
+  // 回退：使用簡化的 composable
+  return useComponentElementLocale().value
 })
 </script>
 

package/src/types/components.d.ts

@@ -370,34 +370,43 @@ export interface BaseInputInstance {
   $emit: BaseInputEmits
 }
 
-// ==================== BaseMultipleInput 組件類型 ====================
+// ==================== BaseSelector 組件類型 ====================
 
-/** BaseMultipleInput 組件 Props 類型 */
-export interface BaseMultipleInputProps {
-  /** 模型值（字符串數組） */
-  modelValue: string[]
-  /** 輸入框類型 */
-  type?: string
-  /** 驗證規則函數 */
-  validateRule?: (inputString: string) => boolean
+/** BaseSelector 組件 Props 類型 */
+export interface BaseSelectorProps {
+  /** 模型值 */
+  modelValue?: string | string[]
+  /** 選項數據 */
+  options?: Array<{ value: string; label: string }>
+  /** 佔位符 */
+  placeholder?: string
+  /** 是否折疊標籤 */
+  collapseTags?: boolean
+  /** 是否顯示折疊標籤提示 */
+  collapseTagsTooltip?: boolean
+  /** 是否多選 */
+  multiple?: boolean
+  /** 是否禁用 */
+  disabled?: boolean
+  /** 自定義 CSS 類名 */
+  class?: string
 }
 
-/** BaseMultipleInput 組件 Emits 類型 */
-export interface BaseMultipleInputEmits {
-  /** 更新模型值事件 */
-  (e: 'update:modelValue', val: string[]): void
-  /** 輸入錯誤事件 */
-  (e: 'inputError'): void
+/** BaseSelector 組件 Emits 類型 */
+export interface BaseSelectorEmits {
+  /** 模型值更新事件 */
+  'update:modelValue': (value?: string | string[]) => void
 }
 
-/** BaseMultipleInput 組件實例類型 */
-export interface BaseMultipleInputInstance {
+/** BaseSelector 組件實例類型 */
+export interface BaseSelectorInstance {
   /** 組件 Props */
-  $props: BaseMultipleInputProps
+  $props: BaseSelectorProps
   /** 組件 Emits */
-  $emit: BaseMultipleInputEmits
+  $emit: BaseSelectorEmits
 }
 
+
 // ==================== 搜尋相關組件類型 ====================
 
 // ==================== SearchBar 組件類型 ====================
@@ -775,9 +784,10 @@ export declare const BaseInput: DefineComponent<
   install: (app: App) => void
 }
 
-/** BaseMultipleInput 組件定義 */
-export declare const BaseMultipleInput: DefineComponent<
-  BaseMultipleInputProps,
+/** BaseSelector 組件定義 */
+export declare const BaseSelector: DefineComponent<
+  BaseSelectorProps,
+  {},
   {},
   {},
   {},
@@ -785,12 +795,13 @@ export declare const BaseMultipleInput: DefineComponent<
   {},
   {},
   {},
-  BaseMultipleInputEmits
+  BaseSelectorEmits
 > & {
   /** 安裝方法 */
   install: (app: App) => void
 }
 
+
 /** SearchBar 組件定義 */
 export declare const SearchBar: DefineComponent<
   SearchBarProps,
@@ -935,8 +946,8 @@ export interface VueTableComponentsPlugin {
   TransferDialog: typeof TransferDialog
   /** BaseInput 組件 */
   BaseInput: typeof BaseInput
-  /** BaseMultipleInput 組件 */
-  BaseMultipleInput: typeof BaseMultipleInput
+  /** BaseSelector 組件 */
+  BaseSelector: typeof BaseSelector
   /** SearchBar 組件 */
   SearchBar: typeof SearchBar
   /** SearchableListPanel 組件 */
@@ -965,7 +976,7 @@ declare module '@vue/runtime-core' {
     BaseWaringDialog: typeof BaseWaringDialog
     TransferDialog: typeof TransferDialog
     BaseInput: typeof BaseInput
-    BaseMultipleInput: typeof BaseMultipleInput
+    BaseSelector: typeof BaseSelector
     SearchBar: typeof SearchBar
     SearchableListPanel: typeof SearchableListPanel
     FunctionHeader: typeof FunctionHeader

package/src/utils/i18n.ts

@@ -1,8 +1,7 @@
 import { createI18n, type I18n, type Composer } from 'vue-i18n'
-import { getCurrentInstance, computed } from 'vue'
+import { computed } from 'vue'
 import { messages } from '../locales'
 import zhTw from 'element-plus/es/locale/lang/zh-tw'
-import enUs from 'element-plus/es/locale/lang/en'
 
 // 內部 i18n 實例
 let internalI18n: I18n | null = null