"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.HttpOperation = void 0;
const tslib_1 = require("tslib");
const react_error_boundary_1 = require("@stoplight/react-error-boundary");
const ui_kit_1 = require("@stoplight/ui-kit");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const React = tslib_1.__importStar(require("react"));
const constants_1 = require("../../../constants");
const MarkdownViewer_1 = require("../../MarkdownViewer");
const Request_1 = require("./Request");
const Responses_1 = require("./Responses");
const HttpOperationComponent = React.memo(({ className, data }) => {
    const color = constants_1.HttpMethodColors[data.method] || 'gray';
    return (React.createElement("div", { className: classnames_1.default('HttpOperation', className) },
        React.createElement("h2", { className: classnames_1.default(ui_kit_1.Classes.HEADING, 'flex items-center mb-10') },
            React.createElement("div", { className: classnames_1.default(`uppercase mr-5 font-semibold border rounded py-1 px-2`, `text-${color}`, `border-${color}`) }, data.method || 'UNKNOWN'),
            data.path && React.createElement("div", { className: "flex-1 font-medium text-gray-6 dark:text-gray-3 break-all" }, data.path)),
        React.createElement(MarkdownViewer_1.MarkdownViewer, { className: "HttpOperation__Description mb-10 ml-1", markdown: data.description || '*No description.*' }),
        React.createElement(Request_1.Request, { request: data.request, security: data.security }),
        data.responses && React.createElement(Responses_1.Responses, { responses: data.responses })));
});
HttpOperationComponent.displayName = 'HttpOperation.Component';
exports.HttpOperation = react_error_boundary_1.withErrorBoundary(HttpOperationComponent, {
    recoverableProps: ['data'],
});
//# sourceMappingURL=index.js.map