import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cx from "classnames";
import { Bubble } from "../Bubble/Bubble.js";
import { BubbleHoverTrigger } from "../Bubble/BubbleHoverTrigger.js";
import { Button } from "../Button/Button.js";
const DEFAULT_ALIGN_POINT_TITLE_TOOLTIP = [{ align: "cr cl" }, { align: "bl tl" }, { align: "bc tc" }];
const DEFAULT_ALIGN_POINT_ACTION_TOOLTIP = [{ align: "cl cr" }, { align: "bc tc" }];
const getActionElement = (actionType, value, isDisableAction, onActionCallback) => {
    switch (actionType) {
        case "LinkButton":
            return (_jsx(Button, { className: "gd-button-link-dimmed", value: value, disabled: isDisableAction, onClick: onActionCallback }));
        case "Switcher":
            return (_jsxs("label", { className: "input-checkbox-toggle", children: [
                    _jsx("input", { type: "checkbox", checked: value, disabled: isDisableAction, onChange: onActionCallback, className: `s-checkbox-toggle ${isDisableAction ? "s-disabled" : "s-enabled"}` }), _jsx("span", { className: "input-label-text" })
                ] }));
        default:
            return (_jsx(Button, { className: "gd-button-secondary gd-button-small", value: value, disabled: isDisableAction, onClick: onActionCallback }));
    }
};
/**
 * @internal
 */
export function SettingItem({ className, title, titleTooltipText, alignPointTitleTooltip, value, actionType, actionValue, hasDivider, isLoading, isDisableAction, actionTooltipText, alignPointActionTooltip, onAction, renderSubtitle, titleTooltipHideDelay = 0, }) {
    return (_jsxs("div", { className: cx(className, "gd-setting-item-container", { divider: hasDivider }), children: [
            _jsxs("div", { className: "gd-setting-item-title", children: [
                    _jsx("span", { className: "title", children: title }), titleTooltipText ? (_jsxs(BubbleHoverTrigger, { hideDelay: titleTooltipHideDelay, children: [
                            _jsx("span", { className: "icon-circle-question gd-icon-circle-question" }), _jsx(Bubble, { className: cx(className, "bubble-primary"), alignPoints: alignPointTitleTooltip || DEFAULT_ALIGN_POINT_TITLE_TOOLTIP, children: titleTooltipText })
                        ] })) : null, renderSubtitle?.()] }), _jsxs("div", { className: "gd-setting-item-state", children: [isLoading ? _jsx("span", { className: cx("gd-spinner middle") }) : null, !isLoading && (_jsxs(_Fragment, { children: [
                            _jsx("div", { className: "gd-setting-item-value", children: value }), _jsx("div", { className: "gd-setting-item-action", children: _jsxs(BubbleHoverTrigger, { children: [getActionElement(actionType, actionValue, isDisableAction ?? false, onAction), actionTooltipText ? (_jsx(Bubble, { className: cx(className, "bubble-primary"), alignPoints: alignPointActionTooltip || DEFAULT_ALIGN_POINT_ACTION_TOOLTIP, children: actionTooltipText })) : null] }) })
                        ] }))] })
        ] }));
}
