@fewangsit/wangsvue-fats 1.0.1-alpha.25 → 1.0.1-alpha.4

package/{inputurl/index.d.ts → components/inputurl/InputURL.vue.d.ts}

@@ -1,6 +1,9 @@
 import { Slot } from 'vue';
 
-import { InputTextEmits, InputTextProps } from '../inputtext';
+import {
+  InputTextEmits,
+  InputTextProps,
+} from '../../components/inputtext/InputText.vue.d';
 
 import { ClassComponent } from '../ts-helpers.d';
 

package/{languagedropdown/index.d.ts → components/languagedropdown/LanguageDropdown.vue.d.ts}

@@ -1,4 +1,7 @@
-import { DropdownEmits, DropdownProps } from '../dropdown';
+import {
+  DropdownEmits,
+  DropdownProps,
+} from '../../components/dropdown/Dropdown.vue.d';
 
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers.d';
 

package/{litedropdown/index.d.ts → components/litedropdown/LiteDropdown.vue.d.ts}

@@ -1,4 +1,4 @@
-import { Option, OptionValue } from '../dropdown';
+import { Option, OptionValue } from '../../components/dropdown/Dropdown.vue.d';
 
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers.d';
 

package/components/menuitem/index.d.ts

@@ -0,0 +1,106 @@
+import { WangsIcons } from '../icon/Icon.vue.d';
+
+/**
+ *
+ * WangsVue menu components share a common api to specify the menuitems and submenus.
+ *
+ * @module menuitem
+ *
+ */
+
+/**
+ * Custom command event.
+ *  @todo next release should be able to change see menuItem.command
+ */
+export interface MenuItemCommandEvent {
+  /**
+   * Browser event.
+   */
+  originalEvent: Event;
+  /**
+   * Menuitem instance.
+   */
+  item: MenuItem;
+  /**
+   * Optional
+   */
+  [key: string]: any;
+}
+
+/**
+ * Defines model of MenuItem API.
+ */
+export interface MenuItem {
+  /**
+   * Property name or getter function to use as the label of an item.
+   */
+  label?: string | ((...args: any) => string) | undefined;
+  /**
+   * Icon of the item.
+   */
+  icon?: WangsIcons | undefined;
+  /**
+   * Callback to execute when item is clicked.
+   * @param {MenuItemCommandEvent} event - Custom command event.
+   * @todo next release should be able to change
+   */
+  command?: (event: MenuItemCommandEvent) => void;
+  /**
+   * External link to navigate when item is clicked.
+   */
+  url?: string | undefined;
+  /**
+   * Specifies where to open the linked document.
+   */
+  target?: string | undefined;
+  /**
+   * Internal/ vue router link to navigate when item is clicked.
+   */
+  route?: string | undefined;
+  /**
+   * 	An array of children menuitems.
+   */
+  items?: MenuItem[] | undefined;
+  /**
+   * A boolean or a function to return a boolean to specify if the item is disabled.
+   * @defaultValue false
+   */
+  disabled?: boolean | ((...args: any) => boolean) | undefined;
+  /**
+   * A boolean or a function to return a boolean to specify if the item is visible.
+   * @defaultValue true
+   */
+  visible?: boolean | ((...args: any) => boolean) | undefined;
+  /**
+   * A boolean or to specify if the item has danger severity.
+   * @defaultValue false
+   */
+  danger?: boolean | undefined;
+  /**
+   * Defines the item as a separator.
+   * @defaultValue false
+   */
+  separator?: boolean | undefined;
+  /**
+   * Inline style of the menuitem.
+   */
+  style?: any;
+  /**
+   * Style class of the menuitem.
+   */
+  class?: any;
+  /**
+   * Unique identifier of an item.
+   */
+  key?: string | undefined;
+  /**
+   * Specify if the there is additional slot for the selected menuitem.
+   * Only work on BulkAction when BulkActionProps.selectMenuType is "dropdown".
+   *
+   */
+  useAdditionSlot?: boolean;
+  /**
+   * Optional
+   */
+  [key: string]: any;
+}

