import React__default from 'react';
import { CopyableText } from './CopyableText.mjs';
import { FlexBox } from '../shared/components/FlexBox.mjs';
import { Typography } from './Typography.mjs';

const SCIMFields = ({ fields, connection })=>{
    return /*#__PURE__*/ React__default.createElement(React__default.Fragment, null, fields?.map((field, index)=>{
        const label = field.label;
        const value = 'value' in field ? field.value : connection[field.scimConnectionKey];
        return /*#__PURE__*/ React__default.createElement(FlexBox, {
            gap: 0.5,
            flexDirection: "column",
            key: index
        }, /*#__PURE__*/ React__default.createElement(Typography, {
            variant: "body2",
            color: "secondary"
        }, label), field.isCopyable ? /*#__PURE__*/ React__default.createElement(CopyableText, null, value) : /*#__PURE__*/ React__default.createElement(Typography, {
            variant: "body2"
        }, value));
    }));
};

export { SCIMFields };
//# sourceMappingURL=ScimFields.mjs.map
