@gemafajarramadhan/dynamic-ui 1.3.16 → 1.3.18

package/dist/index.d.ts

@@ -1,602 +1,612 @@
 import type { DefineComponent, Plugin, App } from 'vue'
 
-    export interface DynamicUIApiConfig {
-        externalApi: any
-    }
-
-    export const DynamicFormField: DefineComponent<{
-        field: {
-            key: string;
-            component: string;
-            model: string;
-            seq?: number;
-            column?: string;
-            isHidden?: boolean;
-            logic?: Record<string, any>;
-            props?: Record<string, any>;
-            propsFieldGlobal?: Record<string, any>;
-        };
-        modelValue?: any;
-        formData?: Record<string, any>;
-        required?: boolean;
-        options?: any[];
-        error?: string | null;
-        dynamicLabels?: {
-            labelEN?: string;
-            labelID?: string;
-            placeholderEN?: string;
-            placeholderID?: string;
-        } | null;
-        dynamicLength?: {
-            minLength?: number | string | null;
-            maxLength?: number | string | null;
-        } | null;
-        baseUrl?: string;
-        viewOnly?: boolean;
-    }>
-
-    export const DCodeAutoComplete: DefineComponent<{
-        modelValue?: any
-        options?: any[]
-        label?: string
-        placeholder?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        error?: string | null
-        [key: string]: any
-    }>
-
-    export const Breadcrumb: DefineComponent<{
-        items?: any[]
-        showHomeIcon?: boolean
-        iconSize?: string
-        disabled?: boolean
-        separatorSize?: number
-        separatorType?: 'chevron' | 'slash'
-        strokeWidth?: number
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeBadge: DefineComponent<{
-        text?: string
-        variant?: 'default' | 'secondary' | 'destructive' | 'outline' | 'success' | 'warning' | 'info' | 'ghost' | 'tonal' | 'pink' | 'purple' | 'dark' | 'light'
-        size?: 'xs' | 'sm' | 'md' | 'lg'
-        icon?: string
-        dot?: boolean
-        pill?: boolean
-        color?: string
-        skeleton?: boolean
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeBeforeAfter: DefineComponent<{
-        dataBefore: any
-        dataAfter: any
-        [key: string]: any
-    }>
+export interface DynamicUIApiConfig {
+    externalApi: any
+}
 
-    export const DCodeListLabels: DefineComponent<{
-        dataBefore?: any
-        dataAfter?: any
-        [key: string]: any
-    }>
-
-    export const DCodeButton: DefineComponent<{
-        text?: string
-        variant?: 'default' | 'secondary' | 'destructive' | 'outline' | 'ghost' | 'link' | 'tonal' | 'elevated'
-        size?: 'default' | 'sm' | 'lg' | 'icon'
-        tooltip?: string
-        bgColor?: string
-        textColor?: string
-        hoverBgColor?: string
-        borderColor?: string
-        disabled?: boolean
-        type?: 'BUTTON' | 'SUBMIT' | 'RESET' | 'button' | 'submit' | 'reset'
-        visible?: boolean
-        skeleton?: boolean
-        to?: string
-        icon?: string
-        iconClass?: string
-        [key: string]: any
-    }>
+export const CardSummary: DefineComponent<{
+    title: string
+    value: number
+    trend?: number
+    icon: string | any
+    type?: 'primary' | 'success' | 'warning' | 'info'
+    format?: 'currency' | 'number'
+    delay?: number
+}>
+
+export const DynamicFormField: DefineComponent<{
+    field: {
+        key: string;
+        component: string;
+        model: string;
+        seq?: number;
+        column?: string;
+        isHidden?: boolean;
+        logic?: Record<string, any>;
+        props?: Record<string, any>;
+        propsFieldGlobal?: Record<string, any>;
+    };
+    modelValue?: any;
+    formData?: Record<string, any>;
+    required?: boolean;
+    options?: any[];
+    error?: string | null;
+    dynamicLabels?: {
+        labelEN?: string;
+        labelID?: string;
+        placeholderEN?: string;
+        placeholderID?: string;
+    } | null;
+    dynamicLength?: {
+        minLength?: number | string | null;
+        maxLength?: number | string | null;
+    } | null;
+    baseUrl?: string;
+    viewOnly?: boolean;
+}>
+
+export const DCodeAutoComplete: DefineComponent<{
+    modelValue?: any
+    options?: any[]
+    label?: string
+    placeholder?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    error?: string | null
+    [key: string]: any
+}>
+
+export const Breadcrumb: DefineComponent<{
+    items?: any[]
+    showHomeIcon?: boolean
+    iconSize?: string
+    disabled?: boolean
+    separatorSize?: number
+    separatorType?: 'chevron' | 'slash'
+    strokeWidth?: number
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeBadge: DefineComponent<{
+    text?: string
+    variant?: 'default' | 'secondary' | 'destructive' | 'outline' | 'success' | 'warning' | 'info' | 'ghost' | 'tonal' | 'pink' | 'purple' | 'dark' | 'light'
+    size?: 'xs' | 'sm' | 'md' | 'lg'
+    icon?: string
+    dot?: boolean
+    pill?: boolean
+    color?: string
+    skeleton?: boolean
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeBeforeAfter: DefineComponent<{
+    dataBefore: any
+    dataAfter: any
+    [key: string]: any
+}>
+
+export const DCodeListLabels: DefineComponent<{
+    dataBefore?: any
+    dataAfter?: any
+    [key: string]: any
+}>
+
+export const DCodeButton: DefineComponent<{
+    text?: string
+    variant?: 'default' | 'secondary' | 'destructive' | 'outline' | 'ghost' | 'link' | 'tonal' | 'elevated'
+    size?: 'default' | 'sm' | 'lg' | 'icon'
+    tooltip?: string
+    bgColor?: string
+    textColor?: string
+    hoverBgColor?: string
+    borderColor?: string
+    disabled?: boolean
+    type?: 'BUTTON' | 'SUBMIT' | 'RESET' | 'button' | 'submit' | 'reset'
+    visible?: boolean
+    skeleton?: boolean
+    to?: string
+    icon?: string
+    iconClass?: string
+    [key: string]: any
+}>
+
+export const DCodeCard: DefineComponent<{
+    [key: string]: any
+}>
+
+export const DCodeChart: DefineComponent<{
+    type: string
+    width?: number
+    height?: number
+    required?: boolean
+    loading?: boolean
+    error?: string | null
+    showInfo?: boolean
+    responsive?: boolean
+    maintainAspectRatio?: boolean
+    theme?: string
+    colors?: string[]
+    data?: any
+    modelValue?: any
+    options?: any
+    label?: string
+    [key: string]: any
+}>
+
+export interface CheckboxItem {
+    id: string | number
+    title: string
+    value?: boolean
+    disabled?: boolean
+    indeterminate?: boolean
+}
 
-    export const DCodeCard: DefineComponent<{
-        [key: string]: any
-    }>
-
-    export const DCodeChart: DefineComponent<{
-        type: string
-        width?: number
-        height?: number
-        required?: boolean
-        loading?: boolean
-        error?: string | null
-        showInfo?: boolean
-        responsive?: boolean
-        maintainAspectRatio?: boolean
-        theme?: string
-        colors?: string[]
-        data?: any
-        modelValue?: any
-        options?: any
-        label?: string
+export const DCodeCheckbox: DefineComponent<{
+    modelValue?: boolean | string[] | any
+    label?: string
+    title?: string
+    required?: boolean
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    [key: string]: any
+}>
+
+export const DCodeCardCheckboxList: DefineComponent<{
+    label?: string
+    items?: CheckboxItem[]
+    modelValue?: CheckboxItem[] | (string | number)[]
+    columns?: 1 | 2 | 3 | 4
+    skeleton?: boolean
+    disabled?: boolean
+    visible?: boolean
+    apiModule?: string
+    apiAction?: string
+    endpoint?: {
+        apiUrl: string
+        apiMethod?: string
         [key: string]: any
-    }>
-
-    export interface CheckboxItem {
-        id: string | number
-        title: string
-        value?: boolean
-        disabled?: boolean
-        indeterminate?: boolean
     }
-
-    export const DCodeCheckbox: DefineComponent<{
-        modelValue?: boolean | string[] | any
-        label?: string
-        title?: string
-        required?: boolean
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeCardCheckboxList: DefineComponent<{
-        label?: string
-        items?: CheckboxItem[]
-        modelValue?: CheckboxItem[] | (string | number)[]
-        columns?: 1 | 2 | 3 | 4
-        skeleton?: boolean
-        disabled?: boolean
-        visible?: boolean
-        apiModule?: string
-        apiAction?: string
-        endpoint?: {
-            apiUrl: string
-            apiMethod?: string
-            [key: string]: any
-        }
-        itemTitle?: string
-        itemValue?: string
-        apiParams?: Record<string, any>
-        returnArray?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeCurrencyField: DefineComponent<{
-        modelValue?: number | null
-        label?: string
-        placeholder?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        error?: string | null
-        currency?: string
-        [key: string]: any
-    }>
-
-    export const DCodeDatePicker: DefineComponent<{
-        modelValue?: string | Date | null
-        label?: string
-        placeholder?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        error?: string | null
-        format?: string
-        [key: string]: any
-    }>
-
-    export const DCodeDialog: DefineComponent<{
-        modelValue?: boolean
-        title?: string
-        [key: string]: any
-    }>
-
-    export const DCodeDialogCloseBtn: DefineComponent<{
-        [key: string]: any
-    }>
-
-    export const DCodeDropzone: DefineComponent<{
-        modelValue?: File | File[] | null
-        label?: string
-        accept?: string
-        multiple?: boolean
-        disabled?: boolean
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeFileField: DefineComponent<{
-        modelValue?: File | null
-        label?: string
-        accept?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        error?: string | null
-        [key: string]: any
-    }>
-
-    export const DCodeFileResult: DefineComponent<{
-        value?: string | null
-        label?: string
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeIconDropdown: DefineComponent<{
-        items?: any[]
-        disabled?: boolean
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeImageCropperDialog: DefineComponent<{
-        modelValue?: boolean
-        imageSrc?: string
-        [key: string]: any
-    }>
-
-    export const DCodeImageField: DefineComponent<{
-        modelValue?: string | File | null
-        label?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        error?: string | null
-        [key: string]: any
-    }>
-
-    export const DCodeImageResult: DefineComponent<{
-        value?: string | null
-        label?: string
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeInfiniteAutoComplete: DefineComponent<{
-        modelValue?: string | number | object | any[] | null | undefined
+    itemTitle?: string
+    itemValue?: string
+    apiParams?: Record<string, any>
+    returnArray?: boolean
+    [key: string]: any
+}>
+
+export const DCodeCurrencyField: DefineComponent<{
+    modelValue?: number | null
+    label?: string
+    placeholder?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    error?: string | null
+    currency?: string
+    [key: string]: any
+}>
+
+export const DCodeDatePicker: DefineComponent<{
+    modelValue?: string | Date | null
+    label?: string
+    placeholder?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    error?: string | null
+    format?: string
+    [key: string]: any
+}>
+
+export const DCodeDialog: DefineComponent<{
+    modelValue?: boolean
+    title?: string
+    [key: string]: any
+}>
+
+export const DCodeDialogCloseBtn: DefineComponent<{
+    [key: string]: any
+}>
+
+export const DCodeDropzone: DefineComponent<{
+    modelValue?: File | File[] | null
+    label?: string
+    accept?: string
+    multiple?: boolean
+    disabled?: boolean
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeFileField: DefineComponent<{
+    modelValue?: File | null
+    label?: string
+    accept?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    error?: string | null
+    [key: string]: any
+}>
+
+export const DCodeFileResult: DefineComponent<{
+    value?: string | null
+    label?: string
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeIconDropdown: DefineComponent<{
+    items?: any[]
+    disabled?: boolean
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeImageCropperDialog: DefineComponent<{
+    modelValue?: boolean
+    imageSrc?: string
+    [key: string]: any
+}>
+
+export const DCodeImageField: DefineComponent<{
+    modelValue?: string | File | null
+    label?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    error?: string | null
+    [key: string]: any
+}>
+
+export const DCodeImageResult: DefineComponent<{
+    value?: string | null
+    label?: string
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeInfiniteAutoComplete: DefineComponent<{
+    modelValue?: string | number | object | any[] | null | undefined
+    apiModule?: string
+    apiAction?: string
+    apiOptions?: any | (() => any | undefined)
+    autoFetchOnOpen?: boolean
+    refreshOnOpen?: boolean
+    autoFetchOnMount?: boolean
+    visible?: boolean
+    clearable?: boolean
+    disabled?: boolean
+    skeleton?: boolean
+    error?: string | null
+    errorMessage?: string | null
+    itemTitle?: string | ((item: any) => string)
+    itemValue?: string | ((item: any) => any)
+    itemSubtitle?: string | ((item: any) => string)
+    returnObject?: boolean
+    endpoint?: {
         apiModule?: string
         apiAction?: string
-        apiOptions?: any | (() => any | undefined)
-        autoFetchOnOpen?: boolean
-        refreshOnOpen?: boolean
-        autoFetchOnMount?: boolean
-        visible?: boolean
-        clearable?: boolean
-        disabled?: boolean
-        skeleton?: boolean
-        error?: string | null
-        errorMessage?: string | null
-        itemTitle?: string | ((item: any) => string)
-        itemValue?: string | ((item: any) => any)
-        itemSubtitle?: string | ((item: any) => string)
-        returnObject?: boolean
-        endpoint?: {
-            apiModule?: string
-            apiAction?: string
-            apiUrl?: string
-            apiMethod?: string
-        }
-        apiParams?: Record<string, any>
-        fetchItems?: () => Promise<any[]>
-        icon?: any
-        label?: string
-        placeholder?: string
-        required?: boolean
-        inputType?: string
-        helperText?: string
-        noResultsText?: string
-        loadingText?: string
-        endOfResultsText?: string
-        pageSize?: number
-        threshold?: number
-        debounceMs?: number
-        [key: string]: any
-    }>
-
-    export const DCodeLabel: DefineComponent<{
-        for?: string
-        required?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeMultiSelect: DefineComponent<{
-        modelValue?: any[]
-        options?: any[]
-        label?: string
-        placeholder?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        error?: string | null
-        [key: string]: any
-    }>
-
-    export const DCodeOtpInput: DefineComponent<{
-        modelValue?: string
-        length?: number
-        disabled?: boolean
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodePermissionMenu: DefineComponent<{
-        menuList?: any[]
-        enableParentControl?: boolean
-        showIcons?: boolean
-        modelValue?: Array<{ menuId: number; actionsIds: number[] }>
-        treeData?: any[]
-        [key: string]: any
-    }>
-
-    export const DCodeProgress: DefineComponent<{
-        modelValue?: number
-        max?: number
-        label?: string
-        showValue?: boolean
-        color?: string
-        size?: 'sm' | 'md' | 'lg'
-        striped?: boolean
-        animated?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeProgressBar: DefineComponent<{
-        isApiLoading?: boolean
-        apiProgress?: number
-    }>
-
-    export const DCodeRadio: DefineComponent<{
-        modelValue?: any
-        value?: any
-        label?: string
-        description?: string
-        disabled?: boolean
-        required?: boolean
-        error?: string | null
-        size?: 'sm' | 'md' | 'lg'
-        color?: string
-        name?: string
-        id?: string
-        [key: string]: any
-    }>
-
-    export const DCodeRadioCustom: DefineComponent<{
-        modelValue?: string | number | boolean
-        options?: any[]
-        label?: string
-        disabled?: boolean
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeSlider: DefineComponent<{
-        modelValue?: number
-        label?: string
-        min?: number
-        max?: number
-        step?: number
-        disabled?: boolean
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeStaticLabel: DefineComponent<{
-        label?: string
-        value?: any
-        icon?: string
-        color?: "primary" | "success" | "warning" | "danger" | "info" | "secondary" | "dark"
-        [key: string]: any
-    }>
-
-    export const DCodeStaticImage: DefineComponent<{
-        items: any[]
-        alt?: string
-        label?: string
-        aspectRatio?: string
-        width?: string
-        height?: string
-        fit?: "cover" | "contain" | "fill" | "none"
-        rounded?: boolean
-        allowPreview?: boolean
-        columns?: number
-        gap?: string
-        [key: string]: any
-    }>
-
-    export const DCodeSwitch: DefineComponent<{
-        modelValue?: boolean
-        label?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeTextField: DefineComponent<{
-        modelValue?: string | number | null
-        label?: string
-        placeholder?: string
-        clearable?: boolean
-        hideClearWhenEmpty?: boolean
-        textCase?: 'none' | 'uppercase' | 'lowercase' | 'titlecase' | 'sentencecase'
-        applyTextCaseToValue?: boolean
-        valueType?: 'free' | 'number' | 'letter' | 'letternumber' | 'email' | 'password'
-        allowSpaces?: boolean
-        allowChars?: string | string[]
-        pattern?: RegExp
-        visible?: boolean
-        skeleton?: boolean
-        showCharCount?: boolean
-        returnNumber?: boolean
-        error?: string | null
-        disabled?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeTextarea: DefineComponent<{
-        modelValue?: string | null
-        label?: string
-        placeholder?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        error?: string | null
-        [key: string]: any
-    }>
-
-     export const DCodeTimelineWithIcons: DefineComponent<{
-        items?: any[]
         apiUrl?: string
-        apiModule?: string
-        apiAction?: string
         apiMethod?: string
-        apiParams?: Record<string, any>
-        title?: string
-        endpoint?: {
-            apiUrl?: string;
-            apiMethod?: string;
-            keyParam?: string[];
-        }
-        [key: string]: any
-    }>
-
-    export const DCodeUploadFile: DefineComponent<{
-        modelValue?: File | null
-        label?: string
-        accept?: string
-        disabled?: boolean
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeWorkflowDiagram: DefineComponent<{
-        auditId?: string | number
-        fetcher?: (params: { auditId: string | number }) => Promise<Blob>
+    }
+    apiParams?: Record<string, any>
+    fetchItems?: () => Promise<any[]>
+    icon?: any
+    label?: string
+    placeholder?: string
+    required?: boolean
+    inputType?: string
+    helperText?: string
+    noResultsText?: string
+    loadingText?: string
+    endOfResultsText?: string
+    pageSize?: number
+    threshold?: number
+    debounceMs?: number
+    [key: string]: any
+}>
+
+export const DCodeLabel: DefineComponent<{
+    for?: string
+    required?: boolean
+    [key: string]: any
+}>
+
+export const DCodeMultiSelect: DefineComponent<{
+    modelValue?: any[]
+    options?: any[]
+    label?: string
+    placeholder?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    error?: string | null
+    [key: string]: any
+}>
+
+export const DCodeOtpInput: DefineComponent<{
+    modelValue?: string
+    length?: number
+    disabled?: boolean
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodePermissionMenu: DefineComponent<{
+    menuList?: any[]
+    enableParentControl?: boolean
+    showIcons?: boolean
+    modelValue?: Array<{ menuId: number; actionsIds: number[] }>
+    treeData?: any[]
+    [key: string]: any
+}>
+
+export const DCodeProgress: DefineComponent<{
+    modelValue?: number
+    max?: number
+    label?: string
+    showValue?: boolean
+    color?: string
+    size?: 'sm' | 'md' | 'lg'
+    striped?: boolean
+    animated?: boolean
+    [key: string]: any
+}>
+
+export const DCodeProgressBar: DefineComponent<{
+    isApiLoading?: boolean
+    apiProgress?: number
+}>
+
+export const DCodeRadio: DefineComponent<{
+    modelValue?: any
+    value?: any
+    label?: string
+    description?: string
+    disabled?: boolean
+    required?: boolean
+    error?: string | null
+    size?: 'sm' | 'md' | 'lg'
+    color?: string
+    name?: string
+    id?: string
+    [key: string]: any
+}>
+
+export const DCodeRadioCustom: DefineComponent<{
+    modelValue?: string | number | boolean
+    options?: any[]
+    label?: string
+    disabled?: boolean
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeSlider: DefineComponent<{
+    modelValue?: number
+    label?: string
+    min?: number
+    max?: number
+    step?: number
+    disabled?: boolean
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeStaticLabel: DefineComponent<{
+    label?: string
+    value?: any
+    icon?: string
+    color?: "primary" | "success" | "warning" | "danger" | "info" | "secondary" | "dark"
+    [key: string]: any
+}>
+
+export const DCodeStaticImage: DefineComponent<{
+    items: any[]
+    alt?: string
+    label?: string
+    aspectRatio?: string
+    width?: string
+    height?: string
+    fit?: "cover" | "contain" | "fill" | "none"
+    rounded?: boolean
+    allowPreview?: boolean
+    columns?: number
+    gap?: string
+    [key: string]: any
+}>
+
+export const DCodeSwitch: DefineComponent<{
+    modelValue?: boolean
+    label?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    [key: string]: any
+}>
+
+export const DCodeTextField: DefineComponent<{
+    modelValue?: string | number | null
+    label?: string
+    placeholder?: string
+    clearable?: boolean
+    hideClearWhenEmpty?: boolean
+    textCase?: 'none' | 'uppercase' | 'lowercase' | 'titlecase' | 'sentencecase'
+    applyTextCaseToValue?: boolean
+    valueType?: 'free' | 'number' | 'letter' | 'letternumber' | 'email' | 'password'
+    allowSpaces?: boolean
+    allowChars?: string | string[]
+    pattern?: RegExp
+    visible?: boolean
+    skeleton?: boolean
+    showCharCount?: boolean
+    returnNumber?: boolean
+    error?: string | null
+    disabled?: boolean
+    [key: string]: any
+}>
+
+export const DCodeTextarea: DefineComponent<{
+    modelValue?: string | null
+    label?: string
+    placeholder?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    error?: string | null
+    [key: string]: any
+}>
+
+export const DCodeTimelineWithIcons: DefineComponent<{
+    items?: any[]
+    apiUrl?: string
+    apiModule?: string
+    apiAction?: string
+    apiMethod?: string
+    apiParams?: Record<string, any>
+    title?: string
+    endpoint?: {
+        apiUrl?: string;
+        apiMethod?: string;
+        keyParam?: string[];
+    }
+    [key: string]: any
+}>
+
+export const DCodeUploadFile: DefineComponent<{
+    modelValue?: File | null
+    label?: string
+    accept?: string
+    disabled?: boolean
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeWorkflowDiagram: DefineComponent<{
+    auditId?: string | number
+    fetcher?: (params: { auditId: string | number }) => Promise<Blob>
+    apiModule?: string
+    apiAction?: string
+    apiUrl?: string
+    apiMethod?: string
+    apiParams?: Record<string, any>
+    title?: string
+    height?: string
+    [key: string]: any
+}>
+
+export const DCodeWizard: DefineComponent<{
+    steps?: any[]
+    modelValue?: number
+    visible?: boolean
+    [key: string]: any
+}>
+
+export const DCodeTreePermissions: DefineComponent<{
+    modelValue?: Array<{ menuId: number; actionsIds: number[] }>
+    label?: string
+    required?: boolean
+    disabled?: boolean
+    error?: string
+    treeData?: any[]
+    [key: string]: any
+}>
+
+export const DCodeDynamicUploadList: DefineComponent<{
+    modelValue?: any[]
+    label?: string
+    labelID?: string
+    labelEN?: string
+    endpoint?: {
         apiModule?: string
         apiAction?: string
         apiUrl?: string
         apiMethod?: string
-        apiParams?: Record<string, any>
-        title?: string
-        height?: string
-        [key: string]: any
-    }>
-
-    export const DCodeWizard: DefineComponent<{
-        steps?: any[]
-        modelValue?: number
-        visible?: boolean
-        [key: string]: any
-    }>
-
-    export const DCodeTreePermissions: DefineComponent<{
-        modelValue?: Array<{ menuId: number; actionsIds: number[] }>
-        label?: string
-        required?: boolean
-        disabled?: boolean
-        error?: string
-        treeData?: any[]
-        [key: string]: any
-    }>
-
-    export const DCodeDynamicUploadList: DefineComponent<{
-        modelValue?: any[]
-        label?: string
-        labelID?: string
-        labelEN?: string
-        endpoint?: {
-            apiModule?: string
-            apiAction?: string
-            apiUrl?: string
-            apiMethod?: string
-        }
-        endpointReference?: {
-            apiModule?: string
-            apiAction?: string
-            apiUrl?: string
-            apiMethod?: string
-        }
-        itemTitle?: string
-        itemValue?: string
-        baseUrl?: string
-        disabled?: boolean
-        visible?: boolean
-        skeleton?: boolean
-        error?: string | null
-        [key: string]: any
-    }>
-
-    export const MicroDynamicForm: any
-    export const MicroDynamicDatatable: any
-
-    export const AutoLayoutForm: DefineComponent<{
-        layoutCode: string
-        isEditMode?: boolean
-        model?: Record<string, any>
-        [key: string]: any
-    }>
-    export const AutoLayoutDatatable: DefineComponent<{
-        layoutCode: string
-        userPermissions?: any
-        permissionBase?: string
-        checkPermission?: (permission: string) => boolean
-        [key: string]: any
-    }>
-    export const DataTable: DefineComponent<{
-        columns?: any[]
-        data?: any[]
-        perPage?: number
-        loading?: boolean
-        hasActions?: boolean
-        nested?: boolean
+    }
+    endpointReference?: {
         apiModule?: string
         apiAction?: string
-        apiMethod?: string
         apiUrl?: string
-        permissionBase?: string
-        apiParams?: Record<string, any>
-        configKey?: string
-        tableConfig?: any
-        dynamicColumns?: boolean
-        searchApiEndpoint?: string
-        enableQuickSearch?: boolean
-        showPagination?: boolean
-        ignorePermissions?: boolean
-        userPermissions?: any
-        permissionChecker?: (path: string, action: string) => boolean
-        permissions?: string[]
-        checkPermission?: (permission: string) => boolean
-        menuPermissions?: any[]
-        dummyMode?: boolean
-        [key: string]: any
-    }>
-    export const DataTableComponent: DefineComponent<{
-        [key: string]: any
-    }>
-
-    export const DynamicForm: DefineComponent<{
-        schema: any
-        dummyMode?: boolean
-        model?: Record<string, any>
-        isEditMode?: boolean
-        loading?: boolean
-        baseUrl?: string
-        [key: string]: any
-    }>
-
-    export function registerLogic(name: string, module: any): void
-    export function getLogicModule(name: string): any
-    export function unregisterLogic(name: string): void
-
-    export function cn(...inputs: any[]): string
-    export function useDynamicForm(props: any, emit: any): any
+        apiMethod?: string
+    }
+    itemTitle?: string
+    itemValue?: string
+    baseUrl?: string
+    disabled?: boolean
+    visible?: boolean
+    skeleton?: boolean
+    error?: string | null
+    [key: string]: any
+}>
+
+export const MicroDynamicForm: any
+export const MicroDynamicDatatable: any
+
+export const AutoLayoutForm: DefineComponent<{
+    layoutCode: string
+    isEditMode?: boolean
+    model?: Record<string, any>
+    [key: string]: any
+}>
+export const AutoLayoutDatatable: DefineComponent<{
+    layoutCode: string
+    userPermissions?: any
+    permissionBase?: string
+    checkPermission?: (permission: string) => boolean
+    [key: string]: any
+}>
+export const DataTable: DefineComponent<{
+    columns?: any[]
+    data?: any[]
+    perPage?: number
+    loading?: boolean
+    hasActions?: boolean
+    nested?: boolean
+    apiModule?: string
+    apiAction?: string
+    apiMethod?: string
+    apiUrl?: string
+    permissionBase?: string
+    apiParams?: Record<string, any>
+    configKey?: string
+    tableConfig?: any
+    dynamicColumns?: boolean
+    searchApiEndpoint?: string
+    enableQuickSearch?: boolean
+    showPagination?: boolean
+    ignorePermissions?: boolean
+    userPermissions?: any
+    permissionChecker?: (path: string, action: string) => boolean
+    permissions?: string[]
+    checkPermission?: (permission: string) => boolean
+    menuPermissions?: any[]
+    dummyMode?: boolean
+    [key: string]: any
+}>
+export const DataTableComponent: DefineComponent<{
+    [key: string]: any
+}>
+
+export const DynamicForm: DefineComponent<{
+    schema: any
+    dummyMode?: boolean
+    model?: Record<string, any>
+    isEditMode?: boolean
+    loading?: boolean
+    baseUrl?: string
+    [key: string]: any
+}>
+
+export function registerLogic(name: string, module: any): void
+export function getLogicModule(name: string): any
+export function unregisterLogic(name: string): void
+
+export function cn(...inputs: any[]): string
+export function useDynamicForm(props: any, emit: any): any
 
 const DynamicUI: {
     install: (app: any, options?: DynamicUIApiConfig) => void