@ghentcdh/ui 1.0.1 → 1.0.3

package/form/select/SelectWrapper.vue.d.ts

@@ -0,0 +1,408 @@
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        selectWrapperRef: HTMLDivElement;
+        listResultsRef: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+            options: {
+                type: import('vue').PropType<Array<import('./ListResults.properties').OptionValue>>;
+                required: false;
+            };
+            isLoading: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            query: {
+                type: StringConstructor;
+                default: null;
+            };
+            isActive: {
+                type: FunctionConstructor;
+                default: (item: any) => boolean;
+            };
+        }>> & Readonly<{}>, {
+            handleKeydown: (e: KeyboardEvent) => void;
+        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+            isActive: Function;
+            query: string;
+            isLoading: boolean;
+        }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+            listRef: HTMLUListElement;
+        }, HTMLUListElement, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('vue').ExtractPropTypes<{
+            options: {
+                type: import('vue').PropType<Array<import('./ListResults.properties').OptionValue>>;
+                required: false;
+            };
+            isLoading: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            query: {
+                type: StringConstructor;
+                default: null;
+            };
+            isActive: {
+                type: FunctionConstructor;
+                default: (item: any) => boolean;
+            };
+        }>> & Readonly<{}>, {
+            handleKeydown: (e: KeyboardEvent) => void;
+        }, {}, {}, {}, {
+            isActive: Function;
+            query: string;
+            isLoading: boolean;
+        }> | null;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    isOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isActive: {
+        type: FunctionConstructor;
+        default: (item: any) => boolean;
+    };
+    options: {
+        type: import('vue').PropType<Array<any>>;
+        required: true;
+    };
+    labelKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    valueKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    enableCreate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    id: {
+        type: StringConstructor;
+    };
+    placeholder: {
+        type: StringConstructor;
+    };
+    description: {
+        type: StringConstructor;
+    };
+    errors: {
+        type: StringConstructor;
+    };
+    label: {
+        type: StringConstructor;
+    };
+    visible: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isFocused: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isTouched: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    styles: {
+        type: import('vue').PropType<import('..').MyStyles>;
+        default: () => {
+            readonly group: {
+                readonly root: "group";
+                readonly label: "text-primary text-lg font-bold";
+                readonly item: "group-item";
+            };
+            readonly verticalLayout: {
+                readonly root: "flex flex-col gap-x-2";
+                readonly item: "w-full";
+            };
+            readonly horizontalLayout: {
+                readonly root: "flex flex-row gap-x-2";
+                readonly item: "w-full";
+            };
+            readonly arrayList: {
+                readonly root: "fieldset";
+                readonly legend: "fieldset-legend text-xl capitalize";
+            };
+            readonly control: {
+                readonly root: "fieldset";
+                readonly wrapper: "fieldset";
+                readonly label: "fieldset-legend";
+                readonly error: "";
+                readonly input: "input";
+                readonly textarea: "input h-32";
+                readonly checkbox: "checkbox";
+                readonly select: "input pr-14";
+                readonly description: "form-control--description label text-xs text-gray-500";
+            };
+            readonly fixedArrayList: {
+                readonly root: "flex flex-row gap-x-2";
+                readonly item: "w-full";
+            };
+        };
+    };
+    width: {
+        type: StringConstructor;
+        default: string;
+    };
+    isLoading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    query: {
+        type: StringConstructor;
+        default: null;
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    isOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isActive: {
+        type: FunctionConstructor;
+        default: (item: any) => boolean;
+    };
+    options: {
+        type: import('vue').PropType<Array<any>>;
+        required: true;
+    };
+    labelKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    valueKey: {
+        type: StringConstructor;
+        default: string;
+    };
+    enableCreate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    id: {
+        type: StringConstructor;
+    };
+    placeholder: {
+        type: StringConstructor;
+    };
+    description: {
+        type: StringConstructor;
+    };
+    errors: {
+        type: StringConstructor;
+    };
+    label: {
+        type: StringConstructor;
+    };
+    visible: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isFocused: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isTouched: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    styles: {
+        type: import('vue').PropType<import('..').MyStyles>;
+        default: () => {
+            readonly group: {
+                readonly root: "group";
+                readonly label: "text-primary text-lg font-bold";
+                readonly item: "group-item";
+            };
+            readonly verticalLayout: {
+                readonly root: "flex flex-col gap-x-2";
+                readonly item: "w-full";
+            };
+            readonly horizontalLayout: {
+                readonly root: "flex flex-row gap-x-2";
+                readonly item: "w-full";
+            };
+            readonly arrayList: {
+                readonly root: "fieldset";
+                readonly legend: "fieldset-legend text-xl capitalize";
+            };
+            readonly control: {
+                readonly root: "fieldset";
+                readonly wrapper: "fieldset";
+                readonly label: "fieldset-legend";
+                readonly error: "";
+                readonly input: "input";
+                readonly textarea: "input h-32";
+                readonly checkbox: "checkbox";
+                readonly select: "input pr-14";
+                readonly description: "form-control--description label text-xs text-gray-500";
+            };
+            readonly fixedArrayList: {
+                readonly root: "flex flex-row gap-x-2";
+                readonly item: "w-full";
+            };
+        };
+    };
+    width: {
+        type: StringConstructor;
+        default: string;
+    };
+    isLoading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    query: {
+        type: StringConstructor;
+        default: null;
+    };
+}>> & Readonly<{}>, {
+    required: boolean;
+    isActive: Function;
+    query: string;
+    width: string;
+    labelKey: string;
+    valueKey: string;
+    styles: {
+        readonly group: {
+            readonly root: "group";
+            readonly label: "text-primary text-lg font-bold";
+            readonly item: "group-item";
+        };
+        readonly verticalLayout: {
+            readonly root: "flex flex-col gap-x-2";
+            readonly item: "w-full";
+        };
+        readonly horizontalLayout: {
+            readonly root: "flex flex-row gap-x-2";
+            readonly item: "w-full";
+        };
+        readonly arrayList: {
+            readonly root: "fieldset";
+            readonly legend: "fieldset-legend text-xl capitalize";
+        };
+        readonly control: {
+            readonly root: "fieldset";
+            readonly wrapper: "fieldset";
+            readonly label: "fieldset-legend";
+            readonly error: "";
+            readonly input: "input";
+            readonly textarea: "input h-32";
+            readonly checkbox: "checkbox";
+            readonly select: "input pr-14";
+            readonly description: "form-control--description label text-xs text-gray-500";
+        };
+        readonly fixedArrayList: {
+            readonly root: "flex flex-row gap-x-2";
+            readonly item: "w-full";
+        };
+    };
+    hideLabel: boolean;
+    enableCreate: boolean;
+    isLoading: boolean;
+    isTouched: boolean;
+    visible: boolean;
+    enabled: boolean;
+    isFocused: boolean;
+    isOpen: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
+    selectWrapperRef: HTMLDivElement;
+    listResultsRef: import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        options: {
+            type: import('vue').PropType<Array<import('./ListResults.properties').OptionValue>>;
+            required: false;
+        };
+        isLoading: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        query: {
+            type: StringConstructor;
+            default: null;
+        };
+        isActive: {
+            type: FunctionConstructor;
+            default: (item: any) => boolean;
+        };
+    }>> & Readonly<{}>, {
+        handleKeydown: (e: KeyboardEvent) => void;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        isActive: Function;
+        query: string;
+        isLoading: boolean;
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        listRef: HTMLUListElement;
+    }, HTMLUListElement, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        options: {
+            type: import('vue').PropType<Array<import('./ListResults.properties').OptionValue>>;
+            required: false;
+        };
+        isLoading: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        query: {
+            type: StringConstructor;
+            default: null;
+        };
+        isActive: {
+            type: FunctionConstructor;
+            default: (item: any) => boolean;
+        };
+    }>> & Readonly<{}>, {
+        handleKeydown: (e: KeyboardEvent) => void;
+    }, {}, {}, {}, {
+        isActive: Function;
+        query: string;
+        isLoading: boolean;
+    }> | null;
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/form/select/composables/useOptions.d.ts

