import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
import { memo } from 'react';
import { useAtomValue } from 'jotai';
import { Markdown as MarkdownWrapper } from '@redocly/theme/components/Markdown/Markdown';
import { ExtensionValue, FieldLabel } from './index.js';
import { globalOptionsAtom } from '../../jotai/store.js';
import { styled } from '../../styled-components.js';
const Extension = styled(MarkdownWrapper) `
  margin: 2px 0;
`;
function ExtensionsComponent({ extensions }) {
    const { showExtensions } = useAtomValue(globalOptionsAtom);
    return showExtensions ? (_jsx("div", { children: Object.keys(extensions).map((key) => (_jsxs(Extension, { children: [_jsxs(FieldLabel, { children: [key.substring(2), ": "] }), ' ', _jsx(ExtensionValue, { children: typeof extensions[key] === 'string'
                        ? extensions[key]
                        : JSON.stringify(extensions[key]) })] }, key))) })) : null;
}
export const Extensions = memo(ExtensionsComponent);
//# sourceMappingURL=Extensions.js.map