@nextcloud/vue 8.4.0 → 9.0.0-alpha.0

package/dist/src/components/NcAvatar/NcAvatar.vue.d.ts

@@ -0,0 +1,348 @@
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * Set a custom url to the avatar image
+     * either the url, user or displayName property must be defined
+     */
+    url: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Set a css icon-class for an icon to be used instead of the avatar.
+     */
+    iconClass: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Set the user id to fetch the avatar
+     * either the url, user or displayName property must be defined
+     */
+    user: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Whether or not to display the user-status
+     */
+    showUserStatus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Whether or not to the status-icon should be used instead of online/away
+     */
+    showUserStatusCompact: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * When the user status was preloaded via another source it can be handed in with this property to save the request.
+     * If this property is not set the status will be fetched automatically.
+     * If a preloaded no-status is available provide this object with properties "status", "icon" and "message" set to null.
+     */
+    preloadedUserStatus: {
+        type: ObjectConstructor;
+        default: undefined;
+    };
+    /**
+     * Is the user a guest user (then we have to user a different endpoint)
+     */
+    isGuest: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Set a display name that will be rendered as a tooltip
+     * either the url, user or displayName property must be defined
+     * specify just the displayname to generate a placeholder avatar without
+     * trying to fetch the avatar based on the user id
+     */
+    displayName: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Set a size in px for the rendered avatar
+     */
+    size: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Placeholder avatars will be automatically generated when this is set to true
+     */
+    allowPlaceholder: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Disable the tooltip
+     */
+    disableTooltip: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Disable the menu
+     */
+    disableMenu: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Declares a custom tooltip when not null
+     * Fallback will be the displayName
+     *
+     * requires disableTooltip not to be set to true
+     */
+    tooltipMessage: {
+        type: StringConstructor;
+        default: null;
+    };
+    /**
+     * Declares username is not a user's name, when true.
+     * Prevents loading user's avatar from server and forces generating colored initials,
+     * i.e. if the user is a group
+     */
+    isNoUser: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Selector for the popover menu container
+     */
+    menuContainer: {
+        type: (StringConstructor | BooleanConstructor | ObjectConstructor | {
+            new (): Element;
+            prototype: Element;
+        })[];
+        default: string;
+    };
+}, any, {
+    avatarUrlLoaded: null;
+    avatarSrcSetLoaded: null;
+    userDoesNotExist: boolean;
+    isAvatarLoaded: boolean;
+    isMenuLoaded: boolean;
+    contactsMenuLoading: boolean;
+    contactsMenuActions: never[];
+    contactsMenuOpenState: boolean;
+}, {
+    avatarAriaLabel(): string | undefined;
+    canDisplayUserStatus(): never;
+    showUserStatusIconOnAvatar(): never;
+    /**
+     * The user identifier, either the display name if set or the user property
+     * If both properties are not set an empty string is returned
+     */
+    userIdentifier(): "";
+    isUserDefined(): boolean;
+    isDisplayNameDefined(): boolean;
+    isUrlDefined(): boolean;
+    hasMenu(): boolean;
+    /**
+     * True if initials should be shown as the user icon fallback
+     */
+    showInitials(): never;
+    avatarStyle(): {
+        '--size': string;
+        lineHeight: string;
+        fontSize: string;
+    };
+    initialsWrapperStyle(): {
+        backgroundColor: string;
+    };
+    initialsStyle(): {
+        color: string;
+    };
+    tooltip(): null;
+    /**
+     * Get the (max. two) initials of the user as uppcase string
+     */
+    initials(): string;
+    menu(): {
+        href: any;
+        icon: any;
+        text: any;
+    }[];
+}, {
+    t: (original: string, placeholders?: Record<string, string | number> | undefined) => string;
+    handleUserStatusUpdated(state: any): void;
+    /**
+     * Toggle the popover menu on click or enter
+     * @param {KeyboardEvent|MouseEvent} event the UI event
+     */
+    toggleMenu(event: KeyboardEvent | MouseEvent): Promise<void>;
+    closeMenu(): void;
+    fetchContactsMenu(): Promise<void>;
+    /**
+     * Handle avatar loading if user or url defined
+     */
+    loadAvatarUrl(): void;
+    /**
+     * Generate an avatar url from the server's avatar endpoint
+     *
+     * @param {string} user the user id
+     * @param {number} size the desired size
+     * @return {string}
+     */
+    avatarUrlGenerator(user: string, size: number): string;
+    /**
+     * Check if the provided url is valid and update Avatar if so
+     *
+     * @param {string} url the avatar url
+     * @param {Array} srcset the avatar srcset
+     */
+    updateImageIfValid(url: string, srcset?: any[]): void;
+}, {
+    data(): {
+        hasStatus: boolean;
+        userStatus: {
+            status: null;
+            message: null;
+            icon: null;
+        };
+    };
+    methods: {
+        fetchUserStatus(userId: string): Promise<void>;
+    };
+}, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * Set a custom url to the avatar image
+     * either the url, user or displayName property must be defined
+     */
+    url: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Set a css icon-class for an icon to be used instead of the avatar.
+     */
+    iconClass: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Set the user id to fetch the avatar
+     * either the url, user or displayName property must be defined
+     */
+    user: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Whether or not to display the user-status
+     */
+    showUserStatus: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Whether or not to the status-icon should be used instead of online/away
+     */
+    showUserStatusCompact: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * When the user status was preloaded via another source it can be handed in with this property to save the request.
+     * If this property is not set the status will be fetched automatically.
+     * If a preloaded no-status is available provide this object with properties "status", "icon" and "message" set to null.
+     */
+    preloadedUserStatus: {
+        type: ObjectConstructor;
+        default: undefined;
+    };
+    /**
+     * Is the user a guest user (then we have to user a different endpoint)
+     */
+    isGuest: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Set a display name that will be rendered as a tooltip
+     * either the url, user or displayName property must be defined
+     * specify just the displayname to generate a placeholder avatar without
+     * trying to fetch the avatar based on the user id
+     */
+    displayName: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Set a size in px for the rendered avatar
+     */
+    size: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Placeholder avatars will be automatically generated when this is set to true
+     */
+    allowPlaceholder: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Disable the tooltip
+     */
+    disableTooltip: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Disable the menu
+     */
+    disableMenu: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Declares a custom tooltip when not null
+     * Fallback will be the displayName
+     *
+     * requires disableTooltip not to be set to true
+     */
+    tooltipMessage: {
+        type: StringConstructor;
+        default: null;
+    };
+    /**
+     * Declares username is not a user's name, when true.
+     * Prevents loading user's avatar from server and forces generating colored initials,
+     * i.e. if the user is a group
+     */
+    isNoUser: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Selector for the popover menu container
+     */
+    menuContainer: {
+        type: (StringConstructor | BooleanConstructor | ObjectConstructor | {
+            new (): Element;
+            prototype: Element;
+        })[];
+        default: string;
+    };
+}>>, {
+    size: number;
+    url: string;
+    user: string;
+    iconClass: string;
+    showUserStatus: boolean;
+    showUserStatusCompact: boolean;
+    preloadedUserStatus: Record<string, any>;
+    isGuest: boolean;
+    displayName: string;
+    allowPlaceholder: boolean;
+    disableTooltip: boolean;
+    disableMenu: boolean;
+    tooltipMessage: string;
+    isNoUser: boolean;
+    menuContainer: string | boolean | Element | Record<string, any>;
+}, {}>;
+export default _default;