@@ -0,0 +1,19 @@
+import { Ref } from 'vue';
+import { OptionValue } from '../ListResults.properties';
+type OptionsProperties = {
+    labelKey: string;
+    valueKey: string;
+};
+export declare const getLabel: (item: any, props: OptionsProperties) => any;
+export declare const getValue: (item: any, props: OptionsProperties) => any;
+type OptionsStrategy<ITEM> = {
+    options: Ref<OptionValue[]>;
+    setOptions: (options: ITEM[] | undefined) => void;
+    getOption: (options: ITEM) => OptionValue | undefined;
+    getOriginal: (options: OptionValue) => ITEM | undefined;
+    getOriginals: (...options: OptionValue[]) => ITEM[];
+    getLabels: (...options: ITEM[]) => string[];
+    getValues: (...options: ITEM[]) => string[];
+};
+export declare const useOptions: <ITEM = any>(props: OptionsProperties) => OptionsStrategy<ITEM>;
+export {};

package/form/select/composables/useSearch.d.ts

@@ -0,0 +1,6 @@
+export declare function useAutoCompleteSearch(props: any): {
+    results: import('vue').Ref<any[] | undefined, any[] | undefined>;
+    isLoading: import('vue').Ref<boolean | undefined, boolean | undefined>;
+    triggerSearch: (query: string) => void;
+    clear: () => void;
+};

package/form/text/Markdown.vue.d.ts

