@redocly/theme
Version:
Shared UI components lib
77 lines (75 loc) • 4.09 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.CatalogEntityProperties = CatalogEntityProperties;
const react_1 = __importDefault(require("react"));
const styled_components_1 = __importDefault(require("styled-components"));
const EntityTypeProperty_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/EntityTypeProperty");
const GitProperty_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/GitProperty");
const TagsProperty_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/TagsProperty");
const UserEmailProperty_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/UserEmailProperty");
const DomainsProperty_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/DomainsProperty");
const OwnersProperty_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/OwnersProperty");
const ContactProperty_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/ContactProperty");
const FormatProperty_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/FormatProperty");
const core_1 = require("../../../../core");
const propertyRenderers = [
{
key: 'type',
condition: (entity) => !!entity.type,
component: EntityTypeProperty_1.EntityTypeProperty,
},
{
key: 'format',
condition: (entity) => { var _a; return entity.type === 'data-schema' && !!((_a = entity.metadata) === null || _a === void 0 ? void 0 : _a.specType); },
component: FormatProperty_1.FormatProperty,
},
{
key: 'contact',
condition: (entity) => { var _a, _b; return !!((_b = (_a = entity.contact) === null || _a === void 0 ? void 0 : _a.slack) === null || _b === void 0 ? void 0 : _b.channels); },
component: ContactProperty_1.ContactProperty,
},
{
key: 'git',
condition: (entity) => !!entity.git,
component: GitProperty_1.GitProperty,
},
{
key: 'tags',
condition: (entity) => { var _a; return !!((_a = entity.tags) === null || _a === void 0 ? void 0 : _a.length); },
component: TagsProperty_1.TagsProperty,
},
{
key: 'user-email',
condition: (entity) => { var _a; return entity.type === 'user' && !!((_a = entity.metadata) === null || _a === void 0 ? void 0 : _a.email); },
component: UserEmailProperty_1.UserEmailProperty,
},
{
key: 'domains',
condition: (entity) => { var _a, _b; return ((_b = (_a = entity.domains) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0; },
component: DomainsProperty_1.DomainsProperty,
},
{
key: 'owners',
condition: (entity) => { var _a, _b; return ((_b = (_a = entity.owners) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0; },
component: OwnersProperty_1.OwnersProperty,
},
];
function CatalogEntityProperties({ entity }) {
const renderers = propertyRenderers.filter((renderer) => renderer.condition(entity));
return (react_1.default.createElement(CatalogEntityPropertiesGridWrapper, { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityProperties" }, renderers.map((renderer) => (react_1.default.createElement(renderer.component, { key: renderer.key + entity.id, entity: entity })))));
}
const CatalogEntityPropertiesGridWrapper = styled_components_1.default.div `
display: grid;
gap: var(--spacing-base);
grid-template-columns: 1fr;
@media screen and (min-width: ${core_1.breakpoints.small}) {
grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: ${core_1.breakpoints.max}) {
grid-template-columns: repeat(3, 1fr);
}
`;
//# sourceMappingURL=CatalogEntityProperties.js.map