import * as React from "react";
import { useFavorites } from "../../hooks/useFavorites";
import { onClickA11y } from "../utils";
/**
 * Creates a clickable "favorite" that coordinates with the toolbar's pinned <FavoritesShell>.
 * @param {string} [className] - An optional CSS className to append.
 * @param {string} [id] - The unique identifier for the favorite item. This must be consistent across restarts.
 * @param {string} [category] - "Workspace" | "Application". The catagory of the favorite item. Currenly only workspaces and launchable Finsemble applications can be favorited.
 * @param {string} [name] - The name of the favorite item. This will be used for display in the FavoriteShell.
 * @param {IconDescriptor} [icon] - The icon of the favorite item. This displays in the FavoriteShell. It defaults to use the initials of the `name` field as its content.
 */
export const FavoriteMaker = ({ id, category, icon, name, children, className = "", style }) => {
    const { isFavorited, addFavorite, removeFavorite } = useFavorites();
    const isCurrentlyFavorited = isFavorited(name);
    // If no icon is specified then default to an avatar based on initials
    const definitiveIcon = icon !== null && icon !== void 0 ? icon : {
        imageType: "initials",
        name: name,
        category: category,
    };
    const toggleFavorite = (e) => {
        definitiveIcon;
        e.preventDefault();
        e.stopPropagation();
        if (isFavorited(id)) {
            removeFavorite(id);
        }
        else {
            addFavorite({
                id,
                category,
                name,
                icon: definitiveIcon,
            });
        }
    };
    const active = isCurrentlyFavorited ? "favorited" : "not-favorited";
    const classes = `favorite-maker ${active} ${className}`;
    const title = isCurrentlyFavorited ? "Unfavorite" : "Favorite";
    return (React.createElement("div", { role: "button", ...onClickA11y(toggleFavorite), className: classes, style: style, title: title }, children || React.createElement("i", { className: "ff-favorite" })));
};
//# sourceMappingURL=FavoriteMaker.js.map