import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { PanelHeader } from '@redocly/theme/components/Panel/PanelHeader';
import { Badge } from '@redocly/theme/components/Badge/Badge';
import { Trigger } from '../Panel/index.js';
import { HttpVerb } from '../common/index.js';
import { makeDeepLink } from '../../services/index.js';
import { shortenHTTPVerb } from '../../utils/index.js';
import { CallbackTitle } from './styled.js';
import { CircleIcon } from '../PropertyDetails/PlusCircleIcon.js';
import { LinkToField } from '../common/LinkToField.js';
import { styled } from '../../styled-components.js';
export function CallbackSummary({ expanded = false, toggle, callback: { name, httpVerb, deprecated, callbackId, id }, translate, }) {
    return (_jsxs(CallbackHeader, { expanded: expanded, onClick: toggle, children: [_jsx(LinkToField, { to: makeDeepLink(id, `callbacks/${callbackId}`) }), _jsxs(Trigger, { children: [_jsx(CircleIconWrap, { children: _jsx(CircleIcon, { sign: expanded ? '-' : '+' }) }), _jsx(CallbackTitle, { deprecated: deprecated, children: name }), _jsx(HttpVerb, { color: httpVerb, children: shortenHTTPVerb(httpVerb) }), deprecated ? (_jsx(Badge, { deprecated: true, children: translate('openapi.badges.deprecated', 'Deprecated') })) : null] })] }));
}
const CallbackHeader = styled(PanelHeader) `
  padding: var(--spacing-sm) 0 var(--spacing-sm) calc(var(--spacing-unit) / 2);
  margin: 0;
  line-height: var(--line-height-base);
  position: relative;
`;
const CircleIconWrap = styled.button `
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 0;
  gap: var(--spacing-xxs);
  color: var(--text-color-secondary);
  font-size: var(--font-size-base);
  font-family: var(--font-family-base);
  line-height: var(--line-height-base);
`;
//# sourceMappingURL=CallbackSummary.js.map