package/{multiselect/index.d.ts → components/multiselect/MultiSelect.vue.d.ts}

@@ -1,6 +1,10 @@
-import { DropdownLocaleConfig, Option, OptionValue } from '../dropdown';
+import {
+  DropdownLocaleConfig,
+  Option,
+  OptionValue,
+} from '../../components/dropdown/Dropdown.vue.d';
 
-import { CustomValidation } from '../form';
+import { CustomValidation } from '../form/Form.vue.d';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers.d';
 
 export type MultiSelectLocaleConfig = DropdownLocaleConfig & {};

package/{steps/index.d.ts → components/steps/Steps.vue.d.ts}

@@ -1,4 +1,4 @@
-import { ClassComponent } from '../ts-helpers.d';
+import { ClassComponent } from '../../components/ts-helpers.d';
 
 export type Step = {
   label: string;

package/{tabmenu/index.d.ts → components/tabmenu/TabMenu.vue.d.ts}

@@ -9,8 +9,8 @@
  */
 
 import { TabMenuProps as WangsUITabMenuProps } from '@wangs-ui/core';
+import { MenuItem } from '@wangs-ui/core/dist/types/components/menuitem/menuitem.type';
 
-import { MenuItem } from '../menuitem';
 import { ClassComponent } from '../ts-helpers.d';
 
 /**

package/{textarea/index.d.ts → components/textarea/Textarea.vue.d.ts}

@@ -1,6 +1,6 @@
 import { TextareaHTMLAttributes } from 'vue';
 
-import { CustomValidation } from '../form';
+import { CustomValidation } from '../form/Form.vue.d';
 import {
   ClassComponent,
   GlobalComponentConstructor,

package/{timeline/index.d.ts → components/timeline/Timeline.vue.d.ts}

@@ -1,7 +1,7 @@
 import { VNode } from 'vue';
 
-import { BadgeProps } from '../badge';
-import { JSONContent } from '../editor';
+import { BadgeProps } from '../badge/Badge.vue.d';
+import { JSONContent } from '../editor/Editor.vue.d';
 import { ClassComponent } from '../ts-helpers.d';
 
 export interface AttachmentFile {

package/{toast/index.d.ts → components/toast/Toast.vue.d.ts}

@@ -11,7 +11,7 @@
 import { TransitionProps, VNode } from 'vue';
 
 import { ComponentHooks } from '../basecomponent';
-import { WangsIcons } from '../icon';
+import { WangsIcons } from '../icon/Icon.vue.d';
 import { PassThroughOptions } from '../passthrough';
 import {
   ClassComponent,

package/{tree/index.d.ts → components/tree/Tree.vue.d.ts}

@@ -1,9 +1,8 @@
 import { Slot } from 'vue';
+import { MenuItem } from '../../components/menuitem';
 
-import { MenuItem } from '../menuitem';
-
-import { BaseTreeProps, TreeNode } from '../basetree';
-import { QueryParams, ShortFetchResponse } from '../datatable';
+import { BaseTreeProps, TreeNode } from '../basetree/BaseTree.vue.d';
+import { QueryParams, ShortFetchResponse } from '../datatable/DataTable.vue.d';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers.d';
 
 import { TreeSelectionKeys } from 'primevue/tree';

package/{tree → components/tree}/helpers/flattenTreeNodeChildren.helper.d.ts

@@ -1,4 +1,4 @@
-import { TreeNode } from '../../basetree';
+import { TreeNode } from '../../basetree/BaseTree.vue.d';
 /**
  * Covert deeply nested tree node into one level array.
  */

package/{userwithicon/index.d.ts → components/userwithicon/UserWithIcon.vue.d.ts}

@@ -1,6 +1,6 @@
 import { UserDetail } from '@tagsamurai/fats-api-services/src/types/user.type';
 
-import { ClassComponent } from '../ts-helpers.d';
+import { ClassComponent } from '../../components/ts-helpers.d';
 
 export interface UserWithIconProps {
   user: Partial<UserDetail> & { fullName: string };

package/directives/index.d.ts

@@ -1,2 +1 @@
 export { default as Focus } from './focus';
-export { default as Tooltip } from './tooltip';

package/event-bus/index.d.ts

@@ -1,6 +1,6 @@
-import { Data, QueryParams } from '../datatable';
 import { Emitter } from './mitt';
-import { ToastParams } from '../utils/baseToast.util';
+import { Data, QueryParams } from '../components/datatable/DataTable.vue.d';
+import { ToastParams } from '../utils/toast.util';
 export type TableEvent = {
   tableName?: string;
 };

package/{wangsvue-fats.d.ts → main.d.ts}

@@ -2,19 +2,20 @@ export { default as mitt } from './event-bus/mitt';
 export { default as eventBus, extendEventBus } from './event-bus';
 
 // PrimeVue
-export { default as ToastService } from './toast/service';
+export { default as ToastService } from 'primevue/toastservice';
 
 // Utils
 export * from './utils';
 
 // Helpers
-export { formatCurrency } from './inputcurrency/helpers/index';
+export { formatCurrency } from './components/inputcurrency/helpers/currency.helper';
 
 // Component store
-export { default as useLoadingStore } from './loading/store';
+export { default as useLoadingStore } from './components/loading/store/loading.store';
 
 // Directives
-export { Focus, Tooltip } from './directives';
+export { default as Tooltip } from 'primevue/tooltip';
+export { Focus } from './directives';
 
 // Plugins
 export { useForm, useField } from './plugins/formValidation';
@@ -22,6 +23,7 @@ export type { FormContext } from './plugins/formValidation';
 
 // Translation
 export * from './plugins/i18n';
+export { default as i18n } from './plugins/i18n-extension';
 
 // Used for dialog print qr
 export { default as VueHtmlToPaper } from './plugins/VueHtmlToPaper';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fewangsit/wangsvue-fats",
-  "version": "1.0.1-alpha.25",
+  "version": "1.0.1-alpha.4",
   "author": "Wangsit FE Developer",
   "description": "Fixed Asset Tagsamurai VueJS Component Library",
   "type": "module",
@@ -9,15 +9,19 @@
   "repository": "https://github.com/fewangsit/wangsvue",
   "exports": {
     ".": {
-      "types": "./wangsvue-fats.d.ts",
-      "import": "./wangsvue-fats.es.js"
+      "types": "./main.d.ts",
+      "import": "./wangsvue-fats.js"
     },
-    "./style.css": "./style.css"
+    "./style.css": "./style.css",
+    "./config/*": "./config/*",
+    "./plugins/*": "./plugins/*",
+    "./directives/*": "./directives/*",
+    "./components/*": "./components/*",
+    "./event-bus/*": "./event-bus/*",
+    "./utils/*": "./utils/*"
   },
   "dependencies": {
     "@wangs-ui/core": "latest",
-    "@wangs-ui/vue": "latest",
-    "xlsx": "npm:@e965/xlsx@0.20.3"
-  },
-  "sideEffects": false
+    "@wangs-ui/vue": "latest"
+  }
 }

