@dpa-id-components/dpa-shared-components 9.4.0 → 9.4.1

package/dist/components/UiSearchBar/UiSearchBar.stories.d.ts

@@ -0,0 +1,871 @@
+import { StoryObj } from '@storybook/vue3';
+
+declare const meta: {
+    title: string;
+    component: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstance<Readonly<import('vue').ExtractPropTypes<{
+            modelValue: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+            placeholder: {
+                type: import('vue').PropType<string>;
+                default: string;
+            };
+            backgroundColor: {
+                type: import('vue').PropType<"gray" | "white">;
+                required: true;
+                default: string;
+            };
+            hiddenFilterRules: {
+                type: import('vue').PropType<number>;
+                default: number;
+            };
+            isFilterChipEditable: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            hasChips: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            executeSearchButtonTitle: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+            resetSearchButtonTittle: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+        }>> & {
+            onFocus?: ((...args: any[]) => any) | undefined;
+            onBlur?: ((...args: any[]) => any) | undefined;
+            onReset?: ((...args: any[]) => any) | undefined;
+            onSubmit?: ((...args: any[]) => any) | undefined;
+            "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+            onSearch?: ((...args: any[]) => any) | undefined;
+        }, {
+            searchInputRef: import('vue').Ref<HTMLInputElement | undefined>;
+        }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+            reset: (...args: any[]) => void;
+            search: (...args: any[]) => void;
+            blur: (...args: any[]) => void;
+            focus: (...args: any[]) => void;
+            submit: (...args: any[]) => void;
+            "update:modelValue": (...args: any[]) => void;
+        }, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & Readonly<import('vue').ExtractPropTypes<{
+            modelValue: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+            placeholder: {
+                type: import('vue').PropType<string>;
+                default: string;
+            };
+            backgroundColor: {
+                type: import('vue').PropType<"gray" | "white">;
+                required: true;
+                default: string;
+            };
+            hiddenFilterRules: {
+                type: import('vue').PropType<number>;
+                default: number;
+            };
+            isFilterChipEditable: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            hasChips: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            executeSearchButtonTitle: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+            resetSearchButtonTittle: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+        }>> & {
+            onFocus?: ((...args: any[]) => any) | undefined;
+            onBlur?: ((...args: any[]) => any) | undefined;
+            onReset?: ((...args: any[]) => any) | undefined;
+            onSubmit?: ((...args: any[]) => any) | undefined;
+            "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+            onSearch?: ((...args: any[]) => any) | undefined;
+        }, {
+            modelValue: string;
+            placeholder: string;
+            backgroundColor: "gray" | "white";
+            hiddenFilterRules: number;
+            isFilterChipEditable: boolean;
+            hasChips: boolean;
+            executeSearchButtonTitle: string;
+            resetSearchButtonTittle: string;
+        }, true, {}, {}, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('vue').ExtractPropTypes<{
+            modelValue: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+            placeholder: {
+                type: import('vue').PropType<string>;
+                default: string;
+            };
+            backgroundColor: {
+                type: import('vue').PropType<"gray" | "white">;
+                required: true;
+                default: string;
+            };
+            hiddenFilterRules: {
+                type: import('vue').PropType<number>;
+                default: number;
+            };
+            isFilterChipEditable: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            hasChips: {
+                type: import('vue').PropType<boolean>;
+                default: boolean;
+            };
+            executeSearchButtonTitle: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+            resetSearchButtonTittle: {
+                type: import('vue').PropType<string>;
+                required: true;
+                default: string;
+            };
+        }>> & {
+            onFocus?: ((...args: any[]) => any) | undefined;
+            onBlur?: ((...args: any[]) => any) | undefined;
+            onReset?: ((...args: any[]) => any) | undefined;
+            onSubmit?: ((...args: any[]) => any) | undefined;
+            "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+            onSearch?: ((...args: any[]) => any) | undefined;
+        }, {
+            searchInputRef: import('vue').Ref<HTMLInputElement | undefined>;
+        }, {}, {}, {}, {
+            modelValue: string;
+            placeholder: string;
+            backgroundColor: "gray" | "white";
+            hiddenFilterRules: number;
+            isFilterChipEditable: boolean;
+            hasChips: boolean;
+            executeSearchButtonTitle: string;
+            resetSearchButtonTittle: string;
+        }>;
+        __isFragment?: undefined;
+        __isTeleport?: undefined;
+        __isSuspense?: undefined;
+    } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+        modelValue: {
+            type: import('vue').PropType<string>;
+            required: true;
+            default: string;
+        };
+        placeholder: {
+            type: import('vue').PropType<string>;
+            default: string;
+        };
+        backgroundColor: {
+            type: import('vue').PropType<"gray" | "white">;
+            required: true;
+            default: string;
+        };
+        hiddenFilterRules: {
+            type: import('vue').PropType<number>;
+            default: number;
+        };
+        isFilterChipEditable: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
+        hasChips: {
+            type: import('vue').PropType<boolean>;
+            default: boolean;
+        };
+        executeSearchButtonTitle: {
+            type: import('vue').PropType<string>;
+            required: true;
+            default: string;
+        };
+        resetSearchButtonTittle: {
+            type: import('vue').PropType<string>;
+            required: true;
+            default: string;
+        };
+    }>> & {
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        onReset?: ((...args: any[]) => any) | undefined;
+        onSubmit?: ((...args: any[]) => any) | undefined;
+        "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+        onSearch?: ((...args: any[]) => any) | undefined;
+    }, {
+        searchInputRef: import('vue').Ref<HTMLInputElement | undefined>;
+    }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        reset: (...args: any[]) => void;
+        search: (...args: any[]) => void;
+        blur: (...args: any[]) => void;
+        focus: (...args: any[]) => void;
+        submit: (...args: any[]) => void;
+        "update:modelValue": (...args: any[]) => void;
+    }, string, {
+        modelValue: string;
+        placeholder: string;
+        backgroundColor: "gray" | "white";
+        hiddenFilterRules: number;
+        isFilterChipEditable: boolean;
+        hasChips: boolean;
+        executeSearchButtonTitle: string;
+        resetSearchButtonTittle: string;
+    }, {}, string, {}> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: {
+            nonEditableChips?(_: {}): any;
+            editableChips?(_: {}): any;
+            searchCriteriaButton?(_: {}): any;
+            extendedSearchButton?(_: {}): any;
+        };
+    });
+    argTypes: {
+        modelValue: {
+            control: "text";
+        };
+        placeholder: {
+            control: "text";
+        };
+        backgroundColor: {
+            control: "select";
+            options: string[];
+        };
+        hiddenFilterRules: {
+            control: "number";
+        };
+        isFilterChipEditable: {
+            control: "boolean";
+        };
+    };
+    args: {
+        modelValue: string;
+        placeholder: string;
+        backgroundColor: "gray";
+        hiddenFilterRules: number;
+        isFilterChipEditable: true;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const WithActionButtons: Story;
+export declare const WithChips: {
+    render: (args: any) => {
+        components: {
+            UiSearchBar: {
+                new (...args: any[]): import('vue').CreateComponentPublicInstance<Readonly<import('vue').ExtractPropTypes<{
+                    modelValue: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                    placeholder: {
+                        type: import('vue').PropType<string>;
+                        default: string;
+                    };
+                    backgroundColor: {
+                        type: import('vue').PropType<"gray" | "white">;
+                        required: true;
+                        default: string;
+                    };
+                    hiddenFilterRules: {
+                        type: import('vue').PropType<number>;
+                        default: number;
+                    };
+                    isFilterChipEditable: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    hasChips: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    executeSearchButtonTitle: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                    resetSearchButtonTittle: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                }>> & {
+                    onFocus?: ((...args: any[]) => any) | undefined;
+                    onBlur?: ((...args: any[]) => any) | undefined;
+                    onReset?: ((...args: any[]) => any) | undefined;
+                    onSubmit?: ((...args: any[]) => any) | undefined;
+                    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+                    onSearch?: ((...args: any[]) => any) | undefined;
+                }, {
+                    searchInputRef: import('vue').Ref<HTMLInputElement | undefined>;
+                }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                    reset: (...args: any[]) => void;
+                    search: (...args: any[]) => void;
+                    blur: (...args: any[]) => void;
+                    focus: (...args: any[]) => void;
+                    submit: (...args: any[]) => void;
+                    "update:modelValue": (...args: any[]) => void;
+                }, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & Readonly<import('vue').ExtractPropTypes<{
+                    modelValue: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                    placeholder: {
+                        type: import('vue').PropType<string>;
+                        default: string;
+                    };
+                    backgroundColor: {
+                        type: import('vue').PropType<"gray" | "white">;
+                        required: true;
+                        default: string;
+                    };
+                    hiddenFilterRules: {
+                        type: import('vue').PropType<number>;
+                        default: number;
+                    };
+                    isFilterChipEditable: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    hasChips: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    executeSearchButtonTitle: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                    resetSearchButtonTittle: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                }>> & {
+                    onFocus?: ((...args: any[]) => any) | undefined;
+                    onBlur?: ((...args: any[]) => any) | undefined;
+                    onReset?: ((...args: any[]) => any) | undefined;
+                    onSubmit?: ((...args: any[]) => any) | undefined;
+                    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+                    onSearch?: ((...args: any[]) => any) | undefined;
+                }, {
+                    modelValue: string;
+                    placeholder: string;
+                    backgroundColor: "gray" | "white";
+                    hiddenFilterRules: number;
+                    isFilterChipEditable: boolean;
+                    hasChips: boolean;
+                    executeSearchButtonTitle: string;
+                    resetSearchButtonTittle: string;
+                }, true, {}, {}, {
+                    P: {};
+                    B: {};
+                    D: {};
+                    C: {};
+                    M: {};
+                    Defaults: {};
+                }, Readonly<import('vue').ExtractPropTypes<{
+                    modelValue: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                    placeholder: {
+                        type: import('vue').PropType<string>;
+                        default: string;
+                    };
+                    backgroundColor: {
+                        type: import('vue').PropType<"gray" | "white">;
+                        required: true;
+                        default: string;
+                    };
+                    hiddenFilterRules: {
+                        type: import('vue').PropType<number>;
+                        default: number;
+                    };
+                    isFilterChipEditable: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    hasChips: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    executeSearchButtonTitle: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                    resetSearchButtonTittle: {
+                        type: import('vue').PropType<string>;
+                        required: true;
+                        default: string;
+                    };
+                }>> & {
+                    onFocus?: ((...args: any[]) => any) | undefined;
+                    onBlur?: ((...args: any[]) => any) | undefined;
+                    onReset?: ((...args: any[]) => any) | undefined;
+                    onSubmit?: ((...args: any[]) => any) | undefined;
+                    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+                    onSearch?: ((...args: any[]) => any) | undefined;
+                }, {
+                    searchInputRef: import('vue').Ref<HTMLInputElement | undefined>;
+                }, {}, {}, {}, {
+                    modelValue: string;
+                    placeholder: string;
+                    backgroundColor: "gray" | "white";
+                    hiddenFilterRules: number;
+                    isFilterChipEditable: boolean;
+                    hasChips: boolean;
+                    executeSearchButtonTitle: string;
+                    resetSearchButtonTittle: string;
+                }>;
+                __isFragment?: undefined;
+                __isTeleport?: undefined;
+                __isSuspense?: undefined;
+            } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                modelValue: {
+                    type: import('vue').PropType<string>;
+                    required: true;
+                    default: string;
+                };
+                placeholder: {
+                    type: import('vue').PropType<string>;
+                    default: string;
+                };
+                backgroundColor: {
+                    type: import('vue').PropType<"gray" | "white">;
+                    required: true;
+                    default: string;
+                };
+                hiddenFilterRules: {
+                    type: import('vue').PropType<number>;
+                    default: number;
+                };
+                isFilterChipEditable: {
+                    type: import('vue').PropType<boolean>;
+                    default: boolean;
+                };
+                hasChips: {
+                    type: import('vue').PropType<boolean>;
+                    default: boolean;
+                };
+                executeSearchButtonTitle: {
+                    type: import('vue').PropType<string>;
+                    required: true;
+                    default: string;
+                };
+                resetSearchButtonTittle: {
+                    type: import('vue').PropType<string>;
+                    required: true;
+                    default: string;
+                };
+            }>> & {
+                onFocus?: ((...args: any[]) => any) | undefined;
+                onBlur?: ((...args: any[]) => any) | undefined;
+                onReset?: ((...args: any[]) => any) | undefined;
+                onSubmit?: ((...args: any[]) => any) | undefined;
+                "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+                onSearch?: ((...args: any[]) => any) | undefined;
+            }, {
+                searchInputRef: import('vue').Ref<HTMLInputElement | undefined>;
+            }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                reset: (...args: any[]) => void;
+                search: (...args: any[]) => void;
+                blur: (...args: any[]) => void;
+                focus: (...args: any[]) => void;
+                submit: (...args: any[]) => void;
+                "update:modelValue": (...args: any[]) => void;
+            }, string, {
+                modelValue: string;
+                placeholder: string;
+                backgroundColor: "gray" | "white";
+                hiddenFilterRules: number;
+                isFilterChipEditable: boolean;
+                hasChips: boolean;
+                executeSearchButtonTitle: string;
+                resetSearchButtonTittle: string;
+            }, {}, string, {}> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                $slots: {
+                    nonEditableChips?(_: {}): any;
+                    editableChips?(_: {}): any;
+                    searchCriteriaButton?(_: {}): any;
+                    extendedSearchButton?(_: {}): any;
+                };
+            });
+            UiButton: {
+                new (...args: any[]): import('vue').CreateComponentPublicInstance<Readonly<import('vue').ExtractPropTypes<{
+                    size: {
+                        type: import('vue').PropType<"xs" | "small" | "medium" | "large">;
+                        default: string;
+                    };
+                    disabled: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    color: {
+                        type: import('vue').PropType<"blue" | "gray" | "white" | "primary-green" | "transparent" | "light-gray">;
+                        default: string;
+                    };
+                    rounded: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    iconName: {
+                        type: import('vue').PropType<string | null>;
+                        default: null;
+                    };
+                    disabledVariant: {
+                        type: import('vue').PropType<"primary" | "secondary">;
+                        default: string;
+                    };
+                    href: {
+                        type: import('vue').PropType<string>;
+                        default: string;
+                    };
+                }>> & {
+                    onClick?: (() => any) | undefined;
+                }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                    click: () => void;
+                }, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & Readonly<import('vue').ExtractPropTypes<{
+                    size: {
+                        type: import('vue').PropType<"xs" | "small" | "medium" | "large">;
+                        default: string;
+                    };
+                    disabled: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    color: {
+                        type: import('vue').PropType<"blue" | "gray" | "white" | "primary-green" | "transparent" | "light-gray">;
+                        default: string;
+                    };
+                    rounded: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    iconName: {
+                        type: import('vue').PropType<string | null>;
+                        default: null;
+                    };
+                    disabledVariant: {
+                        type: import('vue').PropType<"primary" | "secondary">;
+                        default: string;
+                    };
+                    href: {
+                        type: import('vue').PropType<string>;
+                        default: string;
+                    };
+                }>> & {
+                    onClick?: (() => any) | undefined;
+                }, {
+                    size: "xs" | "small" | "medium" | "large";
+                    disabled: boolean;
+                    color: "blue" | "gray" | "white" | "primary-green" | "transparent" | "light-gray";
+                    rounded: boolean;
+                    iconName: string | null;
+                    disabledVariant: "primary" | "secondary";
+                    href: string;
+                }, true, {}, {}, {
+                    P: {};
+                    B: {};
+                    D: {};
+                    C: {};
+                    M: {};
+                    Defaults: {};
+                }, Readonly<import('vue').ExtractPropTypes<{
+                    size: {
+                        type: import('vue').PropType<"xs" | "small" | "medium" | "large">;
+                        default: string;
+                    };
+                    disabled: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    color: {
+                        type: import('vue').PropType<"blue" | "gray" | "white" | "primary-green" | "transparent" | "light-gray">;
+                        default: string;
+                    };
+                    rounded: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                    iconName: {
+                        type: import('vue').PropType<string | null>;
+                        default: null;
+                    };
+                    disabledVariant: {
+                        type: import('vue').PropType<"primary" | "secondary">;
+                        default: string;
+                    };
+                    href: {
+                        type: import('vue').PropType<string>;
+                        default: string;
+                    };
+                }>> & {
+                    onClick?: (() => any) | undefined;
+                }, {}, {}, {}, {}, {
+                    size: "xs" | "small" | "medium" | "large";
+                    disabled: boolean;
+                    color: "blue" | "gray" | "white" | "primary-green" | "transparent" | "light-gray";
+                    rounded: boolean;
+                    iconName: string | null;
+                    disabledVariant: "primary" | "secondary";
+                    href: string;
+                }>;
+                __isFragment?: undefined;
+                __isTeleport?: undefined;
+                __isSuspense?: undefined;
+            } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                size: {
+                    type: import('vue').PropType<"xs" | "small" | "medium" | "large">;
+                    default: string;
+                };
+                disabled: {
+                    type: import('vue').PropType<boolean>;
+                    default: boolean;
+                };
+                color: {
+                    type: import('vue').PropType<"blue" | "gray" | "white" | "primary-green" | "transparent" | "light-gray">;
+                    default: string;
+                };
+                rounded: {
+                    type: import('vue').PropType<boolean>;
+                    default: boolean;
+                };
+                iconName: {
+                    type: import('vue').PropType<string | null>;
+                    default: null;
+                };
+                disabledVariant: {
+                    type: import('vue').PropType<"primary" | "secondary">;
+                    default: string;
+                };
+                href: {
+                    type: import('vue').PropType<string>;
+                    default: string;
+                };
+            }>> & {
+                onClick?: (() => any) | undefined;
+            }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                click: () => void;
+            }, string, {
+                size: "xs" | "small" | "medium" | "large";
+                disabled: boolean;
+                color: "blue" | "gray" | "white" | "primary-green" | "transparent" | "light-gray";
+                rounded: boolean;
+                iconName: string | null;
+                disabledVariant: "primary" | "secondary";
+                href: string;
+            }, {}, string, {}> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                $slots: {
+                    default?(_: {}): any;
+                };
+            });
+            UiIconButton: import('vue').DefineComponent<{
+                size: {
+                    type: import('vue').PropType<"small" | "medium" | "large" | "xl">;
+                    default: string;
+                };
+                disabled: {
+                    type: import('vue').PropType<boolean>;
+                    default: boolean;
+                };
+                title: {
+                    type: import('vue').PropType<string>;
+                    default: string;
+                };
+                iconName: {
+                    type: import('vue').PropType<string>;
+                    required: true;
+                };
+                backgroundColor: {
+                    type: import('vue').PropType<"none" | "blue" | "gray-hover">;
+                    default: string;
+                };
+                iconColor: {
+                    type: import('vue').PropType<"blue" | "gray" | "white">;
+                    default: string;
+                };
+            }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+                click: (payload: any) => void;
+            }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+                size: {
+                    type: import('vue').PropType<"small" | "medium" | "large" | "xl">;
+                    default: string;
+                };
+                disabled: {
+                    type: import('vue').PropType<boolean>;
+                    default: boolean;
+                };
+                title: {
+                    type: import('vue').PropType<string>;
+                    default: string;
+                };
+                iconName: {
+                    type: import('vue').PropType<string>;
+                    required: true;
+                };
+                backgroundColor: {
+                    type: import('vue').PropType<"none" | "blue" | "gray-hover">;
+                    default: string;
+                };
+                iconColor: {
+                    type: import('vue').PropType<"blue" | "gray" | "white">;
+                    default: string;
+                };
+            }>> & {
+                onClick?: ((payload: any) => any) | undefined;
+            }, {
+                size: "small" | "medium" | "large" | "xl";
+                disabled: boolean;
+                title: string;
+                backgroundColor: "none" | "blue" | "gray-hover";
+                iconColor: "blue" | "gray" | "white";
+            }, {}>;
+            UiIcon: import('vue').DefineComponent<{
+                name: {
+                    type: import('vue').PropType<string>;
+                    required: true;
+                };
+                size: {
+                    type: import('vue').PropType<"xs" | "small" | "medium" | "large" | "xl" | "2xl">;
+                    default: string;
+                };
+                sizeClasses: {
+                    type: import('vue').PropType<string>;
+                    default: string;
+                };
+            }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+                name: {
+                    type: import('vue').PropType<string>;
+                    required: true;
+                };
+                size: {
+                    type: import('vue').PropType<"xs" | "small" | "medium" | "large" | "xl" | "2xl">;
+                    default: string;
+                };
+                sizeClasses: {
+                    type: import('vue').PropType<string>;
+                    default: string;
+                };
+            }>>, {
+                size: "xs" | "small" | "medium" | "large" | "xl" | "2xl";
+                sizeClasses: string;
+            }, {}>;
+            UiChip: {
+                new (...args: any[]): import('vue').CreateComponentPublicInstance<Readonly<import('vue').ExtractPropTypes<{
+                    size: {
+                        type: import('vue').PropType<"small" | "medium" | "big">;
+                        default: string;
+                    };
+                    cursorStyle: {
+                        type: import('vue').PropType<"text" | "default" | "pointer">;
+                        default: string;
+                    };
+                    isVisible: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                }>>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & Readonly<import('vue').ExtractPropTypes<{
+                    size: {
+                        type: import('vue').PropType<"small" | "medium" | "big">;
+                        default: string;
+                    };
+                    cursorStyle: {
+                        type: import('vue').PropType<"text" | "default" | "pointer">;
+                        default: string;
+                    };
+                    isVisible: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                }>>, {
+                    size: "small" | "medium" | "big";
+                    cursorStyle: "text" | "default" | "pointer";
+                    isVisible: boolean;
+                }, true, {}, {}, {
+                    P: {};
+                    B: {};
+                    D: {};
+                    C: {};
+                    M: {};
+                    Defaults: {};
+                }, Readonly<import('vue').ExtractPropTypes<{
+                    size: {
+                        type: import('vue').PropType<"small" | "medium" | "big">;
+                        default: string;
+                    };
+                    cursorStyle: {
+                        type: import('vue').PropType<"text" | "default" | "pointer">;
+                        default: string;
+                    };
+                    isVisible: {
+                        type: import('vue').PropType<boolean>;
+                        default: boolean;
+                    };
+                }>>, {}, {}, {}, {}, {
+                    size: "small" | "medium" | "big";
+                    cursorStyle: "text" | "default" | "pointer";
+                    isVisible: boolean;
+                }>;
+                __isFragment?: undefined;
+                __isTeleport?: undefined;
+                __isSuspense?: undefined;
+            } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+                size: {
+                    type: import('vue').PropType<"small" | "medium" | "big">;
+                    default: string;
+                };
+                cursorStyle: {
+                    type: import('vue').PropType<"text" | "default" | "pointer">;
+                    default: string;
+                };
+                isVisible: {
+                    type: import('vue').PropType<boolean>;
+                    default: boolean;
+                };
+            }>>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+                size: "small" | "medium" | "big";
+                cursorStyle: "text" | "default" | "pointer";
+                isVisible: boolean;
+            }, {}, string, {}> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+                $slots: {
+                    default?(_: {}): any;
+                };
+            });
+        };
+        setup(): {
+            args: any;
+        };
+        template: string;
+    };
+};