@redocly/theme 0.60.0-next.0 → 0.60.0-next.2

package/lib/components/Buttons/ConnectMCPButton.js

@@ -48,8 +48,8 @@ const VSCodeIcon_1 = require("../../icons/VSCodeIcon/VSCodeIcon");
 const CopyIcon_1 = require("../../icons/CopyIcon/CopyIcon");
 const CheckmarkFilledIcon_1 = require("../../icons/CheckmarkFilledIcon/CheckmarkFilledIcon");
 const ConnectIcon_1 = require("../../icons/ConnectIcon/ConnectIcon");
-const use_connect_mcp_button_1 = require("../../core/hooks/use-connect-mcp-button");
 const hooks_1 = require("../../core/hooks");
+const hooks_2 = require("../../core/hooks");
 const TriggerButton = react_1.default.memo(({ text }) => {
     return (react_1.default.createElement(StyledButton, { variant: "secondary", icon: react_1.default.createElement(ConnectIcon_1.ConnectIcon, null) }, text));
 });
@@ -80,9 +80,9 @@ const MENU_OPTIONS = [
     },
 ];
 function ConnectMCPButton({ placement = 'bottom', alignment = 'end', options = ['cursor', 'vscode', 'copy'], }) {
-    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { useTranslate } = (0, hooks_2.useThemeHooks)();
     const { translate } = useTranslate();
-    const { isCopied, triggerButtonText, visibleOptions, handleAction } = (0, use_connect_mcp_button_1.useConnectMCPButton)({
+    const { isCopied, triggerButtonText, visibleOptions, handleAction } = (0, hooks_1.useConnectMCPButton)({
         options,
     });
     const menuOptions = (0, react_1.useMemo)(() => MENU_OPTIONS.filter((option) => visibleOptions.includes(option.key)), [visibleOptions]);

package/lib/components/Buttons/variables.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.connectMCPButton = exports.aiAssistantButton = void 0;
 const styled_components_1 = require("styled-components");
+/* eslint-disable theme/no-raw-colors-in-styles */
 exports.aiAssistantButton = (0, styled_components_1.css) `
   /**
    * @tokens AI Assistant Button
@@ -48,6 +49,7 @@ exports.aiAssistantButton = (0, styled_components_1.css) `
   /* Transition */
   --ai-assistant-button-transition: box-shadow 0.3s ease, transform 0.2s ease;
 `;
+/* eslint-enable theme/no-raw-colors-in-styles */
 exports.connectMCPButton = (0, styled_components_1.css) `
   /**
    * @tokens Connect MCP Button

package/lib/components/Catalog/CatalogCardView/CatalogCard.js

@@ -16,7 +16,8 @@ const CatalogEntityIcon_1 = require("../../../components/Catalog/CatalogEntityIc
 const utils_1 = require("../../../core/utils");
 function CatalogCard({ entity, catalogConfig }) {
     var _a, _b, _c;
-    const { useTelemetry } = (0, hooks_1.useThemeHooks)();
+    const { useTelemetry, useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const telemetry = useTelemetry();
     const pathPrefix = (0, utils_1.getPathPrefix)();
     return (react_1.default.createElement(CatalogCardWrapper, { "data-component-name": "Catalog/CatalogCardView/CatalogCard", onClick: () => {
@@ -34,7 +35,7 @@ function CatalogCard({ entity, catalogConfig }) {
                 react_1.default.createElement(CatalogHighlight_1.CatalogHighlight, null, (_a = entity.summary) !== null && _a !== void 0 ? _a : '')),
             react_1.default.createElement(CardMetadataSection, null,
                 react_1.default.createElement(MetadataRow, null,
-                    react_1.default.createElement(MetadataLabel, null, "Domains:"),
+                    react_1.default.createElement(MetadataLabel, null, translate('catalog.metadata.domains', 'Domains:')),
                     react_1.default.createElement(CatalogTagsWithTooltip_1.CatalogTagsWithTooltip, { items: ((_b = entity.domains) === null || _b === void 0 ? void 0 : _b.map((domain) => domain.title)) || [], tagProps: {
                             style: {
                                 fontSize: 'var(--catalog-card-font-size)',
@@ -44,7 +45,7 @@ function CatalogCard({ entity, catalogConfig }) {
                             textTransform: 'none',
                         } })),
                 react_1.default.createElement(MetadataRow, null,
-                    react_1.default.createElement(MetadataLabel, null, "Owners:"),
+                    react_1.default.createElement(MetadataLabel, null, translate('catalog.metadata.owners', 'Owners:')),
                     react_1.default.createElement(CatalogTagsWithTooltip_1.CatalogTagsWithTooltip, { items: ((_c = entity.owners) === null || _c === void 0 ? void 0 : _c.map((owner) => owner.key)) || [], tagProps: {
                             style: {
                                 fontSize: 'var(--catalog-card-font-size)',

package/lib/components/Catalog/CatalogEntity/CatalogEntity.js

@@ -26,7 +26,11 @@ const renderFirstColumnEntitySection = (entity) => {
             return react_1.default.createElement(CatalogEntityMetadata_1.CatalogEntityMetadata, { entity: entity });
     }
 };
-const renderDataSchemaSection = (entity, relatedEntity, RedocSchema, StoreProvider, GraphqlTypeRenderer) => {
+const renderDataSchemaSection = (entity, relatedEntity, 
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+RedocSchema, 
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+StoreProvider, GraphqlTypeRenderer) => {
     if (entity.type !== 'data-schema') {
         return null;
     }

package/lib/components/Catalog/CatalogEntity/CatalogEntityGraph/CatalogEntityRelationsGraph.js

@@ -41,7 +41,7 @@ const react_1 = __importStar(require("react"));
 const react_2 = require("@xyflow/react");
 const styled_components_1 = __importDefault(require("styled-components"));
 const hooks_1 = require("../../../../core/hooks");
-const useGraph_1 = require("../../../../core/hooks/catalog/useGraph");
+const hooks_2 = require("../../../../core/hooks");
 const CatalogEntityRelationsNode_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityGraph/CatalogEntityRelationsNode");
 const CatalogEntityRelationsEdge_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityGraph/CatalogEntityRelationsEdge");
 const styles_1 = require("../../../../core/styles");
@@ -64,7 +64,7 @@ function CatalogEntityRelationsGraph({ entity, }) {
     const { items: allRelations } = useFetchCatalogEntitiesRelations({
         entityKey: entity.key,
     });
-    const { nodes, edges, onNodesChange, onEdgesChange, onConnect } = (0, useGraph_1.useGraph)({
+    const { nodes, edges, onNodesChange, onEdgesChange, onConnect } = (0, hooks_2.useGraph)({
         entity,
         relations: allRelations !== null && allRelations !== void 0 ? allRelations : [],
     });

package/lib/components/Catalog/CatalogEntity/CatalogEntityLinks.js

@@ -10,13 +10,16 @@ const LaunchIcon_1 = require("../../../icons/LaunchIcon/LaunchIcon");
 const LinkIcon_1 = require("../../../icons/LinkIcon/LinkIcon");
 const CatalogEntityInfoBar_1 = require("../../../components/Catalog/CatalogEntity/CatalogEntityInfoBar");
 const Link_1 = require("../../../components/Link/Link");
+const hooks_1 = require("../../../core/hooks");
 function CatalogEntityLinks({ entity }) {
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const links = Object.entries(entity.links || []);
     if (!links.length) {
         return null;
     }
     return (react_1.default.createElement(LinksWrapper, { "data-component-name": "Catalog/CatalogEntity/CatalogEntityLinks" },
-        react_1.default.createElement(Heading, null, "Links"),
+        react_1.default.createElement(Heading, null, translate('catalog.links.label', 'Links')),
         links.map(([key, value]) => (react_1.default.createElement(Link_1.Link, { key: key, color: "var(--catalog-metadata-link-color)", to: value.url, target: "_blank" },
             react_1.default.createElement(CatalogEntityInfoBar_1.CatalogEntityInfoBar, { leftContent: react_1.default.createElement(Label, null,
                     react_1.default.createElement(LinkIcon_1.LinkIcon, null),

package/lib/components/Catalog/CatalogEntity/CatalogEntityMetadata.js

@@ -56,6 +56,7 @@ const utils_1 = require("../../../core/utils");
 const hooks_1 = require("../../../core/hooks");
 const CatalogEntityInfoBar_1 = require("../../../components/Catalog/CatalogEntity/CatalogEntityInfoBar");
 const MAX_INITIAL_ITEMS = 4;
+/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
 function renderMetadataValue(value) {
     if ((0, utils_1.isPlainObject)(value)) {
         return react_1.default.createElement(JsonViewerWrapper, { data: value, expandLevel: 3, controls: false });

package/lib/components/Catalog/CatalogEntity/CatalogEntityMethodAndPath.js

@@ -8,15 +8,18 @@ const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const CatalogEntityInfoBar_1 = require("../../../components/Catalog/CatalogEntity/CatalogEntityInfoBar");
 const HttpTag_1 = require("../../../components/Tags/HttpTag");
+const hooks_1 = require("../../../core/hooks");
 function CatalogEntityMethodAndPath({ entity }) {
     var _a, _b;
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const method = (_a = entity.metadata) === null || _a === void 0 ? void 0 : _a.method;
     const path = (_b = entity.metadata) === null || _b === void 0 ? void 0 : _b.path;
     if (!method || !path) {
         return null;
     }
     return (react_1.default.createElement(LinksWrapper, { "data-component-name": "Catalog/CatalogEntity/CatalogEntityMethodAndPath" },
-        react_1.default.createElement(Heading, null, "Method & Path"),
+        react_1.default.createElement(Heading, null, translate('catalog.methodAndPath.label', 'Method & Path')),
         react_1.default.createElement(CatalogEntityInfoBar_1.CatalogEntityInfoBar, { leftContent: react_1.default.createElement(Label, null,
                 react_1.default.createElement(MethodTag, { color: method.toLowerCase() }, method),
                 react_1.default.createElement(PathLabel, null, path)), withSeparator: false })));

package/lib/components/Catalog/CatalogEntity/CatalogEntityProperties/ContactProperty.js

@@ -8,13 +8,16 @@ const react_1 = __importDefault(require("react"));
 const SlackIcon_1 = require("../../../../icons/SlackIcon/SlackIcon");
 const Tag_1 = require("../../../../components/Tag/Tag");
 const CatalogEntityPropertyCard_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityPropertyCard");
+const hooks_1 = require("../../../../core/hooks");
 function ContactProperty({ entity }) {
     var _a, _b;
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const channels = (_b = (_a = entity.contact) === null || _a === void 0 ? void 0 : _a.slack) === null || _b === void 0 ? void 0 : _b.channels;
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/ContactProperty" },
         react_1.default.createElement(CatalogEntityPropertyCard_1.CatalogEntityPropertyCard, { header: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(SlackIcon_1.SlackIcon, null),
-                "Slack channels"), content: react_1.default.createElement(react_1.default.Fragment, null, channels === null || channels === void 0 ? void 0 : channels.map((channel) => (react_1.default.createElement(Tag_1.Tag, { key: channel.name, textTransform: "none", style: { backgroundColor: 'var(--bg-color)', cursor: 'pointer' }, onClick: () => {
+                translate('catalog.contact.label', 'Slack channels')), content: react_1.default.createElement(react_1.default.Fragment, null, channels === null || channels === void 0 ? void 0 : channels.map((channel) => (react_1.default.createElement(Tag_1.Tag, { key: channel.name, textTransform: "none", style: { backgroundColor: 'var(--bg-color)', cursor: 'pointer' }, onClick: () => {
                     if (channel.url) {
                         window.open(channel.url, '_blank');
                     }

package/lib/components/Catalog/CatalogEntity/CatalogEntityProperties/DomainsProperty.js

@@ -8,12 +8,15 @@ const react_1 = __importDefault(require("react"));
 const GraphIcon_1 = require("../../../../icons/GraphIcon/GraphIcon");
 const Tag_1 = require("../../../../components/Tag/Tag");
 const CatalogEntityPropertyCard_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityPropertyCard");
+const hooks_1 = require("../../../../core/hooks");
 function DomainsProperty({ entity }) {
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const { domains = [] } = entity;
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/DomainsProperty" },
         react_1.default.createElement(CatalogEntityPropertyCard_1.CatalogEntityPropertyCard, { header: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(GraphIcon_1.GraphIcon, null),
-                "Domains"), content: react_1.default.createElement(react_1.default.Fragment, null, domains === null || domains === void 0 ? void 0 : domains.map((domain) => (react_1.default.createElement(Tag_1.Tag, { key: domain === null || domain === void 0 ? void 0 : domain.id, style: { backgroundColor: 'var(--bg-color)' } },
+                translate('catalog.domains.label', 'Domains')), content: react_1.default.createElement(react_1.default.Fragment, null, domains === null || domains === void 0 ? void 0 : domains.map((domain) => (react_1.default.createElement(Tag_1.Tag, { key: domain === null || domain === void 0 ? void 0 : domain.id, style: { backgroundColor: 'var(--bg-color)' } },
                 react_1.default.createElement(GraphIcon_1.GraphIcon, null), domain === null || domain === void 0 ? void 0 :
                 domain.title)))) })));
 }

package/lib/components/Catalog/CatalogEntity/CatalogEntityProperties/EntityTypeProperty.js

@@ -9,16 +9,19 @@ const EntityTypeIcon_1 = require("../../../../icons/EntityTypeIcon/EntityTypeIco
 const utils_1 = require("../../../../core/utils");
 const CatalogEntityTypeIcon_1 = require("../../../../components/Catalog/CatalogEntityTypeIcon");
 const CatalogEntityPropertyCard_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityPropertyCard");
+const hooks_1 = require("../../../../core/hooks");
 const formatEntityType = (entityType) => {
     return (0, utils_1.capitalize)(entityType.startsWith('api-')
         ? entityType.replace('api-', 'API-').replace(/-/g, ' ')
         : entityType.replace(/-/g, ' '));
 };
 function EntityTypeProperty({ entity }) {
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/EntityTypeProperty" },
         react_1.default.createElement(CatalogEntityPropertyCard_1.CatalogEntityPropertyCard, { header: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(EntityTypeIcon_1.EntityTypeIcon, null),
-                "Entity type"), content: react_1.default.createElement(react_1.default.Fragment, null,
+                translate('catalog.entityType.label', 'Entity type')), content: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(CatalogEntityTypeIcon_1.CatalogEntityTypeIcon, { entityType: entity.type }),
                 formatEntityType(entity.type)), hoverEffect: false })));
 }

package/lib/components/Catalog/CatalogEntity/CatalogEntityProperties/FormatProperty.js

@@ -8,12 +8,15 @@ const react_1 = __importDefault(require("react"));
 const NotesIcon_1 = require("../../../../icons/NotesIcon/NotesIcon");
 const Tag_1 = require("../../../../components/Tag/Tag");
 const CatalogEntityPropertyCard_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityPropertyCard");
+const hooks_1 = require("../../../../core/hooks");
 function FormatProperty({ entity }) {
     var _a, _b;
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/FormatProperty" },
         react_1.default.createElement(CatalogEntityPropertyCard_1.CatalogEntityPropertyCard, { header: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(NotesIcon_1.NotesIcon, null),
-                "Format"), content: react_1.default.createElement(react_1.default.Fragment, null,
+                translate('catalog.format.label', 'Format')), content: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(Tag_1.Tag, { textTransform: "none", key: (_a = entity.metadata) === null || _a === void 0 ? void 0 : _a.specType, style: { backgroundColor: 'var(--bg-color)' } }, (_b = entity.metadata) === null || _b === void 0 ? void 0 : _b.specType)), hoverEffect: false })));
 }
 //# sourceMappingURL=FormatProperty.js.map

package/lib/components/Catalog/CatalogEntity/CatalogEntityProperties/GitProperty.js

@@ -9,12 +9,15 @@ const GithubIcon_1 = require("../../../../icons/GithubIcon/GithubIcon");
 const utils_1 = require("../../../../core/utils");
 const Tag_1 = require("../../../../components/Tag/Tag");
 const CatalogEntityPropertyCard_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityPropertyCard");
+const hooks_1 = require("../../../../core/hooks");
 function GitProperty({ entity }) {
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const git = entity.git;
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/GitProperty" },
         react_1.default.createElement(CatalogEntityPropertyCard_1.CatalogEntityPropertyCard, { header: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(GithubIcon_1.GithubIcon, null),
-                "Repositories"), content: react_1.default.createElement(react_1.default.Fragment, null, git === null || git === void 0 ? void 0 : git.map((repo) => {
+                translate('catalog.repositories.label', 'Repositories')), content: react_1.default.createElement(react_1.default.Fragment, null, git === null || git === void 0 ? void 0 : git.map((repo) => {
                 const url = new URL(repo);
                 const repoName = (0, utils_1.removeLeadingSlash)(url.pathname);
                 return (react_1.default.createElement(Tag_1.Tag, { key: repo, textTransform: "none", style: { backgroundColor: 'var(--bg-color)' } }, repoName));

package/lib/components/Catalog/CatalogEntity/CatalogEntityProperties/OwnersProperty.js

@@ -8,12 +8,15 @@ const react_1 = __importDefault(require("react"));
 const PeopleIcon_1 = require("../../../../icons/PeopleIcon/PeopleIcon");
 const Tag_1 = require("../../../../components/Tag/Tag");
 const CatalogEntityPropertyCard_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityPropertyCard");
+const hooks_1 = require("../../../../core/hooks");
 function OwnersProperty({ entity }) {
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const { owners = [] } = entity;
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/OwnersProperty" },
         react_1.default.createElement(CatalogEntityPropertyCard_1.CatalogEntityPropertyCard, { header: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(PeopleIcon_1.PeopleIcon, null),
-                "Owners"), content: react_1.default.createElement(react_1.default.Fragment, null, owners.map((owner) => (react_1.default.createElement(Tag_1.Tag, { key: owner === null || owner === void 0 ? void 0 : owner.id, style: {
+                translate('catalog.owners.label', 'Owners')), content: react_1.default.createElement(react_1.default.Fragment, null, owners.map((owner) => (react_1.default.createElement(Tag_1.Tag, { key: owner === null || owner === void 0 ? void 0 : owner.id, style: {
                     backgroundColor: 'var(--bg-color)',
                     borderRadius: 'var(--border-radius-xl)',
                 } }, owner === null || owner === void 0 ? void 0 : owner.title)))) })));

package/lib/components/Catalog/CatalogEntity/CatalogEntityProperties/TagsProperty.js

@@ -8,11 +8,14 @@ const react_1 = __importDefault(require("react"));
 const TagsIcon_1 = require("../../../../icons/TagsIcon/TagsIcon");
 const theme_1 = require("../../../../index.js");
 const CatalogEntityPropertyCard_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityPropertyCard");
+const hooks_1 = require("../../../../core/hooks");
 function TagsProperty({ entity }) {
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/TagsProperty" },
         react_1.default.createElement(CatalogEntityPropertyCard_1.CatalogEntityPropertyCard, { header: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(TagsIcon_1.TagsIcon, null),
-                "Tags"), content: react_1.default.createElement(theme_1.CatalogTagsWithTooltip, { itemsToShow: 8, items: entity.tags || [], tagProps: {
+                translate('catalog.tags.label', 'Tags')), content: react_1.default.createElement(theme_1.CatalogTagsWithTooltip, { itemsToShow: 8, items: entity.tags || [], tagProps: {
                     style: {
                         fontSize: 'var(--font-size-base)',
                         borderRadius: 'var(--border-radius)',

package/lib/components/Catalog/CatalogEntity/CatalogEntityProperties/UserEmailProperty.js

@@ -8,13 +8,16 @@ const react_1 = __importDefault(require("react"));
 const EmailIcon_1 = require("../../../../icons/EmailIcon/EmailIcon");
 const CatalogEntityPropertyCard_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityProperties/CatalogEntityPropertyCard");
 const CatalogUserEntityCell_1 = require("../../../../components/Catalog/CatalogTableView/CatalogUserEntityCell");
+const hooks_1 = require("../../../../core/hooks");
 function UserEmailProperty({ entity }) {
     var _a;
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const email = (_a = entity.metadata) === null || _a === void 0 ? void 0 : _a.email;
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityProperties/UserEmailProperty" },
         react_1.default.createElement(CatalogEntityPropertyCard_1.CatalogEntityPropertyCard, { header: react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement(EmailIcon_1.EmailIcon, null),
-                "Email"), content: react_1.default.createElement(CatalogUserEntityCell_1.Email, null, email), onClick: () => {
+                translate('catalog.email.label', 'Email')), content: react_1.default.createElement(CatalogUserEntityCell_1.Email, null, email), onClick: () => {
                 window.open(`mailto:${email}`, '_blank');
             } })));
 }

package/lib/components/Catalog/CatalogEntity/CatalogEntitySchema.js

@@ -41,14 +41,14 @@ const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const Sampler = __importStar(require("openapi-sampler"));
 const hooks_1 = require("../../../core/hooks");
-const useCatalogEntitySchema_1 = require("../../../core/hooks/catalog/useCatalogEntitySchema");
+const hooks_2 = require("../../../core/hooks");
 const JsonViewer_1 = require("../../../components/JsonViewer/JsonViewer");
 const CopyButton_1 = require("../../../components/Buttons/CopyButton");
 function CatalogEntitySchema({ entity, relatedEntity, RedocSchema, StoreProvider, GraphqlTypeRenderer, }) {
     var _a, _b;
     const { useTranslate } = (0, hooks_1.useThemeHooks)();
     const { translate } = useTranslate();
-    const { definition, parsedSchema, rawSchema } = (0, useCatalogEntitySchema_1.useCatalogEntitySchema)({ entity, relatedEntity });
+    const { definition, parsedSchema, rawSchema } = (0, hooks_2.useCatalogEntitySchema)({ entity, relatedEntity });
     const isGraphql = ((_a = entity.metadata) === null || _a === void 0 ? void 0 : _a.specType) === 'graphql';
     const graphqlSDL = (_b = entity === null || entity === void 0 ? void 0 : entity.metadata) === null || _b === void 0 ? void 0 : _b.sdl;
     return (react_1.default.createElement(MetadataWrapper, { "data-component-name": "Catalog/CatalogEntity/CatalogEntityMetadata" },

package/lib/components/Catalog/CatalogFilter/CatalogFilterDateRange.js

@@ -61,14 +61,14 @@ function CatalogFilterDateRange({ filter, className, }) {
             react_1.default.createElement(FilterOptions_1.FilterOptions, null,
                 react_1.default.createElement(DateRangeWrapper, null,
                     react_1.default.createElement(DateRangeRow, null,
-                        react_1.default.createElement("span", null, "From:"),
+                        react_1.default.createElement("span", null, translate('filter.dateRange.from', 'From:')),
                         react_1.default.createElement(DatePicker_1.DatePicker, { closeCalendar: true, format: "y-MM-dd", dayPlaceholder: "DD", monthPlaceholder: "MM", yearPlaceholder: "YYYY", value: from, maxDate: new Date(), onChange: (from) => {
                                 if (Array.isArray(from))
                                     return;
                                 filter.selectOption(Object.assign(Object.assign({}, filter.selectedOptions), { from: (0, utils_1.formatDateWithoutTimeZone)(from), to: (0, utils_1.formatDateWithoutTimeZone)(to) }));
                             } })),
                     react_1.default.createElement(DateRangeRow, null,
-                        react_1.default.createElement("span", null, "To:"),
+                        react_1.default.createElement("span", null, translate('filter.dateRange.to', 'To:')),
                         react_1.default.createElement(DatePicker_1.DatePicker, { closeCalendar: true, dayPlaceholder: "DD", monthPlaceholder: "MM", yearPlaceholder: "YYYY", format: "y-MM-dd", minDate: from, value: to, onChange: (to) => {
                                 if (Array.isArray(to))
                                     return;

package/lib/components/Catalog/CatalogSelector.js

@@ -24,7 +24,7 @@ function CatalogSelector({ catalogSwitcherItems, setSearchQuery, setSortOption,
     }));
     const selectedCatalogItem = catalogSwitcherItems.find((item) => item.selected);
     return (react_1.default.createElement(exports.CatalogSelectWrapper, { "data-component-name": "Catalog/CatalogSelector" },
-        react_1.default.createElement(exports.CatalogSelectLabel, null, "Catalogs"),
+        react_1.default.createElement(exports.CatalogSelectLabel, null, translate('catalog.catalogs.label', 'Catalogs')),
         react_1.default.createElement(exports.CatalogSelect, { value: selectedCatalogItem === null || selectedCatalogItem === void 0 ? void 0 : selectedCatalogItem.slug, options: options, onChange: (value) => {
                 navigate(`${pathPrefix}/catalogs/${value}`);
                 setSearchQuery('');

package/lib/components/Catalog/CatalogSortButton.js

@@ -44,7 +44,10 @@ const DescSortIcon_1 = require("../../icons/DescSortIcon/DescSortIcon");
 const Dropdown_1 = require("../../components/Dropdown/Dropdown");
 const DropdownMenu_1 = require("../../components/Dropdown/DropdownMenu");
 const DropdownMenuItem_1 = require("../../components/Dropdown/DropdownMenuItem");
+const hooks_1 = require("../../core/hooks");
 function CatalogSortButton({ onSortChange, currentSort, }) {
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     const toggleSort = (0, react_1.useCallback)((field) => {
         const newSort = currentSort === `-${field}` ? field : `-${field}`;
         onSortChange(newSort);
@@ -52,7 +55,7 @@ function CatalogSortButton({ onSortChange, currentSort, }) {
     return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogSortButton" },
         react_1.default.createElement(Dropdown_1.Dropdown, { trigger: react_1.default.createElement(SortTrigger, null,
                 react_1.default.createElement(SortIconWrapper, null, currentSort === '-title' ? react_1.default.createElement(DescSortIcon_1.DescSortIcon, null) : react_1.default.createElement(AscSortIcon_1.AscSortIcon, null)),
-                react_1.default.createElement(SortText, null, "Sort")), alignment: "end" },
+                react_1.default.createElement(SortText, null, translate('catalog.sort', 'Sort'))), alignment: "end" },
             react_1.default.createElement(DropdownMenu_1.DropdownMenu, null,
                 react_1.default.createElement(DropdownMenuItem_1.DropdownMenuItem, { onAction: () => toggleSort('title') }, currentSort === '-title' ? 'Title | A → Z' : 'Title | Z → A')))));
 }

package/lib/components/Catalog/CatalogTableView/CatalogTableHeaderCell.js

@@ -41,9 +41,9 @@ const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importStar(require("styled-components"));
 const CaretDownIcon_1 = require("../../../icons/CaretDownIcon/CaretDownIcon");
 const CaretUpIcon_1 = require("../../../icons/CaretUpIcon/CaretUpIcon");
-const useCatalogTableHeaderCellActions_1 = require("../../../core/hooks/catalog/useCatalogTableHeaderCellActions");
+const hooks_1 = require("../../../core/hooks");
 const CatalogTableHeaderCell = ({ column, handleSortClick, isColumnSorted, setSortOption, }) => {
-    const { handleCellClick, sortKey, isUpActive, isDownActive } = (0, useCatalogTableHeaderCellActions_1.useCatalogTableHeaderCellActions)({
+    const { handleCellClick, sortKey, isUpActive, isDownActive } = (0, hooks_1.useCatalogTableHeaderCellActions)({
         column,
         handleSortClick,
         isColumnSorted,

package/lib/components/Catalog/CatalogTableView/CatalogTableViewRow.js

@@ -10,7 +10,7 @@ const CatalogOwnersCell_1 = require("../../../components/Catalog/CatalogTableVie
 const CatalogDomainsCell_1 = require("../../../components/Catalog/CatalogTableView/CatalogDomainsCell");
 const CatalogEntityCell_1 = require("../../../components/Catalog/CatalogTableView/CatalogEntityCell");
 const CatalogTagsCell_1 = require("../../../components/Catalog/CatalogTableView/CatalogTagsCell");
-const useCatalogTableViewRow_1 = require("../../../core/hooks/catalog/useCatalogTableViewRow");
+const hooks_1 = require("../../../core/hooks");
 const CatalogEntityTypeTag_1 = require("../../../components/Catalog/CatalogEntityTypeTag");
 const Link_1 = require("../../Link/Link");
 const baseColumns = [
@@ -61,7 +61,7 @@ const baseColumns = [
     },
 ];
 const CatalogTableViewRow = ({ entity, entitiesCatalogConfig, catalogConfig, columns = baseColumns, }) => {
-    const { getEntityDetailsLink } = (0, useCatalogTableViewRow_1.useCatalogTableViewRow)({
+    const { getEntityDetailsLink } = (0, hooks_1.useCatalogTableViewRow)({
         entityKey: entity.key,
         entityType: entity.type,
         catalogConfig,

package/lib/components/Catalog/CatalogTagsWithTooltip.js

@@ -10,7 +10,10 @@ const constants_1 = require("../../core/constants");
 const Tag_1 = require("../../components/Tag/Tag");
 const Tooltip_1 = require("../../components/Tooltip/Tooltip");
 const CatalogHighlight_1 = require("../../components/Catalog/CatalogHighlight");
+const hooks_1 = require("../../core/hooks");
 function CatalogTagsWithTooltip({ items, itemsToShow = 1, showPlaceholder = true, tagProps, }) {
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
+    const { translate } = useTranslate();
     if (!items || items.length === 0) {
         if (showPlaceholder) {
             return (react_1.default.createElement(CatalogTagsWrapper, { "data-component-name": "Catalog/CatalogTagsWithTooltip" },
@@ -31,7 +34,8 @@ function CatalogTagsWithTooltip({ items, itemsToShow = 1, showPlaceholder = true
             react_1.default.createElement(MoreTagsButton, null,
                 "+",
                 remainingCount,
-                " more"))));
+                " ",
+                translate('catalog.tags.more', 'more')))));
 }
 const CatalogTagsWrapper = styled_components_1.default.div `
   display: flex;

package/lib/components/Catalog/variables.dark.js

@@ -3,6 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.catalogDarkMode = void 0;
 const styled_components_1 = require("styled-components");
 exports.catalogDarkMode = (0, styled_components_1.css) `
-  --catalog-avatar-bg-color: #3b3c45;
+  --catalog-avatar-bg-color: var(--color-warm-grey-4);
 `;
 //# sourceMappingURL=variables.dark.js.map

package/lib/components/Catalog/variables.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.catalog = void 0;
 const styled_components_1 = require("styled-components");
+/* eslint-disable theme/no-raw-colors-in-styles */
 exports.catalog = (0, styled_components_1.css) `
   /* === Catalog === */
   /**
@@ -286,7 +287,7 @@ exports.catalog = (0, styled_components_1.css) `
   --catalog-page-badge-line-height: var(--line-height-base);
 
   --catalog-page-badge-dot-size: 6px;
-  --catalog-page-badge-dot-border-color: #ffffff;
+  --catalog-page-badge-dot-border-color: var(--color-static-white);
 
   /**
     * @tokens Catalog table
@@ -407,8 +408,8 @@ exports.catalog = (0, styled_components_1.css) `
   --catalog-entity-relations-node-font-weight-root: 600;
 
   --catalog-entity-relations-node-root-bg-color: var(--color-blue-6);
-  --catalog-entity-relations-node-root-text-color: #ffffff;
-  --catalog-entity-relations-node-root-icon-color: #ffffff;
+  --catalog-entity-relations-node-root-text-color: var(--color-static-white);
+  --catalog-entity-relations-node-root-icon-color: var(--color-static-white);
   // @tokens End
 
   /**
@@ -429,4 +430,5 @@ exports.catalog = (0, styled_components_1.css) `
   --catalog-entity-relations-edge-label-line-height: 1.2;
   // @tokens End
 `;
+/* eslint-enable theme/no-raw-colors-in-styles */
 //# sourceMappingURL=variables.js.map

package/lib/components/CatalogClassic/variables.js

@@ -102,7 +102,7 @@ exports.catalogClassic = (0, styled_components_1.css) `
   --catalog-classic-page-badge-line-height: var(--line-height-base);
 
   --catalog-classic-page-badge-dot-size: 6px;
-  --catalog-classic-page-badge-dot-border-color: #ffffff;
+  --catalog-classic-page-badge-dot-border-color: var(--color-static-white);
 
   // @tokens End
 `;

package/lib/components/CodeBlock/CodeBlock.js

@@ -92,7 +92,9 @@ function CodeBlock(_a) {
                     ? {
                         __html: highlightedCode,
                     }
-                    : undefined, suppressHydrationWarning // TODO: investigate issue
+                    : undefined, 
+                /* eslint-disable-next-line no-warning-comments */
+                suppressHydrationWarning // TODO: investigate issue
                 : true, "data-testid": dataTestId, hideCodeColors: hideCodeColors, maxHeight: codeBlockMaxHeight, wrapContents: wrapContents, tabIndex: 0 }, children),
             reportDialog.visible && (react_1.default.createElement(ReportDialog_1.ReportDialog, Object.assign({}, reportDialog.props, { location: sourceCode, lang: lang }))))));
 }

