import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from 'react';
import { Tag, ToggleButton } from '../common/index.js';
import { useTranslate } from '../../hooks/index.js';
const MAX_PATTERN_LENGTH = 45;
export function Pattern({ pattern }) {
    const translate = useTranslate();
    const [isPatternShown, setIsPatternShown] = useState(false);
    if (!pattern) {
        return null;
    }
    const togglePattern = () => {
        setIsPatternShown(!isPatternShown);
    };
    return (_jsxs(_Fragment, { children: [_jsx(Tag, { children: isPatternShown || pattern.length < MAX_PATTERN_LENGTH
                    ? pattern
                    : `${pattern.slice(0, MAX_PATTERN_LENGTH)}...` }), pattern.length > MAX_PATTERN_LENGTH && (_jsx(ToggleButton, { onClick: togglePattern, children: isPatternShown
                    ? translate('openapi.hidePattern', 'Hide pattern')
                    : translate('openapi.showPattern', 'Show pattern') }))] }));
}
//# sourceMappingURL=Pattern.js.map