package/dist/src/components/NcBreadcrumb/NcBreadcrumb.vue.d.ts

@@ -0,0 +1,197 @@
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * The main text content of the entry.
+     */
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * The title attribute of the element.
+     */
+    title: {
+        type: StringConstructor;
+        default: null;
+    };
+    /**
+     * Route Location the link should navigate to when clicked on.
+     *
+     * @see https://v3.router.vuejs.org/api/#to
+     */
+    to: {
+        type: (StringConstructor | ObjectConstructor)[];
+        default: undefined;
+    };
+    /**
+     * Set this prop if your app doesn't use vue-router, breadcrumbs will show as normal links.
+     */
+    href: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Set a css icon-class to show an icon instead of the name text.
+     */
+    icon: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Disable dropping on this breadcrumb.
+     */
+    disableDrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Force the actions to display in a three dot menu
+     */
+    forceMenu: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Open state of the Actions menu
+     */
+    open: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * CSS class to apply to the root element.
+     */
+    class: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: string;
+    };
+}, any, {
+    /**
+     * Variable to track if we hover over the breadcrumb
+     */
+    hovering: boolean;
+    /**
+     * The unique id of the breadcrumb. Necessary to append the
+     * Actions menu to the correct crumb.
+     */
+    crumbId: string;
+}, {
+    /**
+     * The attributes to pass to `router-link` or `a`
+     */
+    linkAttributes(): {
+        [x: string]: unknown;
+    } | {
+        to: any;
+    } | {
+        href: any;
+    };
+}, {
+    /**
+     * Function to handle changing the open state of the Actions menu
+     * $emit the open state.
+     *
+     * @param {boolean} open The open state of the Actions menu
+     */
+    onOpenChange(open: boolean): void;
+    /**
+     * Function to handle a drop on the breadcrumb.
+     * $emit the event and the path, remove the hovering state.
+     *
+     * @param {object} e The drop event
+     * @return {boolean}
+     */
+    dropped(e: object): boolean;
+    /**
+     * Add the hovering state on drag enter
+     *
+     * @param {DragEvent} e The drag-enter event
+     */
+    dragEnter(e: DragEvent): void;
+    /**
+     * Remove the hovering state on drag leave
+     *
+     * @param {DragEvent} e The drag leave event
+     */
+    dragLeave(e: DragEvent): void;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("dragenter" | "dragleave" | "update:open" | "dropped")[], "dragenter" | "dragleave" | "update:open" | "dropped", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * The main text content of the entry.
+     */
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * The title attribute of the element.
+     */
+    title: {
+        type: StringConstructor;
+        default: null;
+    };
+    /**
+     * Route Location the link should navigate to when clicked on.
+     *
+     * @see https://v3.router.vuejs.org/api/#to
+     */
+    to: {
+        type: (StringConstructor | ObjectConstructor)[];
+        default: undefined;
+    };
+    /**
+     * Set this prop if your app doesn't use vue-router, breadcrumbs will show as normal links.
+     */
+    href: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /**
+     * Set a css icon-class to show an icon instead of the name text.
+     */
+    icon: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Disable dropping on this breadcrumb.
+     */
+    disableDrop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Force the actions to display in a three dot menu
+     */
+    forceMenu: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Open state of the Actions menu
+     */
+    open: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * CSS class to apply to the root element.
+     */
+    class: {
+        type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+        default: string;
+    };
+}>> & {
+    onDragenter?: ((...args: any[]) => any) | undefined;
+    onDragleave?: ((...args: any[]) => any) | undefined;
+    "onUpdate:open"?: ((...args: any[]) => any) | undefined;
+    onDropped?: ((...args: any[]) => any) | undefined;
+}, {
+    icon: string;
+    title: string;
+    class: string | Record<string, any> | unknown[];
+    href: string;
+    to: string | Record<string, any>;
+    open: boolean;
+    forceMenu: boolean;
+    disableDrop: boolean;
+}, {}>;
+export default _default;