package/plugins/WangsVue.d.ts

@@ -1,47 +1,62 @@
 import { Plugin } from 'vue';
 import { InputOtpRawPreset } from '@wangs-ui/core/dist/types/components/inputotp/inputotp.type';
 import { TabMenuRawPreset } from '@wangs-ui/core/dist/types/components/tabmenu/tabmenu.type';
-import { AnimationDefaultConfig } from '../animation';
-import { BadgeComponentConfigs } from '../badge';
+import { AnimationDefaultConfig } from '../components/animation/Animation.vue.d';
+import { BadgeComponentConfigs } from '../components/badge/Badge.vue.d';
 import {
   ButtonBulkActionLocaleConfig,
   ButtonBulkActionProps,
-} from '../buttonbulkaction';
+} from '../components/buttonbulkaction/ButtonBulkAction.vue.d';
 import {
   ButtonDownloadLocaleConfig,
   ButtonDownloadProps,
-} from '../buttondownload';
-import { ButtonSearchLocaleConfig } from '../buttonsearch';
-import { CalendarLocaleConfig, CalendarPresetOptions } from '../calendar';
-import { CustomColumnLocaleConfig } from '../customcolumn';
-import { DataTableLocaleConfig, DataTableProps } from '../datatable';
-import { DialogConfirmLocaleConfig } from '../dialogconfirm';
-import { DialogFormLocaleConfig } from '../dialogform';
-import { DropdownLocaleConfig, DropdownProps } from '../dropdown';
-import { FieldWrapperLocaleConfig, FieldWrapperProps } from '../fieldwrapper';
-import { FilterContainerLocaleConfig } from '../filtercontainer';
-import { ImageProps } from '../image';
-import { ImageCompressorLocaleConfig } from '../imagecompressor';
-import { InputCurrencyLocaleConfig } from '../inputcurrency';
-import { InputEmailProps } from '../inputemail';
-import { InputNumberLocaleConfig } from '../inputnumber';
-import { InputPhoneNumberLocaleConfig } from '../inputphonenumber';
-import { InputrangeNumberLocaleConfig } from '../inputrangenumber';
-import { InputTextLocaleConfig, InputTextProps } from '../inputtext';
-import { InputURLProps } from '../inputurl';
-import { LoadingPresetOptions } from '../loading';
-import { MenuLocaleConfig } from '../menu';
-import { MultiSelectLocaleConfig } from '../multiselect';
-import { OverlayPanelPassThroughOptions } from '../overlaypanel';
-import { TagTypeProps } from '../tagtype';
-import { TextareaLocaleConfig } from '../textarea';
-import { TreeProps } from '../tree';
+} from '../components/buttondownload/ButtonDownload.vue.d';
+import { ButtonSearchLocaleConfig } from '../components/buttonsearch/ButtonSearch.vue.d';
+import {
+  CalendarLocaleConfig,
+  CalendarPresetOptions,
+} from '../components/calendar/Calendar.vue.d';
+import { CustomColumnLocaleConfig } from '../components/customcolumn/CustomColumn.vue.d';
+import {
+  DataTableLocaleConfig,
+  DataTableProps,
+} from '../components/datatable/DataTable.vue.d';
+import { DialogConfirmLocaleConfig } from '../components/dialogconfirm/DialogConfirm.vue.d';
+import { DialogFormLocaleConfig } from '../components/dialogform/DialogForm.vue.d';
+import {
+  DropdownLocaleConfig,
+  DropdownProps,
+} from '../components/dropdown/Dropdown.vue.d';
+import {
+  FieldWrapperLocaleConfig,
+  FieldWrapperProps,
+} from '../components/fieldwrapper/FieldWrapper.vue.d';
+import { FilterContainerLocaleConfig } from '../components/filtercontainer/FilterContainer.vue.d';
+import { ImageProps } from '../components/image/Image.vue.d';
+import { ImageCompressorLocaleConfig } from '../components/imagecompressor/ImageCompressor.vue.d';
+import { InputCurrencyLocaleConfig } from '../components/inputcurrency/InputCurrency.vue.d';
+import { InputEmailProps } from '../components/inputemail/InputEmail.vue.d';
+import { InputNumberLocaleConfig } from '../components/inputnumber/InputNumber.vue.d';
+import { InputPhoneNumberLocaleConfig } from '../components/inputphonenumber/InputPhoneNumber.vue.d';
+import { InputrangeNumberLocaleConfig } from '../components/inputrangenumber/InputRangeNumber.vue.d';
+import {
+  InputTextLocaleConfig,
+  InputTextProps,
+} from '../components/inputtext/InputText.vue.d';
+import { InputURLProps } from '../components/inputurl/InputURL.vue.d';
+import { LoadingPresetOptions } from '../components/loading/Loading.vue.d';
+import { MenuLocaleConfig } from '../components/menu/Menu.vue.d';
+import { MultiSelectLocaleConfig } from '../components/multiselect/MultiSelect.vue.d';
+import { OverlayPanelPassThroughOptions } from '../components/overlaypanel/OverlayPanel.vue.d';
+import { TagTypeProps } from '../components/tagtype/TagType.vue.d';
+import { TextareaLocaleConfig } from '../components/textarea/Textarea.vue.d';
+import { TreeProps } from '../components/tree/Tree.vue.d';
 import {
   UserNameComponentConfigs,
   UserNameLocaleConfig,
   UserNamePresetOptions,
-} from '../username';
-import { type UseToastConfig } from '../utils/baseToast.util';
+} from '../components/username/UserName.vue.d';
+import { type UseToastConfig } from '../utils/toast.util';
 /**
  * A Record of component names with theirs props interface
  */