package/lib/components/CodeBlock/CodeBlockTabs.js

@@ -40,7 +40,7 @@ const hooks_1 = require("../../core/hooks");
 const Button_1 = require("../../components/Button/Button");
 const ChevronLeftIcon_1 = require("../../icons/ChevronLeftIcon/ChevronLeftIcon");
 const ChevronRightIcon_1 = require("../../icons/ChevronRightIcon/ChevronRightIcon");
-const get_file_icon_1 = require("../../core/utils/get-file-icon");
+const utils_1 = require("../../core/utils");
 function CodeBlockTabs({ tabs }) {
     const containerRef = (0, react_1.useRef)(null);
     const tabRefs = (0, react_1.useRef)([]);
@@ -62,9 +62,9 @@ function CodeBlockTabs({ tabs }) {
                 const { name, lang, id } = item;
                 const ext = (_a = name.match(/\.([^.]+)$/)) === null || _a === void 0 ? void 0 : _a[1];
                 const fileIcon = lang
-                    ? (0, get_file_icon_1.getFileIconByLanguage)(lang)
+                    ? (0, utils_1.getFileIconByLanguage)(lang)
                     : ext
-                        ? (0, get_file_icon_1.getFileIconByExt)(ext)
+                        ? (0, utils_1.getFileIconByExt)(ext)
                         : null;
                 return (react_1.default.createElement(Tab, { ref: (el) => {
                         tabRefs.current[i] = el;

package/lib/components/DatePicker/variables.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.datePicker = void 0;
 const styled_components_1 = require("styled-components");
+/* eslint-disable theme/no-raw-colors-in-styles */
 exports.datePicker = (0, styled_components_1.css) `
   --date-picker-nav-color: #000000;
   --date-picker-tile-bg-color: var(--color-blue-2);
@@ -21,4 +22,5 @@ exports.datePicker = (0, styled_components_1.css) `
   --date-picker-wrapper-radius: var(--border-radius-md);
   --date-picker-wrapper-padding: calc(var(--spacing-xxs) / 2) var(--spacing-xs);
 `;
+/* eslint-enable theme/no-raw-colors-in-styles */ 
 //# sourceMappingURL=variables.js.map

package/lib/components/Feedback/Mood.js

@@ -177,8 +177,8 @@ function Mood({ settings, onSubmit, className }) {
                         }
                     } }))),
             displaySubmitBnt && (React.createElement(ButtonsContainer, null,
-                React.createElement(Button_1.Button, { onClick: onCancelMoodForm, variant: "text", size: "small" }, "Cancel"),
-                React.createElement(Button_1.Button, { type: "submit", variant: "secondary", size: "small" }, "Submit"))))));
+                React.createElement(Button_1.Button, { onClick: onCancelMoodForm, variant: "text", size: "small" }, translate('feedback.cancel', 'Cancel')),
+                React.createElement(Button_1.Button, { type: "submit", variant: "secondary", size: "small" }, translate('feedback.submit', 'Submit')))))));
 }
 const remapScore = (score) => {
     switch (score) {

package/lib/components/Feedback/Rating.js

@@ -122,8 +122,8 @@ function Rating({ settings, onSubmit, className }) {
                         }
                     } }))),
             displaySubmitBnt && (React.createElement(ButtonsContainer, null,
-                React.createElement(Button_1.Button, { onClick: onCancelRatingForm, variant: "text", size: "small" }, "Cancel"),
-                React.createElement(Button_1.Button, { onClick: onSubmitRatingForm, variant: "secondary", size: "small" }, "Submit"))))));
+                React.createElement(Button_1.Button, { onClick: onCancelRatingForm, variant: "text", size: "small" }, translate('feedback.cancel', 'Cancel')),
+                React.createElement(Button_1.Button, { onClick: onSubmitRatingForm, variant: "secondary", size: "small" }, translate('feedback.submit', 'Submit')))))));
 }
 const StyledForm = styled_components_1.default.form `
   width: 100%;

package/lib/components/Filter/FilterDateRange.js

@@ -21,14 +21,14 @@ function FilterDateRange({ filter }) {
         react_1.default.createElement(FilterOptions_1.FilterOptions, null,
             react_1.default.createElement(DateRangeWrapper, null,
                 react_1.default.createElement(DateRangeRow, null,
-                    react_1.default.createElement("span", null, "From:"),
+                    react_1.default.createElement("span", null, translate('filter.dateRange.from', 'From:')),
                     react_1.default.createElement(DatePicker_1.DatePicker, { closeCalendar: true, format: "y-MM-dd", dayPlaceholder: "DD", monthPlaceholder: "MM", yearPlaceholder: "YYYY", value: from, maxDate: new Date(), onChange: (from) => {
                             if (Array.isArray(from))
                                 return;
                             filter.selectOption(Object.assign(Object.assign({}, filter.selectedOptions), { from: (0, utils_1.formatDateWithoutTimeZone)(from), to: (0, utils_1.formatDateWithoutTimeZone)(to) }));
                         } })),
                 react_1.default.createElement(DateRangeRow, null,
-                    react_1.default.createElement("span", null, "To:"),
+                    react_1.default.createElement("span", null, translate('filter.dateRange.to', 'To:')),
                     react_1.default.createElement(DatePicker_1.DatePicker, { closeCalendar: true, dayPlaceholder: "DD", monthPlaceholder: "MM", yearPlaceholder: "YYYY", format: "y-MM-dd", minDate: from, value: to, onChange: (to) => {
                             if (Array.isArray(to))
                                 return;

package/lib/components/Filter/FilterSelect.js

@@ -35,7 +35,11 @@ function FilterSelect({ filter, filterValuesCasing, showCounter = true, }) {
     ];
     return (react_1.default.createElement(FilterSelectWrapper, { "data-component-name": "Filter/FilterSelect" },
         react_1.default.createElement(FilterTitle_1.FilterTitle, { "data-translation-key": filter.titleTranslationKey }, translate(filter.titleTranslationKey, filter.title)),
-        react_1.default.createElement(StyledSelect, { value: ((_a = filter.selectedOptions.values().next()) === null || _a === void 0 ? void 0 : _a.value) || '', onChange: (value) => filter.selectOption(value), options: selectOptions })));
+        react_1.default.createElement(StyledSelect
+        /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+        , { 
+            /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+            value: ((_a = filter.selectedOptions.values().next()) === null || _a === void 0 ? void 0 : _a.value) || '', onChange: (value) => filter.selectOption(value), options: selectOptions })));
 }
 const FilterSelectWrapper = styled_components_1.default.div `
   display: flex;

package/lib/components/JsonViewer/{helpers.js → Helpers.js}

@@ -137,4 +137,4 @@ const ExpandButton = (0, styled_components_1.default)(Button_1.Button) `
     margin-left: 0;
   }
 `;
-//# sourceMappingURL=helpers.js.map
+//# sourceMappingURL=Helpers.js.map