@@ -0,0 +1,234 @@
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    width: {
+        type: StringConstructor;
+        default: string;
+    };
+    minHeight: {
+        type: StringConstructor;
+        default: string;
+    };
+    actions: {
+        type: import('vue').PropType<import('./MarkdownComponent.properties').ToolbarAction[]>;
+        default: () => import('./MarkdownComponent.properties').ToolbarAction[];
+    };
+    id: {
+        type: StringConstructor;
+    };
+    placeholder: {
+        type: StringConstructor;
+    };
+    description: {
+        type: StringConstructor;
+    };
+    errors: {
+        type: StringConstructor;
+    };
+    label: {
+        type: StringConstructor;
+    };
+    visible: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isFocused: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isTouched: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    styles: {
+        type: import('vue').PropType<import('..').MyStyles>;
+        default: () => {
+            readonly group: {
+                readonly root: "group";
+                readonly label: "text-primary text-lg font-bold";
+                readonly item: "group-item";
+            };
+            readonly verticalLayout: {
+                readonly root: "flex flex-col gap-x-2";
+                readonly item: "w-full";
+            };
+            readonly horizontalLayout: {
+                readonly root: "flex flex-row gap-x-2";
+                readonly item: "w-full";
+            };
+            readonly arrayList: {
+                readonly root: "fieldset";
+                readonly legend: "fieldset-legend text-xl capitalize";
+            };
+            readonly control: {
+                readonly root: "fieldset";
+                readonly wrapper: "fieldset";
+                readonly label: "fieldset-legend";
+                readonly error: "";
+                readonly input: "input";
+                readonly textarea: "input h-32";
+                readonly checkbox: "checkbox";
+                readonly select: "input pr-14";
+                readonly description: "form-control--description label text-xs text-gray-500";
+            };
+            readonly fixedArrayList: {
+                readonly root: "flex flex-row gap-x-2";
+                readonly item: "w-full";
+            };
+        };
+    };
+    modelValue: {
+        type: import('vue').PropType<any>;
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: any) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    width: {
+        type: StringConstructor;
+        default: string;
+    };
+    minHeight: {
+        type: StringConstructor;
+        default: string;
+    };
+    actions: {
+        type: import('vue').PropType<import('./MarkdownComponent.properties').ToolbarAction[]>;
+        default: () => import('./MarkdownComponent.properties').ToolbarAction[];
+    };
+    id: {
+        type: StringConstructor;
+    };
+    placeholder: {
+        type: StringConstructor;
+    };
+    description: {
+        type: StringConstructor;
+    };
+    errors: {
+        type: StringConstructor;
+    };
+    label: {
+        type: StringConstructor;
+    };
+    visible: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isFocused: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    isTouched: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    styles: {
+        type: import('vue').PropType<import('..').MyStyles>;
+        default: () => {
+            readonly group: {
+                readonly root: "group";
+                readonly label: "text-primary text-lg font-bold";
+                readonly item: "group-item";
+            };
+            readonly verticalLayout: {
+                readonly root: "flex flex-col gap-x-2";
+                readonly item: "w-full";
+            };
+            readonly horizontalLayout: {
+                readonly root: "flex flex-row gap-x-2";
+                readonly item: "w-full";
+            };
+            readonly arrayList: {
+                readonly root: "fieldset";
+                readonly legend: "fieldset-legend text-xl capitalize";
+            };
+            readonly control: {
+                readonly root: "fieldset";
+                readonly wrapper: "fieldset";
+                readonly label: "fieldset-legend";
+                readonly error: "";
+                readonly input: "input";
+                readonly textarea: "input h-32";
+                readonly checkbox: "checkbox";
+                readonly select: "input pr-14";
+                readonly description: "form-control--description label text-xs text-gray-500";
+            };
+            readonly fixedArrayList: {
+                readonly root: "flex flex-row gap-x-2";
+                readonly item: "w-full";
+            };
+        };
+    };
+    modelValue: {
+        type: import('vue').PropType<any>;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+}>, {
+    required: boolean;
+    width: string;
+    actions: import('./MarkdownComponent.properties').ToolbarAction[];
+    styles: {
+        readonly group: {
+            readonly root: "group";
+            readonly label: "text-primary text-lg font-bold";
+            readonly item: "group-item";
+        };
+        readonly verticalLayout: {
+            readonly root: "flex flex-col gap-x-2";
+            readonly item: "w-full";
+        };
+        readonly horizontalLayout: {
+            readonly root: "flex flex-row gap-x-2";
+            readonly item: "w-full";
+        };
+        readonly arrayList: {
+            readonly root: "fieldset";
+            readonly legend: "fieldset-legend text-xl capitalize";
+        };
+        readonly control: {
+            readonly root: "fieldset";
+            readonly wrapper: "fieldset";
+            readonly label: "fieldset-legend";
+            readonly error: "";
+            readonly input: "input";
+            readonly textarea: "input h-32";
+            readonly checkbox: "checkbox";
+            readonly select: "input pr-14";
+            readonly description: "form-control--description label text-xs text-gray-500";
+        };
+        readonly fixedArrayList: {
+            readonly root: "flex flex-row gap-x-2";
+            readonly item: "w-full";
+        };
+    };
+    hideLabel: boolean;
+    minHeight: string;
+    isTouched: boolean;
+    visible: boolean;
+    enabled: boolean;
+    isFocused: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLFieldSetElement>;
+export default _default;