@redocly/theme
Version:
Shared UI components lib
53 lines • 3.42 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.CatalogEntityIcon = CatalogEntityIcon;
const react_1 = __importDefault(require("react"));
const CodeIcon_1 = require("../../icons/CodeIcon/CodeIcon");
const GraphIcon_1 = require("../../icons/GraphIcon/GraphIcon");
const PeopleIcon_1 = require("../../icons/PeopleIcon/PeopleIcon");
const UserIcon_1 = require("../../icons/UserIcon/UserIcon");
const MoleculesIcon_1 = require("../../icons/MoleculesIcon/MoleculesIcon");
const HierarchyIcon_1 = require("../../icons/HierarchyIcon/HierarchyIcon");
const Image_1 = require("../../components/Image/Image");
const core_1 = require("../../core");
const NoteIcon_1 = require("../../icons/NoteIcon/NoteIcon");
const CubeIcon_1 = require("../../icons/CubeIcon/CubeIcon");
const getIconColor = (entityType) => `var(--catalog-entity-icon-color-${entityType})`;
const getEntityIcon = ({ entityType, defaultColor, forceColor, entitiesCatalogConfig, }) => {
var _a, _b;
if (core_1.PREDEFINED_ENTITY_TYPES.includes(entityType)) {
const iconColor = forceColor !== null && forceColor !== void 0 ? forceColor : (defaultColor ? `var(--catalog-entity-icon-color)` : getIconColor(entityType));
const entityIconMap = {
service: react_1.default.createElement(CodeIcon_1.CodeIcon, { color: iconColor }),
domain: react_1.default.createElement(GraphIcon_1.GraphIcon, { color: iconColor }),
team: react_1.default.createElement(PeopleIcon_1.PeopleIcon, { color: iconColor }),
user: react_1.default.createElement(UserIcon_1.UserIcon, { color: iconColor }),
'api-description': react_1.default.createElement(NoteIcon_1.NoteIcon, { color: iconColor }),
'data-schema': react_1.default.createElement(HierarchyIcon_1.HierarchyIcon, { color: iconColor }),
'api-operation': react_1.default.createElement(MoleculesIcon_1.MoleculesIcon, { color: iconColor }),
};
return entityIconMap[entityType];
}
const iconConfig = (_b = (_a = entitiesCatalogConfig === null || entitiesCatalogConfig === void 0 ? void 0 : entitiesCatalogConfig.entityTypes) === null || _a === void 0 ? void 0 : _a[entityType]) === null || _b === void 0 ? void 0 : _b.icon;
if ((iconConfig === null || iconConfig === void 0 ? void 0 : iconConfig.src) || (iconConfig === null || iconConfig === void 0 ? void 0 : iconConfig.srcSet)) {
return (react_1.default.createElement(Image_1.Image, { src: iconConfig === null || iconConfig === void 0 ? void 0 : iconConfig.src, srcSet: iconConfig === null || iconConfig === void 0 ? void 0 : iconConfig.srcSet, alt: `${entityType} icon`, width: "16", height: "16" }));
}
return react_1.default.createElement(CubeIcon_1.CubeIcon, { color: "var(--catalog-entity-icon-color)" });
};
function CatalogEntityIcon({ entityType, defaultColor = false, forceColor, }) {
const themeConfig = (0, core_1.useThemeConfig)();
const icon = getEntityIcon({
entityType,
defaultColor,
forceColor,
entitiesCatalogConfig: themeConfig.entitiesCatalog,
});
if (!icon) {
throw new Error(`Unhandled entity type: ${entityType}`);
}
return icon;
}
//# sourceMappingURL=CatalogEntityIcon.js.map