package/dist/src/components/NcBreadcrumbs/NcBreadcrumbs.vue.d.ts

@@ -0,0 +1,145 @@
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * Set a css icon-class for the icon of the root breadcrumb to be used.
+     */
+    rootIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Set the aria-label of the nav element.
+     */
+    ariaLabel: {
+        type: StringConstructor;
+        default: null;
+    };
+}, any, {
+    /**
+     * Array to track the hidden breadcrumbs by their index.
+     * Comparing two crumbs somehow does not work, so we use the indices.
+     */
+    hiddenIndices: never[];
+    /**
+     * This is the props of the middle Action menu
+     * that show the ellipsised breadcrumbs
+     */
+    menuBreadcrumbProps: {
+        name: string;
+        forceMenu: boolean;
+        disableDrop: boolean;
+        open: boolean;
+    };
+    breadcrumbsRefs: {};
+}, {}, {
+    /**
+     * Close the actions menu
+     *
+     * @param {object} e The event
+     */
+    closeActions(e: object): void;
+    /**
+     * Call the resize function after a delay
+     */
+    delayedResize(): Promise<void>;
+    /**
+     * Check the width of the breadcrumb and hide breadcrumbs
+     * if we overflow otherwise.
+     */
+    handleWindowResize(): void;
+    /**
+     * Checks if two arrays are equal.
+     * Only works for primitive arrays, but that's enough here.
+     *
+     * @param {Array} a The first array
+     * @param {Array} b The second array
+     * @return {boolean} Wether the arrays are equal
+     */
+    arraysEqual(a: any[], b: any[]): boolean;
+    /**
+     * Calculates the total width of all breadcrumbs
+     *
+     * @param {Array} breadcrumbs All breadcrumbs
+     * @return {number} The total width
+     */
+    getTotalWidth(breadcrumbs: any[]): number;
+    /**
+     * Calculates the width of the provided element
+     *
+     * @param {object} el The element
+     * @param {boolean} isLast Is this the last crumb
+     * @return {number} The width
+     */
+    getWidth(el: object, isLast: boolean): number;
+    /**
+     * Prevents the default of a provided event
+     *
+     * @param {object} e The event
+     * @return {boolean}
+     */
+    preventDefault(e: object): boolean;
+    /**
+     * Handles the drag start.
+     * Prevents a breadcrumb from being draggable.
+     *
+     * @param {object} e The event
+     * @return {boolean}
+     */
+    dragStart(e: object): boolean;
+    /**
+     * Handles when something is dropped on the breadcrumb.
+     *
+     * @param {object} e The drop event
+     * @param {string} path The path of the breadcrumb
+     * @param {boolean} disabled Whether dropping is disabled for this breadcrumb
+     * @return {boolean}
+     */
+    dropped(e: object, path: string, disabled: boolean): boolean;
+    /**
+     * Handles the drag over event
+     *
+     * @param {object} e The drag over event
+     * @return {boolean}
+     */
+    dragOver(e: object): boolean;
+    /**
+     * Handles the drag enter event
+     *
+     * @param {object} e The drag over event
+     * @param {boolean} disabled Whether dropping is disabled for this breadcrumb
+     */
+    dragEnter(e: object, disabled: boolean): void;
+    /**
+     * Handles the drag leave event
+     *
+     * @param {object} e The drag leave event
+     * @param {boolean} disabled Whether dropping is disabled for this breadcrumb
+     */
+    dragLeave(e: object, disabled: boolean): void;
+    /**
+     * Check for each crumb if we have to hide it and
+     * add it to the array of all crumbs.
+     */
+    hideCrumbs(): void;
+    isBreadcrumb(vnode: any): boolean;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "dropped"[], "dropped", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * Set a css icon-class for the icon of the root breadcrumb to be used.
+     */
+    rootIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Set the aria-label of the nav element.
+     */
+    ariaLabel: {
+        type: StringConstructor;
+        default: null;
+    };
+}>> & {
+    onDropped?: ((...args: any[]) => any) | undefined;
+}, {
+    ariaLabel: string;
+    rootIcon: string;
+}, {}>;
+export default _default;