@redocly/theme 0.30.1 → 0.30.3-beta.1

package/lib/components/Catalog/useCatalog.js

@@ -256,9 +256,10 @@ function collectFilterOptions(items, filters) {
                 }
             }
         }
-        const options = Object.entries(usedOptions)
-            .map(([value, count]) => ({ value, count }))
-            .sort((a, b) => b.value.localeCompare(a.value));
+        const options = Object.entries(usedOptions).map(([value, count]) => ({ value, count }));
+        if (!staticOptions) {
+            options.sort((a, b) => b.value.localeCompare(a.value));
+        }
         if (othersCount) {
             options.push({
                 value: filter.missingCategoryNameTranslationKey || filter.missingCategoryName || 'Others',

package/lib/components/Filter/Filter.js

@@ -52,7 +52,7 @@ function Filter({ filter, filterValuesCasing, }) {
                             return;
                         filter.selectOption(Object.assign(Object.assign({}, filter.selectedOptions), { to: formatDateWithNoTimeZone(to) }));
                     } })))) : (filter.filteredOptions.map((value) => {
-            const id = 'filter--' + filter.property + '--' + slug(value.value);
+            const id = 'filter--' + filter.property + '--' + value.value;
             return (react_1.default.createElement(FilterOption, { key: id, role: "link", onClick: () => filter.toggleOption(value.value) },
                 react_1.default.createElement(icons_1.CheckboxIcon, { checked: filter.selectedOptions.has(value.value) }),
                 react_1.default.createElement(FilterOptionLabel, null, changeCasing(translate(value.value), filterValuesCasing)),
@@ -133,10 +133,6 @@ const StyledSelect = (0, styled_components_1.default)(Select_1.Select) `
     margin: var(--filter-select-option-margin);
   }
 `;
-// TODO: import from portal
-function slug(str) {
-    return str.replace(/\s/g, '-').toLowerCase();
-}
 const DatePickerWrapper = styled_components_1.default.div `
   color: var(--filter-date-picker-color);
   display: flex;

package/lib/components/LastUpdated/LastUpdated.js

@@ -41,12 +41,13 @@ const FORMATS = {
 function LastUpdated(props) {
     const { markdown: { lastUpdatedBlock = {} } = {} } = (0, useThemeConfig_1.useThemeConfig)();
     const { translate } = (0, hooks_1.useTranslate)();
+    const { currentLocale } = (0, hooks_1.useI18nConfig)();
     if (lastUpdatedBlock === null || lastUpdatedBlock === void 0 ? void 0 : lastUpdatedBlock.hide) {
         return null;
     }
     const lastModified = props.lastModified;
     const format = props.format || lastUpdatedBlock.format || 'timeago';
-    const locale = props.locale || lastUpdatedBlock.locale || 'en-US';
+    const locale = props.locale || lastUpdatedBlock.locale || currentLocale || 'en-US';
     const isoDate = lastModified.toISOString().split('T')[0];
     const lastUpdatedString = FORMATS[format](lastModified, locale);
     const translationKey = format === 'timeago' ? 'theme.page.lastUpdated.timeago' : 'theme.page.lastUpdated.on';

package/lib/components/Menu/MenuItemSwitch.js

@@ -16,7 +16,7 @@ const MenuItem_1 = require("../../components/Menu/MenuItem");
 function MenuItemSwitch(props) {
     var _a;
     const type = (0, getMenuType_1.getMenuType)(props.item);
-    const { Drilldown, handleBack, handleExpand, isExpanded: drilldownIsExpanded, prevActiveItem, } = (0, useDrilldown_1.useDrilldown)(props);
+    const { Drilldown, handleBack, handleExpand, isExpanded: drilldownIsExpanded, } = (0, useDrilldown_1.useDrilldown)(props);
     const { MenuGroup, handleGroupClick, isExpanded } = (0, useMenuGroup_1.useMenuGroup)(props.item);
     switch (type) {
         case types_1.MenuType.Separator:
@@ -31,7 +31,7 @@ function MenuItemSwitch(props) {
             }
             return (react_1.default.createElement(Group, { item: props.item, isExpanded: isExpanded, toggleExpanded: handleGroupClick }, props.children));
         case types_1.MenuType.DrillDown:
-            return (react_1.default.createElement(Drilldown, { item: props.item, isExpanded: drilldownIsExpanded, back: handleBack, expand: handleExpand, prevActiveItem: prevActiveItem }, props.children));
+            return (react_1.default.createElement(Drilldown, { item: props.item, isExpanded: drilldownIsExpanded, back: handleBack, expand: handleExpand }, props.children));
         default:
             return react_1.default.createElement(MenuItem_1.MenuItem, Object.assign({}, props));
     }

package/lib/components/Scorecard/Card.d.ts

@@ -1,2 +1,4 @@
-export declare const ScorecardCard: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ScorecardCard: import("styled-components").StyledComponent<"div", any, {
+    'data-component-name': string;
+}, "data-component-name">;
 export declare const ScorecardCardTitle: import("styled-components").StyledComponent<"h3", any, {}, never>;

package/lib/components/Scorecard/Card.js

@@ -5,9 +5,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ScorecardCardTitle = exports.ScorecardCard = void 0;
 const styled_components_1 = __importDefault(require("styled-components"));
-exports.ScorecardCard = styled_components_1.default.div `
+exports.ScorecardCard = styled_components_1.default.div.attrs({
+    'data-component-name': 'Scorecard/ScorecardCard',
+}) `
   color: var(--text-primary);
-  background-color: var(--thin-tile-background-color);
+  background-color: var(--bg-raised);
   border-radius: 4px;
 
   border: 1px solid var(--border-primary);

package/lib/components/Scorecard/Gauge.d.ts

@@ -1,8 +1,11 @@
 /// <reference types="react" />
-export declare function Gauge({ chunks, }: {
+export interface GaugeProps {
     chunks: {
         share: number;
         color: string;
+        title?: string;
     }[];
-}): JSX.Element;
+    className?: string;
+}
+export declare function Gauge({ chunks, className }: GaugeProps): JSX.Element;
 export declare const GaugeValue: import("styled-components").StyledComponent<"span", any, {}, never>;

package/lib/components/Scorecard/Gauge.js

@@ -29,8 +29,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.GaugeValue = exports.Gauge = void 0;
 const React = __importStar(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
-function Gauge({ chunks, }) {
-    return (React.createElement(GaugeWrapper, null, chunks.map((chunk, i) => (React.createElement(GaugeChunk, Object.assign({ key: i }, chunk))))));
+function Gauge({ chunks, className }) {
+    const title = chunks
+        .map((chunk) => chunk.title)
+        .filter(Boolean)
+        .join(', ');
+    return (React.createElement(GaugeWrapper, { "data-component-name": "Scorecard/StatusByLevelWidget", className: className, title: title }, chunks.map((chunk, i) => (React.createElement(GaugeChunk, { key: i, share: chunk.share, color: chunk.color })))));
 }
 exports.Gauge = Gauge;
 exports.GaugeValue = styled_components_1.default.span `

package/lib/components/Scorecard/StatusByLevelWidget.d.ts

@@ -7,5 +7,6 @@ export interface StatusByLevelWidgetProps {
         warnings: number;
         total: number;
     }[];
+    className?: string;
 }
 export declare function StatusByLevelWidget(props: StatusByLevelWidgetProps): JSX.Element;

package/lib/components/Scorecard/StatusByLevelWidget.js

@@ -32,8 +32,8 @@ const styled_components_1 = __importDefault(require("styled-components"));
 const Gauge_1 = require("../../components/Scorecard/Gauge");
 const Card_1 = require("../../components/Scorecard/Card");
 function StatusByLevelWidget(props) {
-    const { levels, title } = props;
-    return (React.createElement(Card_1.ScorecardCard, null,
+    const { levels, title, className } = props;
+    return (React.createElement(Card_1.ScorecardCard, { "data-component-name": "Scorecard/StatusByLevelWidget", className: className },
         React.createElement(Card_1.ScorecardCardTitle, null, title),
         React.createElement(CardBody, null, levels.map((level) => {
             const success = level.total - level.errors - level.warnings;
@@ -43,14 +43,17 @@ function StatusByLevelWidget(props) {
                         {
                             share: (success / level.total) * 100,
                             color: 'var(--scorecard-color-success)',
+                            title: `${success} passed`,
                         },
                         {
                             share: (level.warnings / level.total) * 100,
                             color: 'var(--scorecard-color-warning)',
+                            title: `${level.warnings} ${level.warnings === 1 ? 'warning' : 'warnings'}`,
                         },
                         {
                             share: (level.errors / level.total) * 100,
                             color: 'var(--scorecard-color-error)',
+                            title: `${level.errors} ${level.errors === 1 ? 'error' : 'errors'}`,
                         },
                     ] }),
                 React.createElement(Gauge_1.GaugeValue, null,

package/lib/components/Sidebar/DrilldownMenu.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import type { DrilldownMenuProps } from '../../components/Sidebar/types';
-export declare function DrilldownMenu({ item, back, prevActiveItem, children, className, }: React.PropsWithChildren<DrilldownMenuProps>): JSX.Element;
+export declare function DrilldownMenu({ item, back, children, className, }: React.PropsWithChildren<DrilldownMenuProps>): JSX.Element;

package/lib/components/Sidebar/DrilldownMenu.js

@@ -33,15 +33,12 @@ const BackButton_1 = require("../../components/Sidebar/BackButton");
 const DrilldownMenuItem_1 = require("../../components/Sidebar/DrilldownMenuItem");
 const hooks_1 = require("../../mocks/hooks");
 const Menu_1 = require("../../components/Menu");
-function DrilldownMenu({ item, back, prevActiveItem, children, className, }) {
+function DrilldownMenu({ item, back, children, className, }) {
     const { translate } = (0, hooks_1.useTranslate)();
-    const label = item.label === (prevActiveItem === null || prevActiveItem === void 0 ? void 0 : prevActiveItem.label) || !(prevActiveItem === null || prevActiveItem === void 0 ? void 0 : prevActiveItem.label)
-        ? translate('theme.sidebar.menu.backLabel', 'Back')
-        : prevActiveItem === null || prevActiveItem === void 0 ? void 0 : prevActiveItem.label;
     return (react_1.default.createElement(MenuContainer, { "data-component-name": "Sidebar/DrilldownMenu", className: className },
         react_1.default.createElement(MenuContent, null,
             react_1.default.createElement(MenuWrapper, null,
-                react_1.default.createElement(BackButton_1.BackButton, { back: back, "data-translation-key": "theme.sidebar.menu.backLabel" }, label),
+                react_1.default.createElement(BackButton_1.BackButton, { back: back, "data-translation-key": "theme.sidebar.menu.backLabel" }, translate('theme.sidebar.menu.backLabel', 'Back')),
                 react_1.default.createElement(Menu_1.MenuLinkItem, { item: item },
                     react_1.default.createElement(DrilldownMenuItem_1.DrilldownMenuItem, { item: item }))),
             children)));

package/lib/components/Sidebar/styledVariables.js

@@ -16,7 +16,7 @@ exports.sidebar = (0, styled_components_1.css) `
   /**
     * @tokens Sidebar typography
     */
-  --sidebar-word-break: inherit; // @presenter WordBreak
+  --sidebar-word-break: inherit;
 
   /**
     * @tokens Sidebar colors

package/lib/components/Sidebar/types.d.ts

@@ -10,7 +10,6 @@ export interface ItemState extends NavItem {
 export interface DrilldownMenuProps {
     back: () => void;
     item: ItemState;
-    prevActiveItem?: ItemState;
     className?: string;
 }
 export interface MenuItemProps {

package/lib/config.d.ts

@@ -24,7 +24,6 @@ declare const markdownConfigSchema: {
                 };
                 readonly locale: {
                     readonly type: "string";
-                    readonly default: "en-US";
                 };
             };
             readonly additionalProperties: false;
@@ -280,9 +279,9 @@ declare const catalogFilterSchema: {
 declare const scorecardConfigSchema: {
     readonly type: "object";
     readonly additionalProperties: true;
-    readonly required: readonly ["levels"];
+    readonly required: readonly [];
     readonly properties: {
-        readonly failBuildIfBelowMinimum: {
+        readonly ignoreNonCompliant: {
             readonly type: "boolean";
             readonly default: false;
         };
@@ -309,6 +308,9 @@ declare const scorecardConfigSchema: {
                     readonly name: {
                         readonly type: "string";
                     };
+                    readonly color: {
+                        readonly type: "string";
+                    };
                     readonly extends: {
                         readonly type: "array";
                         readonly items: {
@@ -871,14 +873,6 @@ export declare const themeConfigSchema: {
             };
             readonly additionalProperties: false;
         };
-        readonly seo: {
-            readonly type: "object";
-            readonly properties: {
-                readonly title: {
-                    readonly type: "string";
-                };
-            };
-        };
         readonly scripts: {
             readonly type: "object";
             readonly properties: {
@@ -1315,7 +1309,6 @@ export declare const themeConfigSchema: {
                         };
                         readonly locale: {
                             readonly type: "string";
-                            readonly default: "en-US";
                         };
                     };
                     readonly additionalProperties: false;
@@ -1849,9 +1842,9 @@ export declare const themeConfigSchema: {
         readonly scorecard: {
             readonly type: "object";
             readonly additionalProperties: true;
-            readonly required: readonly ["levels"];
+            readonly required: readonly [];
             readonly properties: {
-                readonly failBuildIfBelowMinimum: {
+                readonly ignoreNonCompliant: {
                     readonly type: "boolean";
                     readonly default: false;
                 };
@@ -1878,6 +1871,9 @@ export declare const themeConfigSchema: {
                             readonly name: {
                                 readonly type: "string";
                             };
+                            readonly color: {
+                                readonly type: "string";
+                            };
                             readonly extends: {
                                 readonly type: "array";
                                 readonly items: {

package/lib/config.js

@@ -73,7 +73,7 @@ const markdownConfigSchema = {
                     type: 'string',
                     enum: ['timeago', 'iso', 'long', 'short'],
                     default: 'timeago',
-                }, locale: { type: 'string', default: 'en-US' } }, hideConfigSchema.properties),
+                }, locale: { type: 'string' } }, hideConfigSchema.properties),
             additionalProperties: false,
             default: {},
         },
@@ -262,9 +262,9 @@ const catalogFilterSchema = {
 const scorecardConfigSchema = {
     type: 'object',
     additionalProperties: true,
-    required: ['levels'],
+    required: [],
     properties: {
-        failBuildIfBelowMinimum: { type: 'boolean', default: false },
+        ignoreNonCompliant: { type: 'boolean', default: false },
         teamMetadataProperty: {
             type: 'object',
             properties: {
@@ -280,6 +280,7 @@ const scorecardConfigSchema = {
                 required: ['name'],
                 properties: {
                     name: { type: 'string' },
+                    color: { type: 'string' },
                     extends: { type: 'array', items: { type: 'string' } },
                     rules: {
                         type: 'object',
@@ -371,12 +372,6 @@ exports.themeConfigSchema = {
                 } }, hideConfigSchema.properties),
             additionalProperties: false,
         },
-        seo: {
-            type: 'object',
-            properties: {
-                title: { type: 'string' },
-            },
-        },
         scripts: {
             type: 'object',
             properties: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.30.1",
+  "version": "0.30.3-beta.1",
   "description": "Shared UI components lib",
   "keywords": [
     "theme",
@@ -28,19 +28,18 @@
     "styled-system": "^5.1.5"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "^6.5.9",
-    "@storybook/addon-essentials": "^6.5.9",
-    "@storybook/addon-interactions": "^6.5.9",
-    "@storybook/addon-links": "^6.5.9",
-    "@storybook/addon-viewport": "^6.5.9",
-    "@storybook/addons": "^6.5.9",
-    "@storybook/builder-webpack5": "^6.5.9",
-    "@storybook/core-common": "^6.5.9",
-    "@storybook/manager-webpack5": "^6.5.9",
-    "@storybook/node-logger": "^6.5.9",
-    "@storybook/react": "^6.5.9",
-    "@storybook/testing-library": "^0.0.13",
-    "@storybook/theming": "^6.5.9",
+    "@storybook/addon-actions": "^7.4.6",
+    "@storybook/addon-essentials": "^7.4.6",
+    "@storybook/addon-interactions": "^7.4.6",
+    "@storybook/addon-links": "^7.4.6",
+    "@storybook/addon-viewport": "^7.4.6",
+    "@storybook/addons": "^7.4.6",
+    "@storybook/core-common": "^7.4.6",
+    "@storybook/node-logger": "^7.4.6",
+    "@storybook/react": "^7.4.6",
+    "@storybook/react-webpack5": "^7.4.6",
+    "@storybook/testing-library": "^0.2.2",
+    "@storybook/theming": "^7.4.6",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^12.1.4",
     "@testing-library/react-hooks": "^8.0.1",
@@ -69,8 +68,9 @@
     "npm-run-all": "^4.1.5",
     "react-refresh": "^0.14.0",
     "react-router-dom": "^6.10.0",
-    "storybook-addon-pseudo-states": "^1.15.1",
-    "storybook-design-token": "^2.9.0",
+    "storybook": "^7.4.6",
+    "storybook-addon-pseudo-states": "^2.1.2",
+    "storybook-design-token": "3.0.0-beta.6",
     "styled-components": "^5.3.7",
     "styled-system": "^5.1.5",
     "ts-jest": "^29.0.3",
@@ -105,8 +105,8 @@
     "test:coverage": "jest --coverage",
     "test:coverage:html": "jest --coverage --coverageReporters html",
     "e2e": "npx chromatic -b storybook:build --auto-accept-changes main --exit-once-uploaded",
-    "storybook": "start-storybook -p 6006",
-    "storybook:build": "npm run storybook:tokens && build-storybook",
+    "storybook": "storybook dev -p 6006",
+    "storybook:build": "npm run storybook:tokens && storybook build",
     "storybook:tokens": "ts-node scripts/generate-css-tokens.ts",
     "storybook:tokens:watch": "ts-node-dev --respawn scripts/generate-css-tokens.ts",
     "chromatic": "chromatic --exit-zero-on-changes"

package/src/components/Catalog/useCatalog.ts

@@ -299,9 +299,12 @@ function collectFilterOptions(
       }
     }
 
-    const options = Object.entries(usedOptions)
-      .map(([value, count]) => ({ value, count }))
-      .sort((a, b) => b.value.localeCompare(a.value));
+    const options = Object.entries(usedOptions).map(([value, count]) => ({ value, count }));
+
+    if (!staticOptions) {
+      options.sort((a, b) => b.value.localeCompare(a.value));
+    }
+
     if (othersCount) {
       options.push({
         value: filter.missingCategoryNameTranslationKey || filter.missingCategoryName || 'Others',

package/src/components/Filter/Filter.tsx

@@ -109,7 +109,7 @@ export function Filter({
         </>
       ) : (
         filter.filteredOptions.map((value: any) => {
-          const id = 'filter--' + filter.property + '--' + slug(value.value);
+          const id = 'filter--' + filter.property + '--' + value.value;
           return (
             <FilterOption key={id} role="link" onClick={() => filter.toggleOption(value.value)}>
               <CheckboxIcon checked={filter.selectedOptions.has(value.value)} />
@@ -210,11 +210,6 @@ const StyledSelect = styled(Select)`
   }
 `;
 
-// TODO: import from portal
-function slug(str: string): string {
-  return str.replace(/\s/g, '-').toLowerCase();
-}
-
 const DatePickerWrapper = styled.div`
   color: var(--filter-date-picker-color);
   display: flex;

package/src/components/LastUpdated/LastUpdated.tsx

@@ -3,7 +3,7 @@ import styled from 'styled-components';
 import { format } from 'timeago.js';
 
 import { useThemeConfig } from '@theme/hooks/useThemeConfig';
-import { useTranslate } from '@portal/hooks';
+import { useI18nConfig, useTranslate } from '@portal/hooks';
 
 const FORMATS = {
   timeago: (date: Date, locale: string) => format(date, locale),
@@ -24,6 +24,7 @@ export interface LastUpdatedProps {
 export function LastUpdated(props: LastUpdatedProps): JSX.Element | null {
   const { markdown: { lastUpdatedBlock = {} } = {} } = useThemeConfig();
   const { translate } = useTranslate();
+  const { currentLocale } = useI18nConfig();
 
   if (lastUpdatedBlock?.hide) {
     return null;
@@ -31,7 +32,8 @@ export function LastUpdated(props: LastUpdatedProps): JSX.Element | null {
 
   const lastModified = props.lastModified;
   const format = props.format || lastUpdatedBlock.format || 'timeago';
-  const locale = props.locale || lastUpdatedBlock.locale || 'en-US';
+  const locale = props.locale || lastUpdatedBlock.locale || currentLocale || 'en-US';
+
   const isoDate = lastModified.toISOString().split('T')[0];
 
   const lastUpdatedString = FORMATS[format as keyof typeof FORMATS](lastModified, locale);

package/src/components/Menu/MenuItemSwitch.tsx

@@ -19,7 +19,6 @@ export function MenuItemSwitch(props: PropsWithChildren<MenuItemProps>) {
     handleBack,
     handleExpand,
     isExpanded: drilldownIsExpanded,
-    prevActiveItem,
   } = useDrilldown(props);
 
   const { MenuGroup, handleGroupClick, isExpanded } = useMenuGroup(props.item);
@@ -52,7 +51,6 @@ export function MenuItemSwitch(props: PropsWithChildren<MenuItemProps>) {
           isExpanded={drilldownIsExpanded}
           back={handleBack}
           expand={handleExpand}
-          prevActiveItem={prevActiveItem}
         >
           {props.children}
         </Drilldown>

package/src/components/Scorecard/Card.tsx

@@ -1,8 +1,10 @@
 import styled from 'styled-components';
 
-export const ScorecardCard = styled.div`
+export const ScorecardCard = styled.div.attrs({
+  'data-component-name': 'Scorecard/ScorecardCard',
+})`
   color: var(--text-primary);
-  background-color: var(--thin-tile-background-color);
+  background-color: var(--bg-raised);
   border-radius: 4px;
 
   border: 1px solid var(--border-primary);

package/src/components/Scorecard/Gauge.tsx

@@ -1,18 +1,27 @@
 import * as React from 'react';
 import styled from 'styled-components';
-
-export function Gauge({
-  chunks,
-}: {
+export interface GaugeProps {
   chunks: {
     share: number;
     color: string;
+    title?: string;
   }[];
-}) {
+  className?: string;
+}
+
+export function Gauge({ chunks, className }: GaugeProps) {
+  const title = chunks
+    .map((chunk) => chunk.title)
+    .filter(Boolean)
+    .join(', ');
   return (
-    <GaugeWrapper>
+    <GaugeWrapper
+      data-component-name="Scorecard/StatusByLevelWidget"
+      className={className}
+      title={title}
+    >
       {chunks.map((chunk, i) => (
-        <GaugeChunk key={i} {...chunk} />
+        <GaugeChunk key={i} share={chunk.share} color={chunk.color} />
       ))}
     </GaugeWrapper>
   );

package/src/components/Scorecard/StatusByLevelWidget.tsx

@@ -7,12 +7,13 @@ import { ScorecardCard, ScorecardCardTitle } from '@theme/components/Scorecard/C
 export interface StatusByLevelWidgetProps {
   title: string;
   levels: { name: string; errors: number; warnings: number; total: number }[];
+  className?: string;
 }
 
 export function StatusByLevelWidget(props: StatusByLevelWidgetProps) {
-  const { levels, title } = props;
+  const { levels, title, className } = props;
   return (
-    <ScorecardCard>
+    <ScorecardCard data-component-name="Scorecard/StatusByLevelWidget" className={className}>
       <ScorecardCardTitle>{title}</ScorecardCardTitle>
       <CardBody>
         {levels.map((level) => {
@@ -25,14 +26,17 @@ export function StatusByLevelWidget(props: StatusByLevelWidgetProps) {
                   {
                     share: (success / level.total) * 100,
                     color: 'var(--scorecard-color-success)',
+                    title: `${success} passed`,
                   },
                   {
                     share: (level.warnings / level.total) * 100,
                     color: 'var(--scorecard-color-warning)',
+                    title: `${level.warnings} ${level.warnings === 1 ? 'warning' : 'warnings'}`,
                   },
                   {
                     share: (level.errors / level.total) * 100,
                     color: 'var(--scorecard-color-error)',
+                    title: `${level.errors} ${level.errors === 1 ? 'error' : 'errors'}`,
                   },
                 ]}
               />

package/src/components/Sidebar/DrilldownMenu.tsx

@@ -10,22 +10,17 @@ import { MenuLinkItem } from '@theme/components/Menu';
 export function DrilldownMenu({
   item,
   back,
-  prevActiveItem,
   children,
   className,
 }: React.PropsWithChildren<DrilldownMenuProps>): JSX.Element {
   const { translate } = useTranslate();
-  const label =
-    item.label === prevActiveItem?.label || !prevActiveItem?.label
-      ? translate('theme.sidebar.menu.backLabel', 'Back')
-      : prevActiveItem?.label;
 
   return (
     <MenuContainer data-component-name="Sidebar/DrilldownMenu" className={className}>
       <MenuContent>
         <MenuWrapper>
           <BackButton back={back} data-translation-key="theme.sidebar.menu.backLabel">
-            {label}
+            {translate('theme.sidebar.menu.backLabel', 'Back')}
           </BackButton>
           <MenuLinkItem item={item}>
             <DrilldownMenuItem item={item} />

package/src/components/Sidebar/styledVariables.ts

@@ -14,7 +14,7 @@ export const sidebar = css`
   /**
     * @tokens Sidebar typography
     */
-  --sidebar-word-break: inherit; // @presenter WordBreak
+  --sidebar-word-break: inherit;
 
   /**
     * @tokens Sidebar colors

package/src/components/Sidebar/types.ts

@@ -12,7 +12,6 @@ export interface ItemState extends NavItem {
 export interface DrilldownMenuProps {
   back: () => void;
   item: ItemState;
-  prevActiveItem?: ItemState;
   className?: string;
 }
 

package/src/config.ts

@@ -80,7 +80,7 @@ const markdownConfigSchema = {
           enum: ['timeago', 'iso', 'long', 'short'],
           default: 'timeago',
         },
-        locale: { type: 'string', default: 'en-US' },
+        locale: { type: 'string' },
         ...hideConfigSchema.properties,
       },
       additionalProperties: false,
@@ -301,9 +301,9 @@ const catalogFilterSchema = {
 const scorecardConfigSchema = {
   type: 'object',
   additionalProperties: true,
-  required: ['levels'],
+  required: [],
   properties: {
-    failBuildIfBelowMinimum: { type: 'boolean', default: false },
+    ignoreNonCompliant: { type: 'boolean', default: false },
     teamMetadataProperty: {
       type: 'object',
       properties: {
@@ -319,6 +319,7 @@ const scorecardConfigSchema = {
         required: ['name'],
         properties: {
           name: { type: 'string' },
+          color: { type: 'string' },
           extends: { type: 'array', items: { type: 'string' } },
           rules: {
             type: 'object',
@@ -425,12 +426,6 @@ export const themeConfigSchema = {
       },
       additionalProperties: false,
     },
-    seo: {
-      type: 'object',
-      properties: {
-        title: { type: 'string' },
-      },
-    },
     scripts: {
       type: 'object',
       properties: {