import { jsx as _jsx } from "react/jsx-runtime";
// packages/ui/src/components/layout/components/header/AppTitle.tsx
/**
 * @fileoverview AppTitle component
 * @description Simple app title using text-base styling
 *
 * @version 0.0.1
 * @since 0.0.1
 * @author AMBROISE PARK Consulting
 */
import { cn } from '@donotdev/components';
import { useAppConfig, useBreakpoint } from '@donotdev/core';
import { Link } from '../../../../routing/Link';
/**
 * AppTitle - Simple app title using text-base xl
 * Automatically gets app name from AppConfig if title not provided
 *
 * @version 0.0.1
 * @since 0.0.1
 * @author AMBROISE PARK Consulting
 */
export const AppTitle = ({ title, className, linkToHome = true, }) => {
    const isMobileOrTablet = useBreakpoint('isMobileOrTablet');
    const appName = useAppConfig('name');
    const appShortName = useAppConfig('shortName');
    const displayTitle = title || (isMobileOrTablet ? appShortName || appName : appName) || 'App';
    const content = (_jsx("div", { className: cn('dndev-text-base', className), style: {
            fontSize: 'var(--font-size-xl)',
            fontWeight: 700,
            overflow: 'hidden',
            textOverflow: 'ellipsis',
            whiteSpace: 'nowrap',
            maxWidth: '100%',
        }, children: displayTitle }));
    if (linkToHome) {
        return (_jsx(Link, { path: "/", className: cn('dndev-inline-block', className), children: content }));
    }
    return content;
};
export default AppTitle;