package/plugins/i18n-extension.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+  install: (app: import('vue').App) => void;
+};
+export default _default;

package/plugins/i18n.d.ts

@@ -1,5 +1,103 @@
-export type * from '../plugins/basei18n';
-export { useI18n } from '../plugins/basei18n';
-export declare const i18n: {
-  install: (app: import('vue').App) => void;
+import { AxiosResponse } from 'axios';
+import { App, Ref } from 'vue';
+export type Locale = string;
+export interface LanguageOption {
+  /**
+   * ISO 639-1 language code (e.g., "en" for English, "fr" for French).
+   */
+  isoCode?: string;
+  /**
+   * The name of the language in English (e.g., "English", "Français").
+   */
+  name: string;
+  /**
+   * The URL of the country's flag image.
+   * Flags are sourced from https://flagcdn.com and are typically in SVG format for high-quality resolution.
+   */
+  flag?: string;
+}
+export interface I18n {
+  /**
+   * Locale message translation
+   *
+   * @param key - The translation key
+   * @param params - A values of named interpolation
+   * @param args - Positional interpolation values
+   *
+   * @returns translation message
+   * @example `t('Hello {user}!', { user: 'John Doe' })` - returns: 'Hello John Doe!'
+   * @example `t('Hello %s! I am %s.', "John Doe", "Peter Smith")` - returns: 'Hello John Doe! I am Peter Smith.'
+   */
+  t: {
+    (key: string, params: Record<string, any>): string;
+    (key: string, ...args: (string | number | boolean)[]): string;
+  };
+  /**
+   * Change the locale dynamically
+   *
+   * @param newLocale - The locale to switch to
+   */
+  setLocale: (newLocale: Locale) => Promise<void>;
+  /**
+   * Get the current locale
+   *
+   * @returns Current locale
+   */
+  locale: Ref<Locale>;
+  /**
+   * Service methods handle fetch requests
+   */
+  service?: I18nService;
+}
+type MessageMap = Record<string, string>;
+export interface I18nService {
+  /**
+   * Fetch all translation messages for a specific locale.
+   * @param locale The locale code (e.g., 'en', 'id').
+   * @returns A promise resolving to a key-value record of messages.
+   */
+  getMessages(locale: string): Promise<
+    AxiosResponse<{
+      data: MessageMap;
+    }>
+  >;
+  /**
+   * Fetch all available lang options for LanguageDropdown and LanguageSwitcher
+   *
+   * @returns Promise Array of options
+   */
+  getLanguageOptions(): Promise<LanguageOption[]>;
+  /**
+   * Fetch single lang option meta data
+   *
+   * @param locale The locale code (e.g., 'en', 'id').
+   * @returns Promise LanguageMeta
+   */
+  getLanguageOptionMeta(locale: string): Promise<LanguageOption>;
+  /**
+   * Translate a specific text to the target locale.
+   * @param key Unique translation key.
+   * @param locale Target locale code.
+   * @returns A promise resolving to the translated string.
+   */
+  translateText(key: string, locale: string): Promise<string>;
+}
+export declare const useI18n: () => I18n;
+declare const i18n: {
+  install: (app: App) => void;
 };
+export declare const createI18nWithExtension: (
+  service: I18nService,
+) => typeof i18n;
+export default i18n;
+declare module 'vue' {
+  interface ComponentCustomProperties {
+    $i18n: I18n;
+    $t: I18n['t'];
+  }
+}
+declare global {
+  interface Window {
+    i18n: I18n;
+  